/* ============================================================
   Kapıda Kalma — Design system v1
   Tokens transcribed verbatim from "Kapida Kalma PWA.dc.html" (2a).
   Do not hard-code hex values outside this file.
   ============================================================ */

:root {
  /* ---- Renk tokenları ---- */
  --color-primary:      #0A6CFF;
  --color-primary-dark: #0B1D3A;
  --color-primary-50:   #EAF2FF;
  --color-primary-100:  #D6E6FF;
  --color-primary-700:  #0A57CC;

  --color-accent:       #FFB000;
  --color-accent-50:    #FFF7E5;
  /* Açık zeminde yazı için: #FFB000 beyazda 1.83:1 — okunmuyor. */
  --color-accent-700:   #8A5300;

  --color-success:      #12A150;
  --color-success-50:   #E8F7EF;
  --color-success-200:  #B6E5C9;
  /* Beyaz metin taşıyan yüzeyler bu koyu tonu kullanır (5.4:1). */
  --color-success-700:  #0C7A3D;

  --color-danger:       #E5484D;
  --color-danger-50:    #FDECEC;
  /* Metin için koyu varyant: #E5484D beyazda 3.91:1 kalıyor, AA eşiği 4.5. */
  --color-danger-700:   #C62A30;

  --color-warning:      #FFB000;

  --surface:            #FFFFFF;
  --surface-secondary:  #F2F4F7;
  --surface-tertiary:   #E8ECF3;

  --text-primary:       #0B1D3A;
  --text-secondary:     #5A6B85;
  /* #8494AC beyaz üzerinde 3.08:1 kalıyordu — WCAG AA metin eşiği 4.5:1.
     #5F708F aynı mavi-gri tonu korur ve beyazda 5.0, gri zeminde 4.54 verir. */
  --text-tertiary:      #5F708F;

  --border:             #E3E8EF;
  --border-strong:      #CBD5E1;

  /* ---- Dark surface tokens (07 "Çilingir aranıyor" ve dark componentler) ---- */
  --d-surface:   #0B1526;
  --d-surface-2: #12203A;
  --d-border:    #1E3556;
  --d-text:      #F4F7FB;
  --d-text-2:    #93A6C4;

  /* ---- Radius ---- */
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  /* ---- Shadow ---- */
  --shadow-sm: 0 1px 2px rgba(11,29,58,.06), 0 1px 3px rgba(11,29,58,.04);
  --shadow-md: 0 4px 12px rgba(11,29,58,.08);
  --shadow-lg: 0 12px 32px rgba(11,29,58,.12);

  /* ---- Tipografi — Poppins ---- */
  --font-sans: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --fs-h1: 26px;   --lh-h1: 1.22;  --ls-h1: -.02em;   --fw-h1: 700;
  --fs-h2: 20px;   --lh-h2: 1.3;                      --fw-h2: 600;
  --fs-body: 15px; --lh-body: 24px;                   --fw-body: 400;
  --fs-cta: 15px;                  --ls-cta: .02em;   --fw-cta: 600;

  /* ---- Spacing / layout ---- */
  --gutter: 24px;
  --tap-min: 44px;   /* min dokunma alanı */

  /* ---- Motion ---- */
  --ease: cubic-bezier(.32,.72,0,1);
  --dur-fast: 140ms;
  --dur: 260ms;
}

/* Dark palette is opt-in (data-theme="dark") rather than automatic:
   the six customer screens are specified light in the design doc, while the
   --d-* tokens exist for the dark "çilingir aranıyor" surface (screen 07). */
[data-theme="dark"] {
  --surface:           var(--d-surface);
  --surface-secondary: var(--d-surface-2);
  --surface-tertiary:  var(--d-surface-2);
  --text-primary:      var(--d-text);
  --text-secondary:    var(--d-text-2);
  --text-tertiary:     var(--d-text-2);
  --border:            var(--d-border);
  --border-strong:     var(--d-border);
  --color-primary-50:  rgba(10,108,255,.14);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; }
}