/* ============================================================================
   AXION — Thème CLAIR « Ivoire lumineux » (Variante B)
   S'active uniquement via html[data-theme="light"]. En mode sombre : aucun effet.
   Charte : anthracite chaud + or sur ivoire/blanc cassé, accent azur conservé.
   À inclure sur TOUTES les pages (après leurs styles, avant </head>).
   ============================================================================ */

/* ─────────────────────────────────────────────────────────────────────────
   1) RÉASSIGNATION DES VARIABLES (le gros du travail — la plupart des pages
      consomment ces tokens, donc elles basculent automatiquement).
   ───────────────────────────────────────────────────────────────────────── */
html[data-theme="light"]{
  /* Surfaces */
  --bg:#F3EFE6; --surface:#FFFDF8; --surface-2:#EFE9DD;
  --panel:#FFFDF8; --panel2:#F3EFE6; --line:rgba(60,50,30,.12);
  --glass:rgba(60,50,30,.035); --glass-2:rgba(60,50,30,.06);
  --border:rgba(60,50,30,.12); --border-2:rgba(60,50,30,.22); --bd:rgba(60,50,30,.16);

  /* Accents */
  --azure:#2563EB; --azure-soft:#2563EB; --or:#2563EB; --ord:rgba(37,99,235,.10);
  --gold:#A8842F; --gold-soft:#B0863A;

  /* États */
  --green:#0E9F6E; --green-d:#E3F3EC; --g:#0E9F6E;
  --amber:#B45309; --red:#DC2626; --r:#DC2626; --violet:#7C3AED;

  /* Texte (anthracite chaud) */
  --text:#2A2722; --text-dim:#6B6457; --text-faint:#8A8275;
  --t:#2A2722; --t2:#6B6457; --t3:#8A8275;

  /* Acteurs (badges / portails) */
  --moe:var(--azure); --moa:var(--green); --ent:var(--amber);

  color-scheme: light;
}

