/* ============================================================
   theme1 public design tokens — SINGLE SOURCE OF TRUTH
   ------------------------------------------------------------
   One place to change colour / radius / shadow / spacing / fonts for the
   PUBLIC (user-side) site. The look is aligned with the istt.ir visual
   language (flat surfaces, 8–12px radii, generous whitespace, muted-grey
   metadata, boxed "see more" tiles) while KEEPING the CMS blue brand.

   Loaded from themes/theme1/templates/base.html BEFORE style.css and
   site.css, so every downstream rule can reference these variables.
   The dashboard is never themed and does not load this file.
   ============================================================ */
/* NOTE — selector is ``html:root`` (specificity 0,1,1), NOT a bare ``:root``
   (0,1,0). The public slider plugin (``slider_app/plugin.html``) still loads the
   editor stylesheet ``css/slider/editor.css`` for its preview player, and that
   sheet declares a bare ``:root { font-family: Vazirmatn…; --line; --muted;
   --bg; --text; --soft; --panel }``. Because it is loaded *after* this file,
   a same-specificity ``:root`` here would lose the cascade and the editor sheet
   would silently hijack the theme's font (falling back to the never-bundled
   Vazirmatn/Tahoma) and the shared ``--line``/``--muted``/``--bg`` tokens. The
   extra type selector lets this block win regardless of load order, so the
   theme stays the single source of truth without touching the editor sheet. */
html:root {
    /* Re-assert the base font/colour the editor sheet would otherwise clobber. */
    font-family: var(--font-family);
    color: var(--ink);

    /* ---- brand (kept: CMS blue) ---- */
    --brand-main: #1451a4;
    --brand-main-dark: #12488f;
    --brand-main-light: #e3eaf7;
    --brand-main-050: #f2f6fc;
    --brand-main-gradient: linear-gradient(45deg, #1451a4, #5d8fd3);
    /* Optional warm accent for emphasis (istt uses a similar orange). */
    --brand-accent: #f47920;
    --brand-gold: #f5c451;

    /* ---- neutrals (istt-derived) ---- */
    --ink: #292929;
    --ink-2: #404040;
    --muted: #6b7280;
    --muted-2: #94939f;
    --line: #e6e8ec;
    --line-strong: #d3d3d3;
    --surface: #ffffff;
    --surface-alt: #f6f6fb;
    --bg: #f6f8fb;

    /* ---- radii (istt: small, flat corners) ---- */
    --radius-sm: 8px;
    --radius: 10px;
    --radius-lg: 12px;
    --radius-pill: 999px;

    /* ---- shadows (subtle, flat) ---- */
    --shadow-sm: 0 1px 3px rgba(16, 31, 56, .06);
    --shadow: 0 4px 16px rgba(16, 31, 56, .07);
    --shadow-lg: 0 12px 30px rgba(16, 31, 56, .10);

    /* ---- spacing scale ---- */
    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;

    /* ---- typography ----
       Anjoman (the font istt.ir uses) is NOT bundled in this repo and its licence
       is not available, so we standardise on the theme's own Persian webfont:
       IRANSansX, which ``rtl.css`` wires up via the aliased families declared in
       ``assets/fonts/farsi-fonts/font.css`` (font-primary / font-regular / …).
       Using those aliases keeps a single source of truth and avoids referencing a
       family that is never loaded (which silently fell back to Tahoma).
       The weight aliases let a component pick the exact IRANSansX weight it needs
       (istt drives most of its typography through weight, not colour). */
    --font-family: font-primary, "IRANSansX", "Tahoma", system-ui, sans-serif;
    --font-regular: font-regular, "IRANSansX", "Tahoma", system-ui, sans-serif;
    --font-medium: font-medium, "IRANSansX", "Tahoma", system-ui, sans-serif;
    --font-demibold: font-demi-bold, "IRANSansX", "Tahoma", system-ui, sans-serif;
    --font-bold: font-bold, "IRANSansX", "Tahoma", system-ui, sans-serif;
    --font-extrabold: font-extra-bold, "IRANSansX", "Tahoma", system-ui, sans-serif;
    --line-height: 1.9;
}