/* =====================================================================
   TAFI — brand palette
   ---------------------------------------------------------------------
   The eight base colours from the brand guidelines, as CSS tokens, so new
   work names a colour instead of inventing one. Same values (and the same
   file name) as the TAFI Agent landing site, so the app and the marketing
   site read as one brand.

   The rest of the app was moved onto these hues in one pass: every colour
   literal keeps its lightness and its place, only its HUE was rotated onto
   the nearest brand hue. Yellow/amber has no counterpart in the palette, so
   warnings stayed amber; greys, near-blacks and near-whites are substrate,
   not brand colour, and were left alone.

   `--c-*-ink` is the same hue lifted for the dark UI, where the deep inks go
   muddy: use it for text, icons and thin strokes; use the base value for
   fills, chips and anything on a light surface.
   ===================================================================== */

:root {
    --c-orange: #e0701a;   /* Pantone 166   — the TAFI orange, stays primary */
    --c-red:    #d5002f;   /* Pantone 1795  R213 G0   B47  */
    --c-plum:   #940144;   /* Pantone 221   R148 G1   B68  */
    --c-rose:   #b94676;   /* Pantone 674   R185 G70  B118 */
    --c-green:  #34871d;   /* Pantone 363   R52  G135 B29  */
    --c-teal:   #006c50;   /* Pantone 342   R0   G108 B80  */
    --c-blue:   #1b7396;   /* Pantone 633   R27  G115 B150 */
    --c-black:  #000000;   /* Pantone Black                */

    /* Amber has no counterpart in the palette (see the note above), so
       warnings stayed amber — but one amber cannot serve both substrates.
       #f59e0b is the amber the dark UI uses everywhere; on white it drops to
       2.15:1 and the warning reads as a smudge. This is the same warning
       amber taken deep enough for a white surface (5.02:1). Pair them like
       the brand hues: base on light, `-ink` on dark. */
    --c-amber:     #b45309;
    --c-amber-ink: #f59e0b;

    /* the same hues at 10%, for backgrounds and rules */
    --t-orange: rgba(224, 112, 26, .10);
    --t-red:    rgba(213, 0, 47, .10);
    --t-plum:   rgba(148, 1, 68, .10);
    --t-rose:   rgba(185, 70, 118, .10);
    --t-green:  rgba(52, 135, 29, .10);
    --t-teal:   rgba(0, 108, 80, .10);
    --t-blue:   rgba(27, 115, 150, .10);

    /* The brand's plum and rose are documented above, but the UI does not use
       them: on screen, next to freight data, pink reads decorative rather than
       informative (Andreea, 14.08.2026). Wherever a purple or a pink hue was
       carrying a category, the UI uses this light blue instead — lifted well
       clear of --c-blue so the two never read as the same colour. */
    --c-sky:     #2f92bd;
    --c-sky-ink: #7cc6e2;

    /* lifted, for the dark surfaces (the default theme) */
    --c-orange-ink: #e88a3d;
    --c-red-ink:    #ef4469;
    --c-plum-ink:   #b94676;
    --c-rose-ink:   #e07ba5;
    --c-green-ink:  #6ec24e;
    --c-teal-ink:   #2f9e7d;
    --c-blue-ink:   #4ea8cd;
}

/* On white the deep inks are the readable ones, so the -ink aliases collapse
   back onto the base palette. */
[data-theme='light'] {
    --c-amber-ink:  var(--c-amber);
    --c-orange-ink: var(--c-orange);
    --c-red-ink:    var(--c-red);
    --c-plum-ink:   var(--c-plum);
    --c-rose-ink:   var(--c-rose);
    --c-green-ink:  var(--c-green);
    --c-teal-ink:   var(--c-teal);
    --c-blue-ink:   var(--c-blue);
}