/* ============================================================
   CXAGENTS ADMIN — jetons d'application
   ------------------------------------------------------------
   Ce fichier ne redéfinit AUCUN jeton de base. Les couleurs, la
   typographie, l'échelle d'espacement, les rayons et les ombres
   viennent de `colors_and_type.css`, copié tel quel depuis
   CXAGENT WEB : c'est ce partage qui garantit que les deux fronts
   ne divergeront pas.

   Il n'ajoute qu'une chose : le marqueur d'application (§3 du
   brief ADM-02). Une seule teinte, prélevée dans la palette de
   base (famille « lavande sourdine » déjà présente dans le
   fichier de jetons partagé sous --tag-lavender-*), promue au
   rang d'accent d'identité.

   Règle d'emploi — à respecter par tous les écrans futurs :
     • --app-*      = surfaces d'IDENTITÉ (plaque d'application,
                      entrée de menu active, icône d'en-tête de
                      page, racine du fil d'Ariane).
     • --color-accent (teal) = surfaces d'ACTION (boutons, liens,
                      focus, cases cochées). Inchangé, identique à
                      CXAGENT WEB — un bouton se comporte et se
                      lit pareil dans les deux applications.
   ============================================================ */

@import url('colors_and_type.css');

:root {
  /* Accent d'identité — CXAGENTS ADMIN
     Prélevé dans le logo de l'application : l'ardoise de ses segments.
     L'or du logo n'est jamais repris en interface — il reste au logo. */
  --app-accent:       #4A5563; /* ardoise du logo */
  --app-accent-2:     #5A6472;
  --app-accent-tint:  #EDEFF2;
  --app-accent-bd:    #C9CFD8;
  --app-accent-deep:  #3E4756; /* segment le plus foncé du logo */
  --app-nav-active:   #55606F; /* entrée de menu active, sur le rail sombre */

  /* Largeurs du rail — il est REPLIÉ par défaut et se déplie au survol
     (maquette, artboard « Coquille — barre latérale »). Deux jetons plutôt
     que deux nombres écrits deux fois : la transition doit porter sur la
     MÊME paire, sinon le repli et le dépliage ne se répondent pas. */
  /* Hauteur du bandeau de session — déclarée UNE fois, et lue à deux
     endroits : le bandeau lui-même, et le calcul de la hauteur du rail.
     Deux nombres auraient dérivé l'un de l'autre sans que rien ne le dise. */
  --bandeau-hauteur:  38px;

  --rail-replie:      64px;
  --rail-deplie:      264px;

  /* Rayon des boutons de l'écran de connexion — valeur de la maquette (9 px),
     entre `--radius-md` (8) et rien. Deux boutons y sont empilés à la même
     largeur : un nombre écrit deux fois finit par diverger, et l'œil voit
     immédiatement deux angles différents. Un jeton, donc. */
  --bouton-rayon:     9px;

  /* Fond du rail — repris de la maquette (#1C222E). Distinct de
     `--app-accent-deep`, qui reste l'accent d'identité des surfaces claires :
     le rail est une surface sombre, pas une plaque d'identité agrandie. */
  --rail-fond:        #1C222E;

  /* Taille du logo DANS LE RAIL — 36/86 px, mesurés dans la maquette.
     ⚠️ Ne pas confondre avec le logo de l'écran de connexion (150 px) : les
     avoir confondus donnait un logo qui remplissait le rail. */
  --rail-logo-replie: 36px;
  --rail-logo-deplie: 86px;

  /* Nom porté par l'interface — une seule source */
  --app-name:         'CXAGENTS ADMIN';

  /* Marqueur de session de développement (jamais en production) */
  --dev-bg:           #F5EBD9; /* = --color-warning-tint */
  --dev-bd:           #D9BE92;
  --dev-fg:           #7A5522;
  --dev-strong:       #A57434; /* = --color-warning-deep */

  /* Front commercial — sert uniquement à marquer l'appartenance
     d'un collaborateur dans la vue élargie « les deux fronts ». */
  --front-web:        #357C8E; /* = --color-accent-2 */
  --front-web-tint:   #E1ECF1;
  --front-web-bd:     #B2C8D2;
}