/* ==========================================================
   Köprü — Tasarım token'ları (site + uygulama ortak)
   Orta koyuluk: simsiyah değil, yumuşak lacivert-gri.
   ========================================================== */
/* Yazı tipleri uygulamanın içinde (fonts/, SIL OFL 1.1 — fonts/OFL.txt); dışarıdan bir şey yüklenmez.
   Karar (Erim, 18 Eki 2026): her yerde Geist — başlıklar 700, küçük vurgular (düğme, ders adı, saat) 600, gövde 400.
   League Spartan yalnız "Köprü" marka yazısında (--font-brand); dosya yalnız bu harfleri taşır (K ö p r ü Ö P R Ü).
   Geist değişken yazı tipi: tek dosya 100–900 kalınlıkları, Türkçe harfleri ve tablo rakamlarını (tnum) taşır. */
@font-face {
  font-family: 'Geist'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("fonts/geist-variable.woff2") format("woff2");
}
@font-face {
  font-family: 'League Spartan'; font-style: normal; font-weight: 700; font-display: swap;
  src: url("fonts/league-spartan-kopru.woff") format("woff");
}

:root {
  color-scheme: dark;
  --bg: #141A28;
  --bg-2: #182032;
  --surface: #1C2437;
  --surface-2: #242E45;
  --border: #2E3A55;
  --text: #EDF0F7;
  --text-muted: #9AA4BC;
  --text-dim: #8C97AE; /* kartta (surface-2 dahil) ≥ 4.5:1 — test/theme.mjs */
  --cyan: #4CC9F0;
  --violet: #8B5CF6;
  --accent: #7C8CF8;
  --danger: #F0607A;
  --warn: #F5B84C;
  --ok: #4ADE80;
  /* Tek vurgu: düz camgöbeği. Gradyan sadece marka anı için (tanıtım başlığı, karşılama sözü) */
  --gradient-brand: linear-gradient(120deg, var(--cyan), var(--violet));
  --gradient: var(--cyan);
  --on-accent: #0E1320;
  /* Bileşen tonları (app.css'teki sabit renkler buraya taşındı; değerler aynı) */
  --danger-text: #F58BA0;   /* kırmızı zemin üstünde açık yazı (sınav etiketi, risk) */
  --warn-soft-text: #F7D08F; /* uyarı kutusu yazısı */
  --on-violet: #FFFFFF;     /* mor (Asistan) düğme üstündeki simge */
  --violet-solid: #7C3AED;  /* üstünde beyaz yazı olan mor düğme zemini (≥ 4.5:1) */
  --switch-knob: #FFFFFF;   /* açık anahtarın topuzu */
  --scrim: #080B14;         /* pencere arkası karartma (yarı saydam kullanılır) */
  --on-danger: #FFFFFF;     /* kırmızı (silme onayı) düğme yazısı */
  --shadow-1: rgba(0, 0, 0, 0.35); /* kart/yüzen düğme gölgesi */
  --shadow-2: rgba(0, 0, 0, 0.45); /* alt pencere gölgesi */
  --card-shadow: none;      /* koyu temada kartlar çizgiyle ayrılır */
  /* Tanıtım sitesindeki örnek belge (syllabus kâğıdı): her temada aynı */
  --paper: #F4F5F9;
  --paper-ink: #2A3042;
  --paper-line: #DCDFE8;
  /* Köşe: 3 değer + hap */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-pill: 999px;
  /* Yazı ölçeği (8 basamak) */
  --fs-2xs: 0.7rem;
  --fs-xs: 0.78rem;
  --fs-sm: 0.86rem;
  --fs-md: 0.95rem;
  --fs-lg: 1.1rem;
  --fs-xl: 1.35rem;
  --fs-2xl: 1.7rem;
  --fs-3xl: 2.4rem;
  --font-display: 'Geist', system-ui, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Geist', system-ui, 'Segoe UI', Roboto, sans-serif;
  --font-brand: 'League Spartan', 'Geist', system-ui, sans-serif; /* yalnız "Köprü" marka yazısı */
  --radius: var(--r-lg);
  --safe-t: env(safe-area-inset-top, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);
}

/* Açık tema: uygulama <html data-theme="light"> ile açar (theme.js / theme-boot.js).
   Tanıtım sitesi (index.html) data-theme almaz, koyu kalır; gizlilik.html uygulamanın temasını izler. Vurgu renkleri beyaz zeminde okunacak kadar koyu
   (yazı olarak kullanılanlar ≥ 4.5:1 — test/theme.mjs denetler). */
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #E9ECF1;
  --bg-2: #E2E6EC;
  --surface: #F5F6F9;
  --surface-2: #ECEFF3;
  --border: #D2D8E2;
  --text: #141A28;
  --text-muted: #4D5872;
  --text-dim: #5F6A84;
  --cyan: #046C97;
  --violet: #6B3FDB;
  --accent: #4C5BD4;
  --danger: #C42D4B;
  --warn: #9A5A00;
  --ok: #15793A;
  --on-accent: #FFFFFF;
  --danger-text: #A5223D;
  --warn-soft-text: #744300;
  --on-violet: #FFFFFF;
  --violet-solid: #6B3FDB;
  --switch-knob: #FFFFFF;
  --scrim: #141A28;
  --on-danger: #FFFFFF;
  --shadow-1: rgba(20, 26, 40, 0.12);
  --shadow-2: rgba(20, 26, 40, 0.18);
  /* Açık temada kartlar zeminden çok hafif gölgeyle ayrılır (yalnız çizgi yetmiyordu) */
  --card-shadow: 0 1px 2px rgba(20, 26, 40, 0.06), 0 2px 6px rgba(20, 26, 40, 0.05);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 15px/1.5 var(--font-body);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
button { font: inherit; color: inherit; }
a { color: inherit; }
svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
/* hidden özniteliği her zaman kazanır: ".consent { display: flex }" gibi kurallar gizli öğeyi açmasın */
[hidden] { display: none !important; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.brand-mark {
  width: 32px; height: 32px; border-radius: var(--r-sm);
  background: var(--gradient); color: var(--on-accent);
  display: grid; place-items: center;
  font: 700 1rem var(--font-display);
}

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 11px 18px; border-radius: var(--r-md); border: 1px solid transparent;
  font-weight: 600; font-size: 0.92rem; cursor: pointer; text-decoration: none; white-space: nowrap;
}
.btn svg { width: 18px; height: 18px; }
.btn-primary { background: var(--gradient); color: var(--on-accent); }
.btn-violet { background: var(--violet-solid); color: var(--on-violet); } /* yalnızca Asistan */
.btn-ghost { background: var(--surface-2); border-color: var(--border); color: var(--text); }
.btn-danger { background: none; border-color: color-mix(in srgb, var(--danger) 45%, transparent); color: var(--danger); }
.btn-danger.armed { background: var(--danger); border-color: var(--danger); color: var(--on-danger); }
.btn-block { width: 100%; }
.btn:disabled { opacity: 0.5; cursor: default; }

/* Logo işareti (logo-mark.svg): K + köprü kemeri. Eski "K" harfli kare yerine */
img.brand-mark { background: none; border-radius: 0; object-fit: contain; display: block; }

.grad { background: var(--gradient-brand); -webkit-background-clip: text; background-clip: text; color: transparent; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
