/* =====================================================================
   Project Food — design tokens (Phase 13B: Nomvo design system)
   Single source of truth for every colour/type/radius/spacing/motion
   token used across BOTH the admin screens and the customer-facing
   ordering flow. Loaded once, unconditionally, at the top of
   app/Views/layout.php — no other file should define a competing
   :root block for these names.

   The tokens/*.css files are the Nomvo design system's own token
   files, ported verbatim (per its handoff README: "adopt close to
   verbatim... do not round values to a 4/8px grid"). This file is
   just the aggregator, the self-hosted @font-face rules (the bundle's
   own fonts.css loads from Google Fonts — we self-host instead, and
   already did before this phase), and a compat-alias layer mapping
   this app's existing variable names onto the canonical Nomvo ones,
   so the hundreds of existing var(--brand-color) / var(--canvas) /
   etc. call sites across admin.css/components.css/menu.css/kds.css/
   driver.css/menu-builder.css keep working without a site-wide rename.

   Two names COULD NOT be safely aliased and were renamed at every call
   site instead, because the old name's numbering doesn't correspond
   1:1 to the same pixel value in the new scale:
     - --space-1..6 (old 4/8/12/16/24/32px) → every call site now
       references the Nomvo slot that has the SAME pixel value
       (old --space-2 (8px) is now var(--space-4), etc.) rather than
       silently changing meaning under an unchanged name.
     - --font-heading → renamed to --font-display (Nomvo's own name for
       the same Sora-headings token) at every call site.
   ===================================================================== */

/* ?v=2 (Phase 34 banner hues) — @import URLs are static text, so unlike
   this file's own <link> (cache-busted per-deploy via asset_url()'s
   filemtime query), nothing forces the CDN/browser to refetch this one
   when only colors.css itself changes. Bump this manually whenever
   colors.css changes, same reasoning as a cache-busted script tag. */
@import url('tokens/colors.css?v=2');
@import url('tokens/typography.css');
@import url('tokens/spacing.css');
@import url('tokens/radius.css');
@import url('tokens/elevation.css');
@import url('tokens/motion.css');
@import url('tokens/base.css');

@font-face {
    font-family: 'Sora';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/sora-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Sora';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/sora-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Sora';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/sora-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Sora';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/sora-variable.woff2') format('woff2');
}

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/inter-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/inter-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/inter-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/inter-variable.woff2') format('woff2');
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/ibm-plex-mono-400.woff2') format('woff2');
}
@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/ibm-plex-mono-500.woff2') format('woff2');
}
@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/ibm-plex-mono-600.woff2') format('woff2');
}

/* ---------------------------------------------------------------------
   Compat aliases — this app's existing token names, pointed at the
   canonical Nomvo values above. Existing CSS across the whole app
   keeps working unchanged; only the VALUES it resolves to are now the
   exact, final Nomvo ones instead of the earlier hand-picked
   approximations (e.g. --ink-faint was #9CA199, is now #8E938B).
   --------------------------------------------------------------------- */
:root {
    --brand-color: var(--verdigris-600);
    --brand-color-soft: var(--verdigris-100);
    --brand-color-contrast: var(--text-on-accent);
    --canvas: var(--surface-page);
    --surface: var(--surface-card);
    --ink: var(--ink-900);
    --ink-muted: var(--text-muted);
    --ink-faint: var(--text-faint);
    --border: var(--border-subtle);
    --amber: var(--amber-600);
    --amber-soft: var(--warning-surface);
    --rust: var(--rust-600);
    --rust-soft: var(--danger-surface);
    --shadow-card: var(--shadow-xs);
}