/* ═══════════════════════════════════════════════════════════════════════════
   Arkensai · theme-arkensai.css · v1.1 · 2026-06-26
   ═══════════════════════════════════════════════════════════════════════════

   RÔLE
   ────
   Implémentation des design tokens en charte Arkensai.
   Couvre 2 modes : clair (par défaut) et sombre ([data-theme="dark"]).

   Pour rester compatible avec le legacy multi-thèmes existant ("or", "argent",
   "platine", "editorial"), on les définit également ici (ils héritent du
   thème clair Arkensai pour cette version — à séparer en variants si besoin).

   PALETTE ARKENSAI
   ────────────────
     Crème (paper)   : #FAF7F5 — fond principal en mode clair
     Ink (charbon)   : #0F0809 — texte principal en mode clair
                                  fond principal en mode sombre
     Rouge carmin    : #A11D2A — accent de marque
     Rouge alerte    : #C13B2A — semi-sémantique pour erreurs RSE > 5g
     Slate           : #525B5B — texte secondaire (muted)
     Line cream      : #E5DDD2 — bordures et séparateurs
     Eco green       : #2D7A3B — succès, RSE OK
     Warn orange     : #C77017 — attention, RSE moyen

   CHANGELOG
   ─────────
   v1.1 (2026-06-26) — Livraison 2.5 : white-label complet
     · Documentation enrichie sur le fonctionnement du --brand-logo-url
       (basculement SVG fallback ↔ image client via attribut body data-brand-img).
     · Ajout de la variable --brand-favicon-url pour personnalisation du favicon.

   v1.0 (2026-06-25) — Création initiale

   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   THÈME CLAIR (par défaut + "or", "argent", "platine", "editorial" legacy)
   ─────────────────────────────────────────────────────────────────────────── */

:root,
[data-theme="or"],
[data-theme="argent"],
[data-theme="platine"],
[data-theme="editorial"] {

  /* ─── Surfaces ─── */
  --c-bg:          #FAF7F5;
  --c-bg-elevated: #FFFFFF;
  --c-bg-muted:    #F2EDE5;
  --c-bg-hover:    #EFE9DF;

  /* ─── Texte ─── */
  --c-fg:          #0F0809;
  --c-fg-muted:    #525B5B;
  --c-fg-subtle:   #8E867F;
  --c-fg-on-accent:#FFFFFF;

  /* ─── Bordures ─── */
  --c-line:        #E5DDD2;
  --c-line-strong: #D4C9B8;

  /* ─── Accent (rouge carmin Arkensai) ─── */
  --c-accent:       #A11D2A;
  --c-accent-fg:    #FFFFFF;
  --c-accent-soft:  #FCF0F1;
  --c-accent-hover: #8B1422;

  /* ─── Sémantique d'état ─── */
  --c-eco:    #2D7A3B;
  --c-warn:   #C77017;
  --c-danger: #C13B2A;
  --c-info:   #1F6FBF;

  /* ─── Polices ─── */
  --f-display: 'Fraunces', Georgia, serif;
  --f-sans:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --f-mono:    'JetBrains Mono', 'SF Mono', Consolas, monospace;

  /* ─── Tailles ─── */
  --fs-xs:   11px;
  --fs-sm:   12px;
  --fs-base: 14px;
  --fs-md:   15px;
  --fs-lg:   17px;
  --fs-xl:   20px;
  --fs-2xl:  28px;
  --fs-3xl:  48px;

  --lh-tight:  1.15;
  --lh-normal: 1.5;
  --lh-loose:  1.7;

  /* ─── Ombres ─── */
  --shadow-sm: 0 1px 2px rgba(15, 8, 9, 0.05);
  --shadow-md: 0 4px 12px -4px rgba(15, 8, 9, 0.10);
  --shadow-lg: 0 24px 48px -12px rgba(15, 8, 9, 0.18);

  /* ─── Legacy compat — variables historiques utilisées par script_v42 ─── */
  --main-bg:        var(--c-bg);
  --text:           var(--c-fg);
  --text-muted:     var(--c-fg-muted);
  --border:         var(--c-line);
  --accent:         var(--c-accent);
  --font-body:      var(--f-sans);
  --font-display:   var(--f-display);

  /* Variables sidebar legacy (gardées pour compat avec CSS legacy non migré) */
  --sidebar-bg:           var(--c-bg-elevated);
  --sidebar-text:         var(--c-fg);
  --sidebar-muted:        var(--c-fg-subtle);
  --sidebar-item-active-bg: var(--c-accent-soft);
  --sidebar-item-active:    var(--c-accent);
  --sidebar-border:       var(--c-line);
}


