/* ---- Design tokens (ARCHITECTURE.md §3.2) -----------------------------------------------------
   The shared vocabulary both sites size, space and color themselves from. Loaded by every host
   before its own app.css, so a host still wins where it deliberately disagrees.

   PURELY DECLARATIVE. There is not one element selector in this file, so adding the <link> changes
   nothing on screen until something asks for a token. That is what lets this ship ahead of the
   screens that use it.

   --cv-, NOT --carvin-. The Portal's own app.css already defines --carvin-ink, --carvin-accent and
   five more on :root, and it loads after this file - so reusing that prefix would have this layer
   silently overwritten on one of the two sites it exists to unify.

   LIGHT AND DARK, and nothing else. The host stamps data-carvin-scheme on <html>; a component may
   not ask which theme is running, because AppTheme lives in a module and shared UI may not
   reference one (FRAMEWORK.md §3.3). An attribute is the whole interface. */

:root,
:root[data-carvin-scheme="light"] {
    color-scheme: light;

    /* Type. 13px base is a deliberate density choice for screens somebody works in all day; the
       applicant portal deliberately does not use it and sets its own larger body size. */
    --cv-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --cv-font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
    --cv-text-xs: 11px;
    --cv-text-sm: 12px;
    --cv-text-base: 13px;
    --cv-text-lg: 15px;
    --cv-text-xl: 18px;
    --cv-leading: 1.35;
    --cv-weight-normal: 400;
    --cv-weight-medium: 500;
    --cv-weight-semibold: 600;
    --cv-weight-bold: 700;

    /* Space. One scale, so gaps between cards, fields and toolbar groups agree. */
    --cv-space-1: 4px;
    --cv-space-2: 8px;
    --cv-space-3: 12px;
    --cv-space-4: 16px;
    --cv-space-5: 20px;
    --cv-space-6: 24px;

    --cv-radius-sm: 4px;
    --cv-radius-md: 6px;
    --cv-radius-lg: 10px;

    /* Control and row geometry. The grid contract reads these rather than hard-coding pixels, so
       density is tuned in one place instead of per screen.

       24px is a working density, not a cramped one: it is what somebody reviewing a branch queue all
       day wants, and it is why the portal's one grid opts out with .carvin-grid--roomy rather than
       inheriting a decision made for staff. */
    --cv-control-height: 28px;
    --cv-row-height: 24px;
    --cv-header-height: 29px;
    --cv-cell-pad-y: 2px;
    --cv-cell-pad-x: 8px;

    /* NO FLOOR, deliberately. Blueprint forces its grids to 1440px so columns are never crammed,
       which works there because its grids have the columns to fill it. Ours do not - the companies
       grid sums to about 800px - and a forced floor does not create empty margin, it hands the
       leftover width to whichever column has no explicit width. On companies that was the command
       column, which rendered two icons in six hundred pixels of nothing.

       Columns carry their own widths and .carvin-grid-scroller scrolls when they genuinely exceed
       the viewport, so nothing is crammed without this. Set it per grid if one ever needs a floor. */
    --cv-grid-min-width: 0;

    /* Color. Accent tracks Fluent's brand ramp so DevExpress chrome and our own agree. */
    --cv-accent: #0f6cbd;
    --cv-accent-strong: #0c5da5;
    --cv-accent-contrast: #ffffff;

    --cv-text: #1b1b1f;
    --cv-text-soft: #424250;
    --cv-text-muted: #616170;

    --cv-surface: #ffffff;
    --cv-surface-subtle: #f5f6f8;
    --cv-surface-hover: #eceef2;
    --cv-page: #f0f2f5;
    --cv-input-bg: #ffffff;

    --cv-border: #d1d3d9;
    --cv-border-strong: #b0b3bc;

    --cv-success-bg: #e3f5e8;
    --cv-success-text: #0e6b31;
    --cv-warning-bg: #fdf3d8;
    --cv-warning-text: #8a5700;
    --cv-danger-bg: #fdeaea;
    --cv-danger-text: #b3261e;

    /* Row states. A percentage mix rather than a fixed tint, so both stay legible if the accent
       moves. */
    --cv-row-hover: color-mix(in srgb, var(--cv-accent) 9%, var(--cv-surface));
    --cv-row-selected: color-mix(in srgb, var(--cv-accent) 6%, var(--cv-surface));

    --cv-focus-ring: color-mix(in srgb, var(--cv-accent) 30%, transparent);
    --cv-invalid-ring: color-mix(in srgb, var(--cv-danger-text) 22%, transparent);

    --cv-shadow: 0 1px 3px rgba(27, 27, 31, 0.10);
    --cv-shadow-raised: 0 8px 24px rgba(27, 27, 31, 0.16);
}

/* Only the tokens whose ROLE changes are redefined. Anything absent here - the whole type scale,
   the space scale, every geometry value - deliberately carries over, so a spacing decision is made
   once rather than twice and cannot drift between schemes. */
:root[data-carvin-scheme="dark"] {
    color-scheme: dark;

    --cv-accent: #479ef5;
    --cv-accent-strong: #62abf5;
    --cv-accent-contrast: #0b1120;

    --cv-text: #f2f2f4;
    --cv-text-soft: #d6d6dd;
    --cv-text-muted: #a6a6b2;

    --cv-surface: #1f1f24;
    --cv-surface-subtle: #26262d;
    --cv-surface-hover: #2f2f38;
    --cv-page: #17171b;
    --cv-input-bg: #1a1a1f;

    --cv-border: #3b3b45;
    --cv-border-strong: #55555f;

    --cv-success-bg: #10331d;
    --cv-success-text: #6ddb92;
    --cv-warning-bg: #3a2a08;
    --cv-warning-text: #ffc95c;
    --cv-danger-bg: #3d1614;
    --cv-danger-text: #ff9a94;

    --cv-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
    --cv-shadow-raised: 0 8px 24px rgba(0, 0, 0, 0.55);
}
