/* ═══════════════════════════════════════════════════════════════════════════
   GULFLEDGER DESIGN SYSTEM  ·  gl-design-system.css
   ──────────────────────────────────────────────────────────────────────────
   Shared across every app page. The browser downloads this ONCE and uses
   the cached copy for every subsequent page navigation — making page-to-page
   navigation feel instant.

   IMPORTANT: keep this file STABLE — if you change it, every cached copy in
   every user's browser becomes stale. For non-breaking additions, add new
   tokens or classes at the end. For breaking changes, version the URL
   (e.g. gl-design-system.v2.css) so old caches don't pollute the upgrade.

   THREE PRINCIPLES (in priority order):
     1. Trusted    — institutional calm, restraint, consistency
     2. Effortless — minimal cognitive load, easy on the eye, mobile-respectful
     3. Saudi      — embedded culturally, not bolted on
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  --color-bg-page:#F5F4F0;--color-bg-surface:#FFFFFF;--color-bg-subtle:#EDECE8;--color-bg-muted:#E5E4DF;
  --color-text-strong:#171717;--color-text-default:#404040;--color-text-muted:#737373;--color-text-faint:#A3A3A3;--color-text-on-primary:#FFFFFF;
  --color-border:#E5E7EB;--color-border-strong:#D4D4D4;
  --color-primary:#006C35;--color-primary-hover:#00592C;--color-primary-soft:rgba(0,108,53,0.08);--color-primary-tint:rgba(0,108,53,0.12);
  --color-status-success:#166534;--color-status-success-bg:#DCFCE7;
  --color-status-warning:#92400E;--color-status-warning-bg:#FEF3C7;
  --color-status-danger:#991B1B;--color-status-danger-bg:#FEE2E2;
  --color-status-info:#1E40AF;--color-status-info-bg:#DBEAFE;
  --color-status-neutral:#525252;--color-status-neutral-bg:#F5F5F4;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;
  --font-sans:'IBM Plex Sans Arabic','IBM Plex Sans','Tajawal','Cairo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --text-xs:12px;--text-sm:13px;--text-base:15px;--text-lg:17px;--text-xl:20px;--text-2xl:24px;
  --radius-sm:6px;--radius-md:8px;--radius-lg:12px;
  --shadow-sm:0 1px 2px rgba(0,0,0,0.04);--shadow-md:0 4px 12px rgba(0,0,0,0.06),0 1px 3px rgba(0,0,0,0.04);--shadow-lg:0 12px 32px rgba(0,0,0,0.10),0 4px 8px rgba(0,0,0,0.05);
  --motion-fast:120ms;--motion-base:180ms;--ease-out:cubic-bezier(0.16,1,0.3,1);
  --nav-height:52px;--tap-min:44px;
  /* Legacy aliases */
  --navy:#0A2818;--blue:var(--color-primary);--sky:var(--color-primary-hover);--light:var(--color-primary-soft);--tint:var(--color-bg-subtle);
  --green:var(--color-status-success);--red:var(--color-status-danger);--amber:var(--color-status-warning);
  --ink:var(--color-text-strong);--muted:var(--color-text-muted);--border:var(--color-border);--bg:var(--color-bg-page);--white:var(--color-bg-surface);
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{font-family:var(--font-sans);background:var(--color-bg-page);color:var(--color-text-default);min-height:100vh;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body{font-size:var(--text-base);line-height:1.5;}
.num,.row-num,.row-amount,.stat-val{font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate;}