/*
 * IIU admin-hub design tokens (Direction A.1 — "Modern Academic").
 * Source of truth: docs/design/DESIGN_DECISIONS.md §6/§8/§9 (Direction A) as
 * revised by docs/design/A1_BRIEF.md G1-G5 (folded into docs/IIU_DESIGN_SYSTEM.md
 * §3/§4/§6), per docs/IIU_CODEX_DESIGN_IMPLEMENTATION.md §3.1.
 *
 * Migration step 1 only: this sheet defines tokens, it does not yet get consumed
 * by any component or page (iiu-hub.css and every hub page are unchanged in this
 * step) — loading this file must not alter any rendered page.
 *
 * Font files: owner approved self-hosting 2026-09-21; a separate task is
 * downloading/subsetting the variable woff2 files into admin_hub/assets/fonts/.
 * Until those files exist, @font-face simply fails to load and the browser
 * falls through to the fallback stack named in each --iiu-font-* value below
 * (Public Sans / Segoe UI / Tahoma / system-ui / Arial / serif / sans-serif) —
 * no visual break either way.
 *
 * Font @font-face src URLs carry a `?v=` query (see admin_hub/assets/fonts/FONTS.md).
 * The /assets/fonts/*.woff2 files are served with a one-year max-age, so the
 * `?v=` MUST be bumped every time a font file is rebuilt/replaced — otherwise
 * browsers that already cached the old file keep it for up to a year.
 */

@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/plus-jakarta-sans-var.woff2?v=20260921b") format("woff2-variations");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/plus-jakarta-sans-italic-var.woff2?v=20260921b") format("woff2-variations");
  font-weight: 200 800;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("/assets/fonts/cormorant-garamond-var.woff2?v=20260921b") format("woff2-variations");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("/assets/fonts/cormorant-garamond-italic-var.woff2?v=20260921b") format("woff2-variations");
  font-weight: 300 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122;
}

