/* ==========================================================================
   Beedepo Design System — 1. Katman: Token'lar ve tema
   --------------------------------------------------------------------------
   Bu dosya sadece değişken tanımlar; hiçbir seçici stillemez.
   Sıra: tokens.css -> theme.css -> app.css
   ========================================================================== */

:root {
  /* --- Marka renk skalaları -------------------------------------------- */
  --bd-amber-50:  #fff8ed;
  --bd-amber-100: #feecd0;
  --bd-amber-200: #fcd5a0;
  --bd-amber-300: #fab765;
  --bd-amber-400: #f89e3a;
  --bd-amber-500: #f69011;   /* marka turuncusu */
  --bd-amber-600: #e07605;
  --bd-amber-700: #b95a08;
  --bd-amber-800: #94470e;
  --bd-amber-900: #783b0f;

  --bd-navy-50:  #eef4fb;
  --bd-navy-100: #d8e6f5;
  --bd-navy-200: #b3cdea;
  --bd-navy-300: #82acdb;
  --bd-navy-400: #4f85c7;
  --bd-navy-500: #2f66ad;
  --bd-navy-600: #1f4f8f;
  --bd-navy-700: #163c6f;
  --bd-navy-800: #0f2f57;
  --bd-navy-900: #08284f;    /* marka lacivert */
  --bd-navy-950: #051a35;

  --bd-cyan-50:  #ecfbff;
  --bd-cyan-100: #d0f4fe;
  --bd-cyan-200: #a8ebfc;
  --bd-cyan-300: #6ddef9;
  --bd-cyan-400: #2ac7ef;
  --bd-cyan-500: #0baee1;    /* marka camgöbeği */
  --bd-cyan-600: #0689bd;
  --bd-cyan-700: #0a6e99;
  --bd-cyan-800: #115b7d;
  --bd-cyan-900: #134b69;

  /* --- Nötr skala (lacivert tonlu gri) ---------------------------------- */
  --bd-gray-0:   #ffffff;
  --bd-gray-25:  #fcfdfe;
  --bd-gray-50:  #f7f9fc;
  --bd-gray-100: #eef2f7;
  --bd-gray-150: #e6ebf2;
  --bd-gray-200: #dde4ed;
  --bd-gray-300: #c5cfdd;
  --bd-gray-400: #9aa7ba;
  --bd-gray-500: #6f7d92;
  --bd-gray-600: #55637a;
  --bd-gray-700: #414e63;
  --bd-gray-800: #2c3749;
  --bd-gray-900: #1b2434;
  --bd-gray-950: #111827;

  /* --- Durum renk skalaları ---------------------------------------------- */
  --bd-success-50:  #ecfdf5;
  --bd-success-100: #d1fae5;
  --bd-success-200: #a7f3d0;
  --bd-success-500: #10b981;
  --bd-success-600: #059669;
  --bd-success-700: #047857;

  --bd-warning-50:  #fffbeb;
  --bd-warning-100: #fef3c7;
  --bd-warning-200: #fde68a;
  --bd-warning-500: #f59e0b;
  --bd-warning-600: #d97706;
  --bd-warning-700: #b45309;

  --bd-danger-50:   #fef2f2;
  --bd-danger-100:  #fee2e2;
  --bd-danger-200:  #fecaca;
  --bd-danger-500:  #ef4444;
  --bd-danger-600:  #dc2626;
  --bd-danger-700:  #b91c1c;

  /* --- Tipografi ---------------------------------------------------------- */
  --bd-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                  "Helvetica Neue", Arial, sans-serif;
  --bd-font-display: "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont,
                  "Segoe UI", sans-serif;
  --bd-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
                  "Liberation Mono", monospace;

  --bd-text-2xs:  0.6875rem;   /* 11px */
  --bd-text-xs:   0.75rem;     /* 12px */
  --bd-text-sm:   0.8125rem;   /* 13px */
  --bd-text-md:   0.875rem;    /* 14px — arayüz temeli */
  --bd-text-base: 0.9375rem;   /* 15px */
  --bd-text-lg:   1.0625rem;   /* 17px */
  --bd-text-xl:   1.25rem;     /* 20px */
  --bd-text-2xl:  1.5rem;      /* 24px */
  --bd-text-3xl:  1.875rem;    /* 30px */
  --bd-text-4xl:  2.25rem;     /* 36px */

  --bd-leading-tight:  1.25;
  --bd-leading-snug:   1.4;
  --bd-leading-normal: 1.6;

  --bd-tracking-tight: -0.02em;
  --bd-tracking-snug:  -0.011em;
  --bd-tracking-caps:  0.06em;

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

  /* --- Yarıçap ------------------------------------------------------------ */
  --bd-radius-xs:   4px;
  --bd-radius-sm:   6px;
  --bd-radius-md:   8px;
  --bd-radius-lg:   12px;
  --bd-radius-xl:   16px;
  --bd-radius-2xl:  22px;
  --bd-radius-pill: 999px;

  /* --- Kontrol yükseklikleri ---------------------------------------------- */
  --bd-control-h-sm: 32px;
  --bd-control-h:    38px;
  --bd-control-h-lg: 46px;

  /* --- Hareket ------------------------------------------------------------ */
  --bd-ease:      cubic-bezier(0.32, 0.72, 0, 1);
  --bd-ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --bd-dur-fast:  120ms;
  --bd-dur:       180ms;
  --bd-dur-slow:  320ms;

  /* --- Katmanlar ----------------------------------------------------------- */
  --bd-z-sidebar:  1040;
  --bd-z-overlay:  1035;
  --bd-z-topbar:   1030;
  --bd-z-dropdown: 1055;
  --bd-z-modal:    1060;
  --bd-z-toast:    1080;
  --bd-z-loading:  1090;

  /* --- Yerleşim ------------------------------------------------------------ */
  --bd-sidebar-w:      264px;
  --bd-sidebar-w-rail: 76px;
  --bd-topbar-h:       60px;
  --bd-content-max:    1480px;
  --bd-gutter:         1.75rem;
  --bd-gutter-sm:      1rem;
}

