/*
 * coson/portal default theme — the complete semantic-token set every
 * package (coson-ui, coson-components, and any future feature package)
 * consumes instead of hardcoding brand colours (brief §12, layer 1+2).
 *
 * A host overrides individual tokens after this file loads (layer 3); the
 * default values below make the shell fully usable with zero host theming.
 * Load order across the whole stack (brief §14): components base -> this
 * file -> feature-package styles -> host theme -> page-specific styles.
 *
 * Default values implement a NEUTRAL SLATE system on purpose: this repository
 * ships no company's brand, so an install that configures nothing looks
 * unbranded rather than looking like somebody else. Cool slate neutrals, 12px
 * card radius, cool-blue-tinted shadows, Manrope type. The blue tokens below
 * are opt-in accents, not the default chrome.
 *
 * CONTRACT: every --portal-color-* value is a space-separated RGB triplet —
 * consumers do rgb(var(--portal-color-primary)) and
 * rgb(var(--portal-color-border) / 0.5). Never change a colour token to any
 * other format, and never remove or rename a token (fleet-wide break).
 *
 * FONTS: the design system's face is Manrope (UI/headings) with IBM Plex
 * Mono for code. This package deliberately never imports Google Fonts —
 * package CSS must not force a network fetch. The stacks below fall back to
 * system fonts; a host wanting the true Manrope/Plex Mono look should
 * self-host the fonts (or add its own <link>) so the family names resolve.
 */
:root {
    /* Primary action colour — drives primary buttons, active nav, focus.
     * DEFAULT is the design system's "Neutral Theme": a dark slate (#25394F),
     * NOT the brand blue. The Neutral Theme keeps chrome monochrome and
     * reserves brand colour for opt-in accents (see --portal-color-brand).
     * A host recolours every action by overriding this one token. */
    --portal-color-primary: 37 57 79;
    --portal-color-primary-contrast: 255 255 255;

    /*
     * Brand accent — the one colour the shell paints on top of its slate chrome:
     * dashboard stat chips, the overview panel, onboarding icons and links.
     *
     * Slate by default, and the SAME slate as --portal-color-primary. It used to be a
     * blue (#1466B4) left over from a real company's wordmark, so a repository that
     * ships a deliberately unbranded placeholder still had one blue surface — the
     * dashboard — announcing a brand nobody had configured. A host that wants an accent
     * overrides this one token through branding.theme_tokens.
     */
    --portal-color-brand: 60 81 103;

    /* Cool slate neutral scale (design system), for shell chrome — surfaces,
     * avatars, dot markers, muted pills. Triplet contract as all colours. */
    --portal-color-slate-100: 233 239 245; /* #E9EFF5 */
    --portal-color-slate-300: 174 190 204; /* #AEBECC */
    --portal-color-slate-400: 132 152 172; /* #8498AC */
    /* slate-600 is the design system's text colour for chips sitting on a
     * slate-100 fill: 5.7:1 there, where slate-400 is only 2.9:1. */
    --portal-color-slate-600: 72 95 118;   /* #485F76 */
    --portal-color-slate-700: 60 81 103;   /* #3C5167 */
    --portal-color-slate-800: 37 57 79;    /* #25394F */

    /* Surfaces — white cards on a cool off-white page (#F4F8FB) */
    --portal-color-surface: 255 255 255;
    --portal-color-surface-muted: 244 248 251;
    --portal-color-border: 226 234 241; /* #E2EAF1 hairline */

    /* Text — ink navy (#15263B) and slate-500 (#5E7993) */
    --portal-color-text: 21 38 59;
    --portal-color-text-muted: 94 121 147;

    /* Semantic */
    --portal-color-success: 30 158 106; /* #1E9E6A */
    --portal-color-warning: 224 148 26; /* #E0941A */
    --portal-color-danger: 216 69 59;   /* #D8453B */

    /*
     * The reading measure of a single-column page — every screen that is a form or a
     * short list rather than a wide table.
     *
     * These had each picked their own: 42rem on the profile, 40rem on the DMARC checker,
     * 38rem on feedback, 34rem on two-factor, 400px inline on the password change, and
     * 47.5rem across settings. Moving between them made the column jump every time.
     *
     * --portal-settings-width below is kept as an alias rather than renamed: token names
     * are a published contract, and nothing is gained by breaking one an hour after
     * shipping it.
     */
    --portal-page-width: 47.5rem;

    /*
     * The reading width of a settings screen. An alias of --portal-page-width.
     *
     * One token because the settings screens each picked their own: 760px on the two
     * Quote screens, 640px inline on Message settings, and full width on the
     * notification screens — so moving between them made the content column jump, and
     * the tables inside them were three different widths. Anything laying out a
     * settings screen reads this rather than a literal.
     *
     * 47.5rem (760px) is the value the busiest of those screens already used, and it
     * comfortably fits the widest table any of them renders (event + two channels).
     */
    --portal-settings-width: var(--portal-page-width);

    /* Radii — 12px default card/input radius per the design system */
    --portal-radius-sm: 0.5rem;
    --portal-radius-md: 0.75rem;
    --portal-radius-lg: 1rem;

    /* Elevation — cool-blue-tinted (design shadow-xs) */
    --portal-shadow-card:
        0 1px 2px rgb(21 38 59 / 0.06);

    --portal-font-sans:
        'Manrope', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;

    /* ------------------------------------------------------------------
     * Additive tokens — introduced after the original
     * brief; same triplet contract for colour tokens.
     * ------------------------------------------------------------------ */

    /* Deep gradient endpoints + azure accent from the wordmark */
    --portal-color-indigo: 36 60 142;  /* #243C8E */
    --portal-color-azure: 14 134 204;  /* #0E86CC */
    --portal-color-info: 14 134 204;

    /* Ink — near-black navy for dark brand panels (e.g. sign-in split) */
    --portal-color-ink: 21 38 59;      /* #15263B */
    --portal-color-border-strong: 203 215 226; /* #CBD7E2 input borders */

    /* Signature wordmark gradient (left -> right). Kept for opt-in brand
     * flourishes; the Neutral Theme does NOT paint it on buttons by default. */
    --portal-gradient-brand:
        linear-gradient(100deg, #243C8E 0%, #1466B4 46%, #0E86CC 100%);

    /* Gradient painted over primary-coloured actions (buttons). DEFAULT none,
     * so primary buttons are a solid --portal-color-primary (Neutral Theme
     * slate). A host opts into a gradient look by setting this to, e.g.,
     * var(--portal-gradient-brand). */
    --portal-gradient-primary: none;

    --portal-radius-pill: 999px;

    --portal-shadow-md: 0 8px 24px rgb(21 38 59 / 0.09);
    --portal-shadow-brand: 0 14px 34px rgb(60 81 103 / 0.30);

    --portal-font-mono:
        'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;

    /* Eyebrow labels — the brand's spaced uppercase "IT SERVICES" lockup */
    --portal-letterspacing-eyebrow: 0.14em;
}