@font-face {
  font-family: "Noto Sans Arabic";
  src: url("/assets/fonts/noto-sans-arabic-var.woff2?v=20260921b") format("woff2-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

@font-face {
  font-family: "Noto Naskh Arabic";
  src: url("/assets/fonts/noto-naskh-arabic-var.woff2?v=20260921b") format("woff2-variations");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

:root {
  /* Colour — brand */
  --iiu-green-900: #0a2f31;   /* hover/pressed */
  --iiu-green-800: #0d3b3e;   /* brand primary: nav rail, primary buttons, section rules, links on cream */
  --iiu-green-100: #e4ecea;   /* selected row tint, ONLY */
  --iiu-gold-500:  #c5a540;   /* accent: hairline rules, next-step mark, active tab underline — never a fill, never text on cream */
  --iiu-gold-700:  #8a6d1f;   /* gold as text/icon on cream, AA */
  --iiu-canvas:    #f8f4ef;   /* page background */
  --iiu-surface:   #fdfaf6;   /* working surface / cards */
  --iiu-inset:     #f1ebe1;   /* A.1 (new, G3): evidence/technical surface — expanded evidence, technical details, change log, quoted instructions; 1px rule-strong on the inline-start edge only */
  --iiu-surface-raised: #ffffff; /* modals/popovers only */
  --iiu-ink:    #1e1a14;
  --iiu-ink-2:  #4a443c;      /* secondary text */
  --iiu-ink-3:  #6b6257;      /* muted / captions */
  --iiu-ink-4:  #9c948a;      /* disabled */
  --iiu-rule:        #e3ddd5; /* borders/dividers */
  --iiu-rule-strong: #cfc7bc; /* table header rule, focused card, inset inline-start edge */
  --iiu-nav-text:    #f3ede4;

  /* Colour — semantic (text / bg pairs). Per §3.1a, the A.1 eighth status state
     ("In progress ◐") reuses --iiu-info/--iiu-info-text/--iiu-info-bg — no new
     colour token, distinguished by symbol + label only. */
  --iiu-success:    #1f7a4d; --iiu-success-text: #14563a; --iiu-success-bg: #e8f3ec;
  --iiu-warning:    #b7791f; --iiu-warning-text: #7a4f10; --iiu-warning-bg: #fbf3e2;
  --iiu-error:      #b42318; --iiu-error-text:   #8a1a12; --iiu-error-bg:   #fdecea;
  --iiu-info:       #2b5f8a; --iiu-info-text:    #1f4666; --iiu-info-bg:    #eaf1f7; /* A.1: also the "In progress" status colour role, §3.4 */
  --iiu-neutral:    #7a7369; --iiu-neutral-bg:   #efebe5; --iiu-neutral-text: #5c554c;

  /* Typography — families. Fallback stacks (Public Sans / Segoe UI / Tahoma /
     system-ui / Arial / Amiri / serif / sans-serif) carry the page until the
     self-hosted woff2 files land in admin_hub/assets/fonts/. */
  --iiu-font-ui:        'Plus Jakarta Sans', 'Public Sans', system-ui, -apple-system, sans-serif;
  --iiu-font-editorial:  'Cormorant Garamond', Georgia, serif;
  --iiu-font-ui-ar:      'Noto Sans Arabic', 'Segoe UI', Tahoma, system-ui, Arial, sans-serif;
  --iiu-font-editorial-ar: 'Noto Naskh Arabic', 'Amiri', serif;

  /* Type scale: size / line-height / weight — A.1 values (G1, 2026-09-21), supersede memo §6 */
  --iiu-text-display:   2.5rem;   --iiu-lh-display:   2.75rem; --iiu-fw-display:   500; /* Cormorant, Launch Center welcome + one editorial section title per page, unchanged */
  --iiu-text-page-title: 1.5rem;  --iiu-lh-page-title: 2rem;   --iiu-fw-page-title: 600; /* unchanged */
  --iiu-text-section:   1.125rem; --iiu-lh-section:   1.75rem; --iiu-fw-section:   600; /* unchanged */
  --iiu-text-subsection: .9375rem; --iiu-lh-subsection: 1.5rem; --iiu-fw-subsection: 600; /* unchanged */
  --iiu-text-body:      1rem;     --iiu-lh-body:      1.625rem; --iiu-fw-body:      400; /* A.1: 16/26, was 15/24 */
  --iiu-text-secondary: .9375rem; --iiu-lh-secondary: 1.4375rem; --iiu-fw-secondary: 400; /* A.1: 15/23, was 14/22 */
  --iiu-text-label:     .875rem;  --iiu-lh-label:     1.25rem; --iiu-fw-label:     500; /* A.1: 14/20, was 13/20 */
  --iiu-text-caption:   .8125rem; --iiu-lh-caption:   1.1875rem; --iiu-fw-caption:   400; /* A.1: 13/19 — the floor, was 12/18 */
  --iiu-text-data:      .9375rem; --iiu-lh-data:      1.5rem;  --iiu-fw-data:      500; /* tabular-nums, unchanged */
  --iiu-text-button:    .875rem;  --iiu-lh-button:    1.25rem; --iiu-fw-button:    600; /* unchanged */
  --iiu-text-table-body: .9375rem; --iiu-lh-table-body: 1.375rem; --iiu-fw-table-body: 400; /* A.1 (new): 15/22 */
  --iiu-text-table-head: .875rem; --iiu-lh-table-head: 1.25rem; --iiu-fw-table-head: 600; /* A.1: 14/20, was 13/20 */
  --iiu-measure-reading: 68ch; /* A.1: was 72ch */

  /* Spacing scale: 4, 8, 12, 16, 24, 32, 48, 64 */
  --iiu-s1: 4px; --iiu-s2: 8px; --iiu-s3: 12px; --iiu-s4: 16px;
  --iiu-s5: 24px; --iiu-s6: 32px; --iiu-s7: 48px; --iiu-s8: 64px;
  --iiu-gutter: 24px;         /* 16px below 768 — see [dir] / media override below */
  --iiu-width-reading: 760px;
  --iiu-width-operational: 1200px;
  --iiu-width-table: 1360px;

  /* Sizing (memo §8, unchanged by A.1) */
  --iiu-button-height: 40px;
  --iiu-button-height-mobile: 44px;
  --iiu-input-height: 40px;
  --iiu-input-height-mobile: 44px;
  --iiu-table-row-height: 44px;
  --iiu-table-row-height-compact: 36px;
  --iiu-modal-max-width: 560px;
  --iiu-tap-target-min: 44px;

  /* Radius / shadow */
  --iiu-radius-control: 4px;  /* inputs, chips, tags */
  --iiu-radius-card:    6px;  /* buttons, cards */
  --iiu-radius-editorial: 12px; /* editorial callouts only */
  --iiu-radius-pill:    999px; /* status chips only */
  --iiu-shadow-popover: 0 8px 24px rgba(30, 26, 20, .12); /* modals/popovers/menus only, never on cards */

  /* Breakpoints (reference values only; media queries below cannot consume custom properties) */
  --iiu-breakpoint-mobile: 390px;
  --iiu-breakpoint-tablet: 768px;
  --iiu-breakpoint-laptop: 1024px;
  --iiu-breakpoint-desktop: 1280px;
  --iiu-breakpoint-desktop-wide: 1440px;
}

[lang="ar"] body, [dir="rtl"] {
  --iiu-font-ui: var(--iiu-font-ui-ar);
  --iiu-font-editorial: var(--iiu-font-editorial-ar);
}
/* Arabic body +1px over 16px Latin (A.1) and line-height +0.1, per IIU_DESIGN_SYSTEM.md §3.4 —
   applied where a page sets body text under --iiu-text-body (now 16px/26px, A.1); do not
   blanket-override --iiu-text-body itself, scope this to the specific smaller sizes
   (secondary/label/caption/table) per component. A.1's one explicit value, Arabic body 17/28,
   already matches this +1px/+0.1 rule exactly. */

@media (max-width: 768px) {
  :root { --iiu-gutter: 16px; }
}