/*
  NAS design tokens.
  Source: docs/NASST-Migration/05-UI-UX-Design-Specification.md (NAS-UI-001) and
  06-PDF-Design-Analysis.md. "Confirmed" = vector value from the PDF, "Sampled" = pixel
  sample, "Proposed" = not in the PDF and needs design sign-off.
  Fonts: Fira Sans (Latin, matches the approved Coming Soon page) and Tajawal (Arabic)
  are PROVISIONAL. Both are SIL OFL via Google Fonts; final family and self-hosting
  (NAS-UI-003) require confirmation from the designer.
*/
:root {
  /* Brand colours */
  --nas-purple: #3f2e81;        /* Confirmed (vector) */
  --nas-purple-700: #33256b;    /* Proposed: hover, ~8% darker */
  --nas-blue: #336b93;          /* Sampled */
  --nas-teal: #1aada2;          /* Sampled */
  --nas-green: #6bbe46;         /* Sampled */
  --nas-green-700: #3f7d22;     /* Proposed: AA-safe text variant of green */
  --nas-gradient: linear-gradient(45deg, var(--nas-purple) 0%, var(--nas-blue) 30%, var(--nas-teal) 60%, var(--nas-green) 100%);
  --nas-gradient-vertical: linear-gradient(180deg, var(--nas-purple) 0%, var(--nas-blue) 30%, var(--nas-teal) 60%, var(--nas-green) 100%);

  /* Neutrals */
  --nas-ink: #231f20;           /* Confirmed (vector) */
  --nas-grey-600: #808181;      /* Confirmed (vector) - decoration only, fails AA as body text */
  --nas-muted: #5d6585;         /* Proposed: AA-safe secondary text (Coming Soon page) */
  --nas-card-bg: #d2d1d1;       /* Sampled */
  --nas-tile-bg: #dbdbdc;       /* Sampled */
  --nas-hero-top: #b3b4b5;      /* Sampled */
  --nas-surface: #ffffff;
  --nas-surface-alt: #f5f5f7;
  --nas-border: #bdbdbd;

  /* Category pictogram accents */
  --nas-cyan: #00aeef;          /* Confirmed (male) */
  --nas-magenta: #d6338a;       /* Requires confirmation (female) */
  --nas-star: #eeba34;          /* Confirmed */
  --uae-red: #ed2126;
  --uae-green: #39b250;

  /* Feedback (Proposed - not in PDF) */
  --nas-danger: #d52027;
  --nas-danger-bg: #fdecec;
  --nas-warning: #8a5a00;
  --nas-warning-bg: #fff4d6;
  --nas-success: var(--nas-green-700);
  --nas-success-bg: #ecf7e6;
  --nas-info: var(--nas-blue);
  --nas-info-bg: #e8f1f8;

  /* Typography */
  --font-latin: "Fira Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Fira Sans Condensed", var(--font-latin);
  --font-arabic: "Tajawal", "Segoe UI", Tahoma, sans-serif;
  --font-body: var(--font-latin);
  --fs-caption: .75rem;
  --fs-small: .875rem;
  --fs-body: 1rem;
  --fs-h3: 1.25rem;
  --fs-h2: 1.5rem;
  --fs-h1: clamp(1.75rem, 1.2rem + 2vw, 2.5rem);
  --fs-display: clamp(2.25rem, 1.4rem + 4vw, 4.5rem);
  --lh-body: 1.5;
  --lh-heading: 1.2;

  /* Spacing scale: 4 8 12 16 24 32 48 64 */
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;

  /* Shape and depth */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-pill: 999px;
  --shadow-card: 4px 6px 10px rgba(0, 0, 0, .25);   /* Inferred from PDF */
  --shadow-card-hover: 6px 12px 22px rgba(0, 0, 0, .28);
  --shadow-soft: 0 2px 10px rgba(35, 31, 32, .08);
  --focus-ring: 0 0 0 2px var(--nas-surface), 0 0 0 4px var(--nas-teal);

  /* Layout */
  --container-max: 1220px;
  --header-height: 72px;
  --sidebar-width: 260px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --duration: 200ms;
}

:root[lang|="ar"] {
  --font-body: var(--font-arabic), var(--font-latin);
  --font-display: var(--font-arabic), var(--font-latin);
}
