/* ============================================================
   ENGC — Thème « COCKPIT NÉON » (sombre, à interrupteur) — V4.8.0
   ============================================================
   Décision John 2026-07-06 : clair par défaut (design actuel),
   bascule sombre via le bouton 🌙 (localStorage, engc-theme.js).
   Chargé sur TOUTES les pages wizard/attente/résultat, APRÈS
   quote-wizard-engc.css ET quote-wizard-direct.css : les règles
   sont scellées sous html[data-theme="dark"] → inertes en clair,
   et plus spécifiques que les surcouches claires en sombre.
   Direction validée : « l'enseigne allumée, la nuit » — fond bleu
   nuit, panneaux vitrés, halos LED ; les boutons à étoile filante
   (.engc-led, liseré conic) restent EXACTEMENT les mêmes.
   ============================================================ */

/* ---------------------------------------------- bouton interrupteur (2 thèmes) */
.engc-themebtn {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 1200;
  width: 42px;
  height: 42px;
  min-height: 42px;
  padding: 0;
  border-radius: 50%;
  border: 1px solid var(--engc-trait, #d8dee4);
  background: var(--engc-papier, #fff);
  color: var(--engc-encre, #1b2530);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(27, 37, 48, 0.18);
  transition: transform 0.12s ease, box-shadow 0.15s ease;
}
.engc-themebtn:hover { transform: scale(1.08); filter: none; }
@media (max-width: 640px) {
  .engc-themebtn { top: 8px; right: 8px; width: 38px; height: 38px; min-height: 38px; }
}

/* ---------------------------------------------- jetons du thème sombre */
html[data-theme="dark"] {
  --engc-encre: #e4f0f8;                     /* texte principal → clair */
  --engc-acier: #93a9b8;                     /* texte secondaire */
  --engc-trait: #23405366;                   /* bordures translucides bleutées */
  --engc-fond: #0b1d2a;                      /* bleu nuit */
  --engc-papier: #102534;                    /* panneau */
  --engc-bleu-glow: rgba(94, 197, 255, 0.42);
  --engc-ombre: 0 18px 44px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(122, 196, 240, 0.08);
  color-scheme: dark;                        /* scrollbars/contrôles natifs sombres */
}

/* ---------------------------------------------- page */
/* !important requis : quote-wizard-direct.css (canal public) pose le fond clair
   en !important — en sombre, notre sélecteur plus spécifique doit gagner. */
html[data-theme="dark"] body {
  background:
    radial-gradient(1400px 600px at 70% -10%, rgba(18, 50, 71, 0.85) 0%, rgba(11, 29, 42, 0.94) 55%, rgba(8, 21, 33, 0.97) 100%),
    url("/static/fond-realisations.jpg") center top / cover fixed no-repeat,
    var(--engc-fond) !important;
}
html[data-theme="dark"] body::after {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0));
  opacity: 1;
}
/* logo métal brossé : halo LED discret pour l'asseoir sur la nuit */
html[data-theme="dark"] .engc-header img { filter: drop-shadow(0 6px 22px rgba(94, 197, 255, 0.30)); }
html[data-theme="dark"] .engc-themebtn {
  background: #123048;
  border-color: rgba(122, 196, 240, 0.45);
  color: #eaf6fd;
  box-shadow: 0 0 14px rgba(94, 197, 255, 0.35);
}

/* ---------------------------------------------- titres & textes d'accent
   (--engc-bleu-fonce reste inchangé : il teinte le bas des boutons ;
   on éclaircit ses USAGES texte, illisibles sur la nuit) */
html[data-theme="dark"] h2,
html[data-theme="dark"] .grouph,
html[data-theme="dark"] .steps-label,
html[data-theme="dark"] .chosen-mode-txt b,
html[data-theme="dark"] .ralmodal-head b,
html[data-theme="dark"] .engc-partsedit-h,
html[data-theme="dark"] .askblk-head,
html[data-theme="dark"] .engc-construction h2,
html[data-theme="dark"] .engc-powered-static,
html[data-theme="dark"] .engc-powered-fallback .lit,
html[data-theme="dark"] button.sec:hover { color: #7ac4f0; }
html[data-theme="dark"] .engc-detect-spin { color: #a8cfe3; }
html[data-theme="dark"] .askblk-sub,
html[data-theme="dark"] .engc-mcolor-hint,
html[data-theme="dark"] .engc-zh,
html[data-theme="dark"] .engc-mergechk,
html[data-theme="dark"] .cqq { color: #c4dbe8; }
html[data-theme="dark"] .intake-q { color: var(--engc-encre); }
/* le résumé « Aidez-nous à nous améliorer » (couleur posée en style inline) */
html[data-theme="dark"] details > summary[style] { color: #7ac4f0 !important; }

/* ---------------------------------------------- champs de saisie */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background: #0c2130;
  color: var(--engc-encre);
  border-color: #2a4a60;
}
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus { background: #0e2837; }
html[data-theme="dark"] input[type="file"] { background: #0c2130; }
html[data-theme="dark"] ::placeholder { color: #6d8595; }

/* ---------------------------------------------- choix (radio, cases, cartes) */
html[data-theme="dark"] label.chk,
html[data-theme="dark"] label.radio { background: #0e2433; border-color: #2a4a60; }
html[data-theme="dark"] label.radio { border-left-color: #2a4a60; }
html[data-theme="dark"] label.radio.sel,
html[data-theme="dark"] .chosen-mode { background: #123448; }
html[data-theme="dark"] label.radio.sel { border-color: var(--engc-bleu); border-left-color: var(--engc-bleu); }
html[data-theme="dark"] .pcard { background: var(--engc-papier); }
html[data-theme="dark"] .pcard:hover { box-shadow: 0 8px 22px rgba(0, 0, 0, 0.55), 0 0 14px rgba(94, 197, 255, 0.18); }
html[data-theme="dark"] .radio.sel::after,
html[data-theme="dark"] .pcard.sel::after { box-shadow: 0 0 0 3px #102534, 0 0 10px var(--engc-bleu-glow); }
html[data-theme="dark"] .engc-bigopt .bigopt-tx > span { color: var(--engc-acier); }

/* ---------------------------------------------- boutons secondaires & navigation */
html[data-theme="dark"] button.sec,
html[data-theme="dark"] .nav-more > summary {
  background: #122b3c;
  color: #dcebf4;
  border-color: #2a4a60;
}
html[data-theme="dark"] .nav-more > summary:hover { border-color: var(--engc-bleu); color: #7ac4f0; }

/* ---------------------------------------------- blocs résultat / récap */
html[data-theme="dark"] .signblock { background: #0e2433; }
html[data-theme="dark"] .badge { background: rgba(46, 134, 181, 0.18); color: #9fd4f2; }
html[data-theme="dark"] .engc-construction {
  border-color: #2a4a60;
  background: linear-gradient(180deg, #10283a 0%, #0d2130 100%);
}

/* verdict : mêmes couleurs métier, en verre teinté lumineux sur la nuit */
html[data-theme="dark"] .verdict--green {
  background: rgba(46, 158, 91, 0.14);
  border-color: rgba(87, 214, 138, 0.42);
  box-shadow: inset 0 0 30px rgba(46, 158, 91, 0.10), 0 0 24px -8px rgba(46, 158, 91, 0.35);
}
html[data-theme="dark"] .verdict--green .verdict-pct,
html[data-theme="dark"] .verdict--green .verdict-label,
html[data-theme="dark"] .verdict--green .verdict-action { color: #7fe0a8; }
html[data-theme="dark"] .verdict--orange {
  background: rgba(217, 143, 31, 0.14);
  border-color: rgba(240, 180, 94, 0.42);
  box-shadow: inset 0 0 30px rgba(217, 143, 31, 0.10), 0 0 24px -8px rgba(217, 143, 31, 0.30);
}
html[data-theme="dark"] .verdict--orange .verdict-pct,
html[data-theme="dark"] .verdict--orange .verdict-label,
html[data-theme="dark"] .verdict--orange .verdict-action { color: #f0b45e; }
html[data-theme="dark"] .verdict--red {
  background: rgba(192, 57, 43, 0.16);
  border-color: rgba(240, 154, 142, 0.42);
  box-shadow: inset 0 0 30px rgba(192, 57, 43, 0.10), 0 0 24px -8px rgba(192, 57, 43, 0.30);
}
html[data-theme="dark"] .verdict--red .verdict-pct,
html[data-theme="dark"] .verdict--red .verdict-label,
html[data-theme="dark"] .verdict--red .verdict-action { color: #f09a8e; }
html[data-theme="dark"] .verdict-cursor { background: #eaf6fd; box-shadow: 0 0 0 2px #0b1d2a; }

html[data-theme="dark"] .conf-chip.green  { color: #7fe0a8; background: rgba(46, 158, 91, 0.14); border-color: rgba(87, 214, 138, 0.42); }
html[data-theme="dark"] .conf-chip.orange { color: #f0b45e; background: rgba(217, 143, 31, 0.14); border-color: rgba(240, 180, 94, 0.42); }
html[data-theme="dark"] .conf-chip.red    { color: #f09a8e; background: rgba(192, 57, 43, 0.16); border-color: rgba(240, 154, 142, 0.42); }

/* questions de clarification (« Encore une précision ») */
html[data-theme="dark"] .askblk { background: #0e2839; border-color: #2a4a60; }
html[data-theme="dark"] .askblk-reply { background: #123448; }
html[data-theme="dark"] .cqcard { background: var(--engc-papier); border-color: #2a4a60; box-shadow: none; }
html[data-theme="dark"] .cqens { background: rgba(46, 134, 181, 0.20); color: #9fd4f2; }
html[data-theme="dark"] .cqopt { background: #0e2433; border-color: #2a4a60; color: var(--engc-encre); }
html[data-theme="dark"] .cqopt:hover { background: #123448; }
html[data-theme="dark"] .cqopt:has(input:checked) { background: #123c55; }

/* ---------------------------------------------- aperçu 2D, détection, parties */
html[data-theme="dark"] .engc-preview-stage { background: #0d1b26; border-color: #2a4a60; }
html[data-theme="dark"] .engc-preview-big-wrap,
html[data-theme="dark"] .engc-preview-pane { background: transparent; }
@media (max-width: 760px) {
  html[data-theme="dark"] .engc-preview-pane { background: var(--engc-fond); }
}
html[data-theme="dark"] .engc-laqpanel,
html[data-theme="dark"] .engc-blockcard,
html[data-theme="dark"] .engc-detect,
html[data-theme="dark"] .engc-detrow,
html[data-theme="dark"] .engc-partrow { background: var(--engc-papier); border-color: #2a4a60; }
html[data-theme="dark"] .engc-detect.engc-detect-ko { background: #17242e; }
html[data-theme="dark"] .engc-partacc:hover,
html[data-theme="dark"] .engc-partedit-row.merged { background: #123448; }
html[data-theme="dark"] .engc-partedit-row { border-bottom-color: #1c3547; }
html[data-theme="dark"] .engc-partedit-row.active { background: #123c55; }
html[data-theme="dark"] .engc-partname { color: var(--engc-encre); }
html[data-theme="dark"] .engc-partname:hover,
html[data-theme="dark"] .engc-partname:focus { background: #0c2130; border-color: #2a4a60; }
html[data-theme="dark"] .engc-partactiv { background: transparent; color: #a8c4d6; border-color: #2a4a60; }
html[data-theme="dark"] .engc-partrow.engc-partdone { background: #112b26; }
html[data-theme="dark"] .engc-partchosen span { color: #7fe0a8; }
html[data-theme="dark"] .engc-partoptsec { border-color: #2e86b5; }
html[data-theme="dark"] .engc-laqclose { background: #122b3c; border-color: #2a4a60; color: #a8c4d6; }
html[data-theme="dark"] .engc-laqclose:hover { background: #16344a; }
html[data-theme="dark"] .engc-ovbtn { background: rgba(16, 37, 52, 0.92); color: #dcebf4; }
/* les vignettes/aperçus d'un FICHIER client restent sur fond BLANC (lisibilité
   d'un dessin au trait) — choix délibéré, ne pas assombrir :
   .engc-detprev, .engc-detthumb, .cqimg, .engc-signthumb */

/* ---------------------------------------------- palettes RAL / PMMA / puces */
html[data-theme="dark"] .ralmodal { background: var(--engc-papier); }
html[data-theme="dark"] .ralclose { background: #122b3c; color: #a8c4d6; }
html[data-theme="dark"] .ralclose:hover { background: #16344a; }
html[data-theme="dark"] .ralfam { background: #0e2433; border-color: #2a4a60; color: var(--engc-encre); }
html[data-theme="dark"] .ralchip { background: #0e2433; border-color: #2a4a60; color: #c4dbe8; }
html[data-theme="dark"] .ralchips-fam { color: #7f97a6; }
html[data-theme="dark"] .engc-pmma-card { background: var(--engc-papier); border-color: rgba(122, 196, 240, 0.2); }
html[data-theme="dark"] .engc-pmma-card b { color: var(--engc-encre); }
html[data-theme="dark"] .engc-pmma-card span { color: var(--engc-acier); }
html[data-theme="dark"] .engc-swatch-ral { background: #122b3c; color: #9fd4f2; }
html[data-theme="dark"] .engc-zsw-ral { background: #122b3c; color: #a8c4d6; }
html[data-theme="dark"] .engc-ztab { background: #12283a; border-color: #2a4a60; color: #a8c4d6; }
html[data-theme="dark"] .engc-ztab.on { background: #1763a6; border-color: #1763a6; color: #fff; }

/* ---------------------------------------------- divers */
html[data-theme="dark"] .engc-intake-sep { color: #7f97a6; }
html[data-theme="dark"] .engc-intake-sep::before,
html[data-theme="dark"] .engc-intake-sep::after { background: #244054; }
html[data-theme="dark"] .engc-detnoimg { color: #4a6373; }
html[data-theme="dark"] .engc-star .engc-star-badge { color: #7ac4f0; }

@media (prefers-reduced-motion: reduce) {
  .engc-themebtn { transition: none; }
}

/* Bandeau crème « taille réelle / fichier sans dimension » (fond inline #fff7ed) :
   en sombre le texte clair du thème devenait invisible sur le crème (John 2026-07-13).
   Fond ambré sombre + bordure assortie ; !important car le fond est posé inline. */
html[data-theme="dark"] .engc-nodim { background: #241d10 !important; border-color: #5a4a26 !important; }

/* ---------------------------------------------- îlots d'info à fond clair (posés inline)
   Sur les pages wizard/résultat, plusieurs encarts posent leur fond clair EN STYLE INLINE
   (délai de livraison, hints, avertissements, badge vérificateur, bulles du chat). En
   sombre le fond restait clair → le texte clair du thème (ou un texte foncé posé inline)
   devenait illisible. On les repeint en panneaux vitrés sombres, texte clair lisible.
   Sélecteurs d'attribut : ne s'appliquent QUE là où le fond exact est posé inline, et
   uniquement sous data-theme="dark" (inertes en clair). !important : le fond/texte inline
   ne cèdent pas autrement. (John 2026-07-14 — bandeau « Mise à disposition / livraison »
   invisible en sombre + tour de l'outil.) */

/* encarts bleus : hints, « nous avons lu votre photo », conteneur + bulle assistant du
   chat, pièces jointes, sous-panneaux clairs */
/* ⚠ Chaque couleur existe en DEUX écritures : hex (HTML d'origine) ET rgb()
   sérialisé. Dès qu'un JS touche el.style.* (ex. toggleBlockTotal → display),
   le navigateur RÉÉCRIT tout l'attribut style en rgb(r, g, b) → le sélecteur
   hex ne matche plus et l'encart repassait en clair avec texte clair hérité =
   ILLISIBLE (John 2026-07-21, panneau « taille totale de l'élément »). */
html[data-theme="dark"] [style*="background:#eef6fc"],
html[data-theme="dark"] [style*="background: rgb(238, 246, 252)"],
html[data-theme="dark"] [style*="background:#f0f7fb"],
html[data-theme="dark"] [style*="background: rgb(240, 247, 251)"],
html[data-theme="dark"] [style*="background:#f7f9fb"],
html[data-theme="dark"] [style*="background: rgb(247, 249, 251)"],
html[data-theme="dark"] [style*="background:#fbfdff"],
html[data-theme="dark"] [style*="background: rgb(251, 253, 255)"],
html[data-theme="dark"] [style*="background:#eef6fb"],
html[data-theme="dark"] [style*="background: rgb(238, 246, 251)"],
html[data-theme="dark"] [style*="background:#eaf4fb"],
html[data-theme="dark"] [style*="background: rgb(234, 244, 251)"],
html[data-theme="dark"] [style*="background:#f4f6f8"],
html[data-theme="dark"] [style*="background: rgb(244, 246, 248)"] {
  background: #0e2839 !important;
  border-color: #2a4a60 !important;
  color: #dcebf4 !important;
}
/* encart vert « mise à disposition / livraison estimée » + confirmations
   signature/commande (#f1faf3 : signrow signé, « devis déjà signé ») */
html[data-theme="dark"] [style*="background:#eef7f0"],
html[data-theme="dark"] [style*="background: rgb(238, 247, 240)"],
html[data-theme="dark"] [style*="background:#f1faf3"],
html[data-theme="dark"] [style*="background: rgb(241, 250, 243)"] {
  background: #122a1e !important;
  border-color: #2e6b45 !important;
  color: #d7ead9 !important;
}
/* avertissements ambrés (réservé prélèvement, confiance < 90 %, bandeau
   « dimensions écrites non rattachées » #fff7ed…) */
html[data-theme="dark"] [style*="background:#fff8e6"],
html[data-theme="dark"] [style*="background: rgb(255, 248, 230)"],
html[data-theme="dark"] [style*="background:#fff7ed"],
html[data-theme="dark"] [style*="background: rgb(255, 247, 237)"] {
  background: #241d10 !important;
  border-color: #5a4a26 !important;
  color: #e7d8b6 !important;
}
/* badge lavande « compte vérificateur » */
html[data-theme="dark"] [style*="background:#ede7fb"],
html[data-theme="dark"] [style*="background: rgb(237, 231, 251)"] {
  background: rgba(122, 92, 200, 0.22) !important;
  border-color: rgba(160, 130, 230, 0.4) !important;
  color: #cbb9f2 !important;
}

/* ---------------------------------------------- menu unique ☰ (V4.48.0) */
html[data-theme="dark"] .engc-menu-btn,
html[data-theme="dark"] .engc-menu-panel {
  background: var(--engc-papier);
  border-color: var(--engc-trait);
  color: var(--engc-encre);
}
html[data-theme="dark"] .engc-menu-btn { box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5); }
html[data-theme="dark"] .engc-menu-ic span { background: var(--engc-encre); }
html[data-theme="dark"] .engc-menu-ic span:nth-child(2) { background: var(--engc-bleu, #4da3d2); }
html[data-theme="dark"] .engc-menu-item:hover { background: rgba(77, 163, 210, 0.16); color: #bfe0f2; }
html[data-theme="dark"] .engc-switch { background: #3a4a58; }

/* ---------------------------------------------- pages comptes en sombre (V4.63.3)
   Les pages _auth_page (connexion, mot de passe oublié, ouvrir un compte, mes
   devis, admin comptes) chargent le thème depuis le 2026-07-21 (sombre par
   défaut). Leurs liens/titres posés en INLINE bleu foncé #15406b étaient
   illisibles sur fond nuit — un style inline ne cède qu'au !important. */
html[data-theme="dark"] [style*="#15406b"] { color: #8fd0ff !important; }
/* classes propres aux pages comptes, injectées APRÈS cette feuille (extra_css) */
html[data-theme="dark"] .doc-no { color: #9fd4f2; }
html[data-theme="dark"] .adm-nav a,
html[data-theme="dark"] .acct-email,
html[data-theme="dark"] .histlink { color: #8fd0ff; }

/* ---------------------------------------------- pages devis / BAT (_devis_shell)
   Leurs <style> inline posent des fonds quasi blancs #fbfcfd (bloc replié
   « éditer à mon nom », lignes de signature) : le texte clair du thème y
   devenait invisible (tour du 2026-07-22). Le fond vert « signé » #f1faf3
   posé inline est couvert plus haut avec les îlots verts. */
html[data-theme="dark"] details.fold,
html[data-theme="dark"] .signrow { background: #0e2433; border-color: #2a4a60; }
html[data-theme="dark"] details.fold summary,
html[data-theme="dark"] .signrow b { color: #7ac4f0; }