/* Fonds globaux — force le clair même si une page met un fond sombre en dur. */
html[data-theme="light"],
html[data-theme="light"] body{ background:#F3EFE6 !important; color:#2A2722; }
html[data-theme="light"] body::before{ opacity:.35 !important; } /* halo bleu adouci */
html[data-theme="light"] [style*="background:#0A1628"],
html[data-theme="light"] [style*="background: #0A1628"]{ background:#F3EFE6 !important; }

/* Trame de fond (grid-faint) → traits chauds très discrets */
html[data-theme="light"] .grid-faint{
  background-image:
    linear-gradient(rgba(60,50,30,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(60,50,30,.045) 1px, transparent 1px) !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   2) UTILITAIRES TAILWIND « EN DUR » → clair chaud
   ───────────────────────────────────────────────────────────────────────── */
html[data-theme="light"] .text-white{ color:#26231d !important; }
html[data-theme="light"] .text-slate-200,
html[data-theme="light"] .text-slate2-200{ color:#2A2722 !important; }
html[data-theme="light"] .text-slate-300,
html[data-theme="light"] .text-slate2-300{ color:#3a352b !important; }
html[data-theme="light"] .text-slate-400,
html[data-theme="light"] .text-slate2-400{ color:#6B6457 !important; }
html[data-theme="light"] .text-slate-500,
html[data-theme="light"] .text-slate2-500{ color:#8A8275 !important; }
html[data-theme="light"] .text-azure-300,
html[data-theme="light"] .text-azure-400{ color:#2563EB !important; }
html[data-theme="light"] .text-gold-500{ color:#A8842F !important; }

html[data-theme="light"] .bg-ink-900{ background:#EAE3D5 !important; }
html[data-theme="light"] .bg-ink-800{ background:#F3EFE6 !important; }
html[data-theme="light"] .bg-ink-700{ background:#E8E1D2 !important; }
html[data-theme="light"] .bg-ink-600{ background:#EFE9DD !important; }

/* opacités blanches/noires « en dur » → encres chaudes translucides */
html[data-theme="light"] [class*="bg-white/"]{ background:rgba(60,50,30,.045) !important; }
html[data-theme="light"] [class*="border-white/"]{ border-color:rgba(60,50,30,.10) !important; }
html[data-theme="light"] [class*="bg-black/"]{ background:rgba(60,50,30,.05) !important; }
html[data-theme="light"] [class*="border-black/"]{ border-color:rgba(60,50,30,.12) !important; }

/* ─────────────────────────────────────────────────────────────────────────
   3) SURFACES TRANSLUCIDES (glass) → cartes blanc cassé
   ───────────────────────────────────────────────────────────────────────── */
html[data-theme="light"] .glass{
  background:#FFFDF8 !important; border-color:rgba(60,50,30,.10) !important;
  box-shadow:0 8px 22px -18px rgba(60,50,30,.35);
}
html[data-theme="light"] .glass-strong{
  background:rgba(255,253,248,.86) !important; border-color:rgba(60,50,30,.10) !important;
  box-shadow:0 10px 28px -20px rgba(60,50,30,.4);
}
html[data-theme="light"] .card-hover:hover{
  border-color:rgba(37,99,235,.32) !important;
  box-shadow:0 24px 50px -28px rgba(37,99,235,.35) !important;
}
html[data-theme="light"] .kpi:hover{ border-color:rgba(37,99,235,.3) !important; }

/* ─────────────────────────────────────────────────────────────────────────
   4) HERO — passe en CLAIR (Variante B : pâle bleu → ivoire, grue bleue)
   ───────────────────────────────────────────────────────────────────────── */
html[data-theme="light"] .hero-band,
html[data-theme="light"] .hero-band.has-bg{
  border-color:rgba(37,99,235,.14) !important;
  background:
    radial-gradient(820px 400px at 82% -10%, rgba(37,99,235,.14), transparent 62%),
    radial-gradient(600px 360px at 0% 120%, rgba(168,132,47,.10), transparent 60%),
    linear-gradient(155deg,#E9F0FB,#F3EFE6) !important;
}
/* La grue filaire (SVG) redevient visible et bleue sur fond clair */
html[data-theme="light"] .hero-band.has-bg .hero-svg{ display:block !important; }
html[data-theme="light"] .hero-band .hero-svg{ opacity:.5 !important; }

/* Roue des métiers → nœuds blancs, texte foncé, traits bleus */
html[data-theme="light"] #wheelNav .wnode circle.bg{
  fill:#FFFFFF !important; stroke:rgba(37,99,235,.32) !important;
}
html[data-theme="light"] #wheelNav .wnode:hover circle.bg{
  fill:rgba(37,99,235,.12) !important; stroke:#2563EB !important;
}
html[data-theme="light"] #wheelNav .wnode:hover text{ fill:#1B2A47 !important; }
html[data-theme="light"] #wheelNav text{ fill:#3a4a6b !important; }
html[data-theme="light"] #wheelNav line{ stroke:rgba(37,99,235,.18) !important; }
html[data-theme="light"] #wheelNav circle[stroke-dasharray]{ stroke:rgba(37,99,235,.2) !important; }

/* Roue « .node » (page Entreprises) → disques clairs, libellés foncés lisibles */
html[data-theme="light"] .node .disc{
  background:radial-gradient(130% 130% at 32% 24%, #FFFFFF 0%, #F3EFE6 72%) !important;
  border-color:rgba(60,50,30,.14) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 12px 26px -18px rgba(60,50,30,.5) !important;
}
html[data-theme="light"] .node .lbl b{ color:#26231d !important; }
html[data-theme="light"] .node .lbl span{ color:#8A8275 !important; }
html[data-theme="light"] .node:hover .lbl b{ color:#1B2A47 !important; }
html[data-theme="light"] .wheel-svg .ring{ stroke:rgba(60,50,30,.12) !important; }
html[data-theme="light"] .wheel-svg .ring-azure{ stroke:rgba(37,99,235,.22) !important; }
html[data-theme="light"] .wheel-svg .spoke{ stroke:rgba(37,99,235,.22) !important; }
html[data-theme="light"] .hub{
  background:rgba(255,253,248,.92) !important; border-color:rgba(37,99,235,.22) !important;
  box-shadow:0 0 0 8px rgba(233,240,251,.7), 0 0 60px -16px rgba(37,99,235,.35) !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   5) NAVIGATION
   ───────────────────────────────────────────────────────────────────────── */
html[data-theme="light"] .nav-link{ color:#6B6457; }
html[data-theme="light"] .nav-link:hover{ color:#26231d; background:rgba(60,50,30,.05); }
html[data-theme="light"] .nav-link.on{
  color:#1B2A47;
  background:linear-gradient(135deg,rgba(37,99,235,.11),rgba(168,132,47,.07));
  border-color:rgba(37,99,235,.20);
}
html[data-theme="light"] .nav-link.on::before{ background:linear-gradient(#2563EB,#A8842F); }

/* ─────────────────────────────────────────────────────────────────────────
   6) BOUTONS
   ───────────────────────────────────────────────────────────────────────── */
html[data-theme="light"] .btn-azure{
  background:linear-gradient(135deg,#2563EB,#1E4D85) !important; color:#fff !important;
  box-shadow:0 10px 28px -12px rgba(37,99,235,.5);
}
html[data-theme="light"] .btn-outline{
  border-color:rgba(60,50,30,.16) !important; color:#6B6457 !important; background:transparent;
}
html[data-theme="light"] .btn-outline:hover{
  background:rgba(60,50,30,.05) !important; border-color:rgba(60,50,30,.3) !important; color:#26231d !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   7) PILLS / BADGES — conservés teintés mais lisibles sur clair
   ───────────────────────────────────────────────────────────────────────── */
html[data-theme="light"] .pill{
  background:rgba(60,50,30,.04); border-color:rgba(60,50,30,.12); color:#3a352b;
}
html[data-theme="light"] .pill.admin{ color:#92600B; border-color:rgba(180,83,9,.3); background:rgba(245,158,11,.12); }
html[data-theme="light"] .pill.economiste{ color:#B45309; border-color:rgba(180,83,9,.3); background:rgba(245,158,11,.12); }
html[data-theme="light"] .pill.moe{ color:#1D4ED8; border-color:rgba(37,99,235,.32); background:rgba(37,99,235,.08); }
html[data-theme="light"] .pill.moa{ color:#0E7A5A; border-color:rgba(14,159,110,.32); background:rgba(14,159,110,.08); }
html[data-theme="light"] .pill.entreprise{ color:#6D28D9; border-color:rgba(124,58,237,.3); background:rgba(124,58,237,.08); }

/* ─────────────────────────────────────────────────────────────────────────
   8) DÉTAILS
   ───────────────────────────────────────────────────────────────────────── */
/* Le titre dégradé → or plein (lisible sur clair) */
html[data-theme="light"] .text-grad{
  -webkit-text-fill-color:initial; color:#A8842F; background:none;
}

/* Champs de saisie — texte ET fond clairs (sinon les champs sombres en dur
   comme .field restent navy en mode clair → incohérence visuelle). */
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{ color:#2A2722; }
html[data-theme="light"] input:not([type=checkbox]):not([type=radio]):not([type=range]),
html[data-theme="light"] select,
html[data-theme="light"] textarea,
html[data-theme="light"] .field{
  background:#FFFDF8 !important; border-color:rgba(60,50,30,.16) !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder{ color:#A59C8A; }

/* Panneaux posés en dur (notifications, drawer Paul…) */
html[data-theme="light"] [style*="background:#0F1B30"],
html[data-theme="light"] [style*="background: #0F1B30"]{ background:#FFFDF8 !important; }

/* Sélection & scrollbar */
html[data-theme="light"] ::selection{ background:#2563EB; color:#fff; }
html[data-theme="light"] ::-webkit-scrollbar-thumb{ background:#D6CFBF; }

/* ─────────────────────────────────────────────────────────────────────────
   9) BOUTON FLOTTANT DE BASCULE DE THÈME
   ───────────────────────────────────────────────────────────────────────── */
#axThemeToggle{ transition: background .2s, color .2s, border-color .2s; }
html[data-theme="light"] #axThemeToggle{
  background:#FFFDF8 !important; color:#2A2722 !important;
  border-color:rgba(60,50,30,.18) !important;
  box-shadow:0 8px 24px -10px rgba(60,50,30,.35) !important;
}