/* ══════════════════════════════════════════════════════════════
   theme.css — design tokens + dark / light palettes
   Barcha ranglar shu joyda. Brendni o'zgartirish uchun faqat
   --accent va syntax ranglarini tahrirlash kifoya.
   ══════════════════════════════════════════════════════════════ */

:root {
  /* ── typography ── */
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", "JetBrains Mono", "Cascadia Code", Menlo, Consolas, "Liberation Mono", monospace;
  --fs-code: 13px;
  --lh-code: 1.55;
  --lh-tree: 1.75;

  /* ── geometry ── */
  --r-sm: 6px;
  --r-md: 9px;
  --r-lg: 14px;
  --gutter-w: 54px;
  --indent-step: 15px;
  --dur: 0.16s;
}

/* ─────────────────────────── DARK ─────────────────────────── */
[data-theme="dark"] {
  color-scheme: dark;

  --bg: #0b1016;
  --bg-2: #0e141c;
  --surface: #121a24;
  --surface-2: #172029;
  --surface-3: #1f2a37;
  --border: #233040;
  --border-strong: #33475e;

  --text: #e4edf7;
  --text-2: #9fb0c3;
  --text-3: #6d8199;

  --accent: #4c9ffe;
  --accent-fg: #06121f;
  --accent-soft: rgba(76, 159, 254, 0.15);
  --purple: #b083f0;

  --green: #35d399;
  --green-soft: rgba(53, 211, 153, 0.14);
  --red: #ff7a72;
  --red-soft: rgba(255, 122, 114, 0.13);
  --amber: #f5b544;
  --amber-soft: rgba(245, 181, 68, 0.14);

  /* JSON syntax */
  --c-key: #6fd7ff;      /* havorang  */
  --c-string: #7ee787;   /* yashil    */
  --c-number: #ffab70;   /* to'q sariq */
  --c-bool: #79c0ff;     /* ko'k      */
  --c-null: #8ba3c0;     /* ko'kish-kul */
  --c-punct: #63798f;
  --c-meta: #6d8199;

  --row-hover: rgba(255, 255, 255, 0.045);
  --row-active: rgba(76, 159, 254, 0.16);
  --sel: rgba(76, 159, 254, 0.3);
  --mark: rgba(245, 181, 68, 0.35);
  --scrim: rgba(3, 7, 14, 0.62);

  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-2: 0 14px 40px -12px rgba(0, 0, 0, 0.7);
}

/* ─────────────────────────── LIGHT ─────────────────────────── */
[data-theme="light"] {
  color-scheme: light;

  --bg: #e9edf2;
  --bg-2: #f8fafc;
  --surface: #ffffff;
  --surface-2: #f4f7fa;
  --surface-3: #e8edf3;
  --border: #dbe2ea;
  --border-strong: #bcc7d4;

  --text: #16202c;
  --text-2: #4f5f74;
  --text-3: #78889d;

  --accent: #1668d6;
  --accent-fg: #ffffff;
  --accent-soft: rgba(22, 104, 214, 0.1);
  --purple: #7a3fd0;

  --green: #0f8a58;
  --green-soft: rgba(15, 138, 88, 0.11);
  --red: #cc3b30;
  --red-soft: rgba(204, 59, 48, 0.09);
  --amber: #9a5b00;
  --amber-soft: rgba(154, 91, 0, 0.12);

  /* JSON syntax */
  --c-key: #0a6d9e;
  --c-string: #0e7a3d;
  --c-number: #a5510b;
  --c-bool: #1450c8;
  --c-null: #5a7089;
  --c-punct: #6a7789;
  --c-meta: #78889d;

  --row-hover: rgba(15, 30, 50, 0.045);
  --row-active: rgba(22, 104, 214, 0.1);
  --sel: rgba(22, 104, 214, 0.2);
  --mark: rgba(245, 181, 68, 0.45);
  --scrim: rgba(20, 30, 45, 0.35);

  --shadow-1: 0 1px 2px rgba(16, 24, 40, 0.06);
  --shadow-2: 0 14px 40px -12px rgba(16, 24, 40, 0.28);
}
