/* Couleurs de KeoBat, definies une seule fois pour tout le site.
   Les fichiers CSS ecrivent var(--keo-rouge) au lieu de la valeur : changer une
   couleur ici la change partout. Charge par layout.html.twig, signature,
   annotateur, espace client et maintenance.
   Ne marche pas dans les PDF (@react-pdf, jsPDF), les emails et les graphiques
   dessines en canvas : y garder la valeur en dur. */

:root {
  /* Rouge KeoBat : accent unique (icones, liens, onglets, elements actifs) */
  --keo-rouge: #ff2d00;
  --keo-rouge-survol: #e02800;
  --keo-rouge-doux: #fff1ee;
  --keo-rouge-doux-appuye: #ffe4de;

  /* Aplats de sens (paves d'icone, badges, boutons). Jaune et vert fluo sont
     clairs : encre ardoise par-dessus, jamais de blanc. */
  --keo-ardoise: #334155;
  --keo-ardoise-fonce: #1e293b;
  --keo-jaune: #dcf70c;
  --keo-vert-fluo: #39ff14;

  /* Fonds. Fond de page = derriere les cartes et la barre du haut (theme) */
  --keo-fond-page: #f1f3f7;
  --keo-fond: #fff;
  --keo-fond-doux: #f8fafc;
  --keo-fond-gris: #f1f5f9;
  --keo-fond-gris-fonce: #e2e8f0; /* aplat gris : barre de progression, puce */

  /* Bordures */
  --keo-bordure-douce: #f1f5f9;
  --keo-bordure: #e2e8f0;
  --keo-bordure-forte: #cbd5e1;

  /* Textes, du plus fonce au plus pale. Encre = bleu nuit KeoBat (onglet actif) */
  --keo-encre: #040622;
  --keo-texte-noir: #111827;
  --keo-titre: #1e293b;
  --keo-texte-fonce: #334155;
  --keo-texte: #475569;
  --keo-texte-doux: #64748b;
  --keo-texte-pale: #94a3b8;
  /* Texte et icone poses sur un aplat colore (bouton rouge, pave ardoise,
     badge) : distinct de --keo-fond, il ne doit pas suivre le fond de page. */
  --keo-texte-sur-aplat: #fff;
  /* Texte et icone poses sur le jaune ou le vert fluo : toujours fonce, y
     compris en mode sombre (un texte clair y disparait). */
  --keo-texte-sur-clair: #1e293b;

  /* Couleurs de sens, une variable par nuance (valeurs d'origine, pas encore
     harmonisees). Meme echelle pour les quatre : fond, doux, pale, clair, vif,
     base, fonce, tres-fonce. Le danger est un autre rouge que le rouge KeoBat. */
  --keo-danger-fond: #fef2f2;
  --keo-danger-doux: #fee2e2;
  --keo-danger-pale: #fecaca;
  --keo-danger-clair: #fca5a5;
  --keo-danger-vif: #ef4444;
  --keo-danger: #dc2626;
  --keo-danger-fonce: #b91c1c;
  --keo-danger-tres-fonce: #991b1b;

  --keo-succes-fond: #f0fdf4;
  --keo-succes-doux: #dcfce7;
  --keo-succes-pale: #bbf7d0;
  --keo-succes-clair: #86efac;
  --keo-succes-vif: #22c55e;
  --keo-succes: #16a34a;
  --keo-succes-fonce: #15803d;
  --keo-succes-tres-fonce: #166534;

  --keo-attention-fond: #fffbeb;
  --keo-attention-doux: #fef3c7;
  --keo-attention-pale: #fde68a;
  --keo-attention-clair: #fcd34d;
  --keo-attention-vif: #f59e0b;
  --keo-attention: #d97706;
  --keo-attention-fonce: #b45309;
  --keo-attention-tres-fonce: #92400e;

  --keo-info-fond: #eff6ff;
  --keo-info-doux: #dbeafe;
  --keo-info-clair: #93c5fd;
  --keo-info-vif: #3b82f6;
  --keo-info: #2563eb;
  --keo-info-fonce: #1d4ed8;
  --keo-info-tres-fonce: #1e40af;
}

/* Classes Bootstrap claires branchees sur la palette : meme rendu qu'avant
   (bg-white #fff, bg-light #f5f6f8, text-dark #141b2b, ecart invisible), et
   elles suivront le mode sombre au lieu de rester blanches. ":root" passe
   devant le !important de Bootstrap, charge apres ce fichier. */