/* ==========================================================================
   TEMA — AÇIK (varsayılan)
   ========================================================================== */
:root,
[data-bd-theme="light"] {
  color-scheme: light;

  /* Yüzeyler */
  --bd-canvas:         var(--bd-gray-50);
  --bd-surface:        var(--bd-gray-0);
  --bd-surface-raised: var(--bd-gray-0);
  --bd-surface-sunken: var(--bd-gray-100);
  --bd-surface-hover:  var(--bd-gray-50);
  --bd-surface-active: var(--bd-gray-100);
  --bd-surface-inset:  var(--bd-gray-50);
  --bd-surface-brand:  var(--bd-navy-900);

  /* Kenarlıklar */
  --bd-border:        var(--bd-gray-200);
  --bd-border-subtle: var(--bd-gray-150);
  --bd-border-strong: var(--bd-gray-300);

  /* Metin */
  --bd-text:         var(--bd-gray-800);
  --bd-text-strong:  var(--bd-navy-900);
  --bd-text-muted:   var(--bd-gray-500);
  --bd-text-subtle:  var(--bd-gray-400);
  --bd-text-inverse: var(--bd-gray-0);

  /* Marka aksiyon */
  --bd-primary:        var(--bd-amber-500);
  --bd-primary-hover:  var(--bd-amber-600);
  --bd-primary-active: var(--bd-amber-700);
  --bd-primary-soft:   var(--bd-amber-50);
  --bd-primary-soft-border: var(--bd-amber-200);
  --bd-primary-on:     #ffffff;
  --bd-primary-text:   var(--bd-amber-700);

  --bd-accent:      var(--bd-cyan-600);
  --bd-accent-soft: var(--bd-cyan-50);

  --bd-focus-ring:  0 0 0 3px rgba(11, 174, 225, 0.28);
  --bd-focus-color: var(--bd-cyan-500);

  /* Durum yüzeyleri */
  --bd-success:        var(--bd-success-600);
  --bd-success-bg:     var(--bd-success-50);
  --bd-success-border: var(--bd-success-200);
  --bd-success-text:   var(--bd-success-700);

  --bd-warning:        var(--bd-warning-600);
  --bd-warning-bg:     var(--bd-warning-50);
  --bd-warning-border: var(--bd-warning-200);
  --bd-warning-text:   var(--bd-warning-700);

  --bd-danger:         var(--bd-danger-600);
  --bd-danger-bg:      var(--bd-danger-50);
  --bd-danger-border:  var(--bd-danger-200);
  --bd-danger-text:    var(--bd-danger-700);

  --bd-info:           var(--bd-cyan-600);
  --bd-info-bg:        var(--bd-cyan-50);
  --bd-info-border:    var(--bd-cyan-200);
  --bd-info-text:      var(--bd-cyan-700);

  --bd-neutral-bg:     var(--bd-gray-100);
  --bd-neutral-border: var(--bd-gray-200);
  --bd-neutral-text:   var(--bd-gray-600);

  /* Kenar çubuğu */
  --bd-sidebar-bg:          var(--bd-gray-0);
  --bd-sidebar-border:      var(--bd-gray-150);
  --bd-sidebar-text:        var(--bd-gray-600);
  --bd-sidebar-text-strong: var(--bd-navy-900);
  --bd-sidebar-muted:       var(--bd-gray-400);
  --bd-sidebar-hover:       var(--bd-gray-50);
  --bd-sidebar-active-bg:   var(--bd-amber-50);
  --bd-sidebar-active-text: var(--bd-navy-900);
  --bd-sidebar-active-mark: var(--bd-amber-500);
  --bd-sidebar-icon:        var(--bd-gray-400);

  /* Gölgeler — lacivert tonlu, yumuşak */
  --bd-shadow-xs: 0 1px 2px rgba(8, 40, 79, 0.05);
  --bd-shadow-sm: 0 1px 2px rgba(8, 40, 79, 0.06), 0 1px 3px rgba(8, 40, 79, 0.04);
  --bd-shadow:    0 2px 4px rgba(8, 40, 79, 0.04), 0 4px 12px rgba(8, 40, 79, 0.06);
  --bd-shadow-md: 0 4px 8px rgba(8, 40, 79, 0.05), 0 12px 24px rgba(8, 40, 79, 0.08);
  --bd-shadow-lg: 0 8px 16px rgba(8, 40, 79, 0.06), 0 24px 48px rgba(8, 40, 79, 0.12);

  --bd-scrim: rgba(8, 40, 79, 0.44);
}

