/* Yayın tasarım belirteçleri (tokens).
   Kazı ile kardeş ürün: aynı ölçek ve yapı mantığı, ama özgün vurgu rengi ("Yayın Çivit") ve yazı boyutları biraz daha rahat.
   Koyu tema varsayılan; açık tema [data-theme="light"] ile gelir. Tüm boyutlar rem. */

:root {
  --ui-scale: 1;

  /* yazı tipleri: yalnız sistem yığını, web fontu yok */
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", "DejaVu Sans Mono", monospace;

  --fs-2xs: 0.6875rem;  /* 11 */
  --fs-xs: 0.75rem;     /* 12 */
  --fs-sm: 0.8125rem;   /* 13 */
  --fs-base: 0.875rem;  /* 14 */
  --fs-md: 0.9375rem;   /* 15 */
  --fs-lg: 1.0625rem;   /* 17 */
  --fs-xl: 1.25rem;     /* 20 */
  --fs-2xl: 1.5rem;     /* 24 */
  --fs-3xl: 1.875rem;   /* 30 */
  --fs-h1: 2rem;        /* 32 */

  /* boşluk (taban 4 px) */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;

  /* köşe yarıçapı */
  --r-xs: 0.1875rem;
  --r-sm: 0.3125rem;
  --r-md: 0.5rem;
  --r-lg: 0.75rem;
  --r-xl: 1rem;
  --r-pill: 62rem;

  /* yerleşim */
  --sidebar-w: 15rem;
  --topbar-h: 3.5rem;
  --container-w: 64rem;
  --page-gutter: 1.5rem;
  --nav-item-h: 2.5rem;
  --ctl-h: 2.5rem;
  --ctl-h-sm: 2.125rem;

  /* hareket */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 120ms;
  --t: 180ms;
  --t-slow: 260ms;

  /* çentik / ana çubuk gibi güvenli alan boşlukları (index.html'de viewport-fit=cover açık; env() yoksa 0) */
  --safe-t: env(safe-area-inset-top, 0px);
  --safe-r: env(safe-area-inset-right, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-l: env(safe-area-inset-left, 0px);

  /* katmanlar */
  --z-sticky: 10;
  --z-drawer: 40;
  --z-modal: 70;
  --z-toast: 90;
}

/* ---------- koyu tema (varsayılan) ---------- */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;

  --bg-base: #0a0a0c;
  --bg-recess: #0f0f12;
  --bg-panel: #111115;
  --bg-control: #15151a;
  --bg-control-hover: #1c1c22;
  --bg-surface: #17171c;
  --bg-surface-2: #1b1b21;
  --bg-surface-3: #202027;
  --bg-strong: #2a2a33;
  --bg-selected: #2b2c3a;
  --bg-inverse: #f3f3f6;

  --line-faint: #14141a;
  --line-hairline: #1d1d24;
  --line-guide: #1a1a21;
  --line-control: #26262f;
  --line-card: #2a2a34;
  --line-strong: #3a3a47;
  --line-dashed: #474757;
  --line-input: #737385;        /* girdi / seçim kutusu / onay kutusu / anahtar kenarı: zemine >= 3:1 (WCAG 1.4.11) */
  --line-input-hover: #8e8ea0;
  --mark: #30303b;

  --fg-strong: #ffffff;
  --fg-heading: #ededf2;
  --fg-body: #d4d4db;
  --fg-secondary: #abaab5;
  --fg-nav: #a6a6b2;
  --fg-muted: #9494a1;
  --fg-group: #85858f;
  --fg-placeholder: #8a8a96;
  --fg-icon: #75758a;
  --fg-disabled: #5e5e6a;
  --fg-inverse: #0c0c10;

  /* Yayın Çivit */
  --accent: #7c83ff;
  --accent-hover: #939aff;
  --accent-press: #6d74f0;
  --on-accent: #0b0d2a;
  --accent-text: #a9aeff;
  --accent-tint-5: #0e0f1e;
  --accent-tint-8: #13152c;
  --accent-tint-12: #181b3b;
  --accent-tint-16: #1e2249;
  --accent-line: #343a8f;
  --accent-ring: #9aa0ff;

  --danger: #cb1127;
  --danger-hover: #dc2038;
  --on-danger: #ffffff;
  --danger-text: #ff7a88;
  --danger-tint: #2a0e12;
  --warning: #c8801a;
  --warning-text: #eaa73f;
  --warning-tint: #241a0b;
  --success: #22c55e;
  --success-text: #3ddc78;
  --success-tint: #0c2216;
  --info-text: #7db4ff;

  --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.02) inset;
  --shadow-pop: 0 12px 32px rgba(0, 0, 0, 0.55), 0 0 0 1px var(--line-card);
  --shadow-modal: 0 24px 64px rgba(0, 0, 0, 0.6);
  --scrim: rgba(0, 0, 0, 0.6);
}

/* ---------- açık tema ---------- */
:root[data-theme="light"] {
  color-scheme: light;

  --bg-base: #f7f7fa;
  --bg-recess: #f0f0f5;
  --bg-panel: #ffffff;
  --bg-control: #eeeef3;
  --bg-control-hover: #e5e5ec;
  --bg-surface: #ffffff;
  --bg-surface-2: #f3f3f8;
  --bg-surface-3: #ebebf2;
  --bg-strong: #dcdce6;
  --bg-selected: #dfe0f3;
  --bg-inverse: #15151c;

  --line-faint: #ececf2;
  --line-hairline: #e3e3eb;
  --line-guide: #e8e8ef;
  --line-control: #d9d9e3;
  --line-card: #d7d7e1;
  --line-strong: #b9b9c6;
  --line-dashed: #a4a4b3;
  --line-input: #80808f;        /* girdi / seçim kutusu / onay kutusu / anahtar kenarı: zemine >= 3:1 (WCAG 1.4.11) */
  --line-input-hover: #5c5c6a;
  --mark: #c6c6d3;

  --fg-strong: #0b0b12;
  --fg-heading: #15151e;
  --fg-body: #2a2a36;
  --fg-secondary: #494956;
  --fg-nav: #454552;
  --fg-muted: #5c5c6a;
  --fg-group: #62626f;
  --fg-placeholder: #686877;
  --fg-icon: #77778a;
  --fg-disabled: #a2a2b0;
  --fg-inverse: #f6f6fa;

  --accent: #4f46e5;
  --accent-hover: #5b53ee;
  --accent-press: #4339d4;
  --on-accent: #ffffff;
  --accent-text: #4338ca;
  --accent-tint-5: #f5f6ff;
  --accent-tint-8: #eceeff;
  --accent-tint-12: #e1e4ff;
  --accent-tint-16: #d4d8ff;
  --accent-line: #a5abf5;
  --accent-ring: #4338ca;

  --danger: #cb1127;
  --danger-hover: #b30f22;
  --on-danger: #ffffff;
  --danger-text: #b3101f;
  --danger-tint: #fdecee;
  --warning: #b36b00;
  --warning-text: #8a5200;
  --warning-tint: #fdf3df;
  --success: #15803d;
  --success-text: #136c34;
  --success-tint: #e6f6ec;
  --info-text: #1f55b5;

  --shadow-card: 0 1px 2px rgba(20, 20, 30, 0.05);
  --shadow-pop: 0 12px 32px rgba(20, 20, 30, 0.16), 0 0 0 1px var(--line-card);
  --shadow-modal: 0 24px 64px rgba(20, 20, 30, 0.22);
  --scrim: rgba(20, 20, 28, 0.45);
}