/* ───────────────────────────────────────────────────────────────────────────
   THÈME SOMBRE
   ─────────────────────────────────────────────────────────────────────────── */

[data-theme="dark"] {

  /* ─── Surfaces ─── */
  --c-bg:          #0F0809;
  --c-bg-elevated: #1A1014;
  --c-bg-muted:    #181014;
  --c-bg-hover:    #2A1A1F;

  /* ─── Texte ─── */
  --c-fg:          #FAF7F5;
  --c-fg-muted:    #B8AEA5;
  --c-fg-subtle:   #7F756B;
  --c-fg-on-accent:#FAF7F5;

  /* ─── Bordures ─── */
  --c-line:        #2A1A1F;
  --c-line-strong: #3A2A2F;

  /* ─── Accent (rouge plus vif en sombre pour contraste) ─── */
  --c-accent:       #E11D2E;
  --c-accent-fg:    #FAF7F5;
  --c-accent-soft:  #2A0F12;
  --c-accent-hover: #C0162A;

  /* ─── Sémantique d'état (légèrement boostée en sombre) ─── */
  --c-eco:    #4A9B5A;
  --c-warn:   #E0852C;
  --c-danger: #E14938;
  --c-info:   #3A8FE0;

  /* ─── Ombres : très subtiles en sombre ─── */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px -4px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 24px 48px -12px rgba(0, 0, 0, 0.6);

  /* ─── Legacy compat ─── */
  --main-bg:        var(--c-bg);
  --text:           var(--c-fg);
  --text-muted:     var(--c-fg-muted);
  --border:         var(--c-line);
  --accent:         var(--c-accent);

  /* Sidebar legacy */
  --sidebar-bg:           var(--c-bg-elevated);
  --sidebar-text:         var(--c-fg);
  --sidebar-muted:        var(--c-fg-subtle);
  --sidebar-item-active-bg: var(--c-accent-soft);
  --sidebar-item-active:    var(--c-accent);
  --sidebar-border:       var(--c-line);
}


/* ───────────────────────────────────────────────────────────────────────────
   BRAND — paramètres par défaut Arkensai
   ───────────────────────────────────────────────────────────────────────────
   Override-ables par theme-client-<name>.css pour le white-label.
   Quand --brand-logo-url vaut "none" (cas par défaut), le SVG inline fallback
   est utilisé dans le HTML. Sinon (URL définie), un attribut data-brand-img
   est posé sur <body> via JS au démarrage, ce qui masque le SVG fallback
   et révèle l'image en background du conteneur .brand-logo.
   ─────────────────────────────────────────────────────────────────────────── */

:root {
  /* Nom de la plateforme (affiché à droite du logo dans le header) */
  --brand-name:     'Arkensai';

  /* Sous-titre (affiché à droite du nom, séparé par un point) */
  --brand-subtitle: 'Multimodal Agent';

  /* URL du logo image (laisser 'none' pour utiliser le SVG inline fallback).
     Pour activer une vraie image : --brand-logo-url: url('assets/logo.png'); */
  --brand-logo-url: url('assets/logo-standard.png');

  /* Hauteur du logo dans le header (largeur = même valeur, carré) */
  --brand-logo-h:   28px;

  /* Favicon optionnel — appliqué par le mini-script au démarrage.
     Laisser 'none' pour conserver le favicon défini dans le HTML. */
  --brand-favicon-url: none;
}
