/* Palette Arkelio (reprise de arkelio-energie.fr) : vert de marque #465136,
   or #F7AD46, crème #E7E1D7. */
:root {
  --vert-fonce: #465136;
  --vert-moyen: #6D7F53;
  --vert-clair: #ACB899;
  --vert-pale: #EEF1E7;
  --or: #F7AD46;
  --or-clair: #E4C690;
  --or-pale: #F8EFDC;
  --rouge: #C1121F;
  --rouge-pale: #FDE2E4;
  --ambre: #9A5B00;
  --ambre-pale: #FFF1D6;
  --gris-clair: #F5F2EA;
  --gris-moyen: #DDD6C8;
  --gris-fonce: #5B564C;
  --texte: #1D1A17;
  --rayon: 18px;
  --rayon-petit: 10px;
  --rayon-pill: 999px;
  --ombre: 0 4px 20px rgba(31, 26, 15, 0.09);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: var(--gris-clair);
  color: var(--texte);
  max-width: 760px;
  margin: 0 auto;
  min-height: 100vh;
}

.entete { background: var(--vert-fonce); color: #fff; padding: 20px 16px 16px; position: relative; }
.entete h1 { font-size: 1.3rem; }
.entete p { opacity: 0.8; font-size: 0.9rem; margin-top: 2px; }
.lien-deconnexion {
  position: absolute; top: 20px; right: 16px; background: none; border: 0;
  color: #fff; opacity: 0.75; font: inherit; font-size: 0.85rem; cursor: pointer;
  text-decoration: underline;
}
.lien-deconnexion:hover { opacity: 1; }

.onglets { display: flex; background: var(--vert-moyen); }
.onglets button {
  flex: 1; padding: 12px; border: 0; background: none; color: #fff;
  font: inherit; font-weight: 600; cursor: pointer; opacity: 0.7;
  border-bottom: 3px solid transparent; transition: opacity 0.15s ease, border-color 0.15s ease;
}
.onglets button[aria-selected="true"] { opacity: 1; border-bottom-color: var(--or); }

main { padding: 16px; }
.carte { background: #fff; border-radius: var(--rayon); box-shadow: var(--ombre); padding: 16px; }

form label { display: block; font-size: 0.85rem; font-weight: 600; color: var(--gris-fonce); margin-bottom: 14px; }
input, select {
  display: block; width: 100%; margin-top: 6px; padding: 10px 12px;
  font: inherit; font-size: 1rem; color: var(--texte);
  border: 1px solid var(--gris-moyen); border-radius: var(--rayon-petit); background: #fff;
  transition: border-color 0.15s ease;
}
input:focus, select:focus { outline: 2px solid var(--or); outline-offset: 1px; border-color: var(--or); }
.deux-colonnes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* Auto-complétion du nom d'entreprise depuis le SIRET (lot A2bis) — pur
   confort de saisie, volontairement discret : ni un champ, ni une erreur. */
.entreprise-info { margin: -8px 0 14px; font-size: 0.85rem; color: var(--gris-fonce); min-height: 1.1em; }

button.principal, button.secondaire, a.secondaire {
  font: inherit; font-weight: 600; border-radius: var(--rayon-pill); cursor: pointer; padding: 12px 20px;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
}
button.principal { width: 100%; border: 0; background: var(--vert-fonce); color: #fff; font-size: 1rem; }
button.principal:hover:not(:disabled) { background: #37402A; box-shadow: var(--ombre); }
button.principal:active:not(:disabled) { transform: scale(0.99); }
button.principal:disabled { opacity: 0.6; cursor: progress; }
button.secondaire, a.secondaire { border: 1px solid var(--gris-moyen); background: #fff; color: var(--texte); }
button.secondaire:hover:not(:disabled), a.secondaire:hover { border-color: var(--vert-fonce); color: var(--vert-fonce); }
button.secondaire:disabled { opacity: 0.5; cursor: not-allowed; }
/* Le rapport PDF (lot D1) est un lien de téléchargement, pas un bouton
   JS : même apparence que button.secondaire malgré la balise <a>. */
a.bouton-lien { display: inline-block; text-decoration: none; }
.action-rapport { margin: 10px 0; }

#resultat:not(:empty) { margin-top: 16px; }
.resultat { border-radius: var(--rayon); padding: 16px; border-left: 6px solid var(--gris-fonce); background: #fff; box-shadow: var(--ombre); }
.resultat .badge { font-size: 1.05rem; }

.badge {
  display: inline-block; padding: 3px 10px; border-radius: var(--rayon-pill);
  font-weight: 700; font-size: 0.85rem; background: var(--gris-moyen); color: var(--texte);
}

.raisons { margin: 10px 0 0 18px; font-size: 0.9rem; color: var(--gris-fonce); }
.raisons li + li { margin-top: 4px; }

.erreur { color: var(--rouge); font-weight: 600; }
.vide { color: var(--gris-fonce); padding: 16px 0; }

.barre-filtre { display: flex; align-items: flex-end; gap: 12px; margin-bottom: 16px; }
.barre-filtre label { flex: 1; font-size: 0.85rem; font-weight: 600; color: var(--gris-fonce); }

.prospects { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--rayon); overflow: hidden; box-shadow: var(--ombre); }
.prospects th, .prospects td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--gris-clair); vertical-align: top; font-size: 0.9rem; }
.prospects th { background: var(--vert-pale); color: var(--vert-fonce); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; }
.prospects td[data-col="SIRET"] { font-variant-numeric: tabular-nums; }
.prospects td[data-col="Date"], .prospects td[data-col="Surface"] { white-space: nowrap; }
.prospects .entreprise-nom { font-weight: 600; }
.prospects .siret-brut { color: var(--gris-fonce); font-size: 0.8rem; }

/* Documents d'un prospect (lot B1). */
button.petit { padding: 6px 12px; font-size: 0.8rem; white-space: nowrap; border-radius: var(--rayon-pill); }
.ligne-documents > td, .ligne-chiffrage > td { background: var(--gris-clair); }
.zone-documents h3 { font-size: 0.85rem; color: var(--vert-fonce); text-transform: uppercase; letter-spacing: 0.03em; margin: 14px 0 8px; }
.zone-documents h3:first-child { margin-top: 4px; }
.zone-documents label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--gris-fonce); margin-bottom: 10px; }
.zone-documents .aide, .zone-documents .info { font-size: 0.8rem; color: var(--gris-fonce); margin: 6px 0; }
.lien-client { display: flex; gap: 8px; align-items: stretch; }
.lien-client input { margin-top: 0; font-size: 0.8rem; min-width: 0; }
.lien-client button { padding: 8px 14px; font-size: 0.8rem; }
.depot-message { font-size: 0.8rem; color: var(--rouge); margin-top: 6px; }
.doc-categorie h4 { font-size: 0.85rem; margin: 8px 0 4px; }
.doc-compte { color: var(--gris-fonce); font-weight: 400; }
.doc-categorie ul { list-style: none; }
.doc-categorie li { padding: 4px 0; overflow-wrap: anywhere; }
.doc-categorie a { color: var(--vert-moyen); font-weight: 600; }
.doc-meta { display: block; font-size: 0.75rem; color: var(--gris-fonce); }
.doc-categorie .vide { padding: 0; font-size: 0.8rem; }
.origine { font-weight: 600; }
.origine-client { color: var(--ambre); }

/* Chiffrage d'un prospect (lot C1). */
.zone-chiffrage h3 { font-size: 0.85rem; color: var(--vert-fonce); text-transform: uppercase; letter-spacing: 0.03em; margin: 16px 0 8px; }
.zone-chiffrage h4 { font-size: 0.9rem; margin: 0 0 8px; }
.zone-chiffrage h5 { font-size: 0.8rem; margin: 10px 0 6px; color: var(--vert-fonce); }
.zone-chiffrage label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--gris-fonce); margin-bottom: 8px; }
.zone-chiffrage .aide, .zone-chiffrage .info { display: block; font-size: 0.78rem; color: var(--gris-fonce); margin: 2px 0 8px; font-weight: 400; }
.zone-chiffrage .grille-champs { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 14px; }
.zone-chiffrage .catalogue { list-style: none; max-height: 240px; overflow-y: auto; border: 1px solid var(--gris-moyen); border-radius: var(--rayon-petit); padding: 6px 10px; background: #fff; }
.zone-chiffrage .catalogue li { padding: 3px 0; }
.zone-chiffrage label.case { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; margin: 0; color: inherit; }
.zone-chiffrage label.case input { width: auto; margin-top: 3px; }
.fiche-chiffrage { background: #fff; border: 1px solid var(--gris-moyen); border-radius: var(--rayon-petit); padding: 12px; margin-bottom: 10px; }
.fiche-chiffrage fieldset.indexe { border: 1px dashed var(--gris-moyen); border-radius: var(--rayon-petit); padding: 8px; grid-column: 1 / -1; }
/* Bonifications (lot BON-2) : champs communs et champs par fiche, même
   traitement que fieldset.indexe. */
.zone-chiffrage fieldset.bonus, .fiche-chiffrage fieldset.bonus { border: 1px dashed var(--or); border-radius: var(--rayon-petit); padding: 8px; grid-column: 1 / -1; margin-bottom: 8px; }
.zone-chiffrage fieldset.bonus legend, .fiche-chiffrage fieldset.bonus legend { font-size: 0.78rem; font-weight: 700; color: var(--vert-fonce); text-transform: uppercase; letter-spacing: 0.03em; padding: 0 4px; }
.bonus-operation { margin-top: 4px; }
.bonus-operation .badge { margin-bottom: 4px; }
.zone-chiffrage button.petit { white-space: normal; text-align: left; margin: -2px 0 10px; }
.fiche-chiffrage .condition { border-top: 1px solid var(--gris-clair); padding-top: 6px; }
.questions-dossier { margin: 12px 0; font-size: 0.85rem; }
.questions-dossier summary { cursor: pointer; font-weight: 600; color: var(--vert-fonce); margin-bottom: 8px; }
.resultat-chiffrage .motif { margin: 4px 0; font-size: 0.85rem; }
.resultat-chiffrage ul.raisons { margin: 4px 0 0 16px; font-size: 0.8rem; }
.prospects.chiffrage tfoot th, .prospects.chiffrage tfoot td { border-top: 2px solid var(--vert-fonce); }
.arbitrages li { margin: 6px 0 10px 16px; font-size: 0.85rem; }
.categorie-retenue { background: var(--vert-pale); color: var(--vert-fonce); }
.categorie-retenue_sous_reserve, .categorie-indeterminee, .categorie-nulle { background: var(--ambre-pale); color: var(--ambre); }
.categorie-refusee, .categorie-contradiction { background: var(--rouge-pale); color: var(--rouge); }

/* Téléphone : une carte par prospect plutôt qu'un tableau qui déborde. */
@media (max-width: 560px) {
  .prospects thead { display: none; }
  .prospects, .prospects tbody, .prospects tr, .prospects td { display: block; width: 100%; }
  .prospects tr { border-bottom: 1px solid var(--gris-moyen); padding: 8px 0; }
  .prospects td { border: 0; padding: 4px 12px; }
  .prospects td::before { content: attr(data-col) " · "; font-weight: 600; color: var(--gris-fonce); font-size: 0.8rem; }
  .prospects td[data-col="Dossier"]::before, .ligne-detail > td::before { content: none; }
  .zone-chiffrage .deux-colonnes, .zone-chiffrage .grille-champs { grid-template-columns: 1fr; }
  .prospects.chiffrage tfoot tr { display: block; }
  .lien-client { flex-wrap: wrap; }
  .zone-documents .deux-colonnes { grid-template-columns: 1fr; gap: 0; }
}

/* Dossier partagé (lot ÉTAPE-B). */
.badge.cible-prioritaire { background: var(--vert-pale); color: var(--vert-fonce); }
.badge.cible-hors_cible { background: var(--gris-moyen); color: var(--texte); }
.badge.cible-a_qualifier { background: var(--ambre-pale); color: var(--ambre); }
.resultat.cible-prioritaire { border-left-color: var(--vert-moyen); }
.resultat.cible-a_qualifier { border-left-color: var(--ambre); }
.resultat .motif, .resultat .aide { margin-top: 8px; font-size: 0.9rem; }
.resultat .aide { color: var(--gris-fonce); font-size: 0.8rem; }
body:has(#vue-dossier:not([hidden])) { max-width: 1040px; }
.vue-dossier h2 { font-size: 1.1rem; margin: 6px 0; }
.barre-dossier { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
.provenance-saisie { font-size: 0.8rem; font-weight: 600; color: var(--gris-fonce); }
.provenance-saisie select { display: inline-block; width: auto; margin: 0 0 0 6px; padding: 6px 8px; font-size: 0.85rem; }
button.lien { background: none; border: 0; color: var(--vert-moyen); font: inherit; font-size: 0.8rem; cursor: pointer; text-decoration: underline; padding: 0 4px; }
button.lien.danger { color: var(--rouge); }
.sous-onglets { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.sous-onglets button { flex: 1 1 auto; padding: 8px 14px; border: 1px solid var(--gris-moyen); background: #fff; border-radius: var(--rayon-pill); font: inherit; font-size: 0.85rem; font-weight: 600; cursor: pointer; transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease; }
.sous-onglets button[aria-selected="true"] { background: var(--vert-fonce); color: #fff; border-color: var(--vert-fonce); }
.message-dossier:not(:empty) { color: var(--rouge); font-weight: 600; margin: 6px 0; }
.ecran h3 { font-size: 0.9rem; color: var(--vert-fonce); text-transform: uppercase; letter-spacing: 0.03em; margin: 16px 0 8px; }
.ecran h4 { font-size: 0.85rem; margin: 14px 0 6px; color: var(--vert-fonce); }
.ecran .carte { margin-bottom: 12px; }
.ecran label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--gris-fonce); margin-bottom: 8px; }
.ecran .aide { display: block; font-size: 0.78rem; color: var(--gris-fonce); font-weight: 400; margin: 2px 0 6px; }
.grille-questions, .grille-champs { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 4px 14px; }
.question .provenance, .provenance { display: block; font-size: 0.72rem; font-weight: 400; color: var(--vert-moyen); }
.question .inactif { display: block; font-size: 0.72rem; color: var(--ambre); font-weight: 400; }
.nombre-inconnu { display: block; }
.nombre-inconnu label.case, .ecran label.case { display: flex; gap: 6px; align-items: center; font-weight: 400; margin: 4px 0; }
.ecran label.case input { width: auto; margin: 0; }
.anciennete select, .anciennete input { margin-top: 4px; }
/* Alertes de cohérence des surfaces (lot UX-SURFACES) : non bloquantes. */
.alertes-surfaces { list-style: none; margin: 8px 0; }
.alerte-surface { font-size: 0.82rem; padding: 6px 10px; margin-bottom: 4px; border-radius: var(--rayon-petit); border-left: 4px solid var(--or); background: var(--ambre-pale); color: var(--ambre); }
.alerte-surface.information { border-left-color: var(--vert-clair); background: var(--vert-pale); color: var(--gris-fonce); }
.surface-retenue { font-size: 0.85rem; margin: 6px 0 0; }
details.zone, details.equipement, details.paroi { border: 1px solid var(--gris-moyen); border-radius: var(--rayon-petit); padding: 8px 10px; margin-bottom: 8px; background: var(--gris-clair); }
details summary { cursor: pointer; font-weight: 600; font-size: 0.85rem; }
fieldset.dessert { border: 1px dashed var(--gris-moyen); border-radius: var(--rayon-petit); padding: 6px 8px; margin: 6px 0; display: flex; flex-wrap: wrap; gap: 4px 14px; }
fieldset.dessert legend { font-size: 0.75rem; font-weight: 700; padding: 0 4px; }
form.ajout { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 6px 0 10px; }
form.ajout input, form.ajout select { width: auto; flex: 1 1 160px; margin: 0; padding: 7px 10px; font-size: 0.85rem; }
.opportunite { background: #fff; border-radius: var(--rayon); box-shadow: var(--ombre); padding: 12px 14px; margin-bottom: 10px; border-left: 5px solid var(--gris-moyen); font-size: 0.88rem; }
.opportunite.etat-conditions_verifiees { border-left-color: var(--vert-moyen); }
.opportunite.etat-a_confirmer, .opportunite.etat-a_explorer { border-left-color: var(--ambre); }
.opportunite.etat-ecartee { border-left-color: var(--rouge); }
.opportunite .cible { font-size: 0.8rem; color: var(--gris-fonce); margin-top: 2px; }
.opportunite .motif { margin: 6px 0; }
.opportunite .action { color: var(--vert-fonce); font-weight: 600; margin: 4px 0; }
.opportunite ul { margin: 4px 0 4px 18px; }
.opportunite .verdict { font-weight: 700; font-size: 0.75rem; text-transform: uppercase; }
.opportunite .verdict-refusee .verdict, .opportunite .verdict-contradiction .verdict { color: var(--rouge); }
.opportunite .verdict-indeterminee .verdict { color: var(--ambre); }
.opportunite .verdict-confirmee .verdict, .opportunite .verdict-confirmee_par_mesure .verdict { color: var(--vert-moyen); }
.opportunite .alternative { color: var(--ambre); font-weight: 600; }
.opportunite .decision { display: flex; gap: 8px; margin-top: 8px; align-items: center; }
.opportunite .decision button[aria-pressed="true"] { background: var(--vert-fonce); color: #fff; border-color: var(--vert-fonce); }
.badge.etat-conditions_verifiees { background: var(--vert-pale); color: var(--vert-fonce); }
.badge.etat-a_confirmer, .badge.etat-a_explorer { background: var(--ambre-pale); color: var(--ambre); }
.badge.etat-ecartee { background: var(--rouge-pale); color: var(--rouge); }
.badge.depassee { background: var(--rouge-pale); color: var(--rouge); }
.prochaines ol { margin: 6px 0 6px 20px; font-size: 0.88rem; }
.date-orientation { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-bottom: 10px; }
.date-orientation label { margin: 0; }
.lecture-seule { font-size: 0.82rem; padding: 4px 0; }
.champ.manquant { font-size: 0.82rem; color: var(--ambre); }
.operation h4 { margin-top: 0; }
.resultat-simulation { margin-top: 12px; }
.plans li { margin: 6px 0; }
@media (max-width: 560px) {
  .grille-questions, .grille-champs { grid-template-columns: 1fr; }
}

/* Note d'aide générique (lot UI1) : icône à côté d'un label, clic/tap
   affiche un texte court en dessous. Distincte de .aide (toujours visible,
   utilisée partout pour de l'information générale) : réservée aux champs
   à définition piégeuse, sans encombrer visuellement les autres. */
.note-aide-icone {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; margin-left: 4px; padding: 0;
  border: 1px solid var(--gris-moyen); border-radius: 50%; background: #fff;
  color: var(--gris-fonce); font: inherit; font-size: 0.72rem; font-weight: 700;
  line-height: 1; cursor: pointer; vertical-align: middle;
}
.note-aide-icone[aria-expanded="true"] { background: var(--vert-pale); border-color: var(--vert-clair); color: var(--vert-fonce); }
.note-aide-icone:focus-visible { outline: 2px solid var(--or); outline-offset: 1px; }
.note-aide-texte {
  display: block; margin: 4px 0 8px; padding: 6px 10px;
  background: var(--vert-pale); border-left: 3px solid var(--vert-clair); border-radius: 4px;
  font-size: 0.78rem; font-weight: 400; color: var(--vert-fonce);
}

/* Un attribut hidden l'emporte sur les display:block ci-dessus. */
[hidden] { display: none !important; }

/* Onglet « Pièces » (lot ÉTAPE-E1) */
.liste-pieces { list-style: none; margin: 0 0 12px; padding: 0; }
.piece { display: grid; grid-template-columns: 1fr minmax(180px, 260px); gap: 8px 16px; padding: 8px 0; border-bottom: 1px solid var(--gris-clair, #e5e5e5); align-items: start; }
.piece-statut { display: flex; flex-direction: column; gap: 4px; }
.piece-modifiee { border-left: 3px solid var(--ambre); padding-left: 8px; }
.pieces-modifie { color: var(--ambre); font-weight: 700; }
.pieces-enregistre { color: var(--gris-fonce); }
.pieces-barre { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
.pieces-barre .aide, .pieces-barre .erreur, .pieces-barre details { flex-basis: 100%; margin: 0; }
.pieces-barre textarea { width: 100%; font-family: monospace; font-size: 0.8rem; }
.contexte-pieces { margin: 12px 0; }
.contexte-pieces .champ { display: block; margin: 6px 0; }
.contexte-pieces .a-poser { font-weight: 600; }
.badge.socle { background: var(--vert-pale); }
.badge.alerte { color: var(--ambre); border-color: var(--ambre); }
@media (max-width: 560px) { .piece { grid-template-columns: 1fr; } }

/* Dépôt client dans l'onglet Pièces (lot ÉTAPE-E2) */
.depot-panneau .depot-boutons { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin: 10px 0; }
.depot-lien-genere { border: 2px solid var(--vert-moyen); margin: 10px 0; }
.depot-lien-genere input[readonly], .depot-lien-genere textarea[readonly] { width: 100%; }
.depots-piece { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--vert-clair); }
.liste-depots { list-style: none; padding: 0; margin: 6px 0 0; display: grid; gap: 8px; }
.depot { padding: 8px; border: 1px solid var(--vert-clair); border-radius: 8px; background: var(--vert-pale); }
.depot-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.depot-refus { display: flex; gap: 6px; margin-top: 6px; }
.depot-refus input { flex: 1; }
.depot-refus[hidden] { display: none; }
.depot-refuse, .depot-etat-a_refaire { background: var(--rouge-pale); color: var(--rouge); }
.depot-journal ul { list-style: none; padding: 0; margin: 6px 0 0; max-height: 220px; overflow: auto; }

/* Estimation rapide (lot ESTIMATION-RAPIDE) — mobile d'abord. */
#vue-estimation h2 { font-size: 1.15rem; color: var(--vert-fonce); }
#vue-estimation h3 { font-size: 1rem; margin-top: 8px; }
.er-note { color: var(--gris-fonce); font-size: 0.85rem; }
.er-famille { border: 1px solid var(--gris-moyen); border-radius: var(--rayon-petit); padding: 10px 12px; margin: 8px 0; background: #fff; }
.er-case { display: flex; gap: 8px; align-items: center; font-weight: 500; margin-bottom: 6px; }
.er-titre-famille { font-weight: 600; color: var(--vert-fonce); }
.er-detail { margin-top: 8px; display: grid; gap: 8px; }
.er-sous { padding-left: 8px; border-left: 3px solid var(--vert-pale); }
.er-qte { font-size: 0.9rem; margin-top: 4px; }
.er-hyp { font-size: 0.8rem; color: var(--gris-fonce); }
#er-resultat { margin-top: 16px; display: grid; gap: 12px; }
.er-total { background: var(--vert-fonce); color: #fff; border-radius: var(--rayon); padding: 18px 16px; box-shadow: var(--ombre); }
.er-total-titre { opacity: 0.85; font-size: 0.9rem; }
.er-total-montant { font-size: 1.6rem; margin-top: 4px; }
.er-total-montant strong { color: var(--or); }
.er-cartes { display: grid; gap: 10px; }
.er-carte { background: #fff; border-radius: var(--rayon-petit); padding: 14px; box-shadow: var(--ombre); border-left: 5px solid var(--vert-moyen); }
.er-carte.er-a_etudier { border-left-color: var(--or-clair); }
.er-montant { font-size: 1.15rem; margin: 6px 0; }
.er-montant strong { color: var(--vert-fonce); }
.er-etudier { color: var(--ambre); font-weight: 600; }
.er-barre { position: relative; height: 10px; background: var(--vert-pale); border-radius: var(--rayon-pill); overflow: hidden; }
.er-plage { position: absolute; top: 0; bottom: 0; background: linear-gradient(90deg, var(--vert-clair), var(--vert-fonce)); border-radius: var(--rayon-pill); }
.er-lignes { list-style: none; margin-top: 8px; font-size: 0.85rem; display: grid; gap: 4px; }
.er-lignes li { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.er-bonus { margin-top: 8px; display: inline-block; background: var(--or-pale); color: var(--ambre); border-radius: var(--rayon-pill); padding: 2px 10px; font-size: 0.8rem; font-weight: 600; }
.er-affiner { background: var(--or-pale); border-radius: var(--rayon-petit); padding: 14px; }
.er-affiner ul { margin: 6px 0 12px 18px; font-size: 0.9rem; }
.er-jauge { height: 8px; background: #fff; border-radius: var(--rayon-pill); overflow: hidden; margin: 8px 0; }
.er-jauge span { display: block; height: 100%; background: var(--or); }
.er-hypotheses { font-size: 0.85rem; color: var(--gris-fonce); }
.er-hypotheses ul { margin: 6px 0 0 18px; }
.er-mention { font-size: 0.8rem; color: var(--gris-fonce); font-style: italic; }
.er-case { flex-direction: row; align-items: center; justify-content: flex-start; text-align: left; }
.er-case input[type="checkbox"] { width: auto; flex: 0 0 auto; margin: 0; accent-color: var(--vert-fonce); }

/* Estimation rapide, étape 2 : sous-choix par solution technique. */
details.er-famille { border: 1px solid var(--gris-moyen); border-radius: var(--rayon-petit); padding: 8px 12px; margin: 8px 0; background: #fff; }
details.er-famille > summary { cursor: pointer; font-weight: 600; color: var(--vert-fonce); }
details.er-famille[open] > summary { margin-bottom: 6px; }
.er-famille-corps { display: grid; gap: 6px; }
.er-sous[hidden], details.er-famille[hidden] { display: none; }
.er-precision { display: grid; gap: 4px; margin-top: 8px; font-size: 0.9rem; border: 0; padding: 0; }
.er-precision-titre { font-weight: 500; }
.er-options { display: grid; gap: 2px 14px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.er-exclusif { margin-top: 6px; }
.er-exclusion { background: var(--or-pale); border-radius: var(--rayon-petit); padding: 8px 10px; font-size: 0.85rem; margin-top: 8px; }
.er-ligne-etudier em { color: var(--ambre); font-weight: 600; }
.er-non-cumule { opacity: 0.55; }
.er-non-cumule .er-badge { background: var(--gris-moyen); color: var(--gris-fonce); }
.er-badge { display: inline-block; border-radius: var(--rayon-pill); padding: 1px 8px; font-size: 0.75rem; font-weight: 600; }
.er-total-indicatif { font-size: 0.8rem; opacity: 0.85; margin-top: 6px; }

/* Page de connexion en plusieurs étapes (lot 2FA). */
.page-connexion [hidden] { display: none !important; }
.etape-connexion { max-width: 480px; margin: 0 auto; }
.titre-etape { font-size: 1.1rem; margin-bottom: 8px; }
.aide-etape { font-size: 0.9rem; color: var(--gris-fonce); margin-bottom: 14px; line-height: 1.45; }
.aide-etape.petit { font-size: 0.8rem; margin: 6px 0 0; }
.etapes-activation { margin: 0 0 14px 18px; font-size: 0.9rem; line-height: 1.45; }
.etapes-activation li + li { margin-top: 10px; }
.cle-2fa {
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 1.05rem; letter-spacing: 0.05em;
  background: var(--vert-pale); border-radius: var(--rayon-petit); padding: 10px 12px; margin: 8px 0; word-break: break-all;
}
.actions-cle { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 12px; }
.liens-etape { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 12px; }
button.lien { background: none; border: 0; padding: 0; font: inherit; font-size: 0.85rem; color: var(--vert-fonce); text-decoration: underline; cursor: pointer; }
.liste-codes-secours {
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 1rem; columns: 2; column-gap: 24px;
  margin: 0 0 12px 22px; line-height: 1.8;
}
@media (max-width: 420px) { .liste-codes-secours { columns: 1; } }
form label.case-conservee, .case-conservee { display: flex; align-items: center; gap: 8px; font-weight: 600; margin: 4px 0 14px; }
.case-conservee input { width: auto; }
#erreur-connexion { max-width: 480px; margin: 12px auto 0; }
@media print {
  .page-connexion .entete, .page-connexion #erreur-connexion, .page-connexion .actions-cle,
  .page-connexion .case-conservee, .page-connexion #continuer-apres-codes { display: none !important; }
  .page-connexion .carte { box-shadow: none; }
}