/* ═══════════════════════════════════════════════════════════════════════
   KOJAK Rep Cashier · Design Tokens (single source of truth)
   ───────────────────────────────────────────────────────────────────────
   الهوية: «الذهب الهامس» — كحلي قاعدةً (60–70%) · عاجي/رمادي أسطحاً (25–30%)
   · ذهب لمساتٍ فقط (~10%) · تمييز نادر (~2%).
   النسخة المعتمدة هنا: الهوية المطوّرة (الشقيقة) من دليل الهوية §9/§10-ب.
   للعودة إلى النسخة المطابقة لـ ERP بدّل كتلة [A] فقط.
   قاعدة: لا لون مكتوب خارج هذا الملف. لا إيموجي. أرقام لاتينية.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  /* ── [A] Navy — base (deeper than ERP) ─────────────────────────────── */
  --kj-dark:        #2B3342;
  --kj-dark-soft:   #3A4557;   /* hover */
  --kj-dark-deep:   #1A1F28;   /* active + shadows */
  --kj-ink:         #1A1E25;   /* body text ink (not pure black) */

  /* ── [A] Gold — accents only (warmer) ──────────────────────────────── */
  --kj-gold:        #D9BA86;   /* borders, focus ring, active icon */
  --kj-gold-soft:   #F1E6D2;   /* badge backgrounds */
  --kj-gold-mid:    #B0925F;   /* icons/borders on light */
  --kj-gold-deep:   #786230;   /* contrast-safe gold TEXT */
  --kj-gold-cream:  #FAF3E7;   /* active nav item background */

  /* ── [A] Rare accent — emerald (instead of burgundy) ───────────────── */
  --kj-accent:      #2F6B57;
  --kj-accent-soft: #E1EEE8;
  --kj-accent-deep: #234E40;

  /* ── Surfaces ──────────────────────────────────────────────────────── */
  --kj-bg:          #F4F5F7;
  --kj-white:       #FFFFFF;
  --kj-cream-bg:    #FBF9F5;

  /* ── Warm grays ────────────────────────────────────────────────────── */
  --kj-gray-100:    #F3EFE7;
  --kj-gray-200:    #E7E0D3;   /* default borders */
  --kj-gray-300:    #D9D2C6;
  --kj-gray-400:    #B8B0A2;
  --kj-gray-500:    #9A9284;   /* secondary text, labels */
  --kj-gray-600:    #6B7280;
  --kj-gray-700:    #4B5563;

  /* ── Semantic ──────────────────────────────────────────────────────── */
  --kj-success:       #1F8A5B; --kj-success-soft: #E4F3EC; --kj-success-deep: #14603F;
  --kj-danger:        #EF4444; --kj-danger-soft:  #FEE2E2; --kj-danger-deep:  #991B1B;
  --kj-warning:       #B7791F; --kj-warning-soft: #FBEFD3; --kj-warning-deep: #7A5314;
  --kj-info:          #3A4557; --kj-info-soft:    #E7E9ED; --kj-info-deep:    #262E3A;

  /* ── Domain semantics (ledger) ─────────────────────────────────────── */
  /* «له» = الطرف مدين لنا (موجب)  ·  «عليه» = نحن مدينون له (سالب) */
  --kj-owed-to-us:      var(--kj-success-deep);
  --kj-owed-to-us-soft: var(--kj-success-soft);
  --kj-owed-by-us:      var(--kj-warning-deep);
  --kj-owed-by-us-soft: var(--kj-warning-soft);
  --kj-deleted:         var(--kj-accent);
  --kj-deleted-soft:    var(--kj-accent-soft);

  /* ── Typography ────────────────────────────────────────────────────── */
  --kj-font:         'Jost', 'Tajawal', -apple-system, BlinkMacSystemFont, 'Segoe UI', Tahoma, sans-serif;
  --kj-font-display: 'Fraunces', 'Tajawal', Georgia, serif;
  --kj-fs-xs: 10px; --kj-fs-sm: 11px; --kj-fs-base: 13px; --kj-fs-md: 14px;
  --kj-fs-lg: 16px; --kj-fs-xl: 18px; --kj-fs-2xl: 22px; --kj-fs-3xl: 28px;
  --kj-fs-4xl: 36px; --kj-fs-5xl: 48px;
  --kj-fw-light: 300; --kj-fw-normal: 400; --kj-fw-medium: 500; --kj-fw-bold: 700;

  /* ── Spacing ───────────────────────────────────────────────────────── */
  --kj-sp-1: 4px;  --kj-sp-2: 8px;  --kj-sp-3: 12px; --kj-sp-35: 14px; --kj-sp-4: 16px;
  --kj-sp-45: 18px; --kj-sp-5: 20px; --kj-sp-6: 24px; --kj-sp-8: 32px; --kj-sp-10: 40px;
  --kj-sp-14: 56px;

  /* ── Radius ────────────────────────────────────────────────────────── */
  --kj-radius-sm: 6px;  --kj-radius-md: 10px; --kj-radius-lg: 12px; --kj-radius-xl: 14px;
  --kj-radius-2xl: 16px; --kj-radius-3xl: 20px; --kj-radius-full: 9999px;

  /* ── Layers over the page ─────────────────────────────────────────── */
  --kj-scrim: rgba(26, 31, 40, 0.42);         /* behind a sheet or a modal */
  --kj-glass: rgba(255, 255, 255, 0.92);      /* a bar that stays over the content as it scrolls */

  /* ── Shadows — quiet, navy-tinted ──────────────────────────────────── */
  --kj-shadow-sm: 0 1px 3px  rgba(43, 51, 66, 0.06);
  --kj-shadow-md: 0 4px 12px rgba(43, 51, 66, 0.08);
  --kj-shadow-lg: 0 10px 30px rgba(43, 51, 66, 0.12);
  --kj-focus-ring: 0 0 0 3px rgba(217, 186, 134, 0.18);
  --kj-focus-ring-danger: 0 0 0 3px rgba(239, 68, 68, 0.14);

  /* ── Motion ────────────────────────────────────────────────────────── */
  --kj-ease-luxury: cubic-bezier(0.4, 0, 0.2, 1);
  --kj-transition-fast:   150ms var(--kj-ease-luxury);
  --kj-transition-normal: 250ms var(--kj-ease-luxury);

  /* ── Layout ────────────────────────────────────────────────────────── */
  --kj-sidebar-w: 260px;
  --kj-bottomnav-h: 64px;
  --kj-icon-size: 19px;
  --kj-icon-stroke: 1.75;
  --kj-safe-bottom: env(safe-area-inset-bottom, 0px);
  --kj-safe-top: env(safe-area-inset-top, 0px);
}