/* ==========================================================================
   TEMA — KOYU
   ========================================================================== */
[data-bd-theme="dark"] {
  color-scheme: dark;

  --bd-canvas:         #0a121f;
  --bd-surface:        #111c2e;
  --bd-surface-raised: #16243c;
  --bd-surface-sunken: #0d1727;
  --bd-surface-hover:  #182640;
  --bd-surface-active: #1d2d4a;
  --bd-surface-inset:  #0d1727;
  --bd-surface-brand:  #16243c;

  --bd-border:        #24344f;
  --bd-border-subtle: #1b293f;
  --bd-border-strong: #334564;

  --bd-text:         #dce5f1;
  --bd-text-strong:  #ffffff;
  --bd-text-muted:   #94a4bd;
  --bd-text-subtle:  #6f8099;
  --bd-text-inverse: #0a121f;

  --bd-primary:        var(--bd-amber-500);
  --bd-primary-hover:  var(--bd-amber-400);
  --bd-primary-active: var(--bd-amber-300);
  --bd-primary-soft:   rgba(246, 144, 17, 0.14);
  --bd-primary-soft-border: rgba(246, 144, 17, 0.34);
  --bd-primary-on:     #1c1200;
  --bd-primary-text:   var(--bd-amber-300);

  --bd-accent:      var(--bd-cyan-400);
  --bd-accent-soft: rgba(11, 174, 225, 0.14);

  --bd-focus-ring:  0 0 0 3px rgba(42, 199, 239, 0.35);
  --bd-focus-color: var(--bd-cyan-400);

  --bd-success:        #34d399;
  --bd-success-bg:     rgba(16, 185, 129, 0.14);
  --bd-success-border: rgba(16, 185, 129, 0.34);
  --bd-success-text:   #6ee7b7;

  --bd-warning:        #fbbf24;
  --bd-warning-bg:     rgba(245, 158, 11, 0.14);
  --bd-warning-border: rgba(245, 158, 11, 0.34);
  --bd-warning-text:   #fcd34d;

  --bd-danger:         #f87171;
  --bd-danger-bg:      rgba(239, 68, 68, 0.14);
  --bd-danger-border:  rgba(239, 68, 68, 0.34);
  --bd-danger-text:    #fca5a5;

  --bd-info:           var(--bd-cyan-400);
  --bd-info-bg:        rgba(11, 174, 225, 0.14);
  --bd-info-border:    rgba(11, 174, 225, 0.34);
  --bd-info-text:      var(--bd-cyan-200);

  --bd-neutral-bg:     rgba(148, 164, 189, 0.14);
  --bd-neutral-border: #24344f;
  --bd-neutral-text:   #a8b8d0;

  --bd-sidebar-bg:          #0d1727;
  --bd-sidebar-border:      #1b293f;
  --bd-sidebar-text:        #a8b8d0;
  --bd-sidebar-text-strong: #ffffff;
  --bd-sidebar-muted:       #6f8099;
  --bd-sidebar-hover:       #172440;
  --bd-sidebar-active-bg:   rgba(246, 144, 17, 0.15);
  --bd-sidebar-active-text: #ffffff;
  --bd-sidebar-active-mark: var(--bd-amber-500);
  --bd-sidebar-icon:        #6f8099;

  --bd-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
  --bd-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.3);
  --bd-shadow:    0 2px 4px rgba(0, 0, 0, 0.4), 0 4px 12px rgba(0, 0, 0, 0.35);
  --bd-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.4), 0 12px 24px rgba(0, 0, 0, 0.45);
  --bd-shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.45), 0 24px 48px rgba(0, 0, 0, 0.55);

  --bd-scrim: rgba(3, 8, 16, 0.66);
}