/* ==========================================================================
   tokens.css — design tokens for PDFTURA.
   One place for color, spacing, type, radius, and shadow so the whole site
   stays consistent. Referenced by main.css via var(--token).
   ========================================================================== */

/* --- Brand font, self-hosted ----------------------------------------------
   Plus Jakarta Sans as a VARIABLE font: one file answers every weight from
   400 to 800, replacing the five separate static weights the site used to
   pull from fonts.googleapis.com. Living here rather than in a layout means
   the public shell, the auth pages and the admin shell share one definition —
   they all load this file.

   The matching <link rel="preload"> sits in each layout's <head>; a preload
   cannot be written in CSS, and without it the browser would not learn about
   the font until this stylesheet had been fetched and parsed.

   unicode-range keeps the latin-ext file off the wire until a page actually
   contains one of those characters. A glyph in neither file falls through to
   the system stack in --font-sans, so nothing ever renders as tofu.

   Files come from tools/fetch-brand-font.ps1. If they are missing from the
   server the site simply uses the fallback stack — degraded, not broken. */
@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url("/assets/fonts/ui/plus-jakarta-sans-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
        U+02DA, U+02DC, U+0304, U+0308, U+0329, 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";
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url("/assets/fonts/ui/plus-jakarta-sans-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
        U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
        U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
        U+A720-A7FF;
}

:root {
    color-scheme: light;

    /* --- Brand & accent ---------------------------------------------------
       One confident accent (a warm indigo/violet) plus a supporting teal for
       AI tools. Kept to a small, deliberate palette. */
    --c-accent:        #5b4bff;
    --c-accent-dark:   #4436d6;
    --c-accent-soft:   #eceafe;
    --c-ai:            #0ea5a4;
    --c-ai-soft:       #ddf5f4;

    /* --- Neutrals (gray scale) -------------------------------------------- */
    --c-ink:           #1a1a2e;   /* primary text */
    --c-ink-soft:      #4a4a63;   /* secondary text */
    --c-muted:         #7a7a92;   /* tertiary / captions */
    --c-line:          #e6e6ef;   /* borders / dividers */
    --c-surface:       #ffffff;   /* cards */
    --c-surface-2:     #f6f6fb;   /* page background */
    --c-surface-3:     #eef0f6;   /* subtle fills */

    /* --- Status ----------------------------------------------------------- */
    --c-success:       #16a34a;
    --c-warning:       #d97706;
    --c-danger:        #dc2626;

    /* --- Badges ----------------------------------------------------------- */
    --c-badge-new:     #16a34a;
    --c-badge-beta:    #d97706;
    --c-badge-featured:#5b4bff;
    --c-badge-popular: #e11d63;

    /* --- Typography -------------------------------------------------------
       Plus Jakarta Sans is the brand font, self-hosted — see the @font-face
       rules at the top of this file. It falls back to the system stack if the
       webfont is blocked or missing, so text always renders instantly. */
    --font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
                 Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

    /* Slightly larger scale for a more premium, readable feel. */
    --fs-xs:   0.8125rem;   /* 13px */
    --fs-sm:   0.9375rem;   /* 15px */
    --fs-base: 1.0625rem;   /* 17px */
    --fs-lg:   1.25rem;     /* 20px */
    --fs-xl:   1.5rem;      /* 24px */
    --fs-2xl:  2rem;        /* 32px */
    --fs-3xl:  2.625rem;    /* 42px */

    --lh-tight: 1.2;
    --lh-base:  1.55;

    /* --- Spacing scale (4px base) ----------------------------------------- */
    --s-1: 0.25rem;
    --s-2: 0.5rem;
    --s-3: 0.75rem;
    --s-4: 1rem;
    --s-5: 1.5rem;
    --s-6: 2rem;
    --s-7: 3rem;
    --s-8: 4rem;

    /* --- Radius ----------------------------------------------------------- */
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 16px;
    --r-full: 999px;

    /* --- Shadow ----------------------------------------------------------- */
    --sh-sm: 0 1px 2px rgba(26, 26, 46, 0.06);
    --sh-md: 0 4px 14px rgba(26, 26, 46, 0.08);
    --sh-lg: 0 12px 32px rgba(26, 26, 46, 0.12);

    /* --- Layout ----------------------------------------------------------- */
    --container: 1320px;
    --header-h: 58px;
}