:root .bg-white {
  background-color: var(--keo-fond) !important;
}

:root .bg-light {
  background-color: var(--keo-fond-doux) !important;
}

:root .text-dark {
  color: var(--keo-texte-noir) !important;
}

/* Mode sombre, ESSAI reserve a l'entreprise 1 (lune dans la barre du haut,
   layout.html.twig). Gris neutres de KeoCom (src/theme-dark.css), pas de bleu :
   page #16171b, surfaces #1e2025, bordures #34373e. Les regles sombres du vieux
   theme (body[data-layout-mode=dark]) ont ete passees dans les memes gris. Fonds
   pales des couleurs de sens = la couleur vive melangee au fond sombre ; leurs
   textes s'eclaircissent. Rouge KeoBat, jaune, vert fluo et texte sur aplat
   ne changent pas. Pose sur <html> (et pas seulement <body>) pour que les
   alias des modules definis sur :root (--mat-ink: var(--keo-titre)...) suivent. */
html[data-layout-mode='dark'] {
  color-scheme: dark;

  --keo-rouge-doux: color-mix(in oklab, #ff2d00 14%, #1e2025);
  --keo-rouge-doux-appuye: color-mix(in oklab, #ff2d00 22%, #1e2025);
  --keo-ardoise: #3a3d44;
  --keo-ardoise-fonce: #34373e;

  --keo-fond-page: #16171b;
  --keo-fond: #1e2025;
  --keo-fond-doux: #16171b;
  --keo-fond-gris: #2a2d33;
  --keo-fond-gris-fonce: #34373e;

  --keo-bordure-douce: #2a2d33;
  --keo-bordure: #34373e;
  --keo-bordure-forte: #464a52;

  --keo-encre: #f6f7f9;
  --keo-texte-noir: #eceef2;
  --keo-titre: #dde0e6;
  --keo-texte-fonce: #c9cdd5;
  --keo-texte: #b0b5bf;
  --keo-texte-doux: #959ba6;
  --keo-texte-pale: #737985;

  --keo-danger-fond: color-mix(in oklab, #ef4444 12%, #1e2025);
  --keo-danger-doux: color-mix(in oklab, #ef4444 20%, #1e2025);
  --keo-danger-pale: color-mix(in oklab, #ef4444 32%, #1e2025);
  --keo-danger-clair: color-mix(in oklab, #ef4444 45%, #1e2025);
  --keo-danger: #f87171;
  --keo-danger-fonce: #fca5a5;
  --keo-danger-tres-fonce: #fecaca;

  --keo-succes-fond: color-mix(in oklab, #22c55e 12%, #1e2025);
  --keo-succes-doux: color-mix(in oklab, #22c55e 20%, #1e2025);
  --keo-succes-pale: color-mix(in oklab, #22c55e 32%, #1e2025);
  --keo-succes-clair: color-mix(in oklab, #22c55e 45%, #1e2025);
  --keo-succes: #4ade80;
  --keo-succes-fonce: #86efac;
  --keo-succes-tres-fonce: #bbf7d0;

  --keo-attention-fond: color-mix(in oklab, #f59e0b 12%, #1e2025);
  --keo-attention-doux: color-mix(in oklab, #f59e0b 20%, #1e2025);
  --keo-attention-pale: color-mix(in oklab, #f59e0b 32%, #1e2025);
  --keo-attention-clair: color-mix(in oklab, #f59e0b 45%, #1e2025);
  --keo-attention: #fbbf24;
  --keo-attention-fonce: #fcd34d;
  --keo-attention-tres-fonce: #fde68a;

  --keo-info-fond: color-mix(in oklab, #3b82f6 12%, #1e2025);
  --keo-info-doux: color-mix(in oklab, #3b82f6 20%, #1e2025);
  --keo-info-clair: color-mix(in oklab, #3b82f6 45%, #1e2025);
  --keo-info: #60a5fa;
  --keo-info-fonce: #93c5fd;
  --keo-info-tres-fonce: #bfdbfe;
}

/* Menu lateral : ardoise bleutee en mode clair (data-sidebar=dark du theme),
   gris neutre comme les surfaces en mode sombre. */
body[data-layout-mode='dark'][data-sidebar='dark'] .vertical-menu,
body[data-layout-mode='dark'][data-sidebar='dark'] .vertical-menu::before,
body[data-layout-mode='dark'][data-sidebar='dark'] .navbar-brand-box {
  background: #1e2025;
}
