/* The storefront design tokens (CMS-L9, T15).
   Values are read from the reference, never eyeballed (ADR 0004/0010): the
   core-* scales below are the constants the old Theo kit's component css
   named as fallbacks, hoisted here so one definition serves every component.
   Semantic colors (--color-fg-*, surfaces) are deliberately NOT set globally
   yet: the old kit's semantics are the dark editor's, and the storefront's
   own face arrives with its pages, read from the old page css.

   Everything here is in @layer haya-defaults, and that is load-bearing
   (CMS-L11): a normal declaration outside every layer beats a layered one no
   matter which sheet loads later, so while these were unlayered a site's own
   --font-sans in @layer haya-tokens silently lost to the system stack below,
   and choosing a font for a shop did nothing at all. Verified in a browser
   rather than reasoned about. The layer order is declared here because this
   sheet loads first; the generated token and page sheets re-declare the same
   order, which is idempotent. */
@layer haya-defaults, haya-tokens, haya-page, haya-node;

@layer haya-defaults {
    :root {
        /* brand (blue) */
        --core-brand-300: #71c9ff;
        --core-brand-500: #2ea2f0;
        --core-brand-600: #1f81d6;
        --core-accent-glow: #44e9ff;

        /* neutrals */
        --core-neutral-50: #f4f4f4;
        --core-neutral-300: #a9a9a9;
        --core-neutral-600: #3f3f3f;
        --core-neutral-800: #262626;

        /* status */
        --core-success-400: #34d399;
        --core-success-600: #059669;
        --core-success-700: #047857;
        --core-error-400: #f87171;
        --core-error-600: #dc2626;
        --core-error-700: #b91c1c;

        /* alpha steps */
        --core-alpha-white-08: rgba(255, 255, 255, 0.08);
        --core-alpha-white-12: rgba(255, 255, 255, 0.12);
        --core-alpha-white-18: rgba(255, 255, 255, 0.18);
        --core-alpha-white-24: rgba(255, 255, 255, 0.24);
        --core-alpha-white-40: rgba(255, 255, 255, 0.40);

        /* shape & type scale */
        --radius-2: 8px;
        --fs-11: 11px;
        --fs-12: 12px;
        --fw-bold: 700;

        /* The fallback until a site's own token sheet answers: a shop that has
           never been themed still reads in something, and a themed one is
           served its own family from /css/tokens.{version}.css. */
        --font-sans: system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif;

        /* the page itself */
        --web-canvas: #f4f7fe;
        --web-ink: #3d3f52;

        /* This design is light-only, and says so: without color-scheme a
           machine set to dark opens a light-only shop in dark — the browser
           paints its own dark canvas behind pages that never declare one, and
           the cards' dark-blue titles disappear into it. The admin paid for
           this once (CMS-L1's data-scheme fix); the storefront states it
           here instead of discovering it per page. */
        color-scheme: light;
    }

    body {
        margin: 0;
        background: var(--web-canvas);
        color: var(--web-ink);
        /* "Haya Emoji" first (emoji.css): its unicode-range confines it to
           emoji, so the site's own --font-sans still sets every letter. */
        font-family: "Haya Emoji", var(--font-sans);
    }
}