/*
 * Couleurs du cabinet (Cabinet Cans), côté client.
 * Chargée par le layout main pour le rôle client seulement, après tokens.css et custom.css : ne redéfinit que
 * des tokens (gamme --marque-*, boutons de marque, sélection, tableaux --table-*, menu latéral --nav-*) et le fond de page.
 *
 * Piste « 5. Ocre Cabinet Cans » (maquettes des pistes graphiques du 15/10/2026) : dominante marine #17304F
 * (= gamme lochmara, échelon 900), secondaire ocre #C8B28C. Menu latéral marine, bouton principal ocre avec
 * texte marine, entrée de menu active et ligne cochée en ocre, fond de page légèrement réchauffé.
 * Dérivés calculés comme dans la maquette (mélanges OKLab, contraste WCAG) :
 *   texte marine sur ocre 6,5:1 ; ocre sur marine 6,5:1 ; texte du menu sur marine 10,5:1.
 *   L'ocre sur blanc (2,1:1) ne sert jamais de couleur de texte.
 */
:root {
    /* Dominante : gamme de marque inchangée (marine) */
    --marque-50: #F2F7FD;
    --marque-100: #E5EDF9;
    --marque-200: #C5DAF2;
    --marque-300: #91BCE8;
    --marque-400: #5699DA;
    --marque-500: #317CC6;
    --marque-600: #2161A8;
    --marque-700: #1C4E88;
    --marque-800: #1B4371;
    --marque-900: #17304F;
    --marque-950: #12253F;

    /* Secondaire ocre */
    --ocre: #C8B28C;
    --ocre-survol: #A89675;        /* ocre assombri de 12 % */
    --ocre-leger: #F4EFE8;         /* fond d'accent : ligne cochée, encart */

    /* Bouton principal de la maquette : aplat ocre sans filet, texte marine, survol ocre assombri de 12 %.
       Dégradés d'une seule couleur : les tokens servent aussi de background-image (custom.css, .action-btn). */
    --button-brand-background: linear-gradient(var(--ocre), var(--ocre));
    --button-brand-hover-background: linear-gradient(var(--ocre-survol), var(--ocre-survol));
    --button-brand-border: linear-gradient(transparent, transparent);
    --button-brand-hover-border: var(--button-brand-border);
    --button-brand-text: var(--marque-900);

    /* Ligne cochée, sélection ; surfaces atténuées réchauffées */
    --surface-selected: var(--ocre-leger);
    --surface-muted: #FCFAF8;
    /* Bandeau des tuiles de l'accueil : ocre 45 %, nettement plus soutenu que le fond de page réchauffé (30 % : trop proche) */
    --tuile-bandeau: color-mix(in oklab, var(--ocre) 45%, #FFFFFF);
    /* Bulles de conversation : ocre plus soutenu que la ligne cochée (reste visible dessus), texte marine */
    --message-bg: color-mix(in oklab, var(--ocre) 35%, #FFFFFF);
    --message-ink: var(--marque-900);
    /* Tableaux de la maquette : lignes blanches sans zébrure, en-tête ocre 9 % titré en marine,
       filets réchauffés (en-tête ocre 30 % sur #E8E8E6, cellules ocre 14 % sur #F0F0EE), survol ocre 6 % */
    --table-bg: #FFFFFF;
    --table-head-bg: color-mix(in oklab, var(--ocre) 9%, #FFFFFF);
    --table-head-ink: var(--marque-900);
    --table-head-line: color-mix(in oklab, var(--ocre) 30%, #E8E8E6);
    --table-line: color-mix(in oklab, var(--ocre) 14%, #F0F0EE);
    --table-frame: color-mix(in oklab, var(--ocre) 50%, #B4B4B4);   /* cadre marqué : filet des champs de la maquette */
    --table-row-alt: transparent;
    --table-row-hover: color-mix(in oklab, var(--ocre) 6%, #FFFFFF);

    /* Menu latéral marine */
    --nav-bg: var(--marque-900);
    --nav-line: #344A66;           /* blanc 14 % sur marine */
    --nav-ink: #E0E4E9;            /* blanc 88 % sur marine */
    --nav-ink-strong: #FFFFFF;
    --nav-ink-muted: var(--ocre);
    --nav-hover: #253D5B;          /* blanc 7 % */
    --nav-active-bg: #2B425F;      /* blanc 10 % */
    --nav-active-ink: var(--ocre);
    --nav-active-marker: var(--ocre);
    --nav-card-bg: transparent;
    /* Filet sous le bandeau du haut */
    --navbar-line: #F1EFE9;

    --nav-badge-bg: var(--ocre);   /* marine sur ocre 6,5:1 */
    --nav-badge-ink: var(--marque-900);
}

/* Fond de page réchauffé par l'ocre (8 % sur #FBFBFA) */
body {
    background-color: #F7F5F1;
}

/* Mode sombre (tokens.css, :root[data-theme="dark"], plus spécifique que :root) : le menu marine reste ;
   les valeurs claires ci-dessus écrites en dur (tableaux, bulles, filet ; fond de page : custom.css) sont reprises sur fond sombre,
   l'ocre restant l'accent. */
:root[data-theme="dark"] {
    --ocre-leger: color-mix(in oklab, var(--ocre) 18%, var(--neutral-50));
    --surface-selected: var(--ocre-leger);
    --tuile-bandeau: color-mix(in oklab, var(--ocre) 24%, var(--neutral-50));
    --surface-muted: color-mix(in oklab, var(--ocre) 5%, var(--neutral-50));
    --message-bg: color-mix(in oklab, var(--ocre) 22%, var(--neutral-50));
    --message-ink: var(--text-primary);
    --table-bg: var(--neutral-50);
    --table-head-bg: color-mix(in oklab, var(--ocre) 12%, var(--neutral-50));
    --table-head-ink: var(--text-primary);
    --table-head-line: color-mix(in oklab, var(--ocre) 30%, var(--neutral-300));
    --table-line: color-mix(in oklab, var(--ocre) 10%, var(--neutral-300));
    --table-frame: color-mix(in oklab, var(--ocre) 40%, var(--neutral-300));
    --table-row-hover: color-mix(in oklab, var(--ocre) 8%, var(--neutral-50));
    --navbar-line: var(--neutral-300);
}