/* ============================================================================
   SpectroFit design tokens.
   The :root block is copied VERBATIM from SPECTROFIT_LANDING_DESIGN.md §Tokens
   — do not edit the inherited values. App-only additions (brief §4.2) and the
   per-surface accent map (rule 5) follow.
   ============================================================================ */

:root {
    /* Brand */
    --ink-deep:   #15091F;   /* masthead, dark sections */
    --ink:        #1E0B3D;   /* headings, primary button */
    --ink-soft:   #3A2A56;
    --violet:     #4F2F8F;   /* utility labels, focus ring, links */
    --violet-lift:#6B46B0;
    --cyan:       #00D9F5;   /* accents on dark ground only */

    /* Ground */
    --paper:      #FFFFFF;
    --paper-50:   #FAFAFB;   /* alternating sections, recessed panels */
    --paper-100:  #F2F1F6;   /* the one heavier ground, used sparingly */
    --rule:       #E7E5EF;   /* every hairline */

    /* Text */
    --gray-700:   #3D3B45;   /* body */
    --gray-600:   #5C5968;   /* secondary, lede */
    --gray-500:   #807D8C;   /* captions, units, disabled */

    /* Process inks. On a strip or a chart they are data; elsewhere they
       identify a surface. Yellow is unreadable as a graphic on white, so
       --ink-y-deep (the amber it prints as on a wet sheet) stands in. */
    --ink-c: #00AEEF;
    --ink-m: #EC008C;
    --ink-y: #FFF200;
    --ink-k: #1A1A1A;
    --ink-y-deep: #E8A400;

    /* One ink per surface, overridden per route/section (see body.surface-*). */
    --accent: #4F2F8F;
    --accent-rgb: 79, 47, 143;

    /* Measurement verdicts. Reserved — see rule 3. */
    --pass: #1E7F4B;
    --warn: #A66A00;
    --fail: #C42B2B;

    /* Type */
    --font-display: 'Archivo', 'Segoe UI', sans-serif;      /* variable width */
    --font-body:    'IBM Plex Sans', 'Segoe UI', sans-serif;
    --font-mono:    'IBM Plex Mono', 'Courier New', monospace;

    /* Layout */
    --max-width:  1240px;
    --label-col:  190px;   /* the mono label column */
    --radius-sm:  4px;
    --radius-md:  10px;
    --radius-lg:  18px;
    --nav-height: 66px;

    --ease: cubic-bezier(0.16, 1, 0.3, 1);
    --t: 0.35s var(--ease);

    /* The visible spectrum, 400nm -> 700nm: the instrument's range. Used for
       dividers and progress, never as a background fill. */
    --spectrum: linear-gradient(90deg,
        #5B00A8 0%, #3A00E0 9%, #0052FF 19%, #00A6D6 31%,
        #00C853 46%, #9CCC00 58%, #FFD400 69%, #FF7A00 83%, #D50000 100%);

    /* ── app-only additions (brief §4.2) ─────────────────────────────────── */

    /* Density channel inks, reused from the process inks so the density chips
       in the measurement tables agree with the chart series. Replaces the old
       .Cyan/.Magenta/.Yellow/.Black classes in the deleted base.css. */
    --chan-c: var(--ink-c);
    --chan-m: var(--ink-m);
    --chan-y: var(--ink-y-deep);
    --chan-k: var(--ink-k);

    /* Table rhythm — two densities (design-system data-table note). */
    --row-h:       48px;
    --row-h-dense: 40px;

    /* Soft-deleted rows. NOT --fail: a disabled client is not a failed
       measurement (rule 3). */
    --muted-strike: var(--gray-500);
}

/* ── V2 additions (final brief §4) — copied verbatim ─────────────────────── */
:root {
    /* Control geometry. The design system fixes radii; these fix the shapes
       Bootstrap used to own (§2.5). One scale, three sizes. */
    --ctrl-h:      40px;   /* default button / input height */
    --ctrl-h-sm:   32px;
    --ctrl-h-lg:   48px;   /* touch target on the auth pages + mobile primaries */
    --ctrl-pad-x:  1.15rem;

    /* A control edge you can actually see. --rule (#E7E5EF) is 1.25:1 on white:
       fine for a table hairline, invisible on a button or an input (§2.5). */
    --edge:        #C9C5D8;   /* 2.3:1 on --paper — control boundaries */
    --edge-strong: #9C97AE;   /* hover boundary */

    /* Accent washes. Rule 1: colour arrives as light. These are the only
       accent-on-surface fills allowed, and only on interactive elements. */
    --accent-wash:   rgba(var(--accent-rgb), 0.06);
    --accent-wash-2: rgba(var(--accent-rgb), 0.12);

    /* The shell. Phase G deleted the last two left-rail tokens (DEC-1); the
       only "rail" left in the tree is prose in comments. */
    --ctx-height:  56px;   /* context bar MIN-height. NOT its height: the bar wraps —
                             measured 67.75px desktop / 126.5px at 375px. Never use
                             this as a sticky offset (that is what buried .read-progress). */
    --shell-max:   1240px; /* = --max-width; content is centred, not full-bleed */

    /* Motion (§8). The design system supplies --ease and --t (0.35s); an app
       needs faster grades for controls and a slower one for ambient. */
    --t-fast:   0.14s var(--ease);   /* hover, colour, border */
    --t-press:  0.08s var(--ease);   /* active/press */
    --t-panel:  0.26s var(--ease);   /* disclosure height, menu, modal enter */
    --t-exit:   0.19s var(--ease);   /* ≈75% of enter, per the design system */
    --t-swap:   0.22s var(--ease);   /* resolve-don't-cut on new readings */
    --stagger:  24ms;                /* per-row reveal delay */

    /* Skeleton shimmer for loading regions (§7.3). */
    --skeleton:  linear-gradient(90deg,
                   var(--paper-50) 0%, var(--paper-100) 40%,
                   var(--paper-50) 80%);
}

/* One accent per surface (rule 5). Set via <body class="surface-*">; the surface
   context processor derives it from the route's blueprint. Default violet. */
body.surface-medidas    { --accent: #00AEEF; --accent-rgb: 0, 174, 239; }
body.surface-colores    { --accent: #EC008C; --accent-rgb: 236, 0, 140; }
body.surface-equipos    { --accent: #E8A400; --accent-rgb: 232, 164, 0; }
body.surface-admin,
body.surface-estructura { --accent: #4F2F8F; --accent-rgb: 79, 47, 143; }

/* A var() inside a custom property is substituted where the property is
   DECLARED, not where it is used: declared only on :root, --accent-wash bakes in
   the DEFAULT --accent-rgb and every surface would wash violet. Re-declaring the
   pair on body re-substitutes it against the surface class on the same element.
   ponytail: one extra rule instead of repeating the pair in all five surface
   rules; ceiling — any future accent override below <body> needs the same trick. */
body { --accent-wash: rgba(var(--accent-rgb), 0.06); --accent-wash-2: rgba(var(--accent-rgb), 0.12); }
