/* ==========================================================================
   أدوات زيرو — Design Tokens v1.0
   الوضع الداكن هو الأساس. [data-theme="light"] نسخة معادلة كاملة.
   ========================================================================== */

:root{
  /* ---------- Brand: Zero Gold ---------- */
  --zt-gold-50:#FFF9E5;
  --zt-gold-100:#FFEFB8;
  --zt-gold-300:#FFDC5C;
  --zt-gold-500:#FFC801;   /* Primary */
  --zt-gold-600:#E0AC00;   /* Primary على الخلفيات الفاتحة */
  --zt-gold-700:#B88A00;

  /* ---------- Neutral: Ink ---------- */
  --zt-ink-000:#08090B;
  --zt-ink-050:#0E1014;
  --zt-ink-100:#14171C;
  --zt-ink-200:#1B1F26;
  --zt-ink-300:#262B33;
  --zt-ink-400:#363C46;
  --zt-ink-500:#5A626E;
  --zt-ink-600:#7C8593;
  --zt-ink-700:#9BA4B2;
  --zt-ink-800:#C9D0DA;
  --zt-ink-900:#EEF1F5;

  /* ---------- Semantic ---------- */
  --zt-success:#2ED47A;  --zt-success-bg:#0C2418;  --zt-success-bd:#17452C;
  --zt-warning:#FFB020;  --zt-warning-bg:#2A1E06;  --zt-warning-bd:#4A3408;
  --zt-error:#FF4D4F;    --zt-error-bg:#2B1113;    --zt-error-bd:#4C1C1F;
  --zt-info:#4C8DFF;     --zt-info-bg:#0C1A2E;     --zt-info-bd:#173355;

  /* ---------- Applied roles (dark) ---------- */
  --zt-bg:var(--zt-ink-000);
  --zt-surface:var(--zt-ink-100);
  --zt-surface-raised:var(--zt-ink-200);
  --zt-border:var(--zt-ink-300);
  --zt-border-strong:var(--zt-ink-400);
  --zt-text:var(--zt-ink-900);
  --zt-text-2:var(--zt-ink-700);
  --zt-text-3:var(--zt-ink-600);
  --zt-text-disabled:var(--zt-ink-500);
  --zt-on-brand:#17130A;         /* النص فوق الذهبي — داكن دائماً */

  /* ---------- Typography ---------- */
  --zt-font-display:"Alexandria",system-ui,sans-serif;
  --zt-font-body:"IBM Plex Sans Arabic",system-ui,sans-serif;
  --zt-font-mono:"IBM Plex Mono",ui-monospace,monospace;

  --zt-size-display-1:48px;  --zt-lh-display-1:1.25;  --zt-ls-display-1:-0.02em;
  --zt-size-display-2:38px;  --zt-lh-display-2:1.30;
  --zt-size-h1:30px;         --zt-lh-h1:1.35;
  --zt-size-h2:24px;         --zt-lh-h2:1.40;
  --zt-size-h3:20px;         --zt-lh-h3:1.50;
  --zt-size-body-lg:18px;    --zt-lh-body-lg:1.75;
  --zt-size-body:16px;       --zt-lh-body:1.80;
  --zt-size-body-sm:14px;    --zt-lh-body-sm:1.70;
  --zt-size-caption:12px;    --zt-lh-caption:1.60;
  --zt-size-mono:13px;

  --zt-weight-regular:400;
  --zt-weight-medium:500;
  --zt-weight-semibold:600;
  --zt-weight-bold:700;
  /* تباعد الأحرف في العربية = 0 دائماً */
  --zt-tracking-ar:0;
  --zt-tracking-latin-caps:0.16em;

  /* ---------- Spacing (4px base) ---------- */
  --zt-space-1:4px;   --zt-space-2:8px;   --zt-space-3:12px;
  --zt-space-4:16px;  --zt-space-5:24px;  --zt-space-6:32px;
  --zt-space-7:48px;  --zt-space-8:64px;  --zt-space-9:96px;
  --zt-space-10:128px;

  /* ---------- Radius ---------- */
  --zt-radius-xs:6px;    /* شارة */
  --zt-radius-sm:10px;   /* زر · حقل */
  --zt-radius-md:14px;   /* بطاقة */
  --zt-radius-lg:20px;   /* نافذة */
  --zt-radius-pill:999px;
  --zt-radius-app-icon:22%;

  /* ---------- Elevation ---------- */
  --zt-elev-1:0 1px 2px rgba(0,0,0,.45);
  --zt-elev-2:0 8px 24px -8px rgba(0,0,0,.6);
  --zt-elev-3:0 24px 64px -16px rgba(0,0,0,.72);
  --zt-glow:0 0 0 1px rgba(255,200,1,.22), 0 10px 36px -10px rgba(255,200,1,.34);
  --zt-focus-ring:0 0 0 3px rgba(255,200,1,.14);

  /* ---------- Layout ---------- */
  --zt-container:1280px;
  --zt-grid-cols-desktop:12;  --zt-gutter-desktop:24px;  --zt-margin-desktop:48px;
  --zt-grid-cols-tablet:8;    --zt-gutter-tablet:20px;   --zt-margin-tablet:32px;
  --zt-grid-cols-mobile:4;    --zt-gutter-mobile:16px;   --zt-margin-mobile:20px;

  /* ---------- Controls ---------- */
  --zt-control-sm:36px;
  --zt-control-md:44px;
  --zt-control-lg:52px;

  /* ---------- Icons ---------- */
  --zt-icon-grid:24px;
  --zt-icon-stroke:1.75px;
  --zt-icon-linecap:round;
  --zt-icon-padding:2px;

  /* ---------- Motion ---------- */
  --zt-ease:cubic-bezier(.2,.7,.3,1);
  --zt-dur-fast:120ms;
  --zt-dur-base:180ms;
  --zt-dur-slow:280ms;

  /* ---------- Signature ---------- */
  --zt-angle:45deg;   /* زاوية العلامة — كل عنصر قطري يلتزم بها */
}

/* ========================================================== Light theme */
[data-theme="light"]{
  --zt-bg:#FFFFFF;
  --zt-surface:#F5F7F9;
  --zt-surface-raised:#FFFFFF;
  --zt-border:#E3E7EC;
  --zt-border-strong:#CDD4DC;
  --zt-text:#0E1014;
  --zt-text-2:#4A525E;
  --zt-text-3:#6E7783;
  --zt-text-disabled:#A2AAB5;

  --zt-success-bg:#E9F9F1; --zt-success-bd:#BCE9D2;
  --zt-warning-bg:#FFF6E3; --zt-warning-bd:#F5DFA8;
  --zt-error-bg:#FEECEC;   --zt-error-bd:#F6C4C5;
  --zt-info-bg:#EAF1FF;    --zt-info-bd:#C3D8FF;

  --zt-elev-1:0 1px 2px rgba(14,16,20,.06);
  --zt-elev-2:0 8px 24px -8px rgba(14,16,20,.12);
  --zt-elev-3:0 24px 64px -16px rgba(14,16,20,.16);
  --zt-glow:0 0 0 1px rgba(255,200,1,.5), 0 10px 30px -12px rgba(224,172,0,.4);
}

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