:root {
  --bg: #f8fafc; --surface: #fff; --text: #111827; --muted: #6b7280; --border: #e5e7eb;
  --primary: #b45309; --primary-dark: #92400e; --danger: #b91c1c; --success: #15803d;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 15px; background: var(--bg); color: var(--text); }
a { color: var(--primary); }
h1 { font-size: 1.5rem; margin: 0 0 1rem; }
.container { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem; }

.badge { font-size: .75rem; background: #374151; color: #e5e7eb; padding: .15rem .5rem; border-radius: 999px; }
.badge-admin { background: #fef3c7; color: #92400e; }
.badge-user { background: #e5e7eb; color: #374151; }
.badge-off { background: #fee2e2; color: #991b1b; }

.btn { display: inline-block; padding: .5rem 1rem; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); color: var(--text); text-decoration: none; cursor: pointer; font: inherit; }
.btn:hover { background: #f9fafb; }
.btn-sm { padding: .25rem .6rem; font-size: .85rem; }
.btn-primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); }
.btn-danger { color: var(--danger); }

.card { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 1.5rem; }
.page-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.page-head h1 { margin: 0; }

table.list { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
table.list th, table.list td { text-align: left; padding: .65rem .9rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
table.list th { background: #f9fafb; font-weight: 600; font-size: .85rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
table.list tr:last-child td { border-bottom: 0; }
table.list td.actions { text-align: right; white-space: nowrap; }
table.list td.actions form { display: inline; }
.muted { color: var(--muted); }

.flash { padding: .75rem 1rem; border-radius: 8px; margin-bottom: 1rem; border: 1px solid; }
.flash-success { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.flash-error { background: #fef2f2; border-color: #fecaca; color: #991b1b; }

form div { margin-bottom: 1rem; }
form label { display: block; font-weight: 500; margin-bottom: .3rem; }
form input[type=text], form input[type=email], form input[type=password], form select {
  width: 100%; padding: .55rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff;
}
form input:focus, form select:focus { outline: 2px solid #fcd34d; border-color: var(--primary); }
form .help-text, form .form-help { display: block; font-size: .85rem; color: var(--muted); margin-top: .3rem; }
form ul { margin: .3rem 0 0; padding-left: 1.2rem; color: var(--danger); font-size: .9rem; }
form .checkbox { display: flex; align-items: center; gap: .5rem; }
form .checkbox label { margin: 0; font-weight: 400; }
form .form-actions { display: flex; gap: .75rem; align-items: center; margin-top: 1.5rem; }

.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.login-card { width: 100%; max-width: 380px; }
.login-card .login-logo { display: block; text-align: center; margin-bottom: 1rem; }
.login-card .login-logo img { max-width: 160px; height: auto; }
.login-card h1 { text-align: center; }
.login-card .sub { text-align: center; color: var(--muted); margin: -.5rem 0 1.5rem; }
.login-card .btn { width: 100%; }
.alert { padding: .75rem 1rem; border-radius: 8px; margin-bottom: 1rem; background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; }

/* ---- Module Chantiers ---- */
.retour { margin: 0 0 .75rem; }
.petit { font-size: .9rem; }
.table-wrap { overflow-x: auto; }
form.inline { display: inline; }
form.inline div, .filtres div { margin-bottom: 0; }

.filtres { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; margin-bottom: 1rem; }
.filtres input[type=search], .filtres select { padding: .5rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
.filtres input[type=search] { min-width: 260px; flex: 1; }
.filtres .compteur { color: var(--muted); font-size: .9rem; margin-left: auto; }

/* Pastilles de statut (voir App\Enum\StatutChantier::cssClass) */
.statut { font-size: .75rem; padding: .15rem .55rem; border-radius: 999px; white-space: nowrap; font-weight: 500; }
.statut-a-visiter { background: #e5e7eb; color: #374151; }
.statut-visite-faite { background: #dbeafe; color: #1e40af; }
.statut-devis-envoye { background: #fef3c7; color: #92400e; }
.statut-accepte { background: #dcfce7; color: #166534; }
.statut-en-cours { background: #ffedd5; color: #9a3412; }
.statut-termine { background: #d1fae5; color: #065f46; }
.statut-annule { background: #fee2e2; color: #991b1b; }

td.num, .num { font-variant-numeric: tabular-nums; color: var(--muted); }
td .sous { display: block; font-size: .85rem; color: var(--muted); }
table.list tbody tr:hover td { background: #fafaf9; }
table.list td a.principal { color: var(--text); text-decoration: none; font-weight: 500; }
table.list td a.principal:hover { color: var(--primary); }

.vide { text-align: center; padding: 3rem 1.5rem; }
.vide h2 { margin-bottom: .4rem; }
.vide p { margin: 0 0 1.25rem; color: var(--muted); }

.fiche { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.fiche-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.fiche-head .titre .num { font-size: .9rem; display: block; margin-bottom: .2rem; }
.fiche-head h1 { margin: 0 0 .35rem; }
.fiche-head .actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.fiche-head .actions select.btn { padding: .45rem .7rem; }
.fiche h2 { font-size: 1.05rem; margin: 0 0 .75rem; }
.fiche p { margin: 0 0 .4rem; }
.fiche .client-nom { font-weight: 600; }
dl.infos { display: grid; grid-template-columns: max-content 1fr; gap: .45rem 1.25rem; margin: 0; }
dl.infos dt { color: var(--muted); font-size: .9rem; }
dl.infos dd { margin: 0; }
.bloc + .bloc { margin-top: 1rem; }
.texte-libre { white-space: pre-line; line-height: 1.5; }
.a-venir { border-style: dashed; color: var(--muted); text-align: center; padding: 1.25rem; }
.chrono { list-style: none; margin: 0; padding: 0; }
.chrono li { display: grid; grid-template-columns: 5.5rem 1fr; gap: .75rem; padding: .45rem 0; border-bottom: 1px solid var(--border); font-size: .9rem; }
.chrono li:last-child { border-bottom: 0; }
.chrono time { color: var(--muted); font-variant-numeric: tabular-nums; }

.form-chantier fieldset { border: 1px solid var(--border); border-radius: 8px; padding: 1rem 1.25rem .25rem; margin: 0 0 1.25rem; }
.form-chantier legend { font-weight: 600; padding: 0 .4rem; color: var(--muted); font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
.form-grid .large { grid-column: 1 / -1; }
.form-grid > div { margin-bottom: 0; }
form textarea, form input[type=date], form input[type=tel] { width: 100%; padding: .55rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
form textarea:focus, form input[type=date]:focus, form input[type=tel]:focus { outline: 2px solid #fcd34d; border-color: var(--primary); }
form .erreur input, form .erreur select, form div:has(> ul) > input, form div:has(> ul) > select { border-color: var(--danger); }
.client-choix { display: flex; gap: .75rem; align-items: center; }
.client-choix select { flex: 1; }
.nouveau-client { display: none; margin: .75rem 0 1rem; padding: 1rem 1rem .25rem; background: #f9fafb; border: 1px dashed #d1d5db; border-radius: 8px; }
.nouveau-client.ouvert { display: block; }
.nouveau-client > p { margin: 0 0 .75rem; }
#adresse-chantier.inactif { opacity: .55; }
form input:disabled { background: #f3f4f6; color: var(--muted); }

@media (max-width: 720px) {
  .fiche, .form-grid { grid-template-columns: 1fr; }
  .filtres input[type=search] { min-width: 0; width: 100%; }
  .client-choix { flex-direction: column; align-items: stretch; }
}

/* ---- Module 1.1 Sous-chantiers ---- */
.sous-head { display: flex; align-items: center; gap: 1rem; margin-bottom: .75rem; }
.sous-head h2 { margin: 0; flex: 1; }
.sous-head .avancement { color: var(--muted); font-size: .9rem; }
table.sous { width: 100%; border-collapse: collapse; margin-top: .75rem; }
table.sous th { text-align: left; font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); padding: .35rem .5rem; border-bottom: 1px solid var(--border); }
table.sous td { padding: .55rem .5rem; border-bottom: 1px solid var(--border); vertical-align: top; }
table.sous tr:last-child td { border-bottom: 0; }
table.sous td.ordre { color: var(--muted); font-variant-numeric: tabular-nums; width: 2rem; }
table.sous td.duree { white-space: nowrap; font-variant-numeric: tabular-nums; }
table.sous td .sous { display: block; font-size: .85rem; color: var(--muted); white-space: pre-line; }
table.sous td.actions { text-align: right; white-space: nowrap; }
table.sous td.actions form { display: inline; }
.btn-icone { padding: .2rem .45rem; font-size: .85rem; line-height: 1; }
.btn-icone:disabled { opacity: .35; cursor: default; }
.option-tag { font-size: .72rem; border: 1px solid #d1d5db; color: var(--muted); border-radius: 4px; padding: .05rem .35rem; margin-left: .35rem; vertical-align: middle; }
.statut-a-faire { background: #e5e7eb; color: #374151; }
.statut-planifie { background: #dbeafe; color: #1e40af; }
.barre { height: 6px; background: #e5e7eb; border-radius: 999px; overflow: hidden; }
.barre span { display: block; height: 100%; background: var(--success); }
.sous-vide { text-align: center; color: var(--muted); padding: 1.25rem; border: 1px dashed #d1d5db; border-radius: 8px; margin: 0; }
.sous-total { color: var(--muted); font-size: .85rem; text-align: right; padding-top: .5rem; margin: 0; }
.form-sous-chantier { max-width: 720px; }
form input[type=number] { width: 100%; padding: .55rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
form input[type=number]:focus { outline: 2px solid #fcd34d; border-color: var(--primary); }
form.suppression { max-width: 720px; margin-top: 1rem; text-align: right; }

/* ---- Module 4 Paramétrage : employés (le menu déroulant est décrit avec le bandeau, module 0.2, en fin de fichier) ---- */
.fil { color: var(--muted); font-size: .9rem; margin: 0 0 .5rem; }
.fil a { color: var(--muted); text-decoration: none; }
.fil a:hover { color: var(--primary); }
.filtres select { width: auto; }
table.list td.num { white-space: nowrap; }
.statut-en-poste { background: #dcfce7; color: #166534; }
.statut-sorti { background: #e5e7eb; color: #374151; }
.form-employe fieldset { border: 1px solid var(--border); border-radius: 8px; padding: 1rem 1.25rem .25rem; margin: 0 0 1.25rem; }
.form-employe legend { font-weight: 600; padding: 0 .4rem; color: var(--muted); font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; }
.form-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 1.25rem; }
.form-grid-3 > div { margin-bottom: 0; }
.form-grid-3 .large { grid-column: 1 / -1; }
.form-grid-3 .moyen { grid-column: span 2; }
.form-grid-3 .checkbox { margin-top: 1.9rem; margin-bottom: 1rem; }
.fiche-employe dl.infos { grid-template-columns: 11rem 1fr; }
.form-sortie { max-width: 520px; }
@media (max-width: 720px) {
  .form-grid-3 { grid-template-columns: 1fr; }
  .form-grid-3 .checkbox { margin-top: 0; }
}

/* ---- Module 4.1 Fournisseurs et interlocuteurs ---- */
.statut-actif { background: #dcfce7; color: #166534; }
.statut-inactif { background: #e5e7eb; color: #374151; }
.tag-principal { font-size: .72rem; background: #fef3c7; color: #92400e; border-radius: 4px; padding: .05rem .35rem; margin-left: .35rem; vertical-align: middle; font-weight: 500; }
.fiche-fournisseur > div { min-width: 0; }
.fiche-fournisseur dl.infos { grid-template-columns: 8.5rem 1fr; }
.fiche-fournisseur table.sous td.actions { white-space: nowrap; }
.fiche-fournisseur table.sous td.actions form { display: inline; margin-left: .25rem; }
.fiche-fournisseur table.sous tr.inactif td { color: var(--muted); }
.fiche-fournisseur .sous-total a { color: var(--primary); }
.fiche-head .actions form.inline { display: inline; margin: 0; }
.form-fournisseur, .form-interlocuteur { max-width: 900px; }
.form-fournisseur fieldset, .form-interlocuteur fieldset { border: 1px solid var(--border); border-radius: 8px; padding: 1rem 1.25rem .25rem; margin: 0 0 1.25rem; }
.form-fournisseur legend, .form-interlocuteur legend { font-weight: 600; padding: 0 .4rem; color: var(--muted); font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; }
.form-interlocuteur .checkbox { flex-wrap: wrap; }
.form-interlocuteur .checkbox .form-help { flex-basis: 100%; margin: 0 0 0 1.6rem; }

/* ---- Module 2.1 Devis ---- */
.statut-brouillon { background: #e5e7eb; color: #374151; }
.statut-envoye { background: #fef3c7; color: #92400e; }
.statut-refuse { background: #fee2e2; color: #991b1b; }
.page-head .actions-tete { display: flex; gap: .5rem; flex-wrap: wrap; }
.montant { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
table.list td.montant, table.list th.montant { text-align: right; }
table.devis { width: 100%; table-layout: fixed; border-collapse: collapse; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
table.devis th { text-align: left; font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); padding: .5rem .6rem; background: #f9fafb; border-bottom: 1px solid var(--border); }
table.devis th.ordre { width: 2.2rem; }
table.devis th.num { width: 6.5rem; }
/* Colonnes par position : uniquement l'aperçu d'import (la grille de saisie nomme ses colonnes, voir plus bas). */
table.devis:not(.grille) th:nth-child(4) { width: 5.5rem; }
table.devis:not(.grille) th:nth-child(5) { width: 5rem; }
table.devis:not(.grille) th:nth-child(6) { width: 6.3rem; }
table.devis th.montant { width: 7.5rem; }
table.devis th.col-actions { width: 9.5rem; }
table.devis td { padding: .45rem .6rem; border-bottom: 1px solid var(--border); vertical-align: top; }
table.devis tr:last-child td { border-bottom: 0; }
table.devis th.num, table.devis td.num, table.devis th.montant, table.devis td.montant { text-align: right; }
table.devis td.num { color: var(--text); font-variant-numeric: tabular-nums; white-space: nowrap; }
table.devis td.montant { font-variant-numeric: tabular-nums; white-space: nowrap; }
table.devis tr.chapitre td { background: #f3f4f6; font-weight: 600; padding-top: .6rem; padding-bottom: .6rem; }
table.devis tr.chapitre.option td { background: #fffbeb; }
table.devis tr.nota td { color: var(--muted); font-style: italic; white-space: pre-line; }
table.devis tr.sous-total td { text-align: right; color: var(--muted); font-size: .9rem; border-bottom: 2px solid var(--border); }
table.devis tr.sous-total td strong { color: var(--text); }
table.devis td.designation { white-space: pre-line; }
table.devis td.ordre { color: var(--muted); font-variant-numeric: tabular-nums; }
table.devis td.actions { text-align: right; white-space: nowrap; }
table.devis tr.chapitre td.actions { white-space: normal; }
table.devis td.actions form { display: inline; margin: 0 0 .2rem .1rem; }
table.devis input[type=text], table.devis select, table.devis textarea { width: 100%; padding: .3rem .4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; font-size: .9rem; background: #fff; font-weight: 400; }
table.devis textarea { resize: vertical; min-height: 2.6rem; }
table.devis input.num { text-align: right; font-variant-numeric: tabular-nums; }
table.devis input.champ-chapitre { font-weight: 600; }
table.devis .option-case { display: inline-flex; gap: .3rem; align-items: center; font-weight: 400; font-size: .85rem; margin-top: .3rem; }
table.devis .option-case input { width: auto; }
table.devis tr.nota textarea { font-style: italic; color: var(--muted); }
table.devis tr.en-cours td { opacity: .6; }
table.devis tr.en-erreur input, table.devis tr.en-erreur textarea, table.devis tr.en-erreur select { border-color: var(--danger); }
.pied-devis { display: grid; grid-template-columns: 1fr minmax(320px, 420px); gap: 1rem; margin-top: 1rem; align-items: start; }
.pied-devis table.totaux { width: 100%; border-collapse: collapse; }
.pied-devis table.totaux td { padding: .35rem .5rem; border-bottom: 1px solid var(--border); white-space: nowrap; }
.pied-devis table.totaux td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.pied-devis table.totaux tr.ttc td { font-weight: 700; font-size: 1.1rem; border-bottom: 0; border-top: 2px solid var(--text); }
.pied-devis .option-hors-total { color: var(--muted); font-size: .85rem; margin: .5rem 0 0; }
.verrou { background: #fef3c7; border: 1px solid #fcd34d; color: #92400e; padding: .6rem 1rem; border-radius: 8px; margin-bottom: 1rem; font-size: .95rem; }
.versions { display: flex; gap: .4rem; align-items: center; font-size: .85rem; color: var(--muted); margin-top: .4rem; flex-wrap: wrap; }
.versions a, .versions span.courante { padding: .15rem .5rem; border-radius: 999px; border: 1px solid var(--border); text-decoration: none; color: var(--muted); }
.versions span.courante { background: #1f2937; color: #fff; border-color: #1f2937; }
.fiche-head .actions form.rattacher { display: inline-flex; gap: .4rem; }
.form-devis, .form-import { max-width: 900px; }
.form-devis fieldset, .form-import fieldset { border: 1px solid var(--border); border-radius: 8px; padding: 1rem 1.25rem .25rem; margin: 0 0 1.25rem; }
.form-devis legend { font-weight: 600; padding: 0 .4rem; color: var(--muted); font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; }
.form-devis .form-grid-3 > div { margin-bottom: 1rem; }
.form-devis #adresse-travaux.inactif { opacity: .55; }
.depot { border: 2px dashed #d1d5db; border-radius: 10px; padding: 1.5rem; margin: 1rem 0; }
.depot div { margin-bottom: 0; }
.apercu-import { margin-top: 1rem; }
.apercu-import .sous-total { text-align: left; margin-top: .75rem; }
@media (max-width: 900px) { .pied-devis { grid-template-columns: 1fr; } }

/* ---- Module 2.6 Saisie du devis en grille (fiche devis en pleine largeur, bandeau compact, lignes vides) ---- */
.container.pleine-largeur { max-width: none; padding-left: 1.25rem; padding-right: 1.25rem; }
.fiche-head.compacte { margin-bottom: .5rem; }
.fiche-head.compacte h1 { display: inline; margin-right: .5rem; font-size: 1.35rem; }
.bandeau-devis { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: .55rem 1rem; margin-bottom: .75rem; font-size: .93rem; }
.bandeau-devis .ligne { display: flex; flex-wrap: wrap; gap: .25rem .5rem; align-items: center; }
.bandeau-devis .ligne + .ligne { margin-top: .25rem; padding-top: .25rem; border-top: 1px dashed var(--border); }
.bandeau-devis .sep { color: #d1d5db; }
.bandeau-devis .cle { color: var(--muted); font-size: .85rem; }
.bandeau-devis .nom-client { font-weight: 600; font-size: 1rem; }
.bandeau-devis .details-bouton { margin-left: auto; background: none; border: 0; color: var(--primary); font: inherit; font-size: .88rem; cursor: pointer; padding: 0 .25rem; }
.bandeau-devis .details-bouton:hover { text-decoration: underline; }
.bandeau-devis .details { margin-top: .5rem; padding-top: .6rem; border-top: 1px solid var(--border); display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1rem; }
.bandeau-devis .details[hidden] { display: none; }
.bandeau-devis .details h2 { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); margin: 0 0 .35rem; }
.bandeau-devis .details dl.infos { grid-template-columns: 7rem 1fr; gap: .2rem .75rem; font-size: .9rem; }
.sous-head.compacte { margin-bottom: .3rem; flex-wrap: wrap; }
.sous-head.compacte h2 { font-size: 1rem; }
.sous-head .aide { color: var(--muted); font-size: .85rem; margin-left: auto; }
.sous-head .aide kbd { font: inherit; font-size: .8rem; border: 1px solid #d1d5db; border-bottom-width: 2px; border-radius: 4px; padding: 0 .3rem; background: #f9fafb; }
.etat-saisie { font-size: .85rem; color: var(--muted); margin: 0 0 .4rem; text-align: right; min-height: 1.2em; }
.etat-saisie.etat-ok { color: var(--success); }
.etat-saisie.etat-erreur { text-align: left; background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; padding: .45rem .75rem; border-radius: 6px; font-weight: 500; }
/* La grille : champs sans cadre au repos (cadre au survol et au clic), une hauteur de ligne, boutons au survol. */
table.devis.grille { font-size: .9rem; }
table.devis.grille th { font-size: .74rem; padding: .35rem .45rem; }
table.devis.grille th.ordre { width: 2.6rem; }
table.devis.grille th.type { width: 6rem; }
table.devis.grille th.num { width: 6rem; }
table.devis.grille th.unite { width: 5rem; }
table.devis.grille th.tva { width: 5.5rem; }
table.devis.grille th.montant { width: 7.5rem; }
table.devis.grille th.col-actions { width: 5.2rem; }
table.devis.grille td { padding: .15rem .3rem; border-bottom: 1px solid #eef0f2; vertical-align: middle; }
table.devis.grille td.ordre { font-size: .82rem; text-align: right; padding-right: .5rem; white-space: nowrap; }
table.devis.grille input[type=text], table.devis.grille select, table.devis.grille textarea { padding: .22rem .35rem; border-color: transparent; background: transparent; line-height: 1.3; }
table.devis.grille textarea { resize: none; overflow: hidden; display: block; min-height: 0; }
table.devis.grille input[type=text]:hover, table.devis.grille select:hover, table.devis.grille textarea:hover { border-color: #e5e7eb; background: #fff; }
table.devis.grille input[type=text]:focus, table.devis.grille select:focus, table.devis.grille textarea:focus { outline: 2px solid #fcd34d; border-color: var(--primary); background: #fff; }
table.devis.grille select { -webkit-appearance: none; appearance: none; padding-right: 1.1rem; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239ca3af'/%3E%3C/svg%3E") no-repeat right .35rem center; }
table.devis.grille td.type select { color: var(--muted); font-size: .82rem; }
table.devis.grille tr.chapitre td { font-weight: 400; padding-top: .2rem; padding-bottom: .2rem; border-top: 1px solid var(--border); }
table.devis.grille tr.chapitre td.type { font-size: .82rem; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .02em; padding-left: .6rem; }
table.devis.grille tr.chapitre .titre-option { display: flex; align-items: center; gap: .5rem; }
table.devis.grille tr.chapitre .option-case { margin-top: 0; font-size: .8rem; color: var(--muted); white-space: nowrap; }
table.devis.grille tr.chapitre td.montant { font-weight: 600; }
table.devis.grille tr.nota td { white-space: normal; }
table.devis.grille tr.nota td.type, table.devis.grille tr.lecture td.type { color: var(--muted); font-size: .82rem; font-style: normal; }
table.devis.grille tr.vide td { background: #fcfcfd; }
table.devis.grille tr.vide textarea::placeholder { color: #c4c8cf; font-style: italic; }
table.devis.grille tr.vide.futur-chapitre td { background: #f3f4f6; }
table.devis.grille tr.vide.futur-chapitre .si-ligne { visibility: hidden; }
table.devis.grille tr.vide.futur-chapitre textarea { font-weight: 600; }
table.devis.grille tr.sous-total td { font-size: .85rem; padding: .3rem .45rem; background: #fafafa; }
table.devis.grille td.actions .btn-icone { visibility: hidden; padding: .1rem .35rem; font-size: .8rem; border-color: transparent; background: transparent; color: var(--muted); }
table.devis.grille tr:hover td.actions .btn-icone, table.devis.grille tr:focus-within td.actions .btn-icone { visibility: visible; }
table.devis.grille td.actions .btn-icone:hover { border-color: var(--border); background: #fff; color: var(--text); }
table.devis.grille td.actions .btn-icone.btn-danger:hover { color: var(--danger); }
table.devis.grille tr.en-erreur td { background: #fef2f2; }
table.devis.grille tr.en-erreur input[type=text], table.devis.grille tr.en-erreur textarea { background: #fff; }
table.devis.grille tr.nouvelle td { background: #ecfdf5; transition: background .8s; }
table.devis.grille tr.lecture td { padding: .3rem .45rem; }
table.devis.grille tr.lecture td.designation { white-space: pre-line; }
.pied-devis.compact { margin-top: .75rem; }
.pied-devis.compact .card { padding: .75rem 1rem; }
.pied-devis.compact table.totaux td { padding: .25rem .5rem; }
@media (max-width: 900px) { .bandeau-devis .details { grid-template-columns: 1fr; } .bandeau-devis .details-bouton { margin-left: 0; } .sous-head .aide { margin-left: 0; } }

/* ---- Module 2.2 Devis avec WebODM, écran Clients ---- */
.choix-devis { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; max-width: 900px; }
.choix-devis .card { display: flex; flex-direction: column; gap: .6rem; }
.choix-devis h2 { margin: 0; font-size: 1.15rem; }
.choix-devis p { margin: 0; color: var(--muted); }
.choix-devis ol { margin: 0; padding-left: 1.2rem; color: var(--muted); font-size: .92rem; line-height: 1.5; }
.choix-devis .btn { align-self: flex-start; margin-top: auto; }
.origine-webodm { display: inline-flex; align-items: center; gap: .4rem; font-size: .8rem; background: #e0f2f1; color: #0f5f55; border-radius: 999px; padding: .15rem .6rem; vertical-align: middle; }
.origine-webodm a { color: #0f5f55; }
.form-client { max-width: 720px; }
@media (max-width: 720px) { .choix-devis { grid-template-columns: 1fr; } }

/* ---- Module 2.7 : fiche client (civilité, prénom) et adresse assistée ---- */
.form-client { max-width: 760px; }
.form-client .form-grid-3 > div { margin-bottom: 1rem; }
/* Liste de propositions d'adresse (public/js/adresse-assistee.js), ancrée sous le champ Rue ou Ville */
.zone-adresse { position: relative; display: block; }
.propositions { position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 20; color: var(--text); background: var(--surface); border: 1px solid #d1d5db; border-radius: 6px; box-shadow: 0 8px 24px rgba(17, 24, 39, .12); list-style: none; margin: 0; padding: .25rem 0; font-size: 1rem; }
.propositions li { padding: .45rem .75rem; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; }
.propositions li + li { border-top: 1px solid #f3f4f6; }
.propositions li:hover, .propositions li.active { background: #fef3c7; }
.propositions li .voie { font-weight: 500; }
.propositions li .commune { color: var(--muted); font-size: .9rem; white-space: nowrap; }
.propositions li.pied { color: var(--muted); font-size: .8rem; cursor: default; justify-content: flex-start; }
.propositions li.pied:hover { background: transparent; }
.adresse-indispo { display: block; font-size: .85rem; color: var(--muted); margin-top: .3rem; }

/* ---- Module 2.8 : produit relié à une ligne de devis (vignette, lien fiche technique, fenêtres) ---- */
table.devis.grille th.col-actions { width: 6.6rem; }
table.devis.grille td.actions .btn-icone.produit { font-size: .95rem; }
table.devis.grille td.actions .btn-icone.produit.actif { visibility: visible; color: var(--primary); }
table.devis.grille td.designation .avec-produit { display: flex; align-items: flex-start; gap: .4rem; }
table.devis.grille td.designation .avec-produit textarea, table.devis.grille td.designation .avec-produit .texte { flex: 1; min-width: 0; }
table.devis.grille tr.lecture td.designation .avec-produit { align-items: center; }
table.devis.grille tr.lecture td.designation .avec-produit .texte { white-space: pre-line; }
.vignette { flex: none; width: 32px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 4px; background: #fff; overflow: hidden; cursor: zoom-in; margin-top: 1px; }
.vignette img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vignette:hover, .vignette:focus-visible { border-color: var(--primary); outline: 2px solid #fcd34d; }
.fiche-lien { flex: none; display: inline-flex; align-items: center; gap: .2rem; font-size: .78rem; color: var(--primary); text-decoration: none; white-space: nowrap; margin-top: .4rem; padding: 0 .3rem; border-radius: 4px; }
table.devis.grille tr.lecture .fiche-lien { margin-top: 0; }
.fiche-lien:hover { background: #fef3c7; text-decoration: underline; }
.fiche-lien svg { width: 13px; height: 13px; }

dialog.dialogue { border: 0; border-radius: 10px; padding: 0; max-width: min(560px, calc(100vw - 2rem)); width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.35); color: var(--text); }
dialog.dialogue::backdrop { background: rgba(17,24,39,.55); }
dialog.dialogue [hidden] { display: none !important; }   /* l'attribut hidden l'emporte sur .btn, .sans-photo… */
dialog.dialogue h2 { margin: 0 0 .2rem; font-size: 1.1rem; }
dialog.dialogue .form-actions { display: flex; gap: .5rem; justify-content: flex-end; align-items: center; flex-wrap: wrap; margin-top: 1.25rem; }
dialog.zoom-produit .zoom-photo { width: 100%; max-height: 380px; object-fit: contain; background: #f9fafb; display: block; }
dialog.zoom-produit .corps { padding: 1rem 1.25rem 1.25rem; }
dialog.zoom-produit .fournisseur { margin: 0 0 .5rem; font-size: .9rem; }
dialog.zoom-produit .form-actions > .petit { flex-basis: 100%; }
dialog.edition-produit form { padding: 1.25rem 1.5rem; }
dialog.edition-produit .ligne-cible { margin: 0 0 1rem; font-size: .9rem; }
dialog.edition-produit .photo-actuelle { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; }
dialog.edition-produit .photo-courante, dialog.edition-produit .sans-photo { flex: none; width: 96px; height: 96px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); background: #f9fafb; }
dialog.edition-produit .sans-photo { display: flex; align-items: center; justify-content: center; color: var(--muted); font-size: .8rem; text-align: center; padding: .5rem; }
dialog.edition-produit .legende { display: flex; flex-direction: column; gap: .15rem; }
dialog.edition-produit .legende .nom:empty, dialog.edition-produit .legende .fournisseur:empty { display: none; }
dialog.edition-produit label { display: block; font-weight: 500; margin-bottom: .3rem; }
dialog.edition-produit form > div { margin-bottom: 1rem; }
dialog.edition-produit input[type=file] { font: inherit; font-size: .9rem; max-width: 100%; }
dialog.edition-produit input[type=url] { width: 100%; padding: .55rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
dialog.edition-produit input[type=url]:focus { outline: 2px solid #fcd34d; border-color: var(--primary); }
dialog.edition-produit .erreur input { border-color: var(--danger); }
dialog.edition-produit ul.erreurs { margin: .3rem 0 0; padding-left: 1.2rem; color: var(--danger); font-size: .9rem; }
dialog.edition-produit .form-actions .btn-danger { margin-right: auto; }

/* ---- Module 2.9 : styles de ligne. Le style se choisit dans la liste « Type » (Ligne, Nota, puis les 5 styles, chacun
   dans sa police) ; la classe style-… sur la ligne porte la mise en forme (voir App\Enum\StyleLigneDevis). ---- */
table.devis.grille th.type { width: 9rem; }
/* Une ligne stylée quitte le gris italique par défaut des notas ; la règle du style, plus bas, prend le dessus. */
table.devis.grille tr[class*="style-"] td.designation, table.devis.grille tr[class*="style-"] td.designation textarea { color: var(--text); font-style: normal; }
option.style-attention, table.devis.grille tr.style-attention td.designation, table.devis.grille tr.style-attention td.designation textarea, table.devis.grille tr.style-attention td.type select { color: #1d4ed8; font-style: italic; }
option.style-securite, table.devis.grille tr.style-securite td.designation, table.devis.grille tr.style-securite td.designation textarea, table.devis.grille tr.style-securite td.type select { color: #b91c1c; font-weight: 600; }
option.style-important, table.devis.grille tr.style-important td.designation, table.devis.grille tr.style-important td.designation textarea, table.devis.grille tr.style-important td.type select { color: var(--text); font-weight: 700; }
option.style-remarque, table.devis.grille tr.style-remarque td.designation, table.devis.grille tr.style-remarque td.designation textarea, table.devis.grille tr.style-remarque td.type select { color: var(--muted); font-style: italic; }
option.style-mise-en-avant, table.devis.grille tr.style-mise-en-avant td.designation, table.devis.grille tr.style-mise-en-avant td.type select { background-color: #fef9c3; color: #713f12; }
table.devis.grille tr.style-mise-en-avant td.designation textarea { color: #713f12; }
table.devis.grille tr.style-mise-en-avant td.designation textarea:hover, table.devis.grille tr.style-mise-en-avant td.designation textarea:focus { background: #fff; }

/* ---- Module 2.10 : bons d'intervention (pastille « Validé »), origine des sous-chantiers, fenêtre de confirmation ---- */
.statut-valide { background: #dbeafe; color: #1e40af; }
.origine { font-size: .72rem; border: 1px solid #d1d5db; color: var(--muted); border-radius: 4px; padding: .05rem .35rem; margin-left: .35rem; vertical-align: middle; white-space: nowrap; }
.origine a { color: var(--muted); text-decoration: none; }
.origine a:hover { color: var(--primary); }
.fiche-head .actions form.inline[data-confirmation] { margin-left: .5rem; }
dialog.confirmation { border: 0; border-radius: 10px; padding: 1.25rem 1.5rem; max-width: 460px; width: calc(100% - 2rem); box-shadow: 0 20px 60px rgba(0,0,0,.35); }
dialog.confirmation::backdrop { background: rgba(17,24,39,.55); }
dialog.confirmation h2 { margin: 0 0 .5rem; font-size: 1.1rem; }
dialog.confirmation p { margin: 0 0 1rem; color: var(--muted); }
dialog.confirmation .form-actions { display: flex; gap: .5rem; justify-content: flex-end; margin: 0; }
.btn-danger-plein { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn-danger-plein:hover { background: #991b1b; }

/* ---- Module 0.2 : bandeau par familles — remplacé par le menu latéral (module 0.8, en fin de fichier) ---- */

/* ---- Module 5.1 : articles (liste, fiche, formulaire, familles) ---- */
table.list td.vignette-cell { width: 44px; padding-right: 0; }
.vignette-art { width: 36px; height: 36px; border-radius: 4px; border: 1px solid var(--border); background: #f3f4f6; display: inline-flex; align-items: center; justify-content: center; color: #9ca3af; font-size: .7rem; overflow: hidden; }
.vignette-art img { width: 100%; height: 100%; object-fit: cover; display: block; }
table.list td.code, .code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .85rem; color: var(--muted); white-space: nowrap; }
table.list tr.inactif td { color: var(--muted); }
.coef-force { font-size: .7rem; background: #fef3c7; color: #92400e; border-radius: 4px; padding: .05rem .35rem; margin-left: .3rem; vertical-align: middle; white-space: nowrap; }
.fiche-article .photo-grande { width: 100%; max-width: 280px; border-radius: 8px; border: 1px solid var(--border); background: #f9fafb; display: block; }
.prix-apercu { background: #f9fafb; border: 1px dashed #d1d5db; border-radius: 8px; padding: .75rem 1rem; display: flex; gap: 2rem; align-items: baseline; flex-wrap: wrap; margin-bottom: 1rem; }
.prix-apercu strong { font-size: 1.25rem; }
.form-article .photo-courante { display: flex; align-items: center; gap: 1rem; margin: -.5rem 0 1rem; }
.form-article .photo-courante img { width: 96px; height: 96px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); }
.form-article .photo-courante label { margin: 0; font-weight: 400; }
.familles-articles table.sous form.ligne-famille { display: inline; }
.familles-articles table.sous input.num { width: 5rem; text-align: right; padding: .3rem .4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; }
.familles-articles table.sous input.texte { width: 100%; padding: .3rem .4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; }
.familles-articles table.sous tr.inactif td { color: var(--muted); }
.familles-articles table.sous td.actions form.inline { display: inline; }
.form-inline-ajout { display: flex; gap: .5rem; align-items: center; margin-top: .75rem; flex-wrap: wrap; }
.form-inline-ajout input { padding: .45rem .6rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; }

/* ---- Module 0.3 : profils utilisateurs (pastilles, cartes de choix) ---- */
.badge.profil-super-admin { background: #fef3c7; color: #92400e; }
.badge.profil-admin { background: #fde68a; color: #78350f; }
.badge.profil-bureau { background: #dbeafe; color: #1e40af; }
.badge.profil-chef-chantier { background: #dcfce7; color: #166534; }
.badge.profil-technicien { background: #e5e7eb; color: #374151; }
.profils { display: grid; gap: .5rem; margin: 0 0 1rem; }
.profils label.profil { display: grid; grid-template-columns: auto 1fr; gap: .25rem .75rem; align-items: start; padding: .6rem .8rem; border: 1px solid var(--border); border-radius: 8px; cursor: pointer; font-weight: 400; margin: 0; }
.profils label.profil.choisi { border-color: var(--primary); background: #fffbeb; }
.profils label.profil input { margin: .25rem 0 0; width: auto; }
.profils label.profil strong { display: block; }
.profils label.profil span.desc { color: var(--muted); font-size: .88rem; grid-column: 2; }
.profils div { margin: 0; }

/* ---- Module 5.1.1 : fournisseurs multiples, historique des prix, fenêtres de la fiche article ---- */
.etoile { color: #b45309; font-size: 1rem; margin-right: .2rem; }
.tag-principal { font-size: .72rem; background: #fef3c7; color: #92400e; border-radius: 4px; padding: .05rem .35rem; margin-left: .35rem; vertical-align: middle; font-weight: 500; }
.fiche-article .identite dl.infos { grid-template-columns: 9rem 1fr; }
.ean { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .05em; }
.tendance-hausse { color: var(--danger); font-size: .8rem; margin-left: .3rem; white-space: nowrap; }
.tendance-baisse { color: var(--success); font-size: .8rem; margin-left: .3rem; white-space: nowrap; }
.fiche-article .bloc .sous-head { margin-bottom: .5rem; }
.fiche-article .bloc .sous-head h2 { margin: 0; flex: 1; }
.fiche-article table.sous td.num, .fiche-article table.sous td.duree { white-space: nowrap; }
.fiche-article table.sous td.actions form.inline { display: inline; }
.fiche-article table.sous td .sous a { color: var(--muted); }
dialog.fenetre-article { max-width: min(560px, calc(100vw - 2rem)); }
dialog.fenetre-article form { padding: 1.25rem 1.5rem; }
dialog.fenetre-article .ligne-cible { color: var(--muted); font-size: .9rem; margin: 0 0 1rem; }
dialog.fenetre-article .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
dialog.fenetre-article .form-grid > div { margin-bottom: .9rem; }
dialog.fenetre-article .form-grid .large { grid-column: 1 / -1; }
dialog.fenetre-article label { display: block; font-weight: 500; margin-bottom: .3rem; }
dialog.fenetre-article input[type=text], dialog.fenetre-article input[type=date], dialog.fenetre-article select { width: 100%; padding: .5rem .65rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
dialog.fenetre-article .checkbox { display: flex; align-items: flex-start; gap: .5rem; }
dialog.fenetre-article .checkbox input { width: auto; margin-top: .25rem; }
dialog.fenetre-article .checkbox label { margin: 0; font-weight: 400; }
dialog.fenetre-article .form-actions { margin-top: .5rem; }
.fiche-article > div { min-width: 0; }
.fiche-article table.sous td .sous a { word-break: break-all; }

/* ---- Module 0.4 : grille des droits, page « accès refusé », affectation des profils dans la liste ---- */
table.droits { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
table.droits th, table.droits td { padding: .55rem .7rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; }
table.droits th { background: #f9fafb; font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); }
table.droits th.profil { text-align: center; }
table.droits td.module { font-weight: 500; }
table.droits td.module .sous { display: block; font-size: .8rem; color: var(--muted); font-weight: 400; }
table.droits td.niveau { text-align: center; }
table.droits select { padding: .35rem .5rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; font-size: .9rem; min-width: 8.5rem; }
table.droits select.n-aucun, .legende-niveaux .n-aucun { background: #fee2e2; color: #991b1b; }
table.droits select.n-lecture, .legende-niveaux .n-lecture { background: #e5e7eb; color: #374151; }
table.droits select.n-ecriture, .legende-niveaux .n-ecriture { background: #dbeafe; color: #1e40af; }
table.droits select.n-gestion, .legende-niveaux .n-gestion { background: #dcfce7; color: #166534; }
table.droits td.fixe { text-align: center; color: var(--muted); font-size: .85rem; }
.legende-niveaux { display: flex; gap: .75rem; flex-wrap: wrap; margin: .75rem 0 1rem; font-size: .9rem; }
.legende-niveaux span { padding: .15rem .6rem; border-radius: 999px; }
.refus { text-align: center; padding: 3rem 1.5rem; }
.refus h1 { font-size: 1.4rem; margin: 0 0 .5rem; }
table.list form.affectation { display: inline; }
table.list select.profil-select { padding: .3rem .5rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; font-size: .9rem; }
.verrou-lecture { background: #fef3c7; border: 1px solid #fcd34d; color: #92400e; padding: .6rem 1rem; border-radius: 8px; margin-bottom: 1rem; font-size: .95rem; }

/* ---- Module 5.1.2 : import d'articles (modèle, dépôt, aperçu, compte rendu) ---- */
.modele { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; margin-bottom: 1rem; }
.modele .card h2, .compte-rendu h2 { margin-top: 0; font-size: 1.05rem; }
.colonnes { margin: .5rem 0 0; padding-left: 1.2rem; columns: 2; font-size: .9rem; color: var(--muted); }
.colonnes li strong { color: var(--text); }
.depot.erreur { border-color: var(--danger); }
.depot input[type=file] { margin-top: .75rem; }
.bilan { display: flex; gap: .75rem; flex-wrap: wrap; margin: 0 0 1rem; }
.bilan span { padding: .25rem .7rem; border-radius: 999px; font-weight: 500; }
.bilan .nouveau, table.apercu .statut-nouveau { background: #dcfce7; color: #166534; }
.bilan .maj, table.apercu .statut-maj { background: #dbeafe; color: #1e40af; }
.bilan .erreur, table.apercu .statut-erreur { background: #fee2e2; color: #991b1b; }
.bilan .ignore, table.apercu .statut-rien { background: #e5e7eb; color: #374151; }
table.apercu td.etat { white-space: nowrap; }
table.apercu tr.erreur td { background: #fff7f7; }
table.apercu td .detail { display: block; font-size: .82rem; color: var(--muted); }
table.apercu td .detail.rouge { color: var(--danger); }
table.apercu td .detail.orange { color: #92400e; }
@media (max-width: 900px) { .modele { grid-template-columns: 1fr; } .colonnes { columns: 1; } }

/* ---- Module 5.2 : ouvrages (synthèse, composition) et Paramétrage › Entreprise ---- */
table.composition th.num, table.composition td.num { text-align: right; white-space: nowrap; }
table.composition tr.section td { background: #f3f4f6; font-weight: 600; font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); }
table.composition tr.total td { font-weight: 600; border-top: 2px solid var(--border); }
table.composition td .code { display: block; font-size: .78rem; }
table.composition input.num { width: 6rem; text-align: right; padding: .3rem .4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; }
table.composition input.texte { width: 100%; padding: .3rem .4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; }
table.composition tr.vide td { background: #fcfcfd; }
table.composition tr.vide input::placeholder { color: #c4c8cf; font-style: italic; }
table.composition td div { margin: 0; }
table.composition ul { margin: .2rem 0 0; padding-left: 1rem; color: var(--danger); font-size: .85rem; }
.synthese { display: grid; grid-template-columns: repeat(5, 1fr); gap: .75rem; margin: 0 0 1rem; }
.synthese .bloc-chiffre { background: #f9fafb; border: 1px solid var(--border); border-radius: 8px; padding: .6rem .8rem; }
.synthese .bloc-chiffre span { display: block; font-size: .78rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.synthese .bloc-chiffre strong { font-size: 1.15rem; }
.synthese .bloc-chiffre.vente { background: #fffbeb; border-color: #fcd34d; }
.synthese .bloc-chiffre.vente strong { font-size: 1.35rem; color: #92400e; }
.alerte-inactif { background: #fef3c7; border: 1px solid #fcd34d; color: #92400e; padding: .5rem .8rem; border-radius: 8px; font-size: .9rem; margin: 0 0 .75rem; }
.unite-oeuvre { font-size: .85rem; color: var(--muted); }
.form-ouvrage { max-width: 1000px; }
.form-entreprise { max-width: 820px; }
@media (max-width: 900px) { .synthese { grid-template-columns: 1fr 1fr; } }

/* ---- Module 2.11 : contrats de maintenance (situations, statuts, synthèse, échéancier, pastille de visite sur un bon) ---- */
.situations { display: inline-flex; gap: .3rem; flex-wrap: wrap; vertical-align: middle; }
.situation { font-size: .72rem; padding: .1rem .5rem; border-radius: 999px; white-space: nowrap; font-weight: 500; }
.situation-intervenir { background: #ffedd5; color: #9a3412; }
.situation-facturer { background: #dbeafe; color: #1e40af; }
.situation-relancer { background: #fee2e2; color: #991b1b; }
.situation-renouveler { background: #fef3c7; color: #92400e; }
.statut-actif-contrat { background: #dcfce7; color: #166534; }
.statut-resilie { background: #fee2e2; color: #991b1b; }
table.echeancier td.coche { white-space: nowrap; }
table.echeancier td.coche label.checkbox { display: inline-flex; gap: .4rem; align-items: center; margin: 0; }
table.echeancier td.coche input.texte { padding: .2rem .4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; font-size: .85rem; }
table.echeancier tr.passee td { background: #fff7ed; }
table.echeancier tr.faite td { color: var(--muted); }
.contrat-synthese { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin: 0 0 1rem; }
.contrat-synthese .bloc-chiffre { background: #f9fafb; border: 1px solid var(--border); border-radius: 8px; padding: .6rem .8rem; }
.contrat-synthese .bloc-chiffre span { display: block; font-size: .78rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.contrat-synthese .bloc-chiffre strong { font-size: 1.1rem; }
.visite-contrat { display: inline-flex; align-items: center; gap: .4rem; font-size: .8rem; background: #ecfeff; color: #155e75; border-radius: 999px; padding: .15rem .6rem; vertical-align: middle; }
.visite-contrat a { color: inherit; font-weight: 600; }
.form-contrat #date-fin:disabled { background: #f3f4f6; color: var(--muted); }
@media (max-width: 900px) { .contrat-synthese { grid-template-columns: 1fr 1fr; } }
.btn[hidden] { display: none; } /* `.btn` fixe display : sans cette règle, hidden n'aurait pas d'effet (bouton « OK » des échéances) */

/* ---- Module 6.1 : planning intégré (grille reprise du planning DUF, panneau « À planifier », fiche de phase) ---- */
.page-planning { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1rem; align-items: start; }
.outils-planning { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding: .6rem .9rem; border-bottom: 1px solid var(--border); }
.outils-planning .periode { font-weight: 600; margin: 0 .5rem; }
.outils-planning select { padding: .4rem .6rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
.outils-planning .pousse { margin-left: auto; }
.bilan-ecart { font-size: .75rem; font-weight: 700; padding: .15rem .5rem; border-radius: 4px; cursor: help; white-space: nowrap; }
.bilan-ecart.manque { background: #fee2e2; color: #991b1b; }
.bilan-ecart.rab, .bilan-ecart.juste { background: #f3f4f6; color: #374151; }
.card.planning-carte { padding: 0; overflow: hidden; }
.planning { overflow: auto; max-height: calc(100svh - 260px); min-height: 220px; }
.grille { min-width: 780px; }
.ligne-semaines, .ligne-jours { display: grid; grid-template-columns: var(--colonnes); position: sticky; background: #fff; z-index: 10; }
.ligne-semaines { top: 0; z-index: 16; }
.ligne-jours { top: var(--h-semaines, 23px); z-index: 16; border-bottom: 1px solid var(--border); }
.rangee { display: grid; grid-template-columns: var(--colonnes); border-bottom: 1px solid var(--border); }
.rangee:last-child { border-bottom: 0; }
.coin { position: sticky; left: 0; z-index: 20; background: #f9fafb; border-bottom: 1px solid var(--border); }
.rangee-tete { position: sticky; left: 0; z-index: 8; padding: .6rem .8rem; display: flex; align-items: center; gap: .5rem; font-weight: 600; font-size: .9rem; background: #fafaf9; }
.rangee-tete small { color: var(--muted); font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pastille { display: inline-block; vertical-align: -1px; width: 10px; height: 10px; border-radius: 3px; flex: none; }
.semaine { grid-column: span 5; text-align: center; font-size: .75rem; color: var(--muted); padding: .2rem .25rem; border-left: 2px solid #d1d5db; white-space: nowrap; overflow: hidden; }
.semaine.courante { color: var(--primary); font-weight: 600; }
.jour { text-align: center; font-size: .72rem; color: var(--muted); padding: .3rem .1rem .4rem; border-left: 1px solid var(--border); background: #f9fafb; }
.jour b { display: block; font-size: .85rem; color: var(--text); font-weight: 600; }
.jour.lundi, .colonne.lundi { border-left: 2px solid #d1d5db; }
.jour.aujourdhui, .jour.aujourdhui b { color: var(--primary); }
.jour.ferie, .jour.ferie b { color: var(--danger); }
.piste { position: relative; display: grid; row-gap: 3px; column-gap: 0; padding: 4px 0; }
.colonne { grid-row: 1 / -1; border-left: 1px solid var(--border); cursor: copy; }
.colonne.aujourdhui { background: #fff7ed; }
.colonne:hover { background: #fef3c7; }
.colonne.cible { background: #fde68a; box-shadow: inset 0 0 0 1px var(--primary); }
.colonne.ferie { position: relative; cursor: not-allowed; background: none; }
/* Les hachures du férié passent devant les barres ; pointer-events: none laisse cliquer et glisser la barre dessous. */
.colonne.ferie::before { content: ''; position: absolute; inset: 0; z-index: 4; pointer-events: none; background: repeating-linear-gradient(45deg, transparent 0 5px, #fee2e2 5px 10px); }
/* Barres du planning (module 6.1) — limitées à #planning-app depuis le module 0.9 : elles écrasaient la barre d'avancement des sous-chantiers. */
#planning-app .barre { position: relative; z-index: 2; height: 100%; min-height: 40px; margin: 0 2px; padding: 3px 7px; border-radius: 5px; border: 0; font-family: inherit; font-size: .8rem; line-height: 1.25; cursor: grab; overflow: hidden; color: #fff; border-left: 3px solid rgba(0,0,0,.3); text-align: left; display: flex; flex-direction: column; justify-content: center; touch-action: pan-x pan-y; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
#planning-app .barre:hover { filter: brightness(1.08); }
#planning-app .barre.glisse { opacity: .4; }
#planning-app .barre.bon { border-left-color: #fff; outline: 2px dashed rgba(255,255,255,.75); outline-offset: -3px; }
#planning-app .barre.verrou { cursor: not-allowed; outline: 2px solid var(--danger); outline-offset: -2px; border-left-color: var(--danger); }
#planning-app .barre b { display: block; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#planning-app .barre small { opacity: .88; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
#planning-app .barre.termine { opacity: .55; }
#planning-app .barre.annule { opacity: .45; text-decoration: line-through; }
.barre .poignee { position: absolute; top: 0; bottom: 0; width: 8px; cursor: ew-resize; opacity: 0; }
.barre .poignee.gauche { left: 0; }
.barre .poignee.droite { right: 0; }
.barre:hover .poignee { opacity: 1; background: rgba(0,0,0,.28); }
.barre.redim { outline: 2px solid var(--primary); outline-offset: -2px; }
.barre.redim .poignee { opacity: 1; background: var(--primary); }
.barre.fantome { opacity: .55; outline: 2px dashed #fff; outline-offset: -2px; pointer-events: none; }
#planning.geste, #planning.geste .barre, #planning.geste .colonne { cursor: grabbing; }
#planning.geste .colonne:hover { background: transparent; }
#planning.geste .colonne.cible { background: #fde68a; }
#planning.deplacement .barre, #planning.deplacement .renfort { pointer-events: none; }
#planning.deplacement .colonne { cursor: move; }
.ecart { font-style: normal; font-size: .7rem; font-weight: 700; white-space: nowrap; align-self: center; justify-self: end; padding: 1px 5px; border-radius: 4px; margin: 0 14px 0 4px; z-index: 3; pointer-events: none; }
.ecart.manque { background: #fee2e2; color: #991b1b; }
.ecart.rab { background: #f3f4f6; color: #374151; }
.ecart[draggable] { pointer-events: auto; cursor: grab; border: 1px dashed #f87171; }
.ecart[draggable].glisse { opacity: .4; }
.rangee-renforts .rangee-tete { background: transparent; font-weight: 500; color: var(--muted); font-size: .8rem; }
.renfort { z-index: 2; margin: 0 2px; padding: 2px 6px; border-radius: 4px; font-size: .72rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.renfort.orphelin { border: 1px dashed var(--danger); color: var(--danger); }
.vide-planning { padding: 2rem 1rem; text-align: center; color: var(--muted); }
.legende-planning { padding: .4rem .9rem; font-size: .8rem; color: var(--muted); border-top: 1px solid var(--border); }
.legende-planning > summary { cursor: pointer; width: fit-content; font-weight: 600; user-select: none; }
.legende-planning > summary:hover { color: var(--text); }
.legende-planning .legende-contenu { display: flex; gap: .4rem 1.5rem; flex-wrap: wrap; padding-top: .4rem; }
.legende-planning .puce-bon { display: inline-block; width: 22px; height: 12px; border-radius: 3px; background: #0891b2; outline: 2px dashed rgba(255,255,255,.75); outline-offset: -3px; vertical-align: -2px; }
/* Panneau « À planifier » : cible de dépôt pour retirer une barre */
.a-planifier .card { padding: 0; overflow: hidden; }
.a-planifier h2 { font-size: .95rem; margin: 0; padding: .6rem .9rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: .5rem; }
.a-planifier h2 .compte { margin-left: auto; font-size: .75rem; font-weight: 500; color: var(--muted); text-align: right; }
.a-planifier .fiches { padding: .6rem; display: flex; flex-direction: column; gap: .5rem; max-height: 480px; overflow: auto; }
.fiche-planif { border: 1px solid var(--border); border-left: 4px solid #6b7280; border-radius: 6px; padding: .45rem .6rem; background: #fff; font-size: .85rem; }
.fiche-planif[draggable] { cursor: grab; }
.fiche-planif[draggable]:hover { border-color: var(--primary); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.fiche-planif.glisse { opacity: .4; }
.fiche-planif b { display: block; }
.fiche-planif .meta { color: var(--muted); font-size: .78rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.fiche-planif.bon { border-left-color: #0891b2; }
.fiche-planif.chantier { border-left-color: #b45309; }
.fiche-planif .num { font-family: ui-monospace, monospace; font-size: .75rem; color: var(--muted); }
.fiche-planif .retard { color: var(--danger); font-weight: 600; }
.a-planifier .vide-panneau { padding: 1rem; color: var(--muted); font-size: .85rem; text-align: center; }
.a-planifier .aide { padding: .5rem .9rem; font-size: .78rem; color: var(--muted); border-top: 1px dashed var(--border); margin: 0; }
.a-planifier.attend .card:first-child { border-style: dashed; border-color: var(--primary); }
.a-planifier.attend .card:first-child h2::after { content: 'Dépose ici pour retirer du planning'; font-size: .72rem; font-weight: 500; color: var(--primary); margin-left: auto; }
.a-planifier.attend .card:first-child h2 .compte { display: none; }
.a-planifier.cible .card:first-child { box-shadow: inset 0 0 0 2px var(--primary); background: #fffbeb; }
/* Fiche d'une phase et avis */
.modale-planning { border: 1px solid var(--border); border-radius: 10px; padding: 0; width: min(560px, 94vw); }
.modale-planning::backdrop { background: rgba(17, 24, 39, .45); }
.modale-planning header { padding: .9rem 1.25rem; border-bottom: 1px solid var(--border); }
.modale-planning header h2 { margin: 0; font-size: 1.05rem; }
.modale-planning .corps { padding: 1rem 1.25rem 0; }
.modale-planning footer { padding: .75rem 1.25rem 1rem; margin: 0; }
.modale-planning .grille2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.modale-planning .champ { margin-bottom: .9rem; }
.modale-planning input:disabled, .modale-planning select:disabled { background: #f3f4f6; color: var(--muted); }
.modale-planning .message, #avis .message { padding: .6rem .9rem; border-radius: 8px; border: 1px solid; font-size: .9rem; }
.modale-planning .message.err, #avis .message.err { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.modale-planning .message.ok, #avis .message.ok { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
#avis { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 200; max-width: 520px; }
#avis .message { box-shadow: 0 6px 20px rgba(0,0,0,.15); }
#avis .lien { background: none; border: 0; color: inherit; text-decoration: underline; cursor: pointer; font: inherit; padding: 0; margin-left: .4rem; }
#infobulle { position: fixed; z-index: 150; max-width: 320px; background: #1f2937; color: #f9fafb; font-size: .8rem; line-height: 1.4; padding: .5rem .7rem; border-radius: 6px; box-shadow: 0 6px 20px rgba(0,0,0,.25); pointer-events: none; }
#infobulle .mini { opacity: .8; }
/* Fiche chantier : bloc Planning ; Paramétrage › Équipes */
.chantier-planning-bloc .form-forcages { margin-top: .75rem; padding-top: .75rem; border-top: 1px dashed var(--border); }
.chantier-planning-bloc .form-forcages .form-grid > div { margin-bottom: .5rem; }
.equipes-liste .membres { display: flex; gap: .3rem; flex-wrap: wrap; }
.membre { font-size: .78rem; background: #f3f4f6; border-radius: 999px; padding: .1rem .5rem; white-space: nowrap; }
.membre.alternant { background: #ecfeff; color: #155e75; }
.equipes-liste input[type=color], .form-inline-ajout input[type=color] { width: 3rem; height: 2rem; padding: 2px; border: 1px solid #d1d5db; border-radius: 4px; background: #fff; cursor: pointer; }
.form-inline-ajout select { padding: .5rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
@media (max-width: 1100px) { .page-planning { grid-template-columns: 1fr; } }
/* Palette des chantiers (module 6.1) */
.etiquette-palette { display: block; font-weight: 500; margin-bottom: .3rem; }
.palette { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.palette .teinte { width: 26px; height: 26px; padding: 0; border-radius: 6px; cursor: pointer; border: 2px solid transparent; box-shadow: inset 0 0 0 1px rgba(0,0,0,.18); }
.palette .teinte:hover { transform: scale(1.08); }
.palette .teinte.choisie { border-color: var(--text); }
.palette .teinte-libre { width: 34px; height: 26px; padding: 0; cursor: pointer; border: 1px dashed #9ca3af; border-radius: 6px; background: none; }
/* ---- Module 6.1.1 : agenda de présence des alternants (une colonne par mois, une case par semaine) ---- */
.agenda-tete { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .5rem; }
.agenda-tete h2 { margin: 0; }
.agenda-tete .annee { font-weight: 600; font-size: 1.05rem; margin: 0 .3rem; }
.agenda-tete .resume { color: var(--muted); font-size: .85rem; margin-left: auto; }
.agenda-tete .sans-equipe { color: var(--danger); }
.agenda { display: grid; grid-template-columns: repeat(12, 1fr); gap: .35rem; }
.agenda .mois { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); text-align: center; border-bottom: 1px solid var(--border); padding-bottom: .2rem; margin-bottom: .1rem; }
.agenda .colonne-mois { display: flex; flex-direction: column; gap: .3rem; }
.semaine-agenda { display: flex; align-items: center; gap: .35rem; border: 1px solid var(--border); border-radius: 5px; padding: .3rem .4rem; background: #fff; cursor: pointer; font-size: .78rem; line-height: 1.15; margin: 0; font-weight: 400; }
.semaine-agenda input[type=checkbox] { width: 15px; height: 15px; margin: 0; flex: none; }
.semaine-agenda .num { font-weight: 600; }
.semaine-agenda .dates { color: var(--muted); font-size: .7rem; display: block; }
.semaine-agenda .pastille { width: 8px; height: 8px; margin-left: .2rem; }
.semaine-agenda.cochee { background: #cffafe; border-color: #22d3ee; }
.semaine-agenda.cochee .num { color: #155e75; }
.semaine-agenda:has(input:disabled) { cursor: default; }
.agenda-bloc form div { margin-bottom: 0; }
.agenda-pied { display: flex; gap: .75rem; align-items: center; margin-top: .7rem; }
.agenda-pied .muted { font-size: .85rem; }
.agenda-legende { display: flex; gap: 1rem; font-size: .78rem; color: var(--muted); margin: 0 0 .5rem; }
.agenda-legende .case { display: inline-block; width: 14px; height: 14px; border-radius: 3px; border: 1px solid var(--border); vertical-align: -3px; margin-right: .25rem; }
.agenda-legende .case.cochee { background: #cffafe; border-color: #22d3ee; }
@media (max-width: 1000px) { .agenda { grid-template-columns: repeat(6, 1fr); } }
.renfort { border: 0; font: inherit; cursor: pointer; text-align: left; }
.renfort.orphelin { background: #fff !important; }

/* ---- Module 0.5 : accueil (tuiles, histogramme, blocs à traiter par thème) et facturation du chantier ---- */
.statut-non-facture { background: #fee2e2; color: #991b1b; }
.statut-facture { background: #dcfce7; color: #166534; }
.raccourcis { display: flex; gap: .5rem; flex-wrap: wrap; }
.accueil-tete { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-bottom: .75rem; }
.accueil-tete h1 { margin: 0; }
.accueil-tete .date { color: var(--muted); }
.theme-facturation { --theme: #d97706; --theme-texte: #b45309; } .theme-devis { --theme: #2563eb; } .theme-bons { --theme: #0891b2; --theme-texte: #0e7490; } .theme-contrats { --theme: #16a34a; } .theme-planning { --theme: #7c3aed; } .theme-habilitations { --theme: #6b7280; }
.kpi { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: .75rem; margin-bottom: .75rem; }
.kpi .tuile { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: .8rem 1rem; display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; align-items: start; border-left: 4px solid var(--theme, #9ca3af); }
.kpi .tuile .ico-theme { grid-row: span 3; width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--theme) 14%, #fff); color: var(--theme); }
.kpi .tuile .ico-theme svg { width: 20px; height: 20px; }
.kpi .tuile .lib { font-size: .75rem; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.kpi .tuile .val { font-size: 1.6rem; font-weight: 650; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin: .15rem 0; color: var(--theme-texte, var(--theme)); }
.kpi .tuile .note { font-size: .8rem; color: var(--muted); }
.kpi .tuile-histo { grid-template-columns: auto 1fr 1fr; grid-template-rows: auto auto auto; }
.kpi .tuile-histo .histo { grid-column: 3; grid-row: 1 / span 3; width: 100%; height: auto; align-self: center; }
.kpi .tuile-histo .histo rect:hover { fill: #1d4ed8; }
.kpi .tuile.cliquable { cursor: pointer; }
.kpi .tuile.cliquable:hover, .kpi .tuile.cliquable[aria-expanded=true] { border-color: var(--theme); box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.kpi .tuile .depli { color: var(--theme-texte, var(--theme)); font-weight: 600; }
.kpi-liste { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; margin-bottom: .75rem; overflow: hidden; }
.kpi-liste h3 { font-size: .9rem; margin: 0; padding: .55rem .9rem; border-bottom: 1px solid var(--border); display: flex; gap: .5rem; background: #f9fafb; }
.kpi-liste h3 .tout { margin-left: auto; font-size: .78rem; font-weight: 500; }
.kpi-liste ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 0; }
.kpi-liste li { break-inside: avoid; border-bottom: 1px solid var(--border); font-size: .85rem; }
.kpi-liste li a { display: block; padding: .4rem .9rem; color: var(--text); text-decoration: none; }
.kpi-liste li a:hover { background: #fff7ed; color: var(--primary); }
.a-traiter { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.bloc-traiter { background: var(--surface); border: 1px solid var(--border); border-top: 4px solid var(--theme, #9ca3af); border-radius: 10px; padding: 0; overflow: hidden; }
.bloc-traiter h2 { font-size: .95rem; margin: 0; padding: .6rem .9rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: .55rem; background: color-mix(in srgb, var(--theme, #9ca3af) 8%, #fff); }
.bloc-traiter h2 .ico-theme { width: 30px; height: 30px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: var(--theme, #9ca3af); color: #fff; flex: none; }
.bloc-traiter h2 .ico-theme svg { width: 18px; height: 18px; }
.bloc-traiter h2 .nombre { display: inline-block; min-width: 1.6rem; text-align: center; font-size: .75rem; font-weight: 700; padding: .1rem .45rem; border-radius: 999px; background: #fee2e2; color: #991b1b; }
.bloc-traiter h2 .nombre.calme { background: #f3f4f6; color: #374151; }
.bloc-traiter h2 .tout { margin-left: auto; font-size: .78rem; font-weight: 500; }
.bloc-traiter ul { list-style: none; margin: 0; padding: 0; }
.bloc-traiter li { display: flex; gap: .6rem; align-items: baseline; padding: .45rem .9rem; border-bottom: 1px solid var(--border); font-size: .88rem; }
.bloc-traiter li:last-child { border-bottom: 0; }
.bloc-traiter li a.principal { color: var(--text); text-decoration: none; font-weight: 500; }
.bloc-traiter li a.principal:hover { color: var(--primary); }
.bloc-traiter li .num { font-family: ui-monospace, monospace; font-size: .75rem; color: var(--theme, var(--muted)); font-weight: 600; white-space: nowrap; }
.bloc-traiter li .detail { color: var(--muted); font-size: .8rem; margin-left: auto; white-space: nowrap; }
.bloc-traiter li .retard { color: var(--danger); font-weight: 600; }
.bloc-traiter .vide-bloc { padding: .8rem .9rem; color: var(--muted); font-size: .85rem; }
.bloc-traiter.reserve { border-style: dashed; }
.bloc-traiter.reserve h2 { color: var(--muted); }
.rien-a-traiter { text-align: center; padding: 2.5rem 1rem; }
.rien-a-traiter h2 { margin: 0 0 .3rem; }
@media (max-width: 1000px) { .kpi { grid-template-columns: 1fr 1fr; } .kpi .tuile-histo { grid-column: 1 / -1; } .a-traiter { grid-template-columns: 1fr; } .kpi-liste ul { columns: 1; } }
/* Taille de secours des icônes hors bandeau : jamais plus grandes que le texte, même si une règle manque. */
svg.ico { width: 1em; height: 1em; vertical-align: -.15em; }
.histo { max-height: 90px; }

/* ---- Module 7.1 : habilitations (états, tableau croisé, bloc de la fiche employé) ---- */
.etat-hab { font-size: .75rem; padding: .15rem .55rem; border-radius: 999px; white-space: nowrap; font-weight: 500; }
.etat-valide { background: #dcfce7; color: #166534; }
.etat-renouveler { background: #ffedd5; color: #9a3412; }
.etat-echue { background: #fee2e2; color: #991b1b; }
.etat-illimitee { background: #f3f4f6; color: #374151; }
table.croise { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
table.croise th, table.croise td { padding: .45rem .6rem; border-bottom: 1px solid var(--border); font-size: .85rem; vertical-align: middle; }
table.croise th { background: #f9fafb; font-weight: 600; color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; text-align: center; }
table.croise th:first-child, table.croise td:first-child { text-align: left; position: sticky; left: 0; background: #fff; z-index: 1; }
table.croise th:first-child { background: #f9fafb; }
table.croise td { text-align: center; }
table.croise td .sous { display: block; font-size: .8rem; color: var(--muted); }
table.croise td .date { display: block; font-size: .72rem; color: var(--muted); }
table.croise td.vide { color: #d1d5db; }
table.croise .case-hab { display: inline-block; min-width: 5.4rem; padding: .25rem .4rem; border-radius: 6px; }
table.croise .case-valide { background: #dcfce7; color: #166534; }
table.croise .case-renouveler { background: #ffedd5; color: #9a3412; }
table.croise .case-echue { background: #fee2e2; color: #991b1b; }
table.croise .case-illimitee { background: #f3f4f6; color: #374151; }
table.croise tbody tr:hover td { background: #fafaf9; }
.hab-doc { font-size: .8rem; }
.compteurs-hab { display: flex; gap: .5rem; flex-wrap: wrap; margin: 0 0 .75rem; }
.compteurs-hab .etat-hab { font-size: .85rem; padding: .3rem .7rem; }
.ajout-habilitation summary { list-style: none; display: inline-block; }
.ajout-habilitation summary::-webkit-details-marker { display: none; }
.ajout-habilitation form div { margin-bottom: .9rem; }
table.sous.habilitations td.actions form.inline { display: inline; }

/* ---- Module 0.7 : confort et navigation (décisions 1a 2a 3a 4a) ---- */
/* Confort de lecture : texte à 16 px (les pages pleine largeur — grille du devis, planning, tableau de bord — restent à 15 px
   pour garder toutes leurs colonnes), boutons un peu plus hauts, contour de focus bien visible au clavier. */
body { font-size: 16px; }
.container.pleine-largeur { font-size: 15px; }
.btn { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; line-height: 1.2; }
.btn-sm { min-height: 32px; }
.btn-icone { min-height: 0; }
:focus-visible { outline: 3px solid #fcd34d; outline-offset: 2px; }
.btn svg.ico { flex: none; }
/* Fenêtre de recherche (Ctrl+K) */
.recherche-dialogue { border: 0; border-radius: 12px; padding: 0; width: min(720px, 94vw); background: #fff; box-shadow: 0 24px 60px rgba(0,0,0,.35); margin: 8vh auto auto; color: var(--text); }
.recherche-dialogue::backdrop { background: rgba(17,24,39,.45); }
.recherche-dialogue .champ { display: flex; align-items: center; gap: .6rem; padding: .85rem 1rem; border-bottom: 1px solid var(--border); margin: 0; }
.recherche-dialogue .champ svg.ico { color: var(--muted); width: 1.2em; height: 1.2em; }
.recherche-dialogue .champ input { flex: 1; border: 0; font: inherit; font-size: 1.1rem; outline: none; width: auto; padding: .2rem 0; }
.recherche-dialogue .champ input:focus { outline: none; }
.recherche-dialogue .champ .fermer { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; }
.recherche-dialogue kbd { font: inherit; font-size: .72rem; border: 1px solid #d1d5db; border-radius: 4px; padding: 0 .35rem; color: var(--muted); background: #fff; }
.recherche-dialogue .resultats { max-height: 60vh; overflow-y: auto; padding: .4rem; }
.recherche-dialogue .resultats:empty { display: none; }
.recherche-dialogue .groupe { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: .55rem .75rem .25rem; }
.recherche-dialogue a.resultat, .resultats-groupe a.resultat { display: grid; grid-template-columns: 7.5rem 1fr auto; gap: .75rem; align-items: center; padding: .5rem .75rem; border-radius: 8px; text-decoration: none; color: var(--text); }
.recherche-dialogue a.resultat:hover, .recherche-dialogue a.resultat.actif, .resultats-groupe a.resultat:hover { background: #fff7ed; }
.recherche-dialogue a.resultat .num, .resultats-groupe a.resultat .num { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .85rem; color: var(--muted); }
.recherche-dialogue a.resultat .lib small, .resultats-groupe a.resultat .lib small { display: block; color: var(--muted); font-size: .85rem; }
.recherche-dialogue a.resultat.plus .lib { color: var(--primary); font-size: .9rem; }
.recherche-dialogue mark { background: #fde68a; color: inherit; padding: 0 .05em; border-radius: 2px; }
.recherche-dialogue .pied { display: flex; gap: 1rem; padding: .5rem 1rem; border-top: 1px solid var(--border); font-size: .8rem; color: var(--muted); background: #fafaf9; border-radius: 0 0 12px 12px; }
.recherche-dialogue .pied .etat { margin-left: auto; }
.recherche-dialogue .aucun { padding: 1.5rem 1rem; text-align: center; color: var(--muted); }
.recherche-dialogue .aucun b { color: var(--text); }
.recherche-dialogue .aucun .btn { margin-top: .75rem; }
/* Page /recherche (sans JavaScript) */
.resultats-groupe .compte { font-size: .75rem; background: #f3f4f6; color: var(--muted); padding: .1rem .5rem; border-radius: 999px; font-weight: 500; margin-left: .35rem; }
.resultats-groupe ul.resultats { list-style: none; margin: 0; padding: 0; }
/* Frise des étapes (chantier, devis, bon) */
.frise { display: flex; gap: .25rem; margin: 0 0 1.25rem; padding: 0; list-style: none; }
.frise li { flex: 1; font-size: .8rem; color: var(--muted); text-align: center; padding: 0 .2rem; min-width: 0; }
.frise li::before { content: ""; display: block; height: 5px; border-radius: 999px; background: #e5e7eb; margin-bottom: .35rem; }
.frise li.etape-fait { color: #166534; } .frise li.etape-fait::before { background: #15803d; }
.frise li.etape-encours { color: #9a3412; font-weight: 600; } .frise li.etape-encours::before { background: #f97316; }
.frise li.etape-sortie { color: #991b1b; font-weight: 600; } .frise li.etape-sortie::before { background: #b91c1c; }
.frise li.etape-fin { color: #065f46; font-weight: 600; } .frise li.etape-fin::before { background: #059669; }
.frise li small { display: block; font-weight: 400; color: var(--muted); font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.container.pleine-largeur .frise { max-width: 900px; }
@media (max-width: 720px) { .frise { flex-wrap: wrap; } .frise li { flex: 1 1 30%; margin-bottom: .5rem; } }
/* Boutons de contact (Appeler · Écrire · Itinéraire) */
.contacts { display: flex; gap: .5rem; flex-wrap: wrap; margin: .5rem 0 .75rem; }
.btn-contact svg.ico { color: var(--primary); }
dl.infos dd .btn-contact, dl.infos dd .choix-itineraire { margin-left: .5rem; vertical-align: middle; }
/* Menu « Itinéraire » : Google Maps / Waze / Apple Plans (details sans JavaScript) */
.choix-itineraire { position: relative; display: inline-block; }
.choix-itineraire summary { list-style: none; cursor: pointer; }
.choix-itineraire summary::-webkit-details-marker { display: none; }
.choix-itineraire .liste { position: absolute; top: 100%; left: 0; z-index: 10; margin-top: .25rem; min-width: 160px; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,.15); padding: .3rem; }
.choix-itineraire .liste a { display: block; padding: .45rem .7rem; border-radius: 6px; color: var(--text); text-decoration: none; white-space: nowrap; }
.choix-itineraire .liste a:hover { background: #fff7ed; color: var(--primary); }
.btn[hidden] { display: none; } /* rappel après le passage de .btn en inline-flex (module 0.7) */
/* Fenêtre de recherche sur téléphone : une seule colonne par résultat (après les règles générales, pour les surcharger). */
@media (max-width: 720px) {
  .recherche-dialogue { margin-top: 2vh; }
  .recherche-dialogue a.resultat { grid-template-columns: 1fr; gap: .2rem; }
  .recherche-dialogue a.resultat .num { font-size: .75rem; }
  .recherche-dialogue a.resultat .statut { justify-self: start; }
  .recherche-dialogue a.resultat .num:empty { display: none; }
}

/* ---- Module 0.8 : menu latéral (décisions 1a 2a 3a 4a) — remplace le bandeau du module 0.2 ---- */
/* Mise en page : menu à gauche (240 px, 64 px réduit), colonne principale = barre du haut + contenu. Fond des pages gris très clair bleuté (--bg). */
:root { --lateral: 240px; --lateral-reduit: 64px; --nuit: #0f172a; --nuit-2: #1e293b; --nuit-texte: #cbd5e1; --nuit-muted: #64748b; }
.app { display: grid; grid-template-columns: var(--lateral) 1fr; min-height: 100vh; }
.app.sans-menu { display: block; }
.app.menu-reduit { grid-template-columns: var(--lateral-reduit) 1fr; }
.colonne-principale { min-width: 0; display: flex; flex-direction: column; }
.colonne-principale > main { flex: 1; width: 100%; }
/* Le menu */
.lateral { background: var(--nuit); color: var(--nuit-texte); display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto; font-size: .93rem; z-index: 25; }
.lateral .marque { display: flex; align-items: center; gap: .6rem; padding: .8rem .75rem .6rem; }
.lateral .logo { width: 34px; height: 34px; border-radius: 9px; background: var(--primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; text-decoration: none; }
.lateral .logo svg.ico { width: 20px; height: 20px; }
.lateral .brand { color: #fff; font-weight: 700; text-decoration: none; line-height: 1.1; flex: 1; }
.lateral .brand small { display: block; color: #94a3b8; font-weight: 400; font-size: .75rem; }
.lateral .replier { background: none; border: 0; color: #94a3b8; cursor: pointer; padding: .3rem; border-radius: 6px; display: inline-flex; }
.lateral .replier:hover { background: var(--nuit-2); color: #fff; }
.lateral .replier svg.ico { width: 18px; height: 18px; transition: transform .15s; }
.lateral .replier.vers-droite svg.ico { transform: rotate(180deg); }
.lateral nav { flex: 1; padding: 0 .5rem; }
.lateral .menu { margin-top: .5rem; }
.lateral .menu-bouton { display: flex; align-items: center; gap: .5rem; width: 100%; padding: .35rem .5rem .2rem; font: inherit; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--nuit-muted); background: none; border: 0; cursor: pointer; text-align: left; border-radius: 6px; }
.lateral .menu-bouton:hover { color: #fff; }
.lateral .menu-bouton svg.ico { width: 15px; height: 15px; flex: none; }
.lateral .menu-bouton .chevron { margin-left: auto; display: inline-flex; opacity: .6; transition: transform .15s; }
.lateral .menu-bouton .chevron svg.ico { width: 13px; height: 13px; }
.lateral .menu-bouton .compteur-menu { display: none; margin-left: 0; }
.lateral .menu.repliee .menu-bouton .chevron { transform: rotate(-90deg); }
.lateral .menu.repliee .menu-liste { display: none; }
.lateral .menu.repliee .menu-bouton .compteur-menu { display: inline-block; }
.lateral .titre-volet { display: none; }
.lateral .menu-liste a { display: flex; align-items: center; gap: .5rem; padding: .42rem .6rem .42rem 1.9rem; border-radius: 7px; color: var(--nuit-texte); text-decoration: none; }
.lateral .menu-liste a:hover { background: var(--nuit-2); color: #fff; }
.lateral .menu-liste a.active { background: var(--primary); color: #fff; font-weight: 600; }
.lateral .menu-liste a.externe::after { content: "↗"; margin-left: .2rem; opacity: .7; }
.lateral .compteur-menu { margin-left: auto; background: #f59e0b; color: #0f172a; font-size: .68rem; font-weight: 700; padding: 0 .38rem; border-radius: 999px; min-width: 1.15rem; text-align: center; line-height: 1.4; }
.lateral .menu-liste a.active .compteur-menu { background: #fff; color: var(--primary); }
.lateral .bas { border-top: 1px solid var(--nuit-2); padding: .6rem .75rem; display: flex; align-items: center; gap: .6rem; }
.lateral .moi { display: flex; align-items: center; gap: .6rem; flex: 1; min-width: 0; }
.lateral .initiales { width: 32px; height: 32px; border-radius: 50%; background: #fbbf24; color: #0f172a; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .8rem; flex: none; }
.lateral .qui { line-height: 1.15; min-width: 0; }
.lateral .qui .nom { display: block; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lateral .qui .badge { display: inline-block; margin-top: .15rem; font-size: .68rem; padding: .05rem .45rem; }
.lateral button.deconnexion { background: none; border: 0; cursor: pointer; font: inherit; }
.lateral .deconnexion { color: #94a3b8; display: inline-flex; align-items: center; gap: .3rem; text-decoration: none; padding: .3rem; border-radius: 6px; flex: none; }
.lateral .deconnexion:hover { background: var(--nuit-2); color: #fff; }
.lateral .deconnexion span { display: none; }
/* Réduit en barre d'icônes : une icône par famille, ses entrées en volet au survol ou au clic (classe `ouvert`). */
.app.menu-reduit .lateral { overflow: visible; }
.app.menu-reduit .lateral .brand, .app.menu-reduit .lateral .qui { display: none; }
.app.menu-reduit .lateral .marque { flex-direction: column; gap: .4rem; padding: .7rem .5rem .4rem; }
.app.menu-reduit .lateral .menu { position: relative; margin-top: .25rem; }
.app.menu-reduit .lateral .menu-bouton { justify-content: center; padding: .55rem 0; border-radius: 8px; }
.app.menu-reduit .lateral .menu-bouton svg.ico { width: 20px; height: 20px; color: var(--nuit-texte); }
.app.menu-reduit .lateral .menu-bouton span, .app.menu-reduit .lateral .menu-bouton .chevron { display: none; }
.app.menu-reduit .lateral .menu-bouton .compteur-menu { display: block; position: absolute; top: 2px; right: 2px; margin: 0; }
.app.menu-reduit .lateral .menu.active .menu-bouton { background: var(--primary); }
.app.menu-reduit .lateral .menu.active .menu-bouton svg.ico { color: #fff; }
.app.menu-reduit .lateral .menu-liste, .app.menu-reduit .lateral .menu.repliee .menu-liste { display: none; position: absolute; left: 100%; top: 0; margin-left: .35rem; min-width: 230px; background: var(--nuit); border: 1px solid #334155; border-radius: 8px; padding: .4rem; box-shadow: 0 8px 24px rgba(0,0,0,.35); z-index: 30; }
.app.menu-reduit .lateral .menu.ouvert .menu-liste, .app.menu-reduit .lateral .menu:hover .menu-liste { display: block; }
.app.menu-reduit .lateral .titre-volet { display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--nuit-muted); padding: .3rem .6rem .35rem; }
.app.menu-reduit .lateral .menu-liste a { padding-left: .6rem; }
.app.menu-reduit .lateral .bas { flex-direction: column; padding: .6rem .4rem; }
/* Barre du haut : ☰ (téléphone), fil d'Ariane, loupe, + Nouveau */
.barre-haut { height: 52px; background: #fff; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: .75rem; padding: 0 1.25rem; position: sticky; top: 0; z-index: 15; }
.barre-haut .burger { display: none; background: none; border: 1px solid var(--border); border-radius: 7px; padding: .35rem; cursor: pointer; color: var(--text); }
.barre-haut .burger svg.ico { width: 20px; height: 20px; }
.barre-haut .fil-ariane { color: var(--muted); font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.barre-haut .fil-ariane b { color: var(--text); font-weight: 600; }
.barre-haut .recherche-bouton { margin-left: auto; display: inline-flex; align-items: center; gap: .5rem; width: 300px; flex: none; padding: .4rem .7rem; border: 1px solid #e2e8f0; border-radius: 7px; background: #f1f5f9; color: #64748b; font-size: .9rem; text-decoration: none; white-space: nowrap; overflow: hidden; }
.barre-haut .recherche-bouton:hover, .barre-haut .recherche-bouton:focus-visible { border-color: #94a3b8; color: var(--text); }
.barre-haut .recherche-bouton svg.ico { width: 16px; height: 16px; flex: none; }
.barre-haut .recherche-bouton kbd { margin-left: auto; font: inherit; font-size: .72rem; border: 1px solid #cbd5e1; border-radius: 4px; padding: 0 .3rem; background: #fff; }
.barre-haut .menu.nouveau { position: relative; flex: none; }
.barre-haut .menu.nouveau .menu-bouton { display: inline-flex; align-items: center; gap: .35rem; background: var(--primary); color: #fff; border: 0; border-radius: 7px; padding: .45rem .8rem; font: inherit; font-size: .93rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
.barre-haut .menu.nouveau .menu-bouton::after { content: "▾"; font-size: .75em; opacity: .8; }
.barre-haut .menu.nouveau .menu-bouton:hover, .barre-haut .menu.nouveau.ouvert .menu-bouton { background: var(--primary-dark); }
.barre-haut .menu.nouveau .menu-bouton svg.ico { width: 18px; height: 18px; }
.barre-haut .menu.nouveau .menu-liste { display: none; position: absolute; top: 100%; right: 0; margin-top: .3rem; min-width: 230px; background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: .35rem; z-index: 30; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.barre-haut .menu.nouveau.ouvert .menu-liste, .barre-haut .menu.nouveau:focus-within .menu-liste { display: block; }
.barre-haut .menu.nouveau .menu-liste a { display: flex; align-items: center; gap: .6rem; padding: .5rem .7rem; border-radius: 6px; color: var(--text); text-decoration: none; white-space: nowrap; }
.barre-haut .menu.nouveau .menu-liste a:hover { background: #fff7ed; color: var(--primary); }
.barre-haut .menu.nouveau .menu-liste a svg.ico { width: 18px; height: 18px; color: var(--primary); }
.voile-menu { display: none; }
@media (max-width: 1400px) { .barre-haut .recherche-bouton { width: 40px; padding: .4rem .6rem; justify-content: center; } .barre-haut .recherche-bouton span, .barre-haut .recherche-bouton kbd { display: none; } }
/* Téléphone : menu masqué, ouvert en volet par ☰ ; jamais réduit en icônes. */
@media (max-width: 1000px) {
  .app, .app.menu-reduit { grid-template-columns: 1fr; }
  .lateral, .app.menu-reduit .lateral { position: fixed; left: 0; top: 0; bottom: 0; width: 280px; height: auto; overflow-y: auto; transform: translateX(-100%); transition: transform .2s; z-index: 40; box-shadow: 0 0 40px rgba(0,0,0,.4); }
  .app.menu-ouvert .lateral { transform: none; }
  .app.menu-reduit .lateral .brand, .app.menu-reduit .lateral .qui, .app.menu-reduit .lateral .menu-bouton span, .app.menu-reduit .lateral .menu-bouton .chevron { display: revert; }
  .app.menu-reduit .lateral .marque { flex-direction: row; }
  .app.menu-reduit .lateral .menu-bouton { justify-content: flex-start; padding: .35rem .5rem .2rem; }
  .app.menu-reduit .lateral .menu-bouton svg.ico { width: 15px; height: 15px; }
  .app.menu-reduit .lateral .menu-liste { display: block; position: static; margin: 0; min-width: 0; border: 0; box-shadow: none; padding: 0; }
  .app.menu-reduit .lateral .menu.repliee .menu-liste { display: none; }
  .app.menu-reduit .lateral .titre-volet { display: none; }
  .app.menu-reduit .lateral .menu-liste a { padding-left: 1.9rem; }
  .app.menu-reduit .lateral .menu-bouton .compteur-menu { position: static; display: none; }
  .app.menu-reduit .lateral .bas { flex-direction: row; }
  .lateral .replier { display: none; }
  .barre-haut { padding: 0 .75rem; gap: .5rem; }
  .barre-haut .burger { display: inline-flex; }
  .barre-haut .menu.nouveau .menu-bouton { padding: .45rem .6rem; }
  .barre-haut .menu.nouveau .menu-bouton span { display: none; }
  .voile-menu { display: block; position: fixed; inset: 0; background: rgba(15,23,42,.5); z-index: 39; }
  .voile-menu[hidden] { display: none; }
}

/* ---- Module 0.9 : fiche chantier en onglets (décisions 1a 2a 3a 4a) ---- */
main.fiche-chantier { max-width: 1240px; }
/* En-tête collant sous la barre du haut (52 px) : titre, actions, frise, chiffres clés, onglets */
.entete-fiche { margin: -1.5rem -1rem 1.25rem; padding: 1rem 1rem 0; background: #fff; border-bottom: 1px solid var(--border); position: sticky; top: 52px; z-index: 10; }
.entete-fiche .ligne-titre { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.entete-fiche .ligne-titre .num { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--muted); font-size: .9rem; }
.entete-fiche .ligne-titre h1 { margin: 0; font-size: 1.4rem; }
.entete-fiche .ligne-titre .client-court { color: var(--muted); }
.entete-fiche .ligne-titre .actions { margin-left: auto; display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
.entete-fiche .ligne-titre .actions select.btn { padding: .45rem .7rem; }
.entete-fiche .frise { margin: .75rem 0 .5rem; }
.entete-fiche .chiffres { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin: .25rem 0 .75rem; }
.entete-fiche .chiffre { background: #f8fafc; border: 1px solid var(--border); border-radius: 10px; padding: .6rem .9rem; display: grid; gap: .15rem; align-content: start; }
.entete-fiche .chiffre .lib { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); display: flex; align-items: center; gap: .35rem; }
.entete-fiche .chiffre .val { font-size: 1.25rem; font-weight: 700; }
.entete-fiche .chiffre .val small { font-size: .85rem; font-weight: 400; color: var(--muted); }
.entete-fiche .chiffre .sous { font-size: .82rem; color: var(--muted); }
.entete-fiche .chiffre .barre { display: block; margin-top: .3rem; }
.onglets { display: flex; gap: .25rem; overflow-x: auto; }
.onglets a { text-decoration: none; color: var(--muted); padding: .6rem .9rem; border-bottom: 3px solid transparent; font-weight: 500; white-space: nowrap; display: inline-flex; gap: .4rem; align-items: center; margin-bottom: -1px; }
.onglets a:hover { color: var(--text); }
.onglets a.active { color: var(--primary); border-color: var(--primary); }
.onglets a .compte { font-size: .72rem; background: #f3f4f6; color: var(--muted); padding: .05rem .45rem; border-radius: 999px; }
.onglets a.active .compte { background: #fef3c7; color: #92400e; }
/* Sans JavaScript, toutes les sections se suivent ; avec, une seule à la fois. */
.onglets-actifs section.onglet { display: none; }
.onglets-actifs section.onglet.active { display: block; }
section.onglet + section.onglet { margin-top: 1rem; }
.fiche-chantier .bloc h2 { display: flex; align-items: center; gap: .5rem; }
.prochain { background: #fff7ed; border-color: #fed7aa; }
.prochain h2 { color: #9a3412; }
.prochain .jour { font-size: 1.1rem; font-weight: 700; margin: 0 0 .2rem; }
.mini-semaine { display: grid; grid-template-columns: repeat(5, 1fr); gap: 3px; margin: .6rem 0 .3rem; }
.mini-semaine span { height: 24px; border-radius: 4px; background: #f3f4f6; font-size: .68rem; color: var(--muted); display: flex; align-items: center; justify-content: center; white-space: nowrap; }
.mini-semaine span.pose { background: #7c3aed; color: #fff; }
.mini-semaine span.bon { background: #0891b2; color: #fff; }
.a-faire ul { list-style: none; margin: 0; padding: 0; }
.a-faire li { display: flex; gap: .6rem; align-items: flex-start; padding: .45rem 0; border-bottom: 1px solid var(--border); font-size: .92rem; }
.a-faire li:last-child { border-bottom: 0; }
.a-faire .puce { width: 10px; height: 10px; border-radius: 50%; margin-top: .4rem; flex: none; }
.a-faire .rouge { background: #ef4444; } .a-faire .orange { background: #f59e0b; } .a-faire .bleu { background: #3b82f6; }
.chrono.unifie li { grid-template-columns: 6rem 1fr; }
.chrono.unifie .type { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; padding: .05rem .4rem; border-radius: 4px; margin-right: .3rem; white-space: nowrap; }
.chrono.unifie .type.statut { background: #ffedd5; color: #9a3412; } .chrono.unifie .type.devis { background: #dbeafe; color: #1e40af; } .chrono.unifie .type.bon { background: #cffafe; color: #155e75; } .chrono.unifie .type.sous_chantier { background: #dcfce7; color: #166534; } .chrono.unifie .type.facturation { background: #fef3c7; color: #92400e; }
.chrono.unifie .qui { color: var(--muted); font-size: .82rem; }
table.sous tr.muted td { color: var(--muted); }
@media (max-width: 900px) { .entete-fiche { position: static; } .entete-fiche .chiffres { grid-template-columns: 1fr; } }

/* ---- Module 0.10 : listes avec vues en un clic (décisions 1a 2a 3a 4a) ---- */
main.liste-page { max-width: 1240px; }
.vues { display: flex; gap: .35rem; flex-wrap: wrap; margin-bottom: .75rem; }
.vues a { text-decoration: none; font-size: .9rem; padding: .35rem .8rem; border-radius: 999px; border: 1px solid var(--border); background: #fff; color: var(--text); display: inline-flex; gap: .35rem; align-items: center; }
.vues a:hover { border-color: #94a3b8; }
.vues a.active { background: #1f2937; color: #fff; border-color: #1f2937; }
.vues a .n { font-size: .72rem; background: rgba(0,0,0,.07); padding: 0 .4rem; border-radius: 999px; min-width: 1.3rem; text-align: center; }
.vues a.active .n { background: rgba(255,255,255,.22); }
.vues a svg.ico { width: 14px; height: 14px; color: #b45309; }
.vues a.active svg.ico { color: #fcd34d; }
.filtres-liste .recherche { flex: 1; min-width: 260px; display: flex; align-items: center; gap: .5rem; background: #fff; border: 1px solid #d1d5db; border-radius: 8px; padding: 0 .75rem; color: var(--muted); margin: 0; font-weight: 400; }
.filtres-liste .recherche input[type=search] { border: 0; padding: .5rem 0; flex: 1; font: inherit; outline: none; width: auto; min-width: 0; background: transparent; }
.filtres-liste .recherche:focus-within { border-color: var(--primary); }
.filtres-liste .recherche svg.ico { flex: none; }
.visuellement-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
table.liste-plus th a { color: inherit; text-decoration: none; display: inline-flex; gap: .3rem; align-items: center; }
table.liste-plus th a:hover { color: var(--primary); }
table.liste-plus th.tri a { color: var(--primary); }
table.liste-plus th i { font-style: normal; font-size: .7rem; }
table.liste-plus td .principal { font-weight: 600; }
table.liste-plus td:nth-child(2) { min-width: 15rem; }
table.liste-plus td.actions { opacity: 0; transition: opacity .1s; }
table.liste-plus tbody tr:hover td.actions, table.liste-plus tbody tr:focus-within td.actions { opacity: 1; }
table.liste-plus .couleur { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: .45rem; vertical-align: -1px; }
table.liste-plus .avancement { display: flex; align-items: center; gap: .5rem; min-width: 110px; }
table.liste-plus .avancement .barre { flex: 1; }
table.liste-plus td.montant, table.liste-plus th.montant { text-align: right; white-space: nowrap; }
table.liste-plus .alerte, table.liste-plus td.suivi.alerte { color: #b91c1c; font-size: .86rem; font-weight: 500; }
table.liste-plus td.suivi { font-size: .88rem; white-space: nowrap; }
table.liste-plus tr.muted td { color: var(--muted); }
.pied-liste { display: flex; align-items: center; gap: 1rem; padding: .75rem 0; color: var(--muted); font-size: .9rem; flex-wrap: wrap; }
.pied-liste .pages { margin-left: auto; display: flex; gap: .25rem; align-items: center; }
.pied-liste .pages a, .pied-liste .pages span { padding: .25rem .6rem; border: 1px solid var(--border); border-radius: 6px; text-decoration: none; color: var(--text); background: #fff; }
.pied-liste .pages span { border-color: transparent; background: none; color: var(--muted); }
.pied-liste .pages a.active { background: #1f2937; color: #fff; border-color: #1f2937; }
@media (max-width: 720px) { table.liste-plus td.actions { opacity: 1; } .filtres-liste .recherche { min-width: 0; width: 100%; } }

/* ---- Module 1.2 : photos et documents du chantier (décisions 1a 2a 3a 4a 5a) ---- */
.ajout-photos .ajout .boutons { display: flex; gap: .6rem; flex-wrap: wrap; }
.ajout-photos .ajout .boutons .btn { cursor: pointer; }
.ajout-photos .ajout .boutons .btn.desactive { opacity: .5; pointer-events: none; }
.ajout-photos .ajout .options { display: flex; gap: 1rem; flex-wrap: wrap; margin: .75rem 0 .25rem; }
.ajout-photos .ajout .options label { font-weight: 500; display: flex; flex-direction: column; gap: .25rem; min-width: 220px; margin: 0; }
.ajout-photos .ajout .options select, .ajout-photos .ajout .options input { font-weight: 400; width: 100%; }
.ajout-photos .ajout div { margin-bottom: 0; }
.galerie h2 { font-size: 1.05rem; margin: 0; }
.grille-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .9rem; }
.photo { margin: 0; }
.photo .photo-vignette { display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: 10px; border: 1px solid var(--border); background-color: #e5e7eb; background-size: cover; background-position: center; cursor: zoom-in; position: relative; overflow: hidden; padding: 0; text-decoration: none; }
.photo .photo-vignette:focus-visible { outline: 3px solid #fcd34d; }
.photo .photo-vignette .apercu { position: absolute; right: .4rem; bottom: .4rem; font-size: .68rem; color: #fff; background: rgba(0,0,0,.45); padding: .05rem .4rem; border-radius: 4px; }
.photo.document .photo-vignette { background: #fff7ed; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.photo.document .photo-vignette .pdf { font-weight: 800; color: #b91c1c; font-size: 1.3rem; letter-spacing: .05em; border: 2px solid #b91c1c; border-radius: 6px; padding: .2rem .5rem; }
.photo figcaption { padding: .4rem .1rem 0; font-size: .86rem; display: grid; gap: .15rem; }
.photo figcaption b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.photo figcaption .meta { color: var(--muted); font-size: .8rem; }
.photo figcaption .retirer-photo { margin-top: .2rem; }
.photo figcaption .retirer-photo .btn { font-size: .78rem; min-height: 26px; padding: .1rem .5rem; }
.nas { font-size: .74rem; color: var(--muted); }
.nas.ok { color: #166534; }
.nas.attente { color: #92400e; }
.nas-info { display: flex; gap: .4rem; align-items: flex-start; margin: .75rem 0 0; }
.nas-info code { background: #f1f5f9; padding: 0 .3rem; border-radius: 4px; }
/* Photo en grand */
.zoom-chantier { border: 0; border-radius: 12px; padding: 0; width: min(1100px, 92vw); max-height: 92vh; background: #0f172a; color: var(--text); overflow: hidden; }
.zoom-chantier::backdrop { background: rgba(15,23,42,.85); }
.zoom-chantier .zoom-cadre { position: relative; display: flex; align-items: center; justify-content: center; background: #0f172a; }
.zoom-chantier .zoom-cadre img { display: block; max-width: 100%; max-height: calc(92vh - 110px); object-fit: contain; }
.zoom-chantier .zoom-barre { background: #fff; padding: .7rem 1rem; display: flex; gap: 1rem; align-items: center; justify-content: space-between; flex-wrap: wrap; font-size: .92rem; }
.zoom-chantier .zoom-actions { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.zoom-chantier .zoom-actions .nas { font-size: .8rem; }
.zoom-chantier .fleche { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.85); border: 0; border-radius: 50%; width: 44px; height: 44px; font-size: 1.6rem; cursor: pointer; }
.zoom-chantier .fleche.gauche { left: .6rem; } .zoom-chantier .fleche.droite { right: .6rem; }
.zoom-chantier .fleche[hidden] { display: none; }
@media (max-width: 720px) { .grille-photos { grid-template-columns: repeat(2, 1fr); } .ajout-photos .ajout .options label { min-width: 0; width: 100%; } }

/* ---- Module 6.3 : « Ma journée » (décisions 1a 2a 3a 4a) et bouton « Terminé ✓ » des sous-chantiers ---- */
main.journee { max-width: 900px; }
.journee-tete { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.journee-tete h1 { margin: 0; font-size: 1.5rem; }
.journee-tete .date { margin: .1rem 0 0; color: var(--muted); }
.mon-equipe { display: inline-flex; align-items: center; gap: .4rem; background: #fff; border: 1px solid var(--border); border-radius: 999px; padding: .35rem .8rem; font-weight: 600; }
.mon-equipe small { font-weight: 400; color: var(--muted); }
.journee .pastille { display: inline-block; width: 10px; height: 10px; border-radius: 50%; }
.choix-equipe { display: flex; flex-direction: column; gap: .2rem; font-weight: 500; min-width: 200px; }
.choix-equipe div { margin: 0; }
.carte-jour { background: #fff; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; display: grid; grid-template-columns: 8px 1fr; box-shadow: 0 1px 3px rgba(0,0,0,.06); margin-bottom: 1.25rem; }
.carte-jour.vide { grid-template-columns: 1fr; text-align: center; }
.carte-jour .corps { padding: 1rem 1.1rem 1.1rem; min-width: 0; }
.carte-jour .num { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem; color: var(--muted); }
.carte-jour h2 { margin: .1rem 0 .4rem; font-size: 1.2rem; }
.carte-jour p { margin: .2rem 0; display: flex; gap: .4rem; align-items: flex-start; }
.carte-jour.vide p { display: block; }
.carte-jour p svg.ico, .carte-jour .notes svg.ico { flex: none; margin-top: .2rem; color: var(--muted); }
.carte-jour .notes { display: flex; gap: .4rem; background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; padding: .5rem .7rem; margin: .6rem 0; font-size: .92rem; }
.bon-jour { display: flex; gap: .5rem; align-items: flex-start; background: #ecfeff; border: 1px solid #a5f3fc; border-radius: 8px; padding: .55rem .7rem; text-decoration: none; color: var(--text); margin: .4rem 0 .6rem; }
.bon-jour svg.ico { color: #0891b2; margin-top: .2rem; flex: none; }
.bon-jour small { display: block; color: #155e75; }
.carte-jour .gros { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-top: .7rem; }
.carte-jour .gros .btn, .carte-jour .gros summary.btn { min-height: 48px; font-size: .98rem; justify-content: center; width: 100%; cursor: pointer; }
.carte-jour .gros .btn-primary { grid-column: 1 / -1; }
.carte-jour .gros .photo-rapide { margin: 0; }
.carte-jour .gros .photo-rapide div { margin: 0; }
.carte-jour .gros .choix-itineraire { display: block; grid-column: 1 / -1; }
.carte-jour .gros .choix-itineraire summary { width: 100%; }
/* La carte coupe ce qui dépasse (overflow: hidden) : la liste Google Maps / Waze / Apple Plans s'ouvre donc DANS la
   carte (elle pousse la suite vers le bas) au lieu de flotter par-dessus, avec des liens assez grands pour le doigt. */
.carte-jour .gros .choix-itineraire .liste { position: static; margin-top: .4rem; box-shadow: none; display: grid; gap: .3rem; }
.carte-jour .gros .choix-itineraire .liste a { padding: .7rem .9rem; border: 1px solid var(--border); text-align: center; font-weight: 600; }
.sous-jour { margin-top: .9rem; border-top: 1px dashed var(--border); padding-top: .6rem; font-size: .92rem; }
.sous-jour ul { list-style: none; margin: .4rem 0 0; padding: 0; }
.sous-jour li { display: flex; align-items: center; gap: .5rem; padding: .35rem 0; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.sous-jour li:last-child { border-bottom: 0; }
.sous-jour li form { margin-left: auto; }
.sous-jour li form div { margin: 0; }
.journee .titre-section { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 1rem 0 .4rem; }
.liste-semaine { background: #fff; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.liste-semaine .jour { display: grid; grid-template-columns: 3.6rem 1fr; gap: .6rem; padding: .55rem .8rem; border-bottom: 1px solid var(--border); align-items: center; }
.liste-semaine .jour:last-child { border-bottom: 0; }
.liste-semaine .j { font-size: .72rem; color: var(--muted); text-align: center; line-height: 1.1; display: flex; flex-direction: column; align-items: center; gap: .15rem; }
.liste-semaine .j b { font-size: 1.05rem; color: var(--text); }
.liste-semaine .autre-equipe { font-size: .78rem; font-weight: 600; color: var(--muted); display: inline-flex; align-items: center; gap: .3rem; }
.liste-semaine .items { display: grid; gap: .3rem; min-width: 0; }
.liste-semaine .item { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--text); }
.liste-semaine .item .couleur { width: 6px; height: 34px; border-radius: 3px; flex: none; }
.liste-semaine .item .lib { font-size: .95rem; line-height: 1.2; text-align: left; }
.liste-semaine .item small { display: block; color: var(--muted); font-size: .8rem; }
.autres-equipes { margin-top: 1rem; }
.autres-equipes summary { cursor: pointer; font-weight: 600; padding: .5rem 0; display: flex; gap: .4rem; align-items: center; list-style: none; }
.autres-equipes summary::before { content: "›"; color: var(--muted); transition: transform .15s; }
.autres-equipes[open] summary::before { transform: rotate(90deg); }
.autres-equipes[open] summary { margin-bottom: .4rem; }
table.sous td.actions .btn-termine { white-space: nowrap; }
@media (max-width: 720px) { .carte-jour .gros { grid-template-columns: 1fr 1fr; } .journee-tete { flex-direction: column; } }

/* ---- Module 4.3 : parc automobile (liste, fiche en onglets, modèles et plans d'entretien, Mon véhicule) ---- */
.statut-sorti { background: #e5e7eb; color: #374151; }
.fiche-vehicule .chiffre.alerte-orange { border-color: #fed7aa; background: #fff7ed; }
.fiche-vehicule .chiffre.alerte-rouge { border-color: #fecaca; background: #fef2f2; }
.fiche-vehicule .chiffre .sous.alerte { color: #b91c1c; }
.fiche-vehicule .form-releve { margin-bottom: 1rem; padding-bottom: .75rem; border-bottom: 1px dashed var(--border); }
.fiche-vehicule .form-grid-3 > div { margin-bottom: .6rem; }
.form-vehicule .palette { margin-top: .3rem; }
.modele-vehicule.inactif { opacity: .6; }
.modele-vehicule .sous-head { flex-wrap: wrap; gap: .5rem; }
.modele-vehicule .sous-head h2 { flex: 1; min-width: 240px; }
.modele-vehicule input.titre-modele { font: inherit; font-weight: 600; font-size: 1.05rem; width: 100%; border: 1px solid transparent; border-radius: 6px; padding: .2rem .4rem; background: transparent; }
.modele-vehicule input.titre-modele:hover, .modele-vehicule input.titre-modele:focus { border-color: #d1d5db; background: #fff; }
.modele-vehicule input.conso-modele { width: 4.5rem; text-align: right; font: inherit; border: 1px solid #d1d5db; border-radius: 6px; padding: .15rem .4rem; }
.modele-vehicule table.operations input[type=text] { width: 100%; font: inherit; font-size: .92rem; border: 1px solid transparent; border-radius: 6px; padding: .3rem .4rem; background: transparent; }
.modele-vehicule table.operations input[type=text]:hover, .modele-vehicule table.operations input[type=text]:focus { border-color: #d1d5db; background: #fff; }
.modele-vehicule table.operations input.court { width: 6rem; text-align: right; }
.modele-vehicule table.operations td.actions { white-space: nowrap; }
.modele-vehicule tr.ajout td { background: #fafaf9; }
.mon-vehicule .form-plein h3 { font-size: 1rem; margin: .8rem 0 .4rem; }
.mon-vehicule .form-plein .form-grid > div { margin-bottom: .6rem; }
.mon-vehicule .form-plein .btn { width: 100%; min-height: 48px; justify-content: center; }
.mon-vehicule .alertes-vehicule { list-style: none; margin: .4rem 0 0; padding: 0; font-size: .9rem; }
.mon-vehicule .alertes-vehicule li { padding: .25rem 0 .25rem 1rem; position: relative; }
.mon-vehicule .alertes-vehicule li::before { content: ""; position: absolute; left: 0; top: .6rem; width: 8px; height: 8px; border-radius: 50%; background: #f59e0b; }
.mon-vehicule .alertes-vehicule li.rouge::before { background: #ef4444; }
.mon-vehicule .alertes-vehicule li.bleu::before { background: #3b82f6; }
.theme-parc .ico-theme { background: #ccfbf1; color: #0f766e; }

/* ---- Module 1.3 : consultations fournisseurs (choix des lignes, fournisseurs, fiche, comparatif, mail) ---- */
.bandeau-resume { display: flex; gap: 1.5rem; flex-wrap: wrap; align-items: center; background: #f8fafc; border: 1px solid var(--border); border-radius: 10px; padding: .7rem 1rem; margin: 0 0 1rem; }
.bandeau-resume b { font-size: 1.05rem; }
table.selection-lignes tr.chapitre td { background: #f8fafc; font-weight: 600; }
table.selection-lignes td.coche, table.selection-lignes th.coche { width: 2.2rem; text-align: center; }
table.selection-lignes tr.cochee td { background: #fffbeb; }
table.selection-lignes select.article { max-width: 300px; font-size: .88rem; }
table.selection-lignes .libre { color: var(--muted); font-size: .85rem; }
table.selection-lignes input.article-recherche { width: 300px; max-width: 100%; font-size: .88rem; }
table.selection-lignes tr.composant td { border-top: 0; padding-top: .2rem; }
table.selection-lignes td.composant-designation { padding-left: 1.4rem; font-size: .92rem; }
table.selection-lignes textarea.designation { width: 100%; min-width: 260px; font-size: .9rem; resize: vertical; }
table.selection-lignes td.composant-designation textarea.designation { width: calc(100% - 1.2rem); }
table.selection-lignes input.quantite { width: 6rem; }
.menu-article .menu-historique-texte b { font-weight: 600; color: var(--muted); }
.choisis { display: flex; gap: .4rem; flex-wrap: wrap; min-height: 2rem; align-items: center; }
.chip { display: inline-flex; gap: .4rem; align-items: center; background: #fffbeb; border: 1px solid #fcd34d; color: #92400e; border-radius: 999px; padding: .2rem .4rem .2rem .7rem; font-weight: 500; }
.chip button { border: 0; background: #fde68a; color: #92400e; border-radius: 50%; width: 20px; height: 20px; cursor: pointer; font-size: .75rem; line-height: 1; }
.barre-fournisseurs { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; margin: .6rem 0; }
.barre-fournisseurs .recherche { flex: 1; min-width: 260px; }
.liste-fournisseurs { max-height: 330px; overflow: auto; border: 1px solid var(--border); border-radius: 10px; }
.liste-fournisseurs table.list { margin: 0; }
.liste-fournisseurs td.coche, .liste-fournisseurs th.coche { width: 2.2rem; text-align: center; }
.liste-fournisseurs tr.cochee td { background: #fffbeb; }
.liste-fournisseurs select { font-size: .85rem; max-width: 320px; }
.liste-fournisseurs tr[hidden] { display: none; }
.form-consultation .etiquette { display: block; font-weight: 500; margin-bottom: .3rem; }
.choix-livraison { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .6rem; }
.choix-livraison label { display: block; border: 1px solid var(--border); border-radius: 10px; padding: .6rem .8rem; background: #fff; font-weight: 500; cursor: pointer; }
.choix-livraison label:has(:checked) { border-color: var(--primary); background: #fffbeb; }
.choix-livraison .sous { display: block; font-weight: 400; color: var(--muted); font-size: .85rem; margin-left: 1.4rem; }
.fournisseurs-consultes { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: .75rem; }
.fournisseur-carte { border: 1px solid var(--border); border-radius: 10px; padding: .7rem .9rem; background: #fff; display: grid; gap: .2rem; align-content: start; }
.fournisseur-carte.retenu { border-color: #16a34a; background: #f0fdf4; }
.fournisseur-carte > b { font-size: 1rem; }
.fournisseur-carte .etat { font-size: .85rem; }
.fournisseur-carte .etat.ok { color: #166534; } .fournisseur-carte .etat.attente { color: #92400e; } .fournisseur-carte .etat.retard { color: #b91c1c; }
.fournisseur-carte .actions { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .3rem; }
.fournisseur-carte .form-reponse { grid-column: 1 / -1; margin-top: .6rem; padding-top: .6rem; border-top: 1px dashed var(--border); }
.fournisseur-carte .form-reponse[hidden] { display: none; }
/* 12/11/2026 : réponse ouverte (bouton ou devis glissé) = la carte prend toute la largeur, les champs ne s'entassent plus dans 300 px. */
.fournisseur-carte:has(> .form-reponse:not([hidden])) { grid-column: 1 / -1; }
.fournisseur-carte .form-reponse > div { min-width: 0; }
.fournisseur-carte .form-reponse input[type=file] { max-width: 100%; }
.piece-jointe { display: inline-flex; gap: .3rem; align-items: center; font-size: .85rem; background: #f3f4f6; border-radius: 6px; padding: .15rem .5rem; text-decoration: none; color: inherit; }
table.comparatif th.fournisseur { text-align: right; min-width: 130px; }
table.comparatif th.fournisseur small { display: block; font-weight: 400; color: var(--muted); }
table.comparatif td.prix { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
table.comparatif td.prix input { width: 6.5rem; text-align: right; font: inherit; border: 1px solid transparent; border-radius: 6px; padding: .2rem .4rem; background: transparent; }
table.comparatif td.prix input:hover, table.comparatif td.prix input:focus { border-color: #d1d5db; background: #fff; }
table.comparatif td.prix .total-ligne { display: block; color: var(--muted); font-size: .78rem; }
table.comparatif td.prix.mini { background: #dcfce7; }
table.comparatif td.prix.sans { color: var(--muted); }
table.comparatif tfoot td { font-weight: 700; background: #f8fafc; }
table.comparatif tfoot td.prix.mini { background: #bbf7d0; }
table.comparatif td.retenu select { font-size: .85rem; max-width: 160px; }
table.comparatif th.retenu, table.comparatif td.retenu { background: #fefce8; }
table.comparatif tr.retenu-ligne td { background: #f0fdf4; }
.legende-comparatif { color: var(--muted); font-size: .88rem; margin: .5rem 0 0; }
.mail-apercu { max-width: 760px; background: #fff; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.mail-apercu .tete { background: #f8fafc; border-bottom: 1px solid var(--border); padding: .8rem 1rem; font-size: .9rem; display: grid; gap: .15rem; }
.mail-apercu .corps { padding: 1rem 1.2rem; }
.statut-consultee { background: #dbeafe; color: #1e40af; }
.statut-a-decider { background: #fef3c7; color: #92400e; }
.statut-retenue { background: #dcfce7; color: #166534; }
.fiche-consultation .chiffre.alerte-orange { border-color: #fed7aa; background: #fff7ed; }
.fiche-consultation .chiffre.alerte-rouge { border-color: #fecaca; background: #fef2f2; }
.fiche-consultation .chiffre .sous.alerte { color: #b91c1c; }
.form-help.alerte { color: #b91c1c; }

/* ---- Module 1.4 : commandes sur chantier (lignes en saisie, fiche, réception, liste, accueil) ---- */
.statut-commandee { background: #dbeafe; color: #1e40af; }
.statut-partielle { background: #fef3c7; color: #92400e; }
.statut-livree { background: #dcfce7; color: #166534; }
table.lignes-commande td { vertical-align: top; }
table.lignes-commande input[type=text], table.lignes-commande select { font: inherit; width: 100%; border: 1px solid #d1d5db; border-radius: 6px; padding: .3rem .5rem; }
table.lignes-commande input.court { width: 6.5rem; text-align: right; }
table.lignes-commande select { width: auto; }
table.lignes-commande tr.ajout td { background: #fafaf9; }
table.lignes-commande tr.erreur td { background: #fef2f2; }
table.lignes-commande .propose { display: block; }
table.commande td.num, table.commande th.num { text-align: right; white-space: nowrap; }
table.commande input.qte { width: 5.5rem; text-align: right; font: inherit; border: 1px solid #d1d5db; border-radius: 6px; padding: .25rem .4rem; }
table.commande input.date-recue, table.commande input.remarque-recue { font: inherit; border: 1px solid #d1d5db; border-radius: 6px; padding: .25rem .4rem; }
table.commande input.remarque-recue { width: 9rem; }
table.commande tr.livree td { color: var(--muted); }
table.commande .reste { font-weight: 600; }
table.commande .reste.zero { color: #166534; font-weight: 400; }
.avancement-livraison { display: flex; align-items: center; gap: .6rem; min-width: 260px; }
.avancement-livraison .barre { flex: 1; height: 8px; border-radius: 999px; background: #e5e7eb; overflow: hidden; }
.avancement-livraison .barre span { display: block; height: 100%; background: #16a34a; }
.fiche-commande .chiffre.alerte-orange { border-color: #fed7aa; background: #fff7ed; }
.fiche-commande .chiffre .sous.alerte { color: #b91c1c; }
.theme-commandes { --theme: #7c3aed; }
.theme-commandes .ico-theme { background: #ede9fe; color: #6d28d9; }
.entete-fiche .chiffres.chiffres-secondaires { margin-top: -.25rem; grid-template-columns: repeat(3, 1fr); }

/* ---- Module 2.3 : trames d'impression, polices, documents complémentaires, PDF produits ---- */
.trames { display: grid; grid-template-columns: 280px 1fr; gap: 1rem; align-items: start; }
.trames .liste-trames { display: grid; gap: .4rem; }
.trames .liste-trames h3 { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin: .6rem 0 .1rem; }
.trames .liste-trames form { margin-bottom: .2rem; }
.trames .trame-item { display: flex; align-items: center; gap: .5rem; padding: .55rem .75rem; border: 1px solid var(--border); border-radius: 10px; background: #fff; text-decoration: none; color: inherit; }
.trames .trame-item.active { border-color: var(--primary); background: #fffbeb; }
.trames .trame-item b { flex: 1; font-weight: 600; }
.trames .trame-item .tag { font-size: .7rem; padding: .05rem .4rem; border-radius: 4px; background: #dcfce7; color: #166534; }
.trames .trame-item .orient { font-size: .78rem; color: var(--muted); }
.editeur-trame { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 1rem; align-items: start; }
.editeur-trame .etiquette { display: block; font-weight: 500; margin: .9rem 0 .3rem; }
.editeur-trame .zone { margin-bottom: .8rem; }
.editeur-trame .zone label { display: block; font-weight: 500; margin-bottom: .25rem; }
.editeur-trame .zone textarea { font: inherit; font-size: .9rem; width: 100%; border: 1px solid #d1d5db; border-radius: 8px; padding: .5rem .7rem; }
.editeur-trame .aide { margin: .25rem 0 .5rem; }
.variables { display: flex; flex-wrap: wrap; gap: .3rem; margin: .4rem 0 .8rem; }
.variables code { background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 6px; padding: .1rem .45rem; font-size: .8rem; cursor: pointer; }
.variables code:hover { border-color: var(--primary); background: #fffbeb; }
.options-trame { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .8rem; margin: .2rem 0 .4rem; }
.options-trame label { font-weight: 400; font-size: .92rem; }
.palette[data-palette-trame] { display: flex; gap: .4rem; align-items: center; margin-top: .3rem; }
.palette[data-palette-trame] .teinte { width: 26px; height: 26px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px #d1d5db; cursor: pointer; }
.palette[data-palette-trame] .teinte.choisie { box-shadow: 0 0 0 2px var(--primary); }
.apercu-cadre { background: #e5e7eb; border-radius: 10px; padding: 1rem; position: sticky; top: calc(52px + 1rem); }
.apercu-cadre .titre-apercu { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .6rem; font-size: .88rem; color: var(--muted); }
.apercu-cadre iframe { width: 100%; height: calc(100vh - 52px - 9rem); min-height: 520px; border: 0; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.15); border-radius: 4px; }
.apercu-cadre p { margin: .5rem 0 0; }
.docs-comp input.titre-modele { font: inherit; font-weight: 600; width: 100%; border: 1px solid transparent; border-radius: 6px; padding: .2rem .4rem; background: transparent; }
.docs-comp input.titre-modele:hover, .docs-comp input.titre-modele:focus { border-color: #d1d5db; background: #fff; }
.docs-comp input[type=date] { font: inherit; font-size: .9rem; border: 1px solid #d1d5db; border-radius: 6px; padding: .2rem .4rem; }
.docs-comp input[type=file].petit { font-size: .8rem; margin-top: .3rem; }
.docs-comp td.validite .sous.alerte { display: block; }
.logo-entreprise { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.logo-entreprise .apercu-logo { min-width: 180px; height: 70px; border: 1px solid var(--border); border-radius: 8px; background: #fff; display: flex; align-items: center; justify-content: center; padding: .4rem .8rem; }
.logo-entreprise .apercu-logo img { max-height: 60px; max-width: 220px; }
.pdf-liste { list-style: none; margin: 0; padding: 0; }
.pdf-liste li { display: grid; grid-template-columns: 1fr auto; gap: .5rem; padding: .45rem 0; border-bottom: 1px solid var(--border); font-size: .92rem; align-items: center; }
.pdf-liste li:last-child { border-bottom: 0; }
.pdf-liste .quand { color: var(--muted); font-size: .85rem; display: block; }
.choix-trame .liste form { display: block; }
.choix-trame .liste button.lien { display: block; width: 100%; text-align: left; background: none; border: 0; font: inherit; padding: .5rem .8rem; cursor: pointer; color: inherit; }
.choix-trame .liste button.lien:hover { background: #fffbeb; }
.theme-documents { --theme: #b45309; }
.theme-documents .ico-theme { background: #ffedd5; color: #9a3412; }
@media (max-width: 1100px) { .trames, .editeur-trame { grid-template-columns: 1fr; } .apercu-cadre { position: static; } }

/* ---- Module 0.4.1 : droits par sous-module (lignes dépliables « Affiner » dans la grille des droits) ---- */
table.droits td.module { min-width: 13rem; }
table.droits td.module .ligne-module { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
table.droits .affiner { font: inherit; font-size: .78rem; padding: .15rem .55rem; border: 1px solid #d1d5db; border-radius: 999px; background: #fff; color: var(--muted); cursor: pointer; white-space: nowrap; }
table.droits .affiner:hover { border-color: #9ca3af; color: var(--text); }
table.droits .affiner::before { content: "▸ "; }
table.droits tr.deplie .affiner::before { content: "▾ "; }
table.droits .tag-affine { font-size: .72rem; padding: .1rem .5rem; border-radius: 999px; background: #fef3c7; color: #92400e; font-weight: 500; }
table.droits tr.sous-module { display: none; background: #fafafa; }
table.droits tr.sous-module.visible { display: table-row; }
table.droits tr.sous-module td { border-bottom: 1px dashed var(--border); padding-top: .35rem; padding-bottom: .35rem; }
table.droits tr.sous-module td.module { font-weight: 400; padding-left: 2.2rem; color: #374151; font-size: .93rem; }
table.droits tr.sous-module td.module::before { content: "└ "; color: #9ca3af; }
table.droits tr.sous-module select { min-width: 9.5rem; font-size: .85rem; }
table.droits select.n-suit { background: #fff; color: #9ca3af; border-style: dashed; }
table.droits td.conflit select { outline: 2px solid var(--danger); outline-offset: 1px; }
table.droits tr.sous-module.dernier td { border-bottom: 1px solid var(--border); }
.aide-affiner { font-size: .85rem; color: var(--muted); margin: -.5rem 0 1rem; }

/* ---- Module 0.4.2 : montants masqués par profil (ligne « Montants » de la grille, pastille sur les fiches) ---- */
table.droits tr.montants select.n-aucun, .legende-niveaux .n-masque { background: #f3f4f6; color: #6b7280; }
table.droits tr.montants select.n-lecture, .legende-niveaux .n-visible { background: #dcfce7; color: #166534; }
.montants-masques { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; padding: .15rem .6rem; border-radius: 999px; background: #f3f4f6; color: #6b7280; border: 1px dashed #d1d5db; vertical-align: middle; }
.montants-masques::before { content: "€"; text-decoration: line-through; font-weight: 700; }

/* ---- Module 7.2 : congés et absences (calendrier mensuel, saisie, bloc de la fiche employé, planning, Ma journée) ---- */
.conges-tete { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .75rem; }
.conges-tete .mois { font-size: 1.1rem; font-weight: 600; min-width: 11rem; text-align: center; }
.conges-tete select { width: auto; padding: .4rem .6rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; }
.legende-types { display: flex; gap: .6rem 1rem; flex-wrap: wrap; font-size: .85rem; color: var(--muted); margin: .5rem 0 1rem; }
.legende-types .puce, .type-puce { display: inline-block; width: 14px; height: 14px; border-radius: 3px; vertical-align: -2px; margin-right: .3rem; }
.legende-types .puce-ferie { background: repeating-linear-gradient(45deg, transparent 0 3px, #fee2e2 3px 6px); border: 1px solid #fecaca; }
.calendrier-wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; }
table.calendrier { border-collapse: collapse; width: 100%; min-width: 900px; font-size: .8rem; }
table.calendrier th, table.calendrier td { border-bottom: 1px solid var(--border); border-left: 1px solid #f1f5f9; padding: 0; height: 30px; text-align: center; }
table.calendrier th { background: #f9fafb; font-weight: 500; color: var(--muted); font-size: .72rem; padding: .3rem 0; }
table.calendrier th b { display: block; font-size: .85rem; color: var(--text); }
table.calendrier th.we, table.calendrier td.we { background: #f3f4f6; color: #9ca3af; }
table.calendrier th.ferie, table.calendrier td.ferie { background: repeating-linear-gradient(45deg, transparent 0 5px, #fee2e2 5px 10px); }
table.calendrier th.ferie b { color: var(--danger); }
table.calendrier th.aujourdhui b { color: var(--primary); }
table.calendrier td.aujourdhui { box-shadow: inset 0 0 0 2px #fdba74; }
table.calendrier th.employe, table.calendrier td.employe { text-align: left; padding: .35rem .7rem; position: sticky; left: 0; background: #fafaf9; min-width: 12rem; border-left: 0; font-weight: 500; z-index: 2; }
table.calendrier td.employe a { color: var(--text); text-decoration: none; }
table.calendrier td.employe a:hover { color: var(--primary); }
table.calendrier td.employe small { display: block; color: var(--muted); font-weight: 400; font-size: .72rem; }
table.calendrier tr.equipe td { background: #f1f5f9; text-align: left; padding: .25rem .7rem; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; }
table.calendrier th.solde-tete, table.calendrier td.solde { text-align: right; padding: 0 .6rem; white-space: nowrap; color: var(--muted); border-left: 1px solid var(--border); min-width: 6rem; }
table.calendrier th.solde-tete { padding: .3rem .6rem; }
table.calendrier td.solde b { color: var(--text); }
table.calendrier td.solde b.negatif { color: var(--danger); }
table.calendrier td .abs { display: block; height: 22px; margin: 4px 1px; border-radius: 3px; }
table.calendrier td a.abs { cursor: pointer; }
table.calendrier td .abs.matin { height: 11px; margin-bottom: 15px; border-radius: 3px 3px 0 0; }
table.calendrier td .abs.apres { height: 11px; margin-top: 15px; border-radius: 0 0 3px 3px; }
table.calendrier td:hover .abs { filter: brightness(.9); }
.liste-absences { list-style: none; margin: 0; padding: 0; }
.liste-absences li { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; padding: .35rem 0; border-bottom: 1px dashed var(--border); }
.liste-absences li:last-child { border-bottom: 0; }
.liste-absences .quand { color: var(--muted); font-size: .85rem; min-width: 12rem; }
.liste-absences form.inline { display: inline; margin: 0; }
.bloc-solde { display: flex; gap: 1rem; flex-wrap: wrap; margin: .5rem 0 1rem; }
.bloc-solde .chiffre { flex: 1; min-width: 9rem; }
.bloc-solde .chiffre .lib { display: block; font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.bloc-solde .chiffre .val { display: block; font-size: 1.25rem; font-weight: 700; }
.bloc-solde .chiffre .val small { font-size: .85rem; font-weight: 400; color: var(--muted); }
.bloc-solde .chiffre .sous { display: block; font-size: .82rem; color: var(--muted); }
.bloc-solde .chiffre.alerte-rouge .val { color: #b91c1c; }
#form-absence label.checkbox.demi { margin: .35rem 0 0; font-size: .9rem; }
.apercu-absence [data-solde].avertissement { color: #92400e; }
.absent { z-index: 2; margin: 0 2px; padding: 2px 6px; border-radius: 4px; font-size: .72rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; color: #1f2937; }

.absents-jour { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin-top: .35rem; }
.absents-jour .tag-abs { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .6rem; border-radius: 999px; font-size: .85rem; background: #f3f4f6; }
.form-inline-ajout label.checkbox { display: inline-flex; align-items: center; gap: .3rem; margin: 0; }

/* ---- Module 4.3.1 — Parc automobile : tarif de l'assurance, documents du véhicule ---- */
.prime-actuelle { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; margin: .2rem 0 .8rem; }
.prime-actuelle .montant { font-size: 1.6rem; font-weight: 700; }
.prime-actuelle .par { color: var(--muted); }
.evolution { font-size: .8rem; padding: .1rem .45rem; border-radius: 999px; font-weight: 600; white-space: nowrap; }
.evolution.hausse { background: #fef2f2; color: #b91c1c; }
.evolution.baisse { background: #ecfdf5; color: #15803d; }
.evolution.stable { background: #f3f4f6; color: #4b5563; }
table.tarifs td.actions .btn { opacity: 0; transition: opacity .15s; }
table.tarifs tr:hover td.actions .btn, table.tarifs td.actions .btn:focus-visible { opacity: 1; }
table.tarifs tr.en-cours td:first-child { font-weight: 600; }
table.tarifs tr.a-venir { color: var(--muted); }
#assurance .sous-head .btn, #documents-essentiels .sous-head a { margin-left: auto; }
ul.docs-essentiels { list-style: none; margin: 0; padding: 0; }
ul.docs-essentiels li { display: flex; align-items: center; gap: .6rem; padding: .55rem 0; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
ul.docs-essentiels li:last-child { border-bottom: 0; }
ul.docs-essentiels .etat-doc { width: 1.4rem; height: 1.4rem; border-radius: 50%; display: inline-grid; place-items: center; font-size: .8rem; font-weight: 700; flex: none; background: #f3f4f6; color: var(--muted); }
ul.docs-essentiels .etat-doc.ok { background: #dcfce7; color: #15803d; }
ul.docs-essentiels .etat-doc.manque { background: #fff7ed; color: #c2410c; border: 1px dashed #fdba74; }
ul.docs-essentiels .quoi { flex: 1; min-width: 10rem; }
ul.docs-essentiels .quoi small { display: block; color: var(--muted); }
.tag-manque { font-size: .75rem; padding: .1rem .5rem; border-radius: 999px; background: #fff7ed; color: #c2410c; border: 1px dashed #fdba74; white-space: nowrap; }
.erreur-champ { color: var(--danger); font-size: .85rem; margin-top: .25rem; }
input.invalide, select.invalide { border-color: var(--danger); }
.pied-parc { display: flex; gap: 1.5rem; flex-wrap: wrap; align-items: baseline; padding: .8rem 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; margin-top: 1rem; }
.pied-parc b { font-size: 1.15rem; }
.pied-parc .muted { font-size: .9rem; }
@media (max-width: 720px) { table.tarifs td.actions .btn { opacity: 1; } }

/* ---- Module 0.10.1 — Tri par colonne sur toutes les listes : mêmes en-têtes que les listes du module 0.10 ---- */
table.list th a, table.croise th a { color: inherit; text-decoration: none; display: inline-flex; gap: .3rem; align-items: center; }
table.list th a:hover, table.croise th a:hover { color: var(--primary); }
table.list th i, table.croise th i { font-style: normal; font-size: .7rem; }
table.list th.tri a, table.croise th.tri a { color: var(--primary); }
table.list th:not(.tri) a:hover::after, table.croise th:not(.tri) a:hover::after { content: "↕"; color: #9ca3af; font-size: .9em; }

/* ---- Module 2.7.1 : corbeille des clients ---- */
/* Cadre sous la fiche client : même carte que la fiche, liseré rouge à gauche = action à part ; gris si impossible. */
.zone-suppression { max-width: 760px; margin-top: 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; border-left: 4px solid var(--danger); padding: 1rem 1.5rem; }
.zone-suppression p { margin: .25rem 0 0; }
.zone-suppression form { margin: 0; }
.zone-suppression.zone-bloquee { border-left-color: var(--border); }
/* Message de succès qui porte un bouton (« Restaurer »). */
.flash-avec-action { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.flash-avec-action form { margin: 0; }
/* Nombre de clients dans la corbeille, sur le bouton de la liste. */
.compteur-corbeille { display: inline-block; min-width: 1.4em; padding: 0 .35em; border-radius: 999px; background: #f3f4f6; font-size: .8rem; text-align: center; }

/* ---- Module 7.2.1 : saisir une absence dans le calendrier des congés ---- */
/* Case vide choisissable : curseur « + », léger survol ; pendant le glisser, les cases choisies se teintent. */
table.calendrier.saisie tbody tr[data-employe] td[data-date] { cursor: cell; user-select: none; -webkit-user-select: none; }
table.calendrier.saisie tbody tr[data-employe] td[data-date]:hover { background-color: #fff7ed; }
table.calendrier td.choisi, table.calendrier.saisie tbody tr[data-employe] td.choisi:hover { background: #fed7aa; box-shadow: inset 0 2px 0 #fb923c, inset 0 -2px 0 #fb923c; }
table.calendrier td.choisi.bord-debut { box-shadow: inset 2px 2px 0 #fb923c, inset 0 -2px 0 #fb923c; }
table.calendrier td.choisi.bord-fin { box-shadow: inset -2px 2px 0 #fb923c, inset 0 -2px 0 #fb923c; }
table.calendrier td.choisi.bord-debut.bord-fin { box-shadow: inset 0 0 0 2px #fb923c; }
/* Tablette : le premier jour touché reste marqué, une aide dit quoi faire ensuite. */
.aide-selection { position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 60; width: max-content; max-width: calc(100% - 2rem); background: #111827; color: #fff; border-radius: 999px; padding: .55rem 1rem; font-size: .9rem; display: flex; gap: .75rem; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(0,0,0,.2); }
.aide-selection[hidden] { display: none; }
.aide-selection button { background: none; border: 1px solid #6b7280; color: #fff; border-radius: 999px; padding: .15rem .7rem; font: inherit; font-size: .85rem; cursor: pointer; }
/* Fenêtre de saisie : même famille que la fenêtre de confirmation commune, plus large. */
dialog.fenetre-absence { border: 0; border-radius: 10px; padding: 1.25rem 1.5rem; max-width: 560px; width: calc(100% - 2rem); box-shadow: 0 20px 60px rgba(0,0,0,.35); }
dialog.fenetre-absence::backdrop { background: rgba(17,24,39,.55); }
dialog.fenetre-absence h2 { margin: 0 0 .15rem; font-size: 1.1rem; }
dialog.fenetre-absence .sous-titre { margin: 0 0 1rem; color: var(--muted); font-size: .9rem; }
dialog.fenetre-absence .deux { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
dialog.fenetre-absence .champ { margin-bottom: .8rem; }
dialog.fenetre-absence label.checkbox { margin: .35rem 0 0; font-size: .88rem; font-weight: 400; }
dialog.fenetre-absence .prix-apercu { margin-bottom: .8rem; padding: .55rem .8rem; gap: .25rem 1rem; }
dialog.fenetre-absence .prix-apercu strong { font-size: 1.1rem; }
dialog.fenetre-absence .erreur-fenetre { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; border-radius: 8px; padding: .55rem .8rem; font-size: .9rem; margin-bottom: .8rem; }
dialog.fenetre-absence .form-actions { display: flex; gap: .5rem; justify-content: flex-end; margin: .25rem 0 0; }
dialog.fenetre-absence .select-type { display: flex; align-items: center; gap: .5rem; }
dialog.fenetre-absence .select-type .puce { width: 16px; height: 16px; border-radius: 4px; flex: none; }
@media (max-width: 600px) { dialog.fenetre-absence .deux { grid-template-columns: 1fr; } }

/* ---- Module 2.12 : photos sur les devis et les bons, reprises par le chantier ---- */
.photos-document { margin-top: 1rem; }
.photos-document .ajout { margin: .5rem 0 1rem; }
.pastille-photos { display: inline-flex; align-items: center; gap: .3rem; margin-left: .6rem; padding: .1rem .6rem; border-radius: 999px; background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; font-size: .8rem; font-weight: 500; text-decoration: none; vertical-align: middle; }
.photo figcaption .origine-photo { justify-self: start; font-size: .72rem; padding: .05rem .45rem; border-radius: 4px; background: #eef2ff; color: #3730a3; }
.photo figcaption .etape-photo { justify-self: start; font-size: .72rem; padding: .05rem .45rem; border-radius: 4px; background: #f3f4f6; color: #374151; }
.photos-passees { background: #eef2ff; border: 1px solid #c7d2fe; color: #3730a3; border-radius: 8px; padding: .5rem .8rem; font-size: .9rem; margin: .25rem 0 .75rem; }

/* ---- Module 6.1.2 : équipes à composition datée (planning, Ma journée) ---- */
.rangee.avec-compo { border-bottom: 0; }
.rangee-compo .rangee-tete { background: #fafaf9; font-weight: 400; padding-top: 0; padding-bottom: .3rem; }
.rangee-compo .rangee-tete small { font-size: .72rem; }
.rangee-compo .piste { padding: 0 0 4px; }
.compo { display: flex; flex-wrap: wrap; align-items: center; gap: 2px .25rem; margin: 0 3px; padding: 2px .3rem; min-height: 26px; border-left: 1px solid var(--border); overflow: hidden; }
.compo.resume { justify-content: center; padding: 2px 0; }
.compo.resume .capa { margin: 0; }
.compo.cible { background: #ecfdf5; outline: 2px dashed #16a34a; outline-offset: -2px; border-radius: 4px; }
.personne { display: inline-block; padding: .05rem .45rem; border-radius: 999px; background: #f1f5f9; border: 1px solid #e2e8f0; font-size: .72rem; }
button.personne { font: inherit; font-size: .72rem; color: inherit; cursor: grab; }
.personne.alternant { background: #fff; border-style: dashed; color: var(--muted); cursor: default; }
.personne.en-cours { opacity: .45; outline: 2px solid #2563eb; }
.personne.ponctuelle { background: #dcfce7; border-color: #86efac; font-weight: 600; }
.personne.detache { text-decoration: line-through; color: var(--muted); }
.personne.ajoutee { background: #eef2ff; border-color: #c7d2fe; color: #3730a3; font-size: .85rem; cursor: default; }
.personne.ajoutee .retirer { border: 0; background: none; color: inherit; cursor: pointer; padding: 0 .1rem; }
.compo .personne { white-space: nowrap; }
.compo .capa { margin-left: auto; flex-shrink: 0; font-size: .72rem; color: var(--muted); font-weight: 600; }
.personnes-liste { display: flex; gap: .35rem; align-items: center; flex-wrap: wrap; margin: .35rem 0; }
.personnes-liste select { width: auto; }
.barre .personnes-phase { margin-top: auto; font-weight: 600; background: rgba(255,255,255,.7); color: #111; border-radius: 4px; padding: 0 .25rem; font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.modale-planning label.checkbox { display: block; font-weight: 400; margin: .3rem 0; }
.note-equipe { flex-basis: 100%; order: 3; margin: 0; color: #3730a3; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 8px; padding: .4rem .8rem; font-size: .88rem; }

/* ---- Module 6.1.3 : tâches du bureau (occupation de voirie…) ---- */
.rangee-bureau { background: #f8fafc; }
.rangee-bureau .rangee-tete small { color: var(--muted); }
.barre.tache-bureau { overflow: visible; white-space: nowrap; z-index: 3; min-width: max-content; border: 0; border-radius: 6px; margin: 5px 1px; padding: .2rem .45rem; font-size: .72rem; text-align: left; display: flex; flex-direction: column; justify-content: center; cursor: pointer; }
.barre.tache-bureau small { font-size: .66rem; opacity: .9; }
.barre.tache-bureau.a-faire { background: #f59e0b; color: #111; }
.barre.tache-bureau.demandee { background: #3b82f6; color: #fff; }
.barre.tache-bureau.accordee { background: #16a34a; color: #fff; }
.barre.tache-bureau.refusee { background: #dc2626; color: #fff; }
.fiche-planif.tache-attente { border-left-color: #64748b; background: #f8fafc; cursor: pointer; }
.pastille-tache { display: inline-block; padding: .05rem .5rem; border-radius: 999px; font-size: .75rem; font-weight: 600; }
.pastille-tache.a-faire { background: #fef3c7; color: #92400e; }
.pastille-tache.demandee { background: #dbeafe; color: #1e40af; }
.pastille-tache.accordee { background: #dcfce7; color: #166534; }
.pastille-tache.refusee { background: #fee2e2; color: #991b1b; }
.taches-a-prevoir label.checkbox { display: block; font-weight: 400; margin: .3rem 0; }
.etats-tache { display: flex; gap: 1rem; flex-wrap: wrap; margin: .2rem 0 .6rem; }
.etats-tache label.checkbox { margin: 0; font-weight: 400; }
.taches-bureau .tache-bureau-ligne { padding: .5rem 0; border-bottom: 1px solid var(--border); }
.taches-bureau .tache-bureau-ligne:last-of-type { border-bottom: 0; }
.taches-bureau .tete { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.taches-bureau p { margin: .2rem 0; }
.taches-bureau details summary { cursor: pointer; color: var(--primary); font-size: .9rem; }
.taches-bureau .form-tache { margin-top: .5rem; display: grid; gap: .5rem; }
dialog.creer-chantier form { padding: 1.25rem 1.5rem; }
dialog.creer-chantier fieldset { border: 1px solid var(--border); border-radius: 8px; padding: .6rem .9rem; margin: 0 0 .75rem; }
dialog.creer-chantier legend { font-weight: 600; padding: 0 .3rem; }

/* ---- Base TEST : bandeau, pages Paramétrage › Base TEST (absent en production) ---- */
.bandeau-base-test { display: flex; gap: .3rem 1rem; align-items: center; flex-wrap: wrap; padding: .4rem 1rem; background: repeating-linear-gradient(135deg, #6d28d9 0 14px, #7c3aed 14px 28px); color: #fff; font-size: .88rem; position: sticky; top: 0; z-index: 90; }
.bandeau-base-test .marque-bt { letter-spacing: .08em; background: #fff; color: #6d28d9; padding: .05rem .5rem; border-radius: 4px; }
.bandeau-base-test .liens { margin-left: auto; display: flex; gap: .9rem; flex-wrap: wrap; }
.bandeau-base-test a { color: #fff; text-decoration: underline; }
.bandeau-base-test a i { font-style: normal; background: #fff; color: #6d28d9; border-radius: 999px; padding: 0 .4rem; font-size: .75rem; font-weight: 700; }
body.base-test .lateral, body.base-test .barre-haut { top: 2.1rem; }
body.base-test .lateral { height: calc(100vh - 2.1rem); }
.lateral .menu-liste .desactive { display: flex; align-items: center; padding: .42rem .6rem .42rem 1.9rem; opacity: .45; cursor: not-allowed; text-decoration: line-through; color: var(--nuit-texte); }
.nas.simule { color: #6d28d9; font-weight: 600; }
@media (max-width: 700px) { .bandeau-base-test { font-size: .75rem; padding: .3rem .8rem; } .bandeau-base-test .long, .bandeau-base-test .liens { display: none; } }
.bt-grille { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; align-items: start; margin-bottom: 1rem; }
@media (max-width: 900px) { .bt-grille { grid-template-columns: 1fr; } }
.bt-etat { display: grid; grid-template-columns: 12rem 1fr; gap: .45rem 1rem; margin: 0 0 1rem; } .bt-etat dt { color: var(--muted); } .bt-etat dd { margin: 0; }
.bt-actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-bottom: .6rem; }
.bt-qr svg { width: 180px; height: 180px; display: block; margin: .3rem 0 .8rem; border: 1px solid var(--border); }
.bt-etapes { padding-left: 1.2rem; margin: 0 0 .8rem; } .bt-etapes li { margin: .3rem 0; color: var(--muted); } .bt-etapes li.fait { color: #166534; } .bt-etapes li.fait::after { content: ' ✓'; } .bt-etapes li.encours { color: #6d28d9; font-weight: 600; }
.bt-barre { height: 8px; background: #ede9fe; border-radius: 999px; overflow: hidden; margin-bottom: .6rem; } .bt-barre i { display: block; height: 100%; background: #7c3aed; transition: width .4s; }
.bt-boite { display: grid; grid-template-columns: 1fr 2fr; gap: 1rem; } @media (max-width: 900px) { .bt-boite { grid-template-columns: 1fr; } }
.bt-liste ul { list-style: none; margin: 0; padding: 0; } .bt-liste li a { padding: .6rem .7rem; border-radius: 8px; display: flex; flex-direction: column; gap: .15rem; color: inherit; text-decoration: none; } .bt-liste li span { font-size: .82rem; color: var(--muted); } .bt-liste li.actif a { background: #f5f3ff; outline: 1px solid #ddd6fe; }
.bt-message dl { display: grid; grid-template-columns: 7rem 1fr; gap: .3rem .8rem; margin: 0 0 1rem; } .bt-message dt { color: var(--muted); } .bt-message dd { margin: 0; }
.bt-corps { border-top: 1px solid var(--border); padding-top: .8rem; line-height: 1.5; }
.bt-corps-html { width: 100%; min-height: 420px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.bt-simule { margin: 1rem 0 0; color: #6d28d9; font-weight: 600; }
.bt-op { display: inline-block; padding: .05rem .5rem; border-radius: 999px; font-size: .78rem; font-weight: 600; } .bt-op.cree { background: #dcfce7; color: #166534; } .bt-op.modifie { background: #dbeafe; color: #1e40af; } .bt-op.supprime { background: #fee2e2; color: #991b1b; } .bt-op.envoi { background: #ede9fe; color: #5b21b6; }

/* ---- Module 2.13 : option partielle d'un chapitre. Case « Opt. » sous la liste Type ; les lignes en option sont
   regroupées en fin de chapitre, sous l'intertitre « Options du chapitre », sur le fond des chapitres en option. ---- */
table.devis .option-ligne { display: flex; gap: .25rem; align-items: center; font-size: .75rem; color: var(--muted); margin-top: .2rem; white-space: nowrap; cursor: pointer; }
table.devis .option-ligne input { width: auto; margin: 0; }
table.devis tr.intertitre-options td { background: #d6e6f8; font-weight: 600; font-size: .85rem; padding-top: .5rem; }
/* Module 2.14 : règles de TVA — nature de la ligne au-dessus du taux, taux manuel signalé, moins-value calculée. */
table.devis.grille td.tva .tva-regles { display: flex; gap: .25rem; align-items: center; }
table.devis th.col-opt, table.devis td.col-opt { width: 1%; white-space: nowrap; text-align: center; }
table.devis td.col-opt .option-ligne, table.devis td.col-opt .option-case { margin-top: 0; justify-content: center; }
/* Devis avec régime : la colonne TVA porte la nature (liste) et le taux, côte à côte. */
table.devis.grille.avec-regles th.tva { width: 15.5rem; }
table.devis.grille td.tva select.nature-tva { color: var(--muted); font-size: .78rem; flex: 1 1 auto; min-width: 0; }
table.devis.grille td.tva .tva-regles select[name="taux_tva"] { flex: 0 0 6.2rem; }
table.devis select.taux-manuel, table.devis span.taux-manuel { color: #92400e; }
table.devis tr.moins-value td { background: #f0fdf4; font-style: italic; }
table.devis tr.sous-total-options-ligne td { color: var(--muted); background: #e8f1fc; }
/* Devis — chapitres en option (demande d'Arnaud du 25/09/2026) : en-tête, lignes et sous-total du chapitre sur fond
   bleu clair, le même fond que la mention « Options … non comprises dans les totaux » sous les totaux. Depuis la fusion du
   module 2.13 (28/09/2026), les lignes en option d'un chapitre (« Options du chapitre ») ont le même fond. */
table.devis tr.chapitre.option td, table.devis tr.en-option:not(.en-erreur):not(.nouvelle):not(.futur-chapitre) td { background: #e8f1fc; }
table.devis.grille tr.chapitre.en-option td { background: #d6e6f8; }
table.devis.grille tr.en-option.style-mise-en-avant:not(.en-erreur):not(.nouvelle) td.designation { background-color: #fef9c3; }
.pied-devis .option-hors-total { background: #e8f1fc; color: var(--text); border-radius: 6px; padding: .45rem .7rem; }

/* ---- Module 2.15 : prix des ouvrages de l'ERP dans le devis WebODM ---- */
.bloc-webodm { border-left: 4px solid #0d9488; }
.webodm-champ { border: 1px solid var(--border); border-radius: 8px; padding: .8rem 1rem; margin: 1rem 0; }
.webodm-champ legend { font-weight: 600; padding: 0 .3rem; }
.webodm-champ select.erreur-champ { border-color: #b91c1c; }
.webodm-champ .erreurs { color: #b91c1c; margin: .3rem 0; padding-left: 1.1rem; font-size: .9rem; }
.webodm-champ .aide { color: var(--muted); font-size: .85rem; margin: .3rem 0 0; }
.etq-sans { display: inline-block; font-size: .75rem; padding: .05rem .5rem; border-radius: 999px; background: #fff7ed; color: #9a3412; font-weight: 600; }
table.liens-webodm td { vertical-align: top; }
table.liens-webodm details.relier { display: inline-block; text-align: left; }
table.liens-webodm details.relier summary { list-style: none; cursor: pointer; }
table.liens-webodm details.relier summary::-webkit-details-marker { display: none; }
table.liens-webodm details.relier[open] form { display: flex; gap: .4rem; margin-top: .4rem; align-items: center; }
table.liens-webodm details.relier select { max-width: 28rem; }

/* ---- Module 2.16 : import de devis Batappli en PDF ---- */
.etq-batappli { display: inline-block; font-size: .72rem; padding: .05rem .5rem; border-radius: 999px; background: #f1f5f9; color: #334155; font-weight: 600; border: 1px solid #cbd5e1; white-space: nowrap; }
.origine-batappli { font-size: .85rem; color: #334155; background: #f1f5f9; border: 1px solid #cbd5e1; border-radius: 999px; padding: .15rem .7rem; }
.import-pdf { margin-bottom: 1rem; border-left: 4px solid #16a34a; }
.import-pdf.avert { border-left-color: #d97706; }
.import-pdf.ko { border-left-color: #b91c1c; background: #fffafa; }
.import-pdf header { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; margin-bottom: .6rem; }
.import-pdf .objet { color: var(--muted); margin-top: .2rem; }
.import-pdf .controle { font-weight: 600; font-size: .85rem; white-space: nowrap; }
.import-pdf .controle.ok { color: #15803d; } .import-pdf .controle.ko { color: #b91c1c; }
.import-pdf .chiffres-import { margin: .6rem 0; }
.import-pdf details summary { cursor: pointer; color: var(--primary); }
.import-pdf .valeur { margin: .3rem 0; }
.form-import-pdf label { display: block; font-weight: 500; margin-bottom: .3rem; }
.form-import-pdf label.checkbox { display: flex; gap: .4rem; align-items: center; font-weight: 400; }
.form-import-pdf select, .form-import-pdf input[type=text] { width: 100%; }
.form-import-pdf .client-autre { margin-top: .3rem; }
.form-import-pdf .form-help { display: block; color: var(--muted); font-size: .82rem; margin-top: .25rem; }
.flash-avert { background: #fffbeb; border: 1px solid #fcd34d; color: #92400e; padding: .6rem .9rem; border-radius: 8px; margin: .4rem 0 .8rem; }
.flash-avert .checkbox { margin-top: .3rem; }

/* ---- Module 5.1.4 — Conditionnement fournisseur des articles ---- */
.fiche-article table.sous td.actions { white-space: normal; width: 12rem; text-align: right; }
.fiche-article table.sous td.actions .btn { margin: 0 0 .3rem .2rem; }
.fiche-article table.sous td.actions form.inline { display: inline-block; }
.fiche-article td.conditionnement strong { font-weight: 600; }
.fiche-article table.sous td .sous.prix-lot { color: var(--text); }
fieldset.cadre-conditionnement { border: 1px solid var(--border); border-radius: 8px; padding: .5rem .9rem .75rem; margin: 0; }
fieldset.cadre-conditionnement legend { font-weight: 600; font-size: .9rem; padding: 0 .3rem; }
.ligne-cond { display: grid; grid-template-columns: 9rem 1fr; gap: 0 .75rem; }
.avec-unite { display: flex; align-items: center; gap: .4rem; }
.avec-unite input { min-width: 0; }
.avec-unite span { color: var(--muted); }
.apercu-lot { margin: .6rem 0 0; font-size: .9rem; color: var(--muted); }
.apercu-lot strong { color: var(--text); }
table.sous td .sous.info-lot, .info-lot { display: block; font-size: .85rem; color: #1e3a8a; margin-top: .2rem; }
@media (max-width: 560px) { .ligne-cond { grid-template-columns: 1fr; } }

/* Liste des clients sur une ligne par client (01/10/2026, demandes d'Arnaud) : rien ne passe à la ligne, l'adresse
   reste entière ; le nom et l'email trop longs sont coupés par « … » (texte entier au survol) ; les colonnes
   Téléphone, Devis, Chantiers et le bouton prennent juste la place de leur contenu. */
table.liste-clients th, table.liste-clients td { white-space: nowrap; }
main.page-clients { max-width: 1600px; }
/* L'adresse reste lisible en entier : sur une ligne, elle ne passe à la ligne que si l'écran manque de place. */
table.liste-clients td:nth-child(2) { white-space: normal; min-width: 12rem; }
table.liste-clients th, table.liste-clients td { padding: .4rem .6rem; }
table.liste-clients .coupe { display: block; overflow: hidden; text-overflow: ellipsis; }
table.liste-clients td:nth-child(1) .coupe { max-width: 14rem; }
table.liste-clients td:nth-child(4) .coupe { max-width: 13rem; }
table.liste-clients th:nth-child(n+5), table.liste-clients td:nth-child(n+5),
table.liste-clients th:nth-child(3), table.liste-clients td:nth-child(3) { width: 1%; }

/* ---- Module 1.5 : indicateurs de la page Chantiers (tuiles en deux groupes, filtre par indicateur) ---- */
.indicateurs { display: grid; grid-template-columns: 4fr 3fr; gap: 1rem; margin-bottom: 1rem; }
.groupe-indic h2 { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 0 0 .35rem; font-weight: 600; }
.grille-indic { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .6rem; }
.indic { background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--theme); border-radius: 10px; padding: .6rem .8rem; display: flex; flex-direction: column; gap: .1rem; color: var(--text); text-decoration: none; transition: box-shadow .15s, border-color .15s; }
.indic:hover { border-color: var(--theme); box-shadow: 0 2px 8px rgba(0,0,0,.08); text-decoration: none; }
.indic.actif { border-color: var(--theme); box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme) 35%, transparent); background: color-mix(in srgb, var(--theme) 5%, #fff); }
.indic .tete { display: flex; align-items: center; gap: .45rem; }
.indic .ico-theme { width: 26px; height: 26px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--theme) 14%, #fff); color: var(--theme); flex: none; }
.indic .ico-theme svg { width: 15px; height: 15px; }
.indic .lib { font-size: .72rem; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; line-height: 1.2; }
.indic .aide { margin-left: auto; color: #9ca3af; font-size: .85rem; cursor: help; }
.indic .val { font-size: 1.45rem; font-weight: 650; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--theme-texte, var(--theme)); margin-top: .2rem; white-space: nowrap; }
.indic .val small { font-size: .78rem; font-weight: 500; color: var(--muted); letter-spacing: 0; }
.indic .note { font-size: .78rem; color: var(--muted); line-height: 1.3; }
.indic .signal { font-size: .76rem; font-weight: 600; color: var(--theme-texte, var(--theme)); margin-top: .15rem; }
.indic .signal::before { content: "● "; }
.indic.calme { --theme: #9ca3af !important; }
.indic.calme .val { color: #6b7280; }
.filtre-indicateur { display: flex; align-items: center; gap: 1rem; background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; border-radius: 8px; padding: .45rem .8rem; margin-bottom: .75rem; font-size: .9rem; }
.filtre-indicateur a { margin-left: auto; color: #9a3412; font-weight: 600; text-decoration: none; white-space: nowrap; }
table.list tr.ligne-alerte td { background: #fffbeb; }
@media (max-width: 1900px) { .indicateurs { grid-template-columns: 1fr; gap: .6rem; } }
@media (max-width: 720px) { .grille-indic { grid-template-columns: 1fr 1fr; } .indic .val { font-size: 1.2rem; } }

/* ---- Module 1.6 : indicateurs de la fiche d'un chantier (camemberts en anneau, briques, ruban dans le temps) ---- */
.indicateurs-chantier h2 { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.indicateurs-chantier h2 .petit { font-weight: 400; font-size: .8rem; }
.indic-haut { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: .75rem; margin-bottom: .75rem; }
.indic-bas { display: grid; grid-template-columns: 1fr 2fr; gap: .75rem; }
.carte-indic { border: 1px solid var(--border); border-left: 4px solid #cbd5e1; border-radius: 10px; padding: .7rem .9rem; background: #fff; min-width: 0; }
.carte-indic.alerte-orange { border-left-color: #ea580c; }
.carte-indic.alerte-rouge { border-left-color: #dc2626; }
.carte-indic h3 { margin: 0 0 .5rem; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; display: flex; align-items: center; gap: .4rem; }
.carte-indic .conclusion { margin: .55rem 0 0; font-size: .85rem; color: var(--text); }
.carte-indic .signal { font-weight: 600; } .carte-indic .signal.orange { color: #c2410c; } .carte-indic .signal.rouge { color: #dc2626; }
.carte-indic .graphe { display: flex; align-items: center; gap: .9rem; }
svg.anneau { width: 118px; height: 118px; flex: none; }
svg.anneau .seg { transition: stroke-width .12s; }
svg.anneau .seg:hover { stroke-width: 19; }
svg.anneau .centre { font-size: 21px; font-weight: 700; fill: var(--text); font-variant-numeric: tabular-nums; }
svg.anneau .centre-sous { font-size: 10px; fill: var(--muted); }
.legende-graphe { list-style: none; margin: 0; padding: 0; flex: 1; min-width: 0; font-size: .84rem; }
.legende-graphe li { display: flex; align-items: center; gap: .45rem; padding: .18rem 0; }
.legende-graphe .lib { color: var(--muted); flex: 1; }
.legende-graphe b { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.legende-graphe .total { border-top: 1px solid var(--border); margin-top: .2rem; padding-top: .35rem; }
.legende-graphe .seuil .trait { width: 10px; height: 3px; background: #111827; border-radius: 2px; }
.carte-indic .pastille, .legende-ruban .pastille { width: 10px; height: 10px; border-radius: 3px; flex: none; display: inline-block; }
.carte-indic .grand { margin: 0 0 .4rem; font-size: 1.35rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.carte-indic .grand small { font-size: .82rem; font-weight: 400; color: var(--muted); }
.briques { display: flex; flex-wrap: wrap; gap: 3px; margin-bottom: .45rem; align-items: center; }
.briques .plus { font-size: .78rem; color: var(--muted); margin-left: .3rem; }
.carte-indic .b { display: inline-block; width: 16px; height: 16px; border-radius: 4px; }
.carte-indic .b.passe { background: #1d4ed8; } .carte-indic .b.avenir { background: #93c5fd; } .carte-indic .b.aposer { background: #fff; border: 1.5px dashed #94a3b8; }
.carte-indic .b.entrop { background: #dc2626; } .carte-indic .b.entrop.termine { background: #fca5a5; }
.legende-briques, .legende-ruban { list-style: none; margin: 0 0 .3rem; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem .9rem; font-size: .78rem; color: var(--muted); }
.legende-briques li, .legende-ruban li { display: inline-flex; align-items: center; gap: .3rem; }
.legende-briques .b { width: 11px; height: 11px; border-radius: 3px; }
.frise-temps { display: grid; gap: .45rem; margin-bottom: .4rem; }
.ruban-ligne { display: grid; grid-template-columns: 6.5rem 1fr; align-items: center; gap: .6rem; }
.ruban-titre { font-size: .82rem; color: var(--muted); text-align: right; }
.ruban { display: flex; gap: 2px; height: 28px; }
.seg-ruban { background: var(--c); color: #fff; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: .78rem; min-width: 2.4rem; }
.seg-ruban b { font-weight: 600; }
.seg-ruban.en-cours { background: repeating-linear-gradient(135deg, var(--c) 0 7px, color-mix(in srgb, var(--c) 70%, #fff) 7px 12px); }
.seg-ruban.alerte { box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #111827; }
.ruban-ligne.moyenne .seg-ruban { background: color-mix(in srgb, var(--c) 40%, #fff); color: #12181f; } /* audit code navigateur, constat 7 : teinte pâle, texte foncé lisible */
.ruban-ligne.moyenne .seg-ruban.en-cours { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--c) 40%, #fff) 0 7px, color-mix(in srgb, var(--c) 25%, #fff) 7px 12px); }
.legende-ruban .pastille.hachure { background: repeating-linear-gradient(135deg, #64748b 0 3px, #cbd5e1 3px 6px); }
@media (max-width: 1250px) { .indic-bas { grid-template-columns: 1fr; } }
@media (max-width: 720px) { .ruban-ligne { grid-template-columns: 1fr; } .ruban-titre { text-align: left; } .carte-indic .graphe { flex-wrap: wrap; } }

/* ---- Module 8.1 : marges (Analyse › Marges, carte Marge, onglet Dépenses) ---- */
#indicateurs-chantier .indic-bas { grid-template-columns: 1fr 1fr 2fr; }
@media (max-width: 1400px) { #indicateurs-chantier .indic-bas { grid-template-columns: 1fr 1fr; } #indicateurs-chantier .indic-bas .large { grid-column: 1 / -1; } }
@media (max-width: 720px) { #indicateurs-chantier .indic-bas { grid-template-columns: 1fr; } }
.marges-tuiles { grid-template-columns: repeat(4, 1fr); margin-bottom: 1rem; }
table.marges td.repart { width: 11rem; }
.mini-repartition { display: flex; gap: 1px; height: 12px; border-radius: 3px; overflow: hidden; background: #f1f5f9; min-width: 6rem; }
.mini-repartition span { display: block; height: 100%; }
.mini-repartition.depasse { outline: 2px solid #dc2626; outline-offset: 1px; }
.marge-vert { color: #15803d; } .marge-orange { color: #c2410c; } .marge-rouge { color: #dc2626; }
table.list tr.ligne-orange td { background: #fff7ed; } table.list tr.ligne-rouge td { background: #fef2f2; }
table.marges tfoot td { border-top: 2px solid var(--border); background: #f8fafc; }
.legende-marge { margin: .6rem 0; }
.form-depense { border-top: 1px solid var(--border); margin-top: 1rem; padding-top: .8rem; }
.form-depense h3 { font-size: .95rem; margin: 0 0 .5rem; }
.erreur-champ { border-color: #dc2626 !important; }
details.modifier-depense { display: inline-block; }
details.modifier-depense[open] { display: block; text-align: left; margin-bottom: .5rem; }
details.modifier-depense summary { list-style: none; }
details.modifier-depense summary::-webkit-details-marker { display: none; }
@media (max-width: 1100px) { .marges-tuiles { grid-template-columns: 1fr 1fr; } }

/* ---- Devis : icône d'ajout de photos et grille lisible sur téléphone (demande d'Arnaud du 02/10/2026) ---- */
.ajout-photo-icone { display: inline-flex; align-items: center; gap: .4rem; margin-left: .4rem; vertical-align: middle; }
.ajout-photo-icone label.btn-icone { cursor: pointer; min-height: 32px; padding: .2rem .45rem; color: var(--muted); }
.ajout-photo-icone label.btn-icone:hover { color: var(--text); }
.ajout-photo-icone label.btn-icone svg { width: 1.15rem; height: 1.15rem; }
.ajout-photo-icone .btn.desactive { opacity: .5; pointer-events: none; }
/* Sur téléphone, chaque ligne devient une petite carte : numéro + désignation sur toute la largeur, puis type,
   prix, quantité, unité, TVA et total en dessous ; les boutons ↑ ↓ ✕ restent visibles (pas de survol au doigt). */
@media (max-width: 720px) {
  table.devis.grille { display: block; width: 100%; min-width: 0; border: 0; background: transparent; font-size: .95rem; }
  table.devis.grille thead { display: none; }
  table.devis.grille tbody { display: block; }
  table.devis.grille tr { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .3rem; padding: .4rem .3rem; background: var(--surface); border-bottom: 1px solid var(--border); }
  table.devis.grille td { display: block; border: 0; padding: .1rem; background: transparent; }
  table.devis.grille tr.chapitre td, table.devis.grille tr.vide td, table.devis.grille tr.sous-total td { background: transparent; }
  table.devis.grille tr.chapitre { background: #f3f4f6; border-top: 1px solid var(--border); }
  table.devis.grille tr.chapitre.en-option { background: #d6e6f8; }
  table.devis.grille tr.en-option:not(.chapitre) { background: #e8f1fc; }
  table.devis.grille tr.vide { background: #fcfcfd; }
  table.devis.grille tr.sous-total { background: #fafafa; }
  table.devis.grille td.ordre { order: 0; flex: 0 0 auto; min-width: 2rem; text-align: left; padding-right: .2rem; }
  table.devis.grille td.designation, table.devis.grille td[colspan] { order: 1; flex: 1 1 calc(100% - 3rem); min-width: 0; }
  table.devis.grille tr.sous-total td[colspan] { flex-basis: 100%; }
  table.devis.grille td.type { order: 2; flex: 0 0 6.2rem; }
  table.devis.grille td.type select { font-size: .8rem; }
  table.devis.grille tr.chapitre td.type, table.devis.grille tr.nota td:empty, table.devis.grille tr.intertitre-options td:empty { display: none; }
  table.devis.grille td:not(.ordre):not(.designation):not([colspan]):not(.type) { order: 3; flex: 0 0 auto; }
  table.devis.grille td input[name=prix_unitaire] { width: 5.8rem; }
  table.devis.grille td input[name=quantite] { width: 4.2rem; }
  table.devis.grille td select[name=unite] { width: 4.6rem; }
  table.devis.grille td select[name=taux_tva] { width: 6rem; }
  table.devis.grille td.tva.avec-regles { flex-basis: 100%; }
  table.devis.grille td.montant { margin-left: auto; font-weight: 600; }
  table.devis.grille td.col-opt { width: auto; }
  table.devis.grille td.actions { order: 4; display: flex; flex-wrap: nowrap; align-items: center; gap: .15rem; margin-left: auto; }
  table.devis.grille td.actions form { margin: 0; }
  table.devis.grille tr.chapitre td.col-opt .option-case { margin: 0; }
  table.devis.grille td.actions .btn-icone { visibility: visible; padding: .25rem .5rem; }
  table.devis.grille textarea { min-height: 2.2rem; }
  /* Petits repères au-dessus des champs chiffrés en saisie. */
  table.devis.grille td:has(> input[name=prix_unitaire])::before { content: "P.U. HT"; }
  table.devis.grille td:has(> input[name=quantite])::before { content: "Qté"; }
  table.devis.grille td:has(> input[name=prix_unitaire])::before, table.devis.grille td:has(> input[name=quantite])::before { display: block; font-size: .68rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
  .ajout-photo-icone label.btn-icone { min-height: 40px; padding: .3rem .6rem; }
}
.ajout-photo-icone select.etape-photo-icone { width: auto; padding: .15rem .3rem; font-size: .8rem; color: var(--muted); border-radius: 6px; }
.ajout-photo-icone details.choix-photo { position: relative; }
.ajout-photo-icone details.choix-photo summary { list-style: none; cursor: pointer; min-height: 32px; padding: .2rem .45rem; color: var(--muted); }
.ajout-photo-icone details.choix-photo summary::-webkit-details-marker { display: none; }
.ajout-photo-icone details.choix-photo summary svg { width: 1.15rem; height: 1.15rem; }
.ajout-photo-icone details.choix-photo[open] summary { color: var(--text); background: #fff; }
.ajout-photo-icone .choix-photo-menu { position: absolute; top: calc(100% + .3rem); left: 0; z-index: 30; display: flex; flex-direction: column; min-width: 15rem; padding: .3rem; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 8px 24px rgba(15, 23, 42, .12); }
.ajout-photo-icone .choix-photo-menu label { display: flex; align-items: center; gap: .5rem; margin: 0; padding: .6rem .7rem; border-radius: 6px; font-size: .95rem; font-weight: 500; cursor: pointer; white-space: nowrap; }
.ajout-photo-icone .choix-photo-menu label:hover { background: #f3f4f6; }
.ajout-photo-icone.envoi-en-cours details { opacity: .5; pointer-events: none; }
@media (max-width: 720px) { .ajout-photo-icone details.choix-photo summary { min-height: 40px; padding: .3rem .6rem; } }
.ajout-photo-icone .choix-photo-menu button { display: flex; align-items: center; gap: .5rem; padding: .6rem .7rem; border: 0; border-radius: 6px; background: none; font: inherit; font-size: .95rem; font-weight: 500; color: var(--text); text-align: left; cursor: pointer; white-space: nowrap; }
.ajout-photo-icone .choix-photo-menu button[hidden] { display: none; }
.ajout-photo-icone .choix-photo-menu button:hover { background: #f3f4f6; }
/* « Série de photos » : appareil photo plein écran dans la page (photos-chantier.js). */
dialog.rafale-photos { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: #000; color: #fff; overflow: hidden; }
dialog.rafale-photos::backdrop { background: #000; }
dialog.rafale-photos[open] { display: block; }
dialog.rafale-photos video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; }
dialog.rafale-photos.flash video { opacity: .3; }
dialog.rafale-photos .rafale-haut { position: absolute; top: 0; left: 0; right: 0; display: flex; justify-content: space-between; align-items: center; padding: .8rem; background: linear-gradient(rgba(0,0,0,.6), transparent); }
dialog.rafale-photos .rafale-nombre { font-size: 1rem; }
dialog.rafale-photos .rafale-message { position: absolute; top: 4rem; left: 1rem; right: 1rem; margin: 0; text-align: center; font-size: 1rem; text-shadow: 0 1px 3px #000; }
dialog.rafale-photos .rafale-bas { position: absolute; left: 0; right: 0; bottom: 0; padding: .6rem .8rem calc(1rem + env(safe-area-inset-bottom)); background: linear-gradient(transparent, rgba(0,0,0,.75)); }
dialog.rafale-photos .rafale-bande { display: flex; gap: .4rem; overflow-x: auto; min-height: 3.6rem; margin-bottom: .6rem; }
dialog.rafale-photos .rafale-bande img { height: 3.4rem; width: auto; border-radius: 4px; border: 2px solid #fff; flex: 0 0 auto; }
dialog.rafale-photos .rafale-commandes { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
dialog.rafale-photos .rafale-commandes .btn-primary { justify-self: end; }
dialog.rafale-photos .rafale-declencheur { width: 4.6rem; height: 4.6rem; border-radius: 50%; border: 5px solid #fff; background: rgba(255,255,255,.35); cursor: pointer; }
dialog.rafale-photos .rafale-declencheur:active { background: #fff; }
dialog.rafale-photos .rafale-declencheur:disabled { opacity: .4; }
/* Accès direct aux applications de guidage (02/10/2026) : Waze · Google Maps · Apple Plans */
.itineraires { display: inline-flex; flex-wrap: wrap; gap: .4rem; vertical-align: middle; }
dl.infos dd .itineraires { margin-left: .5rem; }
dl.infos dd .itineraires .btn-contact { margin-left: 0; }
.itineraire-waze svg.ico { color: #0891b2; }
/* Fiche client : carte de contact au-dessus du formulaire (02/10/2026) */
.carte-client { display: flex; flex-direction: column; gap: .3rem; margin-bottom: 1rem; }
.carte-client .identite { display: flex; flex-direction: column; gap: .2rem; }
.carte-client .identite b { font-size: 1.1rem; }
.carte-client .adresse { color: var(--muted); display: inline-flex; gap: .3rem; align-items: center; }
.carte-client .contacts { margin: .4rem 0 0; }
.carte-client .rattaches { display: flex; flex-wrap: wrap; gap: .4rem; margin: .3rem 0 0; }
.carte-client .tag-lien { display: inline-block; padding: .2rem .65rem; border-radius: 999px; background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; font-size: .85rem; text-decoration: none; }
@media (max-width: 720px) {
  /* Une seule colonne : les champs « larges » ou « moyens » ne doivent plus créer de colonne fantôme. */
  .form-grid-3 .large, .form-grid-3 .moyen { grid-column: 1 / -1; }
  .carte-client .contacts, .carte-client .itineraires { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; width: 100%; }
  .carte-client .contacts > .itineraires { grid-column: 1 / -1; grid-template-columns: repeat(3, 1fr); }
  .carte-client .contacts .btn-contact { justify-content: center; min-height: 44px; font-size: .95rem; }
  .form-client .form-actions .btn { flex: 1; justify-content: center; min-height: 44px; }
  .itineraires .btn-contact { min-height: 40px; }
}

/* ---- Module 2.17 : remise sur le devis (maquette /maquettes/remise-devis validée le 02/10/2026) ---- */
.pied-devis table.totaux tr.remise td { color: #9a3412; }
.pied-devis table.totaux tr.remise td small { color: var(--muted); font-weight: 400; }
.pied-devis table.totaux tr.nouveau-total td { font-weight: 600; border-top: 1px solid var(--text); }
.carte-totaux .actions-remise { display: flex; gap: .4rem; justify-content: flex-end; margin-top: .6rem; flex-wrap: wrap; }
.carte-totaux .actions-remise form { margin: 0; }
.mention-remise { font-size: .8rem; color: var(--muted); margin: .4rem 0 0; }
.fenetre-remise form { padding: 1.2rem 1.4rem; }
.fenetre-remise .choix-mode { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin: .8rem 0 1rem; }
.fenetre-remise .choix-mode label { display: flex; flex-direction: column; gap: .15rem; border: 1px solid var(--border); border-radius: 8px; padding: .55rem .7rem; cursor: pointer; font-weight: 600; font-size: .92rem; margin: 0; }
.fenetre-remise .choix-mode label small { font-weight: 400; color: var(--muted); font-size: .78rem; }
.fenetre-remise .choix-mode label.choisi { border-color: var(--primary); background: #fff7ed; box-shadow: 0 0 0 1px var(--primary); }
.fenetre-remise .choix-mode input { position: absolute; opacity: 0; pointer-events: none; }
.fenetre-remise .choix-mode label:focus-within { outline: 2px solid #fcd34d; }
.fenetre-remise .saisie-remise { display: flex; align-items: center; gap: .5rem; }
.fenetre-remise .saisie-remise input { flex: 0 0 11rem; width: 11rem; font-size: 1.15rem; text-align: right; padding: .45rem .6rem; }
.fenetre-remise .saisie-remise input.en-erreur { border-color: #b91c1c; outline: 2px solid #fecaca; }
.fenetre-remise .saisie-remise .unite { font-weight: 600; }
.fenetre-remise .erreur-remise { color: #b91c1c; font-size: .9rem; margin: .4rem 0 0; }
.fenetre-remise .apercu-remise { margin-top: 1rem; background: #f9fafb; border: 1px solid var(--border); border-radius: 8px; padding: .6rem .8rem; }
.fenetre-remise .apercu-remise table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.fenetre-remise .apercu-remise td { padding: .2rem .3rem; }
.fenetre-remise .apercu-remise td:last-child { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fenetre-remise .apercu-remise tr.fort td { font-weight: 700; }
.fenetre-remise .apercu-remise tr.calcule td { color: #9a3412; }

/* ---- Module 0.11 : affichage sur téléphone, tablette et grand écran (décisions 1a 2a 3a du 02/10/2026) ----
   Ordinateur : toutes les pages jusqu'à 1 600 px comme la liste des clients ; les formulaires de saisie
   (main.formulaire) restent à 1 100 px pour que les champs ne s'étirent pas. Ma journée garde sa colonne de 900 px. */
.container, main.liste-page, main.fiche-chantier { max-width: 1600px; }
.container.formulaire { max-width: 1100px; }

/* Pages en deux colonnes qui passent en une seule : la colonne ne doit jamais s'élargir au contenu (grille du planning,
   aperçu des trames), sinon toute la page déborde de l'écran. */
@media (max-width: 1100px) {
  .page-planning, .trames, .editeur-trame { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) { .agenda { grid-template-columns: repeat(3, 1fr); } }

/* Grille du devis sur tablette (721 à 1 100 px) : la désignation garde toujours une largeur lisible ; les colonnes
   chiffrées se resserrent et la TVA (nature + taux) passe sur deux lignes au lieu de deux listes côte à côte. */
@media (min-width: 721px) and (max-width: 1100px) {
  table.devis.grille { font-size: .85rem; }
  table.devis.grille td.designation { min-width: 13rem; }
  table.devis.grille th.ordre { width: 2rem; }
  table.devis.grille th.type { width: 6.4rem; }
  table.devis.grille th.num { width: 4.8rem; }
  table.devis.grille th.unite { width: 3.8rem; }
  table.devis.grille th.tva, table.devis.grille.avec-regles th.tva { width: 6.6rem; }
  table.devis.grille th.montant { width: 5.8rem; }
  table.devis.grille th.col-actions { width: 5.2rem; }
  table.devis.grille td.tva .tva-regles { flex-direction: column; align-items: stretch; gap: .1rem; }
  table.devis.grille td.tva .tva-regles select[name="taux_tva"] { flex: none; }
  table.devis.grille td.actions .btn-icone { padding: .1rem .25rem; }
  table.devis.grille td.col-opt .option-case { font-size: 0; gap: 0; }
}

/* Téléphone et tablette en portrait (≤ 900 px) : chaque ligne d'une liste ou d'un petit tableau devient une carte. La première case sert de titre ; les
   autres s'affichent « TITRE …… valeur » (titres recopiés par public/js/tableaux-mobiles.js). Les titres de colonne
   cliquables restent au-dessus, en pastilles, pour trier. */
@media (max-width: 900px) {
  table.en-cartes, table.en-cartes > tbody, table.en-cartes > tfoot { display: block; width: 100%; min-width: 0; border: 0; background: transparent; }
  .table-wrap:has(> table.en-cartes) { overflow: visible; border: 0; background: transparent; box-shadow: none; }
  table.en-cartes > thead { display: block; }
  table.en-cartes > thead:not(:has(a)) { display: none; }
  table.en-cartes > thead > tr { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: .6rem; background: transparent; border: 0; }
  table.en-cartes > thead > tr > th { display: none; }
  table.en-cartes > thead > tr > th:has(a) { display: block; padding: 0; border: 0; background: transparent; width: auto !important; }
  table.en-cartes > thead > tr > th:has(a) a { display: inline-flex; align-items: center; gap: .25rem; padding: .3rem .7rem; border: 1px solid var(--border); border-radius: 999px; background: #fff; font-size: .75rem; min-height: 32px; text-decoration: none; }
  table.en-cartes > thead > tr > th.tri a { border-color: var(--primary); color: var(--primary); }
  /* Une carte = la première case en titre sur toute la largeur, puis les autres en deux colonnes « titre au-dessus,
     valeur dessous » ; les boutons en haut à droite ; les cases vides (« — ») ne prennent pas de place. */
  table.en-cartes > tbody > tr, table.en-cartes > tfoot > tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .3rem .9rem; align-content: start; position: relative; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: .55rem .8rem .6rem; margin-bottom: .55rem; }
  table.en-cartes > tfoot > tr { background: #f9fafb; }
  table.en-cartes > tbody > tr > td, table.en-cartes > tfoot > tr > td, table.en-cartes > tbody > tr > th, table.en-cartes > tfoot > tr > th {
    display: block; border: 0; padding: 0; text-align: left !important; white-space: normal !important; min-width: 0 !important; width: auto !important; max-width: none !important; opacity: 1; background: transparent !important; overflow-wrap: anywhere; font-size: .92rem; line-height: 1.35;
  }
  table.en-cartes > tbody > tr > td::before, table.en-cartes > tfoot > tr > td::before {
    content: attr(data-label); display: block; color: var(--muted); font-size: .66rem; text-transform: uppercase; letter-spacing: .04em; line-height: 1.5;
  }
  table.en-cartes > tbody > tr > td[data-label=""]::before, table.en-cartes > tfoot > tr > td[data-label=""]::before { content: none; }
  table.en-cartes > tbody > tr > td:first-child, table.en-cartes > tbody > tr > td[colspan] { grid-column: 1 / -1; }
  table.en-cartes > tbody > tr > td:first-child { font-size: 1.02rem; font-weight: 600; padding-right: 5.5rem; }
  table.en-cartes > tbody > tr > td:first-child::before { content: none; }
  table.en-cartes > tbody > tr:not(:has(> td.actions)) > td:first-child { padding-right: 0; }
  table.en-cartes > tbody > tr > td:empty, table.en-cartes > tbody > tr > td.vide-carte { display: none; }
  table.en-cartes > tbody > tr > td.actions { opacity: 1 !important; position: absolute; top: .45rem; right: .55rem; display: flex; flex-wrap: wrap; gap: .3rem; justify-content: flex-end; max-width: 60%; }
  table.en-cartes > tbody > tr > td.actions::before { content: none; }
  table.en-cartes > tbody > tr > td.actions .btn { min-height: 36px; }
  table.en-cartes > tbody > tr > td.actions:has(.btn:nth-of-type(2), form + .btn, .btn + form, form + form) { position: static; grid-column: 1 / -1; max-width: none; justify-content: flex-start; padding-top: .25rem; }
  table.en-cartes > tbody > tr:has(> td.actions:has(.btn:nth-of-type(2), form + .btn, .btn + form, form + form)) > td:first-child { padding-right: 0; }
  table.en-cartes .coupe { display: inline; max-width: none !important; white-space: normal; overflow: visible; }
  table.en-cartes .sous { display: block; }
  table.en-cartes input:not([type=checkbox]):not([type=radio]), table.en-cartes select, table.en-cartes textarea { max-width: 100%; }
  table.en-cartes > tbody > tr > td > input:not([type=checkbox]):not([type=radio]), table.en-cartes > tbody > tr > td > select { width: 100%; margin-top: .15rem; }
  table.en-cartes > tbody > tr.ligne-alerte, table.en-cartes > tbody > tr.ligne-rouge { border-left: 4px solid var(--danger); }
  table.en-cartes > tbody > tr.ligne-orange { border-left: 4px solid #d97706; }
}
/* Tablette en portrait : deux cartes côte à côte pour voir plus de lignes. */
@media (min-width: 561px) and (max-width: 900px) {
  table.en-cartes > tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
  table.en-cartes > tbody > tr { margin-bottom: 0; }
  table.en-cartes > tbody > tr:has(> td[colspan]) { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  /* Accueil : chiffres clés sur une colonne, lignes « à traiter » sur deux lignes (détail sous le libellé). */
  .kpi { grid-template-columns: 1fr; }
  .kpi .tuile-histo { grid-template-columns: auto 1fr; }
  .kpi .tuile-histo .histo { grid-column: 1 / -1; grid-row: auto; margin-top: .4rem; }
  .bloc-traiter li { flex-wrap: wrap; row-gap: .1rem; }
  .bloc-traiter li a.principal { flex: 1 1 60%; min-width: 0; }
  .bloc-traiter li .detail { flex-basis: 100%; margin-left: 0; white-space: normal; }
  .bloc-traiter h2 .tout { white-space: nowrap; }

  /* En-tête de page : le titre passe au-dessus des boutons au lieu d'être écrasé à côté. */
  .page-head { flex-wrap: wrap; }
  .page-head h1 { flex: 1 1 100%; }
}

/* Fiches en deux colonnes (règle .fiche corrigée plus haut) : les longues adresses, emails et sites web passent à la ligne. */
dl.infos dd { min-width: 0; overflow-wrap: anywhere; }
/* Tablette en paysage et petit portable : les listes se resserrent pour tenir sans défiler sur le côté. */
@media (min-width: 901px) and (max-width: 1300px) {
  table.list th, table.list td { padding-left: .45rem; padding-right: .45rem; }
  table.liste-plus td:nth-child(2) { min-width: 10rem; }
  table.liste-clients th, table.liste-clients td { white-space: normal; }
  table.liste-plus td.suivi { white-space: normal; }
}

/* ---- Module 2.18 — Demande du client (« Votre demande ») et fenêtre « Depuis Plaud » ---- */
.demande-client { border: 1px solid var(--border); border-left: 4px solid #0d9488; border-radius: 8px; background: #fff; padding: .7rem 1rem; margin: .8rem 0 1rem; }
.demande-client .tete { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.demande-client h2 { font-size: 1rem; margin: 0; }
.demande-client .source { font-size: .8rem; color: var(--muted); }
.demande-client .actions { margin-left: auto; display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
.demande-client .texte { margin: .5rem 0 0; white-space: pre-line; line-height: 1.45; overflow-wrap: anywhere; }
.demande-client.vide { border-style: dashed; border-left-style: solid; background: #f9fafb; }
.demande-client.vide .texte { color: var(--muted); font-style: italic; }
.demande-client .texte.replie { max-height: 6.2em; overflow: hidden; position: relative; }
.demande-client .texte.replie::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2em; background: linear-gradient(transparent, #fff); }
.fenetre-demande .brouillon-demande { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin: .4rem 0; padding: .35rem .6rem; border-radius: 6px; background: #fef3c7; color: #92400e; font-size: .85rem; }
.demande-client .lire-plus { background: none; border: 0; color: var(--primary); cursor: pointer; padding: 0; font: inherit; font-size: .88rem; margin-top: .2rem; }
.logo-plaud { display: inline-flex; align-items: center; justify-content: center; width: 1.3em; height: 1.3em; border-radius: 4px; background: #111; color: #fff; font-size: .72em; font-weight: 700; flex: none; }
dialog.dialogue.fenetre-plaud, dialog.dialogue.fenetre-demande { max-width: min(760px, calc(100vw - 2rem)); }
.fenetre-plaud .corps-plaud, .fenetre-demande form { padding: 1.2rem 1.4rem; }
.fenetre-plaud h2 { display: flex; gap: .45rem; align-items: center; }
.etapes-plaud { display: flex; gap: .4rem; font-size: .8rem; color: var(--muted); margin: .2rem 0 .6rem; flex-wrap: wrap; }
.etapes-plaud b { color: var(--text); }
.recherche-plaud { display: flex; gap: .5rem; margin: .6rem 0 .8rem; }
.recherche-plaud input { flex: 1; min-width: 0; }
ul.enregistrements { list-style: none; margin: 0; padding: 0; border: 1px solid var(--border); border-radius: 8px; max-height: 50vh; overflow: auto; }
ul.enregistrements:empty { display: none; }
ul.enregistrements li { display: flex; gap: .8rem; align-items: center; padding: .6rem .8rem; border-top: 1px solid var(--border); }
ul.enregistrements li:first-child { border-top: 0; }
ul.enregistrements li.vide { color: var(--muted); font-style: italic; }
ul.enregistrements li .nom { font-weight: 600; }
ul.enregistrements li .meta { font-size: .82rem; color: var(--muted); }
ul.enregistrements li .btn { margin-left: auto; flex: none; }
.fenetre-plaud .parties { display: grid; gap: .5rem; max-height: 50vh; overflow: auto; padding-right: .3rem; }
.fenetre-plaud .partie { border: 1px solid var(--border); border-radius: 8px; padding: .5rem .7rem; }
.fenetre-plaud .partie.cochee { border-color: #0d9488; background: #f0fdfa; }
.fenetre-plaud .partie label { display: flex; gap: .5rem; align-items: center; font-weight: 600; margin: 0; cursor: pointer; }
.fenetre-plaud .partie p { margin: .3rem 0 0 1.6rem; font-size: .88rem; color: #374151; white-space: pre-line; }
.fenetre-plaud .partie.interne label::after { content: "interne"; font-size: .7rem; font-weight: 600; color: #9a3412; background: #ffedd5; border-radius: 999px; padding: .05rem .45rem; margin-left: .3rem; }
.fenetre-plaud .page-resume { display: grid; gap: .5rem; }
.fenetre-plaud .onglets-resumes { display: flex; gap: .3rem; flex-wrap: wrap; border-bottom: 1px solid var(--border); margin: .2rem 0 .6rem; }
.fenetre-plaud .onglet-resume { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid transparent; border-bottom: 0; border-radius: 6px 6px 0 0; background: none; padding: .35rem .7rem; margin-bottom: -1px; font: inherit; font-size: .88rem; color: var(--muted); cursor: pointer; }
.fenetre-plaud .onglet-resume.actif { border-color: var(--border); background: #fff; color: inherit; font-weight: 600; }
.fenetre-plaud .onglet-resume .nb-cochees:not(:empty) { font-size: .72rem; font-weight: 700; color: #fff; background: #0d9488; border-radius: 999px; padding: 0 .4rem; }
.fenetre-demande textarea { width: 100%; min-height: 14rem; line-height: 1.45; font: inherit; padding: .6rem .7rem; box-sizing: border-box; }
.fenetre-demande textarea.en-erreur { border-color: #b91c1c; outline: 2px solid #fecaca; }
.fenetre-demande .compte-car { font-size: .8rem; color: var(--muted); text-align: right; }
.alerte-plaud { border: 1px solid #fecaca; background: #fef2f2; color: #991b1b; border-radius: 8px; padding: .6rem .8rem; margin: .6rem 0; }
.connexion-plaud { display: flex; gap: .8rem; align-items: center; padding: .8rem 1rem; border-radius: 8px; border: 1px solid var(--border); background: #fff; margin-bottom: 1rem; flex-wrap: wrap; }
.connexion-plaud .pastille { width: .8rem; height: .8rem; border-radius: 50%; background: #16a34a; flex: none; }
.connexion-plaud.coupee .pastille { background: #dc2626; }
.connexion-plaud .actions { margin-left: auto; display: flex; gap: .4rem; }
.connexion-etapes { padding: 1rem 1.2rem; }
.connexion-etapes h2 { margin-top: 0; }
.connexion-etapes ol.marche { line-height: 1.7; padding-left: 1.3rem; }
.connexion-etapes code { background: #f3f4f6; padding: .05rem .3rem; border-radius: 4px; font-size: .85rem; overflow-wrap: anywhere; }
.connexion-etapes .coller-retour { display: flex; gap: .5rem; margin-top: .3rem; flex-wrap: wrap; }
.connexion-etapes .coller-retour input { flex: 1; min-width: 14rem; }
.connexion-etapes .recommencer { margin-top: .6rem; display: flex; gap: .5rem; align-items: center; }
@media (max-width: 720px) {
  .demande-client .actions { margin-left: 0; width: 100%; }
}

/* ---- Module 7.3 — RH › Pointage (heures, semaine d'une personne, export du mois) ---- */
.onglets-pointage { border-bottom: 1px solid var(--border); margin: .4rem 0 1rem; }
.tete-mois { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-bottom: .8rem; }
.tete-mois .mois { font-weight: 700; font-size: 1.1rem; min-width: 10rem; text-align: center; }
.tete-mois form.inline { display: inline-flex; }
.etat-mois { font-size: .8rem; font-weight: 600; border-radius: 999px; padding: .15rem .6rem; }
.etat-mois.ouvert { background: #dcfce7; color: #166534; }
.etat-mois.cloture { background: #e0e7ff; color: #3730a3; }
.kpi-pointage { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; margin-bottom: 1rem; }
.kpi-pointage .tuile { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: .6rem .8rem; }
.kpi-pointage .lib { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.kpi-pointage .val { font-size: 1.35rem; font-weight: 700; }
.kpi-pointage .val small { font-size: .85rem; font-weight: 400; color: var(--muted); }
table.heures { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--border); font-size: .9rem; }
table.heures th, table.heures td { padding: .45rem .6rem; border-bottom: 1px solid var(--border); text-align: right; white-space: nowrap; }
table.heures th { background: #f9fafb; color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .03em; font-weight: 600; }
table.heures th:first-child, table.heures td:first-child { text-align: left; white-space: normal; }
table.heures td.nom a, table.heures td.nom b { font-weight: 600; }
table.heures td.nom small { display: block; color: var(--muted); font-size: .78rem; }
table.heures tr.equipe td { background: #f8fafc; font-weight: 600; color: #334155; text-align: left; font-size: .82rem; }
table.heures td.hs { color: #9a3412; font-weight: 600; }
table.heures td.zero { color: #cbd5e1; }
table.heures td a.lien-semaine { color: inherit; text-decoration: none; border-bottom: 1px dotted var(--muted); }
table.heures td.abs span { display: inline-block; font-size: .75rem; border-radius: 4px; padding: 0 .35rem; margin-left: .2rem; color: #fff; }
table.heures td.abs span.ecole { background: #7c3aed; }
table.heures tr.alerte td:first-child { box-shadow: inset 3px 0 0 #dc2626; }
table.heures td .alerte-txt { color: #b91c1c; font-size: .78rem; display: block; }
table.heures tfoot td { font-weight: 700; background: #f9fafb; }
.verrou-mois { background: #eef2ff; border: 1px solid #c7d2fe; color: #3730a3; border-radius: 8px; padding: .6rem .9rem; margin-bottom: .8rem; display: flex; gap: .8rem; align-items: center; flex-wrap: wrap; }
.verrou-mois .btn { margin-left: auto; }
.fiche-personne { display: flex; gap: 1rem; align-items: baseline; flex-wrap: wrap; margin-bottom: .6rem; }
.fiche-personne h1 { margin: 0; }
.fiche-personne .semaine-nav { display: flex; gap: .4rem; align-items: center; margin-left: auto; flex-wrap: wrap; }
table.grille-heures { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--border); font-size: .9rem; }
table.grille-heures th, table.grille-heures td { border: 1px solid var(--border); padding: .35rem .45rem; text-align: center; }
table.grille-heures th { background: #f9fafb; font-size: .75rem; color: var(--muted); font-weight: 600; }
table.grille-heures th small { display: block; font-weight: 400; }
table.grille-heures th button.jour { background: none; border: 0; font: inherit; color: var(--primary); cursor: pointer; padding: 0; text-decoration: underline dotted; }
table.grille-heures th.we, table.grille-heures td.we { background: #f8fafc; }
table.grille-heures td.chantier { text-align: left; min-width: 15rem; }
table.grille-heures td.chantier small { display: block; color: var(--muted); }
table.grille-heures td.h { font-variant-numeric: tabular-nums; min-width: 4rem; }
table.grille-heures td.h[data-jour] { cursor: pointer; }
table.grille-heures td.h[data-jour]:hover { outline: 2px solid #fcd34d; outline-offset: -2px; }
table.grille-heures td.h.planning { color: #64748b; }
table.grille-heures td.h.corrige { color: #9a3412; font-weight: 700; background: #fff7ed; }
table.grille-heures td.h.ajoute { color: #166534; font-weight: 700; background: #f0fdf4; }
table.grille-heures td.h.absent { background: repeating-linear-gradient(135deg, #fef2f2, #fef2f2 4px, #fff 4px, #fff 8px); color: #b91c1c; font-size: .75rem; }
table.grille-heures td.verrouille { color: #94a3b8; }
table.grille-heures tr.total td { font-weight: 700; background: #f9fafb; }
.cle-couleurs { display: flex; gap: 1rem; flex-wrap: wrap; font-size: .82rem; color: var(--muted); margin: .5rem 0 1rem; }
.cle-couleurs span::before { content: ""; display: inline-block; width: .8rem; height: .8rem; border-radius: 3px; margin-right: .35rem; vertical-align: -1px; border: 1px solid var(--border); }
.cle-couleurs .c-planning::before { background: #fff; }
.cle-couleurs .c-corrige::before { background: #fff7ed; border-color: #fdba74; }
.cle-couleurs .c-ajoute::before { background: #f0fdf4; border-color: #86efac; }
.cle-couleurs .c-absent::before { background: repeating-linear-gradient(135deg, #fecaca, #fecaca 3px, #fff 3px, #fff 6px); }
.decompte-hs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-top: .8rem; }
.decompte-hs div { background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: .5rem .7rem; }
.decompte-hs b { display: block; font-size: 1.15rem; }
.decompte-hs .hs b { color: #9a3412; }
details.corriger-hs { margin-top: .8rem; }
details.corriger-hs summary { cursor: pointer; color: var(--primary); font-size: .9rem; }
.form-hs { display: flex; gap: .6rem; align-items: flex-end; flex-wrap: wrap; margin-top: .5rem; }
.form-hs label { display: flex; flex-direction: column; font-size: .85rem; gap: .2rem; }
.form-hs input { width: 7rem; }
.form-hs label.large input { width: 20rem; max-width: 100%; }
dialog.dialogue.fenetre-heures { max-width: min(620px, calc(100vw - 2rem)); }
.fenetre-heures form { padding: 1.2rem 1.4rem; }
.fenetre-heures .lignes-jour { display: grid; gap: .45rem; margin: .7rem 0; }
.fenetre-heures .ligne-jour { display: grid; grid-template-columns: minmax(0, 1fr) 6rem 2.2rem; gap: .4rem; align-items: center; }
.fenetre-heures .ligne-jour select { min-width: 0; }
.fenetre-heures .ligne-jour input.h { text-align: right; }
.fenetre-heures label.motif { display: block; margin-top: .8rem; }
.fenetre-heures label.motif input { width: 100%; }
.fenetre-heures .en-erreur { border-color: #b91c1c; outline: 2px solid #fecaca; }
.fenetre-heures .erreur { color: #b91c1c; font-size: .88rem; margin: .4rem 0 0; }
.fenetre-heures .avert { color: #9a3412; font-size: .85rem; margin: .4rem 0 0; }
.titre-controles { font-size: 1.05rem; }
ul.controles { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; }
ul.controles li { display: flex; gap: .5rem; align-items: baseline; padding: .45rem .7rem; border-radius: 8px; background: #fff; border: 1px solid var(--border); }
ul.controles li.ok::before { content: "✔"; color: #16a34a; font-weight: 700; }
ul.controles li.avert::before { content: "!"; color: #fff; background: #f59e0b; border-radius: 50%; width: 1.1rem; height: 1.1rem; display: inline-flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; flex: none; }
ul.controles li a { margin-left: auto; font-size: .85rem; }
.form-cloturer, .form-rouvrir { padding: 1rem 1.2rem; margin-top: 1rem; }
.form-rouvrir { display: flex; gap: .5rem; align-items: flex-end; flex-wrap: wrap; }
.form-rouvrir label { flex: 1; min-width: 16rem; display: flex; flex-direction: column; gap: .2rem; }
.telechargements { display: flex; gap: .6rem; flex-wrap: wrap; margin: .8rem 0; }
ul.historique-mois { font-size: .85rem; color: var(--muted); padding-left: 1.2rem; }
@media (max-width: 900px) { .kpi-pointage, .decompte-hs { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fiche-personne .semaine-nav { margin-left: 0; } }

/* ---- Module 6.1.4 : absences glissées sur le planning ---- */
#planning .absent.deplacable { cursor: grab; touch-action: pan-x pan-y; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
#planning .absent.glisse { opacity: .4; }
#planning .absent.fantome { opacity: .8; outline: 2px dashed #1f2937; outline-offset: -2px; pointer-events: none; z-index: 3; }
#planning.geste .absent { cursor: grabbing; }

/* ---- Module 1.7 — Case de recherche d'un client (formulaires Chantier, Devis / Bon, Contrat) ---- */
.choix-client { flex: 1; min-width: 0; }
.recherche-client { position: relative; }
.recherche-client[hidden], .client-retenu[hidden] { display: none; }
.recherche-client > svg.ico { position: absolute; left: .7rem; top: 1.3rem; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.recherche-client input[type=search] { width: 100%; padding: .55rem .7rem .55rem 2.1rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
.recherche-client input[type=search]:focus { outline: 2px solid #fcd34d; border-color: var(--primary); }
.erreur .recherche-client input[type=search] { border-color: var(--danger); }
/* Liste : reprend .propositions des adresses (module 2.7) ; deux lignes par client, défile au-delà de 8. */
.propositions-client { max-height: 22rem; overflow-y: auto; }
.propositions-client li { flex-direction: column; gap: .1rem; align-items: stretch; }
.propositions-client .qui { font-weight: 500; }
.propositions-client .ou { color: var(--muted); font-size: .85rem; }
.propositions-client mark { background: #fde68a; color: inherit; padding: 0; border-radius: 2px; }
.propositions-client li.pied { flex-direction: row; flex-wrap: wrap; gap: .5rem; }
.propositions-client .creer { font-weight: 600; }
/* Client choisi : une carte à la place de la case. */
.client-retenu { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .45rem .5rem .45rem .8rem; border: 1px solid var(--border); border-left: 4px solid #2563eb; border-radius: 6px; background: #f8fafc; }
.client-retenu b { display: block; }
.client-retenu span { color: var(--muted); font-size: .88rem; }
.client-retenu .changer { font: inherit; font-size: .88rem; display: inline-flex; gap: .3rem; align-items: center; background: none; border: 1px solid var(--border); border-radius: 6px; padding: .3rem .6rem; cursor: pointer; color: var(--text); white-space: nowrap; }
.client-retenu .changer:hover { background: #fff; }
@media (max-width: 720px) { .client-choix { flex-direction: column; align-items: stretch; } }

/* ---- Historique des lignes de devis (10/10/2026) : menu ouvert par Ctrl + Espace dans une désignation (devis-historique.js) ---- */
.menu-historique { position: absolute; z-index: 60; max-height: 22rem; overflow-y: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 10px 30px rgba(15, 23, 42, .18); font-size: .9rem; }
.menu-historique-titre { margin: 0; padding: .45rem .7rem; font-size: .78rem; color: var(--muted); border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--surface); }
.menu-historique-vide { margin: 0; padding: .7rem; color: var(--muted); }
.menu-historique-ligne { padding: .45rem .7rem; cursor: pointer; border-bottom: 1px solid #f1f5f9; }
.menu-historique-ligne[aria-selected="true"] { background: #fef3c7; }
.menu-historique-texte { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.menu-historique-infos { margin-top: .15rem; font-size: .8rem; color: var(--muted); font-variant-numeric: tabular-nums; }
/* Au doigt (07/11/2026) : icône d'historique au bout de la désignation, sur écran tactile seulement (pas de Ctrl au téléphone). */
.histo-doigt { display: none; }
@media (pointer: coarse) {
    table.devis.grille td.designation { position: relative; }
    table.devis.grille td.designation textarea[name="designation"] { padding-right: 2.9rem; }
    .histo-doigt { display: inline-flex; align-items: center; justify-content: center; position: absolute; top: .3rem; right: .3rem; width: 2.5rem; height: 2.5rem; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--muted); }
    .histo-doigt svg { width: 1.3rem; height: 1.3rem; }
    tr.chapitre .histo-doigt, tr.futur-chapitre .histo-doigt { display: none; }
    table.devis.grille td.designation .avec-produit .histo-doigt { position: static; flex: none; }
    table.devis.grille td.designation .avec-produit textarea[name="designation"] { padding-right: revert; }
    tr.chapitre td.designation textarea[name="designation"], tr.futur-chapitre td.designation textarea[name="designation"] { padding-right: revert; }
}

/* ---- Glisser-déposer des lignes du devis (10/10/2026, devis-glisser.js) ---- */
#tableau-devis td.ordre .poignee { cursor: grab; color: var(--muted); margin-right: .25rem; padding: 0 .1rem; user-select: none; opacity: .45; }
#tableau-devis tr:hover td.ordre .poignee { opacity: 1; }
#tableau-devis tr.glisse { opacity: .4; }
#tableau-devis tr.glisser-avant > td { box-shadow: inset 0 3px 0 var(--primary); }
#tableau-devis tr.glisser-apres > td { box-shadow: inset 0 -3px 0 var(--primary); }
#tableau-devis tr.glisser-dedans > td { background: #fef3c7; }
@media (pointer: coarse) { #tableau-devis td.ordre .poignee { display: none; } }

/* Planning sur téléphone : colonne des équipes réduite à leur numéro sur leur couleur (« Équipe 2 » → « 2 »), pour
   laisser la place aux jours ; le nom complet reste dans l'info-bulle. Ailleurs, l'abrégé est caché. Au doigt, un
   chantier se saisit par un appui long (planning.js) : un glisser rapide fait défiler. */
#planning .rangee-tete .abrege { display: none; }
@media (max-width: 720px) {
  #planning .grille { --tete-equipes: 40px; }
  #planning .rangee-tete { padding: .4rem .3rem; justify-content: center; }
  #planning .rangee-tete > :not(.abrege) { display: none; }
  #planning .rangee-tete .abrege { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 .2rem; border-radius: 6px; color: #fff; font-weight: 700; font-size: .85rem; }
}

/* Module 7.3.1 — heures à récupérer : colonne « Récup. » du pointage du mois, choix de la semaine. */
#heures-mois td.recup small { display: block; color: var(--muted); font-size: .72rem; white-space: nowrap; }
.form-hs.mode-recup { margin: .4rem 0 .6rem; }
.heures-sup-employe .checkbox { margin: 0 0 .2rem; }
.heures-sup-employe .aide { margin: 0 0 .8rem 1.6rem; }

/* Module 4.1.2 — Google Contacts : choix du libellé, accès Google. */
.form-libelle-google { display: grid; gap: .45rem; }
.form-libelle-google input[type=text] { max-width: 24rem; margin-left: 1.6rem; }
.form-google { display: grid; gap: .6rem; margin-top: .6rem; }
#adresse-retour { word-break: break-all; }

/* ---- Module 6.1.5 — Temps réservé à l'entreprise au planning ---- */
.piste .temps-entreprise { z-index: 2; margin: 0 1px; padding: 0 2px; border: 0; border-radius: 4px; font-size: .68rem; font-weight: 600; line-height: 20px; height: 20px; overflow: hidden; white-space: nowrap; text-overflow: clip; text-align: center; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); }
.piste .temps-entreprise:hover { filter: brightness(.95); }
.legende-planning .puce-temps { display: inline-block; width: 22px; height: 10px; border-radius: 3px; background: #a78bfa; vertical-align: -1px; }
.modale-planning .champ[hidden] { display: none; }
.modale-planning input[type=time] { width: 100%; padding: .55rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; background: #fff; }
.modale-planning input[type=time]:focus { outline: 2px solid #fcd34d; border-color: var(--primary); }
.modale-planning .cases-planning { display: flex; flex-wrap: wrap; gap: .3rem .9rem; max-height: 11rem; overflow-y: auto; padding: .2rem 0; }
.modale-planning .cases-planning label.checkbox { display: inline-flex; align-items: center; gap: .3rem; margin: 0; font-weight: normal; }
.journee .temps-jour h2 { display: flex; align-items: center; gap: .5rem; }
.journee .temps-jour h2 .pastille { width: .8rem; height: .8rem; border-radius: 50%; display: inline-block; flex: none; }
.journee .liste-semaine .item.temps { cursor: default; }

/* ===== Module 1.8 — Chantiers › Photos (photothèque : carte et mosaïque, sans prix) ===== */
.filtres-photos label { display: flex; align-items: center; gap: .35rem; margin: 0; font-weight: 500; }
.filtres-photos input[type=date] { padding: .45rem .5rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; }
.vues-photos { display: flex; gap: .5rem; margin-bottom: .75rem; }
.vues-photos .btn { flex: 0 0 auto; }
.carte-photos { height: 68vh; min-height: 340px; border-radius: 10px; border: 1px solid var(--border); background: #e5e7eb; z-index: 0; }
.etat-carte { margin: .5rem 0 0; min-height: 1.2em; }
.point-photos { box-sizing: border-box; background: var(--primary); color: #fff; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 1px 4px rgba(0,0,0,.4); font-weight: 700; font-size: .85rem; }
.point-photos span { display: block; text-align: center; line-height: 30px; }
.bulle-photos { display: grid; gap: .35rem; font-size: .88rem; }
.bulle-photos .bulle-vignettes { display: grid; grid-template-columns: repeat(3, 1fr); gap: .3rem; margin: .2rem 0; }
.bulle-photos .bulle-vignette { aspect-ratio: 1; width: 100%; border: 0; border-radius: 6px; background-color: #e5e7eb; background-size: cover; background-position: center; cursor: zoom-in; padding: 0; }
.bulle-photos .bulle-actions { display: flex; gap: .4rem; flex-wrap: wrap; }
.bulle-photos .bulle-actions .btn { color: inherit; }
.bulle-photos .bulle-actions .btn-primary { color: #fff; }
.lieu-photos { scroll-margin-top: 4.5rem; transition: box-shadow .3s; }
.lieu-photos.surligne { box-shadow: 0 0 0 3px #fcd34d; }
.lieu-photos .lieu-tete { display: flex; justify-content: space-between; gap: .75rem; align-items: flex-start; margin-bottom: .75rem; }
.lieu-photos .lieu-tete h2 { font-size: 1.05rem; margin: 0; }
.lieu-photos .lieu-tete p { margin: .15rem 0 0; }
.lieu-photos .origine-photo { font-size: .72rem; padding: .05rem .45rem; border-radius: 4px; background: #eef2ff; color: #3730a3; }
@media (max-width: 720px) {
    .filtres-photos input[type=search] { min-width: 0; flex: 1 1 100%; }
    .filtres-photos label { flex: 1 1 40%; }
    .filtres-photos input[type=date] { flex: 1; min-width: 0; }
    .filtres-photos .compteur { margin-left: 0; }
    .vues-photos .btn { flex: 1; justify-content: center; }
    .carte-photos { height: 62vh; }
    .lieu-photos .lieu-tete { flex-direction: column; }
    .lieu-photos .grille-photos { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: .6rem; }
}

/* ===== Module 6.1.6 — Planning à la demi-journée : trait pointillé entre le matin et l'après-midi ===== */
#planning .colonne.demi { position: relative; }
#planning .colonne.demi::after { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; border-left: 1px dashed #cbd5e1; pointer-events: none; }
#planning .colonne.demi.ferie::after { display: none; }
.journee .demi-jour { color: var(--primary); }

/* ===== Module 0.4.3 — Compte « Écran TV » : pastille du profil, planning en plein écran ===== */
.badge.profil-ecran-tv { background: #ede9fe; color: #5b21b6; }
body.planning-plein-ecran .lateral, body.planning-plein-ecran .barre-haut, body.planning-plein-ecran .page-head,
body.planning-plein-ecran .a-planifier, body.planning-plein-ecran .legende-planning, body.planning-plein-ecran .bandeau-base-test,
body.planning-plein-ecran #btnPleinEcran { display: none !important; }
body.planning-plein-ecran .app { display: block; }
body.planning-plein-ecran main.container { max-width: none; padding: .5rem; margin: 0; }
body.planning-plein-ecran .page-planning { grid-template-columns: minmax(0, 1fr); }
body.planning-plein-ecran .planning-carte { margin: 0; }
#btnQuitterPleinEcran { position: fixed; right: .75rem; bottom: .75rem; z-index: 50; opacity: .55; }
#btnQuitterPleinEcran:hover, #btnQuitterPleinEcran:focus { opacity: 1; }
.horloge-tv { display: none; font-size: 1.6rem; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1; }
body.planning-plein-ecran .horloge-tv, #planning-app[data-tv="1"] .horloge-tv { display: inline; }

/* ---- Module 1.2.1 : fiche chantier sur téléphone (16/10/2026) ----
   Les quatre actions de l'en-tête (planning, nouveau bon, statut, modifier) tiennent sur UNE ligne : parts égales,
   libellés raccourcis (« planning », « bon »), plus de retour à la ligne. Le raccourci photo suit le titre. */
.entete-fiche .ligne-titre form.ajout-photo-icone { display: inline-flex; flex-wrap: nowrap; }
@media (max-width: 720px) {
  .entete-fiche .ligne-titre .actions { order: 10; flex: 1 1 100%; margin-left: 0; flex-wrap: nowrap; gap: .35rem; }
  .entete-fiche .ligne-titre .actions > * { flex: 1 1 0; min-width: 0; }
  .entete-fiche .ligne-titre .actions .btn { width: 100%; justify-content: center; padding: .45rem .35rem; font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .entete-fiche .ligne-titre .actions select.btn { padding: .45rem .3rem; }
  .entete-fiche .ligne-titre .actions form.inline { display: block; flex-grow: 1.3; }
  .entete-fiche .ligne-titre .actions .mot-long { display: none; }
  .entete-fiche .ligne-titre .actions .btn svg { flex: 0 0 auto; }
  .entete-fiche .ligne-titre .ajout-photo-icone { margin-left: 0; }
  .entete-fiche .ligne-titre .ajout-photo-icone select.etape-photo-icone { width: auto; max-width: 9.5rem; min-height: 40px; }
}
/* Module 1.2.1 : dans l'appareil de « Série de photos », le geste à deux doigts zoome la caméra, jamais la page
   (le déclencheur restait hors de l'écran). */
dialog.rafale-photos { touch-action: none; overscroll-behavior: contain; }
dialog.rafale-photos video { transform-origin: 50% 50%; }
dialog.rafale-photos .rafale-bande { touch-action: pan-x; }
dialog.rafale-photos .rafale-zoom { padding: .3rem .7rem; border: 1px solid rgba(255,255,255,.6); border-radius: 999px; background: rgba(0,0,0,.45); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
dialog.rafale-photos .rafale-zoom[hidden] { display: none; }

/* ---- Module 6.1.7 : tâches libres au planning (une seule couleur, décision 4a) ---- */
.piste .tache-planning { position: relative; z-index: 2; margin: 0 2px; padding: 0 6px; height: 22px; line-height: 20px; border: 1px solid #94a3b8; border-left: 3px solid #475569; border-radius: 4px; background: repeating-linear-gradient(135deg, #f1f5f9 0 6px, #e2e8f0 6px 12px); color: #1e293b; font: inherit; font-size: .72rem; font-weight: 600; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.piste .tache-planning:hover { border-color: #475569; }
/* Tâche plus courte que son texte : la case garde la durée réelle, le texte continue à droite (place réservée).
   01/11/2026 (demande d'Arnaud) : le texte qui dépasse est en gris, sans cadre ni fond, pour qu'on voie qu'il
   appartient au jour coloré et ne couvre pas les jours suivants. */
.piste .tache-planning.court { overflow: visible; text-overflow: clip; }
.piste .tache-planning.court span { position: relative; z-index: 3; padding-right: 4px; color: #475569; font-weight: 500; font-style: italic; text-shadow: 0 0 2px #fff, 0 0 2px #fff; }
.legende-planning .puce-tache { display: inline-block; width: 22px; height: 10px; border-radius: 3px; border: 1px solid #94a3b8; border-left: 3px solid #475569; background: repeating-linear-gradient(135deg, #f1f5f9 0 4px, #e2e8f0 4px 8px); vertical-align: -1px; }

/* ---- Module 2.3.1 : vue terrain du devis (aucun prix), lisible sur téléphone ---- */
.devis-terrain-tete .sans-prix { display: inline-block; padding: .1rem .5rem; border-radius: 999px; background: #ecfdf5; color: #047857; font-size: .8rem; font-weight: 600; vertical-align: .2rem; }
.devis-terrain-cadres { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
.devis-terrain-cadres .bloc + .bloc { margin-top: 0; }
.devis-terrain-cadres h2, .devis-terrain-demande h2 { font-size: 1rem; margin: 0 0 .4rem; }
.devis-terrain-cadres p { margin: 0 0 .5rem; }
.devis-terrain-demande { margin-bottom: 1rem; }
.devis-terrain-chapitre h2 { font-size: 1.05rem; margin: 0 0 .5rem; color: var(--primary); }
.devis-terrain-chapitre.en-option { background: #e8f1fc; }
.devis-terrain-chapitre .pastille-option { font-size: .75rem; font-weight: 600; padding: .05rem .45rem; border-radius: 999px; background: #d6e6f8; color: #1e3a8a; vertical-align: .15rem; }
.devis-terrain-chapitre h3.options-chapitre { font-size: .9rem; margin: .8rem 0 .3rem; color: #1e3a8a; }
ul.lignes-terrain { list-style: none; margin: 0; padding: 0; }
ul.lignes-terrain > li { display: grid; grid-template-columns: 3rem 1fr auto; gap: .6rem; align-items: start; padding: .5rem 0; border-top: 1px solid var(--border); }
ul.lignes-terrain > li:first-child { border-top: 0; }
ul.lignes-terrain > li.en-option { background: #e8f1fc; padding-left: .4rem; padding-right: .4rem; }
ul.lignes-terrain > li.nota { display: block; font-style: italic; color: var(--muted); padding-left: 3.6rem; }
ul.lignes-terrain .num { color: var(--muted); font-size: .85rem; }
ul.lignes-terrain .quantite { font-weight: 700; white-space: nowrap; text-align: right; font-size: 1.05rem; }
ul.lignes-terrain .quantite small { font-weight: 400; color: var(--muted); }
ul.lignes-terrain li.style-attention .designation { color: #1d4ed8; font-style: italic; }
ul.lignes-terrain li.style-securite .designation { color: #b91c1c; font-weight: 600; }
ul.lignes-terrain li.style-remarque .designation { color: var(--muted); font-style: italic; }
ul.lignes-terrain li.style-important .designation { font-weight: 700; }
ul.lignes-terrain li.style-mise-en-avant .designation { background: #fef9c3; color: #713f12; }
ul.lignes-terrain .vignette-terrain { float: left; width: 44px; height: 44px; object-fit: cover; border-radius: 6px; margin: 0 .5rem .2rem 0; }
ul.composants-terrain { margin: .3rem 0 0; padding-left: 1.1rem; font-size: .85rem; color: #374151; clear: left; }
@media (max-width: 720px) {
  .devis-terrain-cadres { grid-template-columns: 1fr; gap: .6rem; }
  .devis-terrain-chapitre { padding: .9rem; }
  ul.lignes-terrain > li { grid-template-columns: 2.2rem 1fr auto; gap: .4rem; }
  ul.lignes-terrain > li.nota { padding-left: 2.6rem; }
}
a.lien-terrain { display: inline-flex; align-items: center; gap: .15rem; margin-left: .35rem; font-size: .8rem; color: var(--muted); text-decoration: none; white-space: nowrap; }
a.lien-terrain:hover { color: var(--primary); }
a.lien-terrain svg { width: 14px; height: 14px; }

/* ---- Retouche 0.11 (18/10/2026) : listes plus simples sur téléphone ----
   Les titres de colonne en pastilles (tri) sont retirés : la carte montre déjà le titre de chaque valeur.
   Boutons de tête et filtres tiennent chacun sur une seule ligne (qui défile sur le côté si besoin) ; le bouton
   « Filtrer » disparaît : une liste déroulante filtre dès qu'on la change, la recherche part avec la touche Entrée. */
@media (max-width: 900px) {
  table.en-cartes > thead { display: none; }
}
@media (max-width: 720px) {
  .page-head .actions-tete { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; scrollbar-width: none; }
  .page-head .actions-tete::-webkit-scrollbar { display: none; }
  .page-head .actions-tete > * { flex: none; white-space: nowrap; padding: .4rem .7rem; font-size: .88rem; }
  .page-head .actions-tete > .btn-primary { order: -1; }
  form.filtres:not(.filtres-photos) { flex-wrap: nowrap; overflow-x: auto; gap: .4rem; scrollbar-width: none; }
  form.filtres:not(.filtres-photos)::-webkit-scrollbar { display: none; }
  form.filtres:not(.filtres-photos) > * { flex: none; }
  form.filtres:not(.filtres-photos) > input[type=search], form.filtres:not(.filtres-photos) > .recherche { flex: 0 0 62%; width: auto; min-width: 0; }
  form.filtres:not(.filtres-photos) > select { max-width: 11rem; padding: .45rem .5rem; font-size: .88rem; }
  form.filtres:not(.filtres-photos) > button[type=submit].btn:not(.btn-primary) { display: none; }
  form.filtres:not(.filtres-photos) > .compteur { margin-left: 0; white-space: nowrap; font-size: .8rem; }
}

/* ---- Module 1.9 : notes de chantier (raccourci à côté de la photo, onglet Notes, page de suivi imprimable, écran TV) ---- */
.entete-fiche .ligne-titre .raccourci-note { min-height: 32px; padding: .2rem .45rem; color: var(--muted); vertical-align: middle; }
.entete-fiche .ligne-titre .raccourci-note:hover { color: var(--text); }
.entete-fiche .ligne-titre .raccourci-note svg { width: 1.15rem; height: 1.15rem; }
@media (max-width: 720px) { .entete-fiche .ligne-titre .raccourci-note { min-height: 40px; padding: .3rem .6rem; } }
.pastille-note { display: inline-block; font-size: .7rem; font-weight: 600; padding: .05rem .45rem; border-radius: 999px; vertical-align: 1px; white-space: nowrap; }
.pastille-note.note-a-traiter { background: #e0f2fe; color: #075985; }
.pastille-note.note-a-commander { background: #fef3c7; color: #92400e; }
ul.notes-chantier { list-style: none; margin: 0; padding: 0; }
ul.notes-chantier li.note-chantier { display: flex; gap: .65rem; align-items: flex-start; padding: .55rem 0; border-bottom: 1px solid var(--border); }
ul.notes-chantier li.note-chantier:last-child { border-bottom: 0; }
li.note-chantier form.coche-note { margin: 0; display: flex; gap: .3rem; align-items: center; }
li.note-chantier input[data-coche-note] { width: 1.35rem; height: 1.35rem; margin: .05rem 0 0; cursor: pointer; accent-color: var(--primary); }
li.note-chantier .coche-lecture { font-size: 1.2rem; line-height: 1; color: var(--muted); }
li.note-chantier .texte-note { flex: 1; min-width: 0; overflow-wrap: anywhere; line-height: 1.4; }
li.note-chantier .texte-note .sous { display: block; font-size: .78rem; color: var(--muted); }
li.note-chantier.traitee .texte-note { color: var(--muted); }
li.note-chantier.traitee .texte-note > .pastille-note { opacity: .6; }
.notes-fiche h2 { display: flex; align-items: center; gap: .75rem; }
.notes-fiche h2 .btn { margin-left: auto; }
details.notes-traitees { margin-top: .75rem; }
details.notes-traitees summary { cursor: pointer; color: var(--muted); font-size: .9rem; }
dialog.fenetre-note textarea { width: 100%; font: inherit; }
.choix-type-note { display: flex; gap: .5rem; margin-bottom: .75rem; flex-wrap: wrap; }
.choix-type-note label { display: inline-flex; align-items: center; gap: .35rem; margin: 0; padding: .45rem .8rem; border: 1px solid var(--border); border-radius: 999px; font-weight: 500; cursor: pointer; }
.choix-type-note label:has(input:checked).note-a-traiter { background: #e0f2fe; border-color: #7dd3fc; }
.choix-type-note label:has(input:checked).note-a-commander { background: #fef3c7; border-color: #fcd34d; }
.notes-resume { margin-top: -.5rem; }
.notes-suivi { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap: 1rem; align-items: start; }
.groupe-notes { margin: 0; }
.groupe-notes h2 { font-size: 1.05rem; margin: 0 0 .4rem; }
.groupe-notes h2 a { color: inherit; text-decoration: none; }
.groupe-notes h2 .num { color: var(--muted); font-weight: 500; margin-right: .3rem; }
.groupe-notes h2 .sous { display: block; font-size: .82rem; font-weight: 400; color: var(--muted); }
/* Écran TV : colonne à droite du planning, gardée en plein écran (le reste du panneau « À planifier » y est caché). */
.notes-tv { padding-bottom: .6rem !important; }
.notes-tv > p { margin: .6rem .9rem 0; }
.groupe-notes-tv { margin: .3rem .6rem 0; }
.groupe-notes-tv h3 { margin: 0 0 .1rem; font-size: .66rem; line-height: 1.2; }
.groupe-notes-tv h3 .sous { font-weight: 400; color: var(--muted); font-size: .58rem; }
/* Retouche 1.9 : textes réduits pour faire tenir plus de notes à l'écran. */
.groupe-notes-tv ul { margin: 0; padding-left: .8rem; font-size: .6rem; line-height: 1.2; }
.groupe-notes-tv li { margin: 0; overflow-wrap: anywhere; }
body.planning-plein-ecran .page-planning:has(#notesTv) { grid-template-columns: minmax(0, 1fr) 300px; gap: .5rem; }
body.planning-plein-ecran .a-planifier:has(#notesTv) { display: block !important; }
body.planning-plein-ecran .a-planifier:has(#notesTv) > .card:not(.notes-tv) { display: none; }
body.planning-plein-ecran .notes-tv { margin: 0; max-height: calc(100vh - 1rem); overflow: hidden; }
/* Retouche 1.9 : la colonne garde son titre, la liste dessous défile seule (planning.js) quand elle est trop longue. */
.notes-tv { display: flex; flex-direction: column; max-height: 70vh; }
body.planning-plein-ecran .notes-tv { display: flex !important; }
.notes-tv h2 { flex: none; font-size: .85rem; }
.notes-tv-liste { flex: 1 1 auto; min-height: 0; overflow: hidden; padding-bottom: .6rem; }
/* Impression de la page de suivi : la feuille seule, les chantiers à la suite sans couper un chantier. */
@media print {
  .lateral, .barre-haut, .bandeau-base-test, .page-head .actions-tete, #avis, .flash { display: none !important; }
  .app { display: block !important; }
  main.container { max-width: none !important; padding: 0 !important; }
  .notes-suivi { display: block; }
  .groupe-notes { break-inside: avoid; border: 0; border-bottom: 1px solid #999; border-radius: 0; box-shadow: none; padding: .4rem 0; margin: 0 0 .4rem; }
  .groupe-notes h2 a { text-decoration: none; }
  li.note-chantier { padding: .25rem 0 !important; border: 0 !important; }
  li.note-chantier input[data-coche-note] { accent-color: #000; }
}

/* ---- Module 1.9.1 : photos jointes aux notes de chantier ---- */
.photos-a-joindre { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .75rem; }
.photos-a-joindre label.btn { display: inline-flex; align-items: center; gap: .35rem; margin: 0; cursor: pointer; }
.photos-note { display: flex; flex-wrap: wrap; gap: .35rem; margin: .35rem 0 .1rem; }
.photos-note img { display: block; width: 64px; height: 64px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); background: #f3f4f6; }
li.note-chantier.traitee .photos-note img { opacity: .6; }
li.note-chantier form.photo-note-ajout { margin: 0; flex: none; }
li.note-chantier form.photo-note-ajout label.btn-icone { display: inline-flex; margin: 0; min-height: 32px; padding: .2rem .45rem; color: var(--muted); cursor: pointer; }
li.note-chantier form.photo-note-ajout label.btn-icone:hover { color: var(--text); }
li.note-chantier form.photo-note-ajout label.envoi { opacity: .4; pointer-events: none; }
@media (max-width: 720px) { li.note-chantier form.photo-note-ajout label.btn-icone { min-height: 40px; padding: .3rem .6rem; } }
@media print {
  li.note-chantier form.photo-note-ajout { display: none; }
  .photos-note img { width: 90px; height: 90px; }
}

/* ---- Page publique « Confidentialité » (accès Google, module 4.1.2) ---- */
.confidentialite { width: 100%; max-width: 720px; }
.confidentialite .login-logo { display: block; text-align: center; margin-bottom: 1rem; }
.confidentialite .login-logo img { max-width: 160px; height: auto; }
.confidentialite h2 { margin-top: 1.5rem; }
.confidentialite ul { padding-left: 1.25rem; }
.login-card .lien-confidentialite { text-align: center; margin: 1rem 0 0; }

/* ===== Module 0.4.4 — Météo de l'écran TV (22/10/2026) =====
   Sous les équipes, en plein écran et pour le profil Écran TV : à gauche la journée heure par heure à Wambrechies,
   à droite le radar de pluie animé sur le fond IGN. Hauteur fixe ; planning.js réduit les équipes pour lui laisser la
   place. Retouche du 23/10/2026 : bandeau ramené d'un quart à 14 % de l'écran (pictogramme et température côte à côte)
   pour rendre la place aux équipes. */
.meteo-tv { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 30%); gap: .5rem; height: 14vh; min-height: 112px; margin-top: .5rem; }
.meteo-tv[hidden] { display: none; }
.meteo-tv-previsions { display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 2px; min-width: 0; min-height: 0; }
.meteo-tv-heures { display: flex; align-items: stretch; gap: 2px; min-width: 0; min-height: 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--surface); }
.meteo-heure { flex: 1 1 0; min-width: 0; display: grid; grid-template-columns: auto auto; justify-content: center; align-content: space-evenly; align-items: center; column-gap: .25rem; padding: .15rem 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.meteo-heure .h, .meteo-heure .p, .meteo-heure .v { grid-column: 1 / -1; text-align: center; }
.meteo-heure .h { font-size: clamp(.7rem, 1.5vh, 1.05rem); color: var(--muted); font-weight: 600; line-height: 1.1; }
.meteo-heure .meteo-picto { width: clamp(16px, min(3.4vh, 1.5vw), 40px); height: clamp(16px, min(3.4vh, 1.5vw), 40px); } /* 12 heures côte à côte : la largeur compte aussi */
.meteo-heure .t { font-size: clamp(.8rem, min(2.4vh, 1.3vw), 1.7rem); font-weight: 700; line-height: 1; }
.meteo-heure .p { font-size: clamp(.6rem, 1.3vh, .9rem); color: #1d4ed8; font-weight: 600; min-height: 1.1em; line-height: 1.1; }
.meteo-heure .v { font-size: clamp(.62rem, 1.15vh, .85rem); color: var(--muted); min-height: 1.1em; line-height: 1.1; }
.meteo-tv-jours { display: flex; gap: 2px; min-width: 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--surface); }
.meteo-tv-jours:empty { display: none; }
.meteo-jour { flex: 1 1 0; min-width: 0; display: grid; grid-template-columns: auto auto; align-items: center; justify-content: center; justify-items: center; column-gap: .55rem; padding: .05rem .25rem; font-size: clamp(.75rem, 1.85vh, 1.4rem); line-height: 1.12; font-variant-numeric: tabular-nums; white-space: nowrap; }
.meteo-jour + .meteo-jour { border-left: 1px solid var(--border); }
.meteo-jour .d { font-weight: 700; color: var(--muted); }
.meteo-jour .meteo-picto { width: clamp(15px, 2.3vh, 30px); height: clamp(15px, 2.3vh, 30px); }
.meteo-jour.jour-attendu { grid-template-columns: auto; }
.meteo-jour .t b { font-weight: 700; }
.meteo-jour .t small { font-size: .85em; color: var(--muted); }
.meteo-jour .p { color: #1d4ed8; font-weight: 600; font-size: .85em; }
.meteo-jour.aujourdhui { background: #fef3c7; }
.meteo-jour.jour-attendu .m { color: var(--muted); font-style: italic; }
.meteo-heure.actuelle { background: #fef3c7; box-shadow: inset 0 -3px 0 var(--primary); }
.meteo-picto.meteo-soleil, .meteo-picto.meteo-eclaircies { color: #d97706; }
.meteo-picto.meteo-nuages { color: #64748b; }
.meteo-picto.meteo-pluie, .meteo-picto.meteo-neige { color: #2563eb; }
.meteo-picto.meteo-nuit { color: #475569; }
.meteo-tv-vide { margin: auto; color: var(--muted); }
.meteo-tv-radar { position: relative; z-index: 0; isolation: isolate; min-width: 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.meteo-tv-carte { position: absolute; inset: 0; background: #e5e7eb; }
.meteo-tv-pluie { image-rendering: pixelated; transition: opacity .15s linear; }
.meteo-tv-instant { position: absolute; top: .35rem; left: .35rem; z-index: 500; background: rgba(17, 24, 39, .8); color: #fff; border-radius: 6px; padding: .15rem .5rem; font-size: clamp(.75rem, 1.8vh, 1.2rem); font-weight: 700; font-variant-numeric: tabular-nums; }
.meteo-tv-instant.prevision { background: rgba(180, 83, 9, .9); }
.meteo-tv-source { position: absolute; left: .35rem; bottom: .25rem; z-index: 500; background: rgba(255, 255, 255, .85); border-radius: 4px; padding: 0 .35rem; font-size: .7rem; color: #374151; }

/* ---- Retouche 0.11 (25/10/2026) : barres d'outils sur une seule ligne sur téléphone ----
   Demande d'Arnaud : « toutes ces options/filtres sur une seule ligne pour gagner en visibilité ». Sous 720 px, la
   barre du planning, les boutons de tête des fiches (devis, bons, contrats, commandes, articles, ouvrages,
   fournisseurs, consultations), la tête du calendrier des congés et les boutons d'itinéraire ne vont plus à la ligne :
   une seule rangée, qui défile sur le côté si elle dépasse (comme les listes, retouche du 18/10). Le planning raccourcit
   ses libellés (span.mot-long masqué, span.mot-court affiché) et masque la période. */
.outils-planning .mot-court { display: none; }
@media (max-width: 720px) {
  .outils-planning, .fiche-head .actions, .conges-tete, .itineraires {
    flex-wrap: nowrap; overflow-x: auto; max-width: 100%; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .outils-planning::-webkit-scrollbar, .fiche-head .actions::-webkit-scrollbar, .conges-tete::-webkit-scrollbar,
  .itineraires::-webkit-scrollbar { display: none; }
  .outils-planning > *, .fiche-head .actions > *, .conges-tete > *, .itineraires > * { flex: none; white-space: nowrap; }

  .outils-planning { gap: .35rem; padding: .5rem .6rem; }
  .outils-planning .btn { padding: .4rem .6rem; font-size: .88rem; }
  /* La période est déjà lisible dans l'en-tête de la grille (« S43 · 19 oct. ») ; « + Phase » et « Annuler » suivent
     les flèches, visibles sans faire défiler. */
  .outils-planning .periode { display: none; }
  .outils-planning #btnPrec, .outils-planning #btnAuj, .outils-planning #btnSuiv { order: -2; }
  .outils-planning #btnNouvelleInterv, .outils-planning #btnAnnuler { order: -1; }
  .outils-planning select { padding: .4rem .35rem; font-size: .88rem; }
  .outils-planning .pousse { display: none; }
  .outils-planning .mot-long { display: none; }
  .outils-planning .mot-court { display: inline; }

  .fiche-head .actions { width: 100%; gap: .4rem; }
  .fiche-head .actions .btn { padding: .45rem .7rem; font-size: .88rem; }
  .fiche-head .actions form.inline { display: block; }
  .fiche-head .actions form.inline[data-confirmation] { margin-left: 0; }
  /* L'action principale (« Passer en Envoyé », « Valider le bon »…) en tête de rangée, visible sans défiler. */
  .fiche-head .actions > :is(.btn-primary, :has(> .btn-primary)) { order: -1; }
  /* Un menu « PDF ▾ » ouvert serait coupé par le défilement : la rangée se déplie le temps du choix. */
  .fiche-head .actions:has(details[open]) { flex-wrap: wrap; overflow: visible; }

  .conges-tete { gap: .4rem; }
  .conges-tete .mois { min-width: 0; font-size: 1rem; }
  .conges-tete select { max-width: 11rem; padding: .4rem .35rem; font-size: .88rem; }
  .conges-tete .muted.petit { font-size: .8rem; }

  .itineraires { display: flex; }
  dl.infos dd .itineraires { margin: .3rem 0 0; }
}

/* ---- Retouche 0.11 (25/10/2026, suite) : en-tête des listes resserré sur téléphone ----
   Demande d'Arnaud (capture de la liste des devis) : titre et boutons sur la même ligne (le titre rapetisse et passe
   sur deux lignes s'il est long) ; puces des vues en un clic (module 0.10) sur une seule rangée qui
   défile sur le côté, la vue en cours ramenée à l'écran par _vues.html.twig. */
@media (max-width: 720px) {
  .page-head:has(> .actions-tete) { flex-wrap: nowrap; gap: .6rem; justify-content: flex-start; }
  .page-head:has(> .actions-tete) h1 { flex: 0 1 auto; min-width: 0; max-width: 45%; font-size: 1.3rem; line-height: 1.15; overflow-wrap: anywhere; }
  .page-head:has(> .actions-tete) .actions-tete { flex: 1 1 0; min-width: 0; }

  .vues { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .vues::-webkit-scrollbar { display: none; }
  .vues a { flex: none; white-space: nowrap; }
}

/* ---- Retouche 0.11 (25/10/2026) : cartes des clients compactes sur téléphone (maquette cartes-clients, choix A) ----
   Trois lignes au lieu de six blocs titrés : nom + pastilles « N devis · N chantiers » (liens vers les listes filtrées,
   presque invisibles à 0) ; adresse en petit ; téléphone(s) et email côte à côte, l'email en petit coupé par « … ».
   Plus de bouton « Modifier » : le nom ouvre la fiche. Sur ordinateur, les nombres restent dans leurs colonnes. */
table.liste-clients .unite { display: none; }
table.liste-clients td.nb-devis a, table.liste-clients td.nb-chantiers a { color: inherit; text-decoration: none; }
table.liste-clients td.nb-devis a:hover, table.liste-clients td.nb-chantiers a:hover { color: var(--primary); text-decoration: underline; }
@media (max-width: 720px) {
  table.liste-clients.en-cartes > tbody > tr {
    grid-template-columns: auto minmax(0, 1fr) auto auto; grid-template-areas: "nom nom devis chantiers" "adresse adresse adresse adresse" "tel mail mail mail";
    gap: .1rem .25rem; padding: .55rem .75rem; margin-bottom: .45rem;
  }
  table.liste-clients.en-cartes > tbody > tr > td::before { content: none; }
  table.liste-clients.en-cartes > tbody > tr > td.nom { grid-area: nom; padding-right: .3rem; font-size: 1rem; font-weight: 700; }
  table.liste-clients.en-cartes td.nom .coupe { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  table.liste-clients.en-cartes td.nom a.principal { color: var(--text); text-decoration: none; }
  table.liste-clients.en-cartes > tbody > tr > td.adresse { grid-area: adresse; font-size: .82rem; color: var(--muted); white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  /* Téléphone(s) puis email sur la même ligne : la case téléphone garde sa largeur, l'email prend le reste. */
  table.liste-clients.en-cartes > tbody > tr > td.tel { grid-area: tel; margin-right: .5rem; font-size: .82rem; white-space: nowrap !important; overflow-wrap: normal; }
  table.liste-clients.en-cartes > tbody > tr > td.mail { grid-area: mail; align-self: center; min-width: 0; font-size: .75rem; white-space: nowrap !important; overflow-wrap: normal; }
  table.liste-clients.en-cartes > tbody > tr:has(> td.tel.vide-carte) > td.mail { grid-column: 1 / -1; }
  table.liste-clients.en-cartes td.mail .coupe { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  table.liste-clients.en-cartes > tbody > tr > td.nb-devis { grid-area: devis; }
  table.liste-clients.en-cartes > tbody > tr > td.nb-chantiers { grid-area: chantiers; }
  table.liste-clients.en-cartes > tbody > tr > td:is(.nb-devis, .nb-chantiers) { align-self: center; display: block !important; }
  table.liste-clients.en-cartes td:is(.nb-devis, .nb-chantiers) > * , table.liste-clients.en-cartes td:is(.nb-devis, .nb-chantiers) { font-size: .7rem; font-weight: 600; }
  table.liste-clients.en-cartes td:is(.nb-devis, .nb-chantiers) a { display: inline-block; color: #475569; background: #f1f5f9; border: 1px solid #e2e8f0; padding: .05rem .4rem; border-radius: 999px; white-space: nowrap; line-height: 1.4; }
  table.liste-clients.en-cartes td.zero a { color: var(--muted); background: transparent; } /* audit code navigateur, constat 7 : lisible (4,8 pour 1) */
  table.liste-clients .unite { display: inline; }
  table.liste-clients.en-cartes > tbody > tr > td.actions { display: none; }
  /* Toute la carte ouvre la fiche (le nom seul était une cible trop petite, et ne ressemblait plus à un lien) :
     le lien du nom s'étend sur la carte ; téléphone, email et pastilles passent au-dessus et gardent leur action.
     top/right/bottom/left plutôt que inset (ignoré avant iOS 14.5) ; client/index.html.twig ajoute un filet en JS. */
  table.liste-clients.en-cartes > tbody > tr { position: relative; cursor: pointer; }
  table.liste-clients.en-cartes td.nom a.principal::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; border-radius: 10px; }
  table.liste-clients.en-cartes td.nom a.principal:active::after { background: rgba(180, 83, 9, .06); }
  table.liste-clients.en-cartes td:is(.tel, .mail, .nb-devis, .nb-chantiers) a { position: relative; z-index: 2; }
  table.liste-clients.en-cartes > tbody > tr:has(a.principal) > td.adresse { padding-right: 1.1rem; }
  table.liste-clients.en-cartes > tbody > tr:has(a.principal)::after { content: '›'; position: absolute; right: .7rem; top: 50%; transform: translateY(-15%); color: #9ca3af; font-size: 1.3rem; line-height: 1; pointer-events: none; }
}
/* Fiche client en lecture seule (25/10/2026) : élément rattaché affiché sans lien quand le profil ne lit pas ce module. */
.carte-client .tag-lien.sans-lien { background: #f3f4f6; border-color: var(--border); color: var(--muted); }
.email-client { margin: 0 0 .4rem; font-size: .9rem; overflow-wrap: anywhere; }
@media (max-width: 720px) {
  /* Carte de contact du client : les trois boutons d'itinéraire se partagent la largeur (texte sur deux lignes si
     besoin) au lieu de défiler, ce qui coupait « Apple Plans » au bord de la carte. */
  .carte-client .contacts > .itineraires, .carte-client .itineraires { display: flex; gap: .4rem; overflow: visible; }
  .carte-client .itineraires > .btn-contact { flex: 1 1 0; min-width: 0; justify-content: center; gap: .25rem; padding: .4rem .3rem; font-size: .85rem; line-height: 1.15; white-space: normal; text-align: center; }
}

/* ===== Module 1.10 — Rapports de chantier (25/10/2026) =====
   Fiche chantier : onglet Rapports (lignes datées avec pastilles), corbeille, fenêtre « Nouveau rapport » (rendez-vous
   Google Agenda). Page du rapport façon OneNote : rapports à gauche (en bandeau sur téléphone), blocs à droite, croquis
   au stylet. Impression : la page seule. */
.liste-rapports { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.liste-rapports a.rapport-ligne { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: .8rem; align-items: center; padding: .65rem .85rem; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; color: var(--text); text-decoration: none; }
.liste-rapports a.rapport-ligne:hover { border-color: #fcd34d; background: #fffdf7; }
.rapport-ligne .date-bloc { text-align: center; background: #fff7ed; border-radius: 8px; padding: .3rem 0; color: var(--primary-dark); line-height: 1.1; }
.rapport-ligne .date-bloc b { display: block; font-size: 1.25rem; }
.rapport-ligne .date-bloc span { font-size: .7rem; text-transform: uppercase; }
.rapport-ligne .titre { display: block; font-weight: 600; }
.rapport-ligne .fleche { color: var(--muted); font-size: 1.3rem; }
.pastilles { display: flex; gap: .3rem; flex-wrap: wrap; margin-top: .25rem; }
.pastilles .pastille, .entete-rapport .pastille { display: inline-flex; align-items: center; gap: .2rem; font-size: .72rem; color: #475569; background: #f1f5f9; border: 1px solid #e2e8f0; padding: .05rem .45rem; border-radius: 999px; white-space: nowrap; width: auto; height: auto; }  /* la règle générale .pastille (carré de 10 px) écrasait la taille : textes superposés (31/10/2026) */
.pastille.agenda { color: #1d4ed8; background: #eff6ff; border-color: #bfdbfe; }
.pastille.ouvert { color: #92400e; background: #fffbeb; border-color: #fde68a; }
.pastille svg.ico { width: .85em; height: .85em; }
.rapports-fiche h2 { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.rapports-corbeille { margin-top: 1rem; font-size: .9rem; }
.rapports-corbeille summary { cursor: pointer; color: var(--muted); }
.rapports-corbeille ul { list-style: none; padding: 0; margin: .5rem 0 0; display: grid; gap: .4rem; }
.rapports-corbeille form { margin-left: .4rem; }
@media (max-width: 720px) {
  .liste-rapports a.rapport-ligne { grid-template-columns: 50px minmax(0, 1fr); gap: .6rem; padding: .55rem .65rem; }
  .rapport-ligne .fleche { display: none; }
}

/* Fenêtre « Nouveau rapport » */
dialog.fenetre-rapport { max-width: min(600px, calc(100vw - 1rem)); }
dialog.fenetre-rapport > header { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .9rem 1.1rem; border-bottom: 1px solid var(--border); }
dialog.fenetre-rapport .corps { padding: .8rem 1.1rem 1.1rem; max-height: calc(100vh - 7rem); overflow-y: auto; }
.fenetre-rapport .recherche-rdv { width: 100%; padding: .5rem .7rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; font-size: 16px; }
.fenetre-rapport .groupe { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin: .9rem 0 .35rem; }
.fenetre-rapport label.rdv { display: flex; gap: .65rem; align-items: flex-start; padding: .55rem .7rem; border: 1px solid var(--border); border-radius: 8px; margin-bottom: .4rem; cursor: pointer; font-weight: 400; }
.fenetre-rapport label.rdv[hidden] { display: none; }
.fenetre-rapport label.rdv:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 1px var(--primary); }
.fenetre-rapport label.rdv.propose { background: #eff6ff; border-color: #bfdbfe; }
.fenetre-rapport label.rdv input[type=radio] { margin-top: .2rem; accent-color: var(--primary); flex: none; }
.fenetre-rapport label.rdv > span { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.fenetre-rapport .quand { font-size: .8rem; color: var(--muted); }
.fenetre-rapport .pourquoi { font-size: .72rem; color: #1d4ed8; }
.fenetre-rapport .pourquoi.deja { color: var(--muted); }
.fenetre-rapport .champs-sans-rdv { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .35rem; }
.fenetre-rapport .champs-sans-rdv input { padding: .4rem .55rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; font-size: 16px; }
.fenetre-rapport .champs-sans-rdv input[name=titre] { flex: 1 1 100%; }
.fenetre-rapport .relier-agenda { background: #f8fafc; border: 1px solid var(--border); border-radius: 8px; padding: .6rem .8rem; margin-bottom: .4rem; }
.fenetre-rapport .relier-agenda p { margin: 0 0 .5rem; }
.fenetre-rapport .erreur-rdv, .fenetre-rapport p.erreur-rdv { color: var(--danger); font-size: .88rem; }

/* Page du rapport */
.page-rapport .bandeau-corbeille { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; border-radius: 8px; padding: .55rem .8rem; margin-bottom: .8rem; display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
.carnet { display: grid; grid-template-columns: 240px minmax(0, 1fr); background: var(--surface); border: 1px solid var(--border); border-radius: 12px; overflow: clip; min-height: 70vh; }
.pages-rapports { background: #faf5ff; border-right: 1px solid #e9d5ff; padding: .6rem; display: flex; flex-direction: column; gap: .1rem; }
.pages-rapports .entete-pages { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #7e22ce; margin: .2rem .35rem .45rem; }
.pages-rapports a { display: block; padding: .45rem .6rem; border-radius: 6px; text-decoration: none; color: var(--text); font-size: .88rem; line-height: 1.25; border-left: 3px solid transparent; }
.pages-rapports a small { display: block; color: var(--muted); font-size: .74rem; }
.pages-rapports a:hover { background: #f3e8ff; }
.pages-rapports a.actif { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.08); border-left-color: #7e22ce; }
.pages-rapports a.nouvelle { margin-top: .5rem; color: #7e22ce; font-weight: 600; display: flex; align-items: center; gap: .3rem; }
.feuille { padding: 1.1rem 1.5rem 2rem; min-width: 0; }
.entete-rapport h1 { font-size: 1.45rem; margin: 0; }
.entete-rapport .meta { display: flex; gap: .35rem .9rem; flex-wrap: wrap; align-items: center; font-size: .84rem; color: var(--muted); margin: .35rem 0 .6rem; }
.entete-rapport .meta > span { display: inline-flex; align-items: center; gap: .3rem; }
.actions-rapport { display: flex; gap: .4rem; flex-wrap: wrap; align-items: flex-start; padding-bottom: .7rem; border-bottom: 1px solid var(--border); }
.actions-rapport form { margin: 0; }
.modifier-entete > summary { list-style: none; }
.modifier-entete > summary::-webkit-details-marker { display: none; }
.modifier-entete[open] { flex-basis: 100%; order: 5; }
.formulaire-entete { display: grid; gap: .5rem; margin-top: .6rem; padding: .8rem; background: #f8fafc; border: 1px solid var(--border); border-radius: 8px; max-width: 560px; }
.formulaire-entete label { display: flex; flex-direction: column; gap: .2rem; font-size: .85rem; font-weight: 500; }
.formulaire-entete input { padding: .45rem .6rem; border: 1px solid #d1d5db; border-radius: 6px; font: inherit; font-size: 16px; }
.formulaire-entete .deux { display: flex; gap: .5rem; }
.formulaire-entete .deux label { flex: 1; }
.formulaire-entete button { justify-self: start; }
.outils-rapport { position: sticky; top: 0; z-index: 12; display: flex; gap: .35rem; align-items: center; padding: .5rem 0; margin-bottom: .6rem; background: var(--surface); border-bottom: 1px solid #f1f5f9; overflow-x: auto; scrollbar-width: none; }
.outils-rapport::-webkit-scrollbar { display: none; }
.outils-rapport .btn { display: inline-flex; align-items: center; gap: .3rem; flex: none; }
.outils-rapport .etat-page { margin-left: auto; white-space: nowrap; }
.bloc-rapport { position: relative; margin: 0 0 .9rem; padding: .55rem .75rem .75rem; border: 1px solid transparent; border-radius: 9px; }
.bloc-rapport:hover, .bloc-rapport:focus-within { border-color: var(--border); }
.bloc-rapport:target { border-color: #fcd34d; }
.tete-bloc { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .35rem; }
.tete-bloc .titre-bloc { flex: 1 1 12rem; min-width: 0; font: inherit; font-weight: 650; font-size: 1rem; margin: 0; border: 1px solid transparent; border-radius: 5px; padding: .15rem .3rem; background: transparent; }
.tete-bloc input.titre-bloc:hover, .tete-bloc input.titre-bloc:focus { border-color: var(--border); background: #fff; outline: none; }
.tete-bloc .qui { font-size: .72rem; color: var(--muted); white-space: nowrap; }
.tete-bloc .etat-enreg { font-size: .72rem; color: var(--success); white-space: nowrap; }
.tete-bloc .etat-enreg.erreur { color: var(--danger); white-space: normal; flex-basis: 100%; }
.tete-bloc .actions-bloc { display: inline-flex; gap: .15rem; opacity: .35; }
.bloc-rapport:hover .actions-bloc, .bloc-rapport:focus-within .actions-bloc { opacity: 1; }
.tete-bloc .actions-bloc form { margin: 0; display: inline-flex; gap: .15rem; }
.tete-bloc .actions-bloc .btn-icone { padding: .2rem .35rem; min-height: 30px; }
.texte-bloc { display: block; width: 100%; min-height: 70px; resize: none; overflow: hidden; border: 1px solid transparent; border-radius: 6px; padding: .35rem .45rem; font: inherit; line-height: 1.55; background: transparent; }
.texte-bloc:hover { border-color: #f1f5f9; }
.texte-bloc:focus { outline: none; border-color: #fde68a; background: #fffdf5; }
.texte-rapport { line-height: 1.55; padding: .1rem .45rem; overflow-wrap: anywhere; }
.impression-seule { display: none; }
.points-rapport { list-style: none; margin: 0; padding: 0; }
.points-rapport li { display: flex; align-items: center; gap: .45rem; padding: .15rem 0; }
.points-rapport input[type=checkbox] { width: 1.15rem; height: 1.15rem; flex: none; accent-color: var(--primary); }
.points-rapport .texte-point { flex: 1 1 auto; min-width: 0; border: 1px solid transparent; border-radius: 5px; padding: .3rem .4rem; font: inherit; background: transparent; }
.points-rapport input.texte-point:focus { outline: none; border-color: #fde68a; background: #fffdf5; }
.points-rapport li.fait .texte-point { color: var(--muted); text-decoration: line-through; }
.points-rapport .vers-note { font-size: .72rem; color: #1d4ed8; white-space: nowrap; text-decoration: none; }
.points-rapport .vers-note-choix { font-size: .75rem; max-width: 9.5rem; padding: .15rem; border: 1px solid var(--border); border-radius: 5px; color: var(--muted); background: #fff; }
.points-rapport .retirer-point { padding: .1rem .3rem; min-height: 28px; color: var(--muted); opacity: .5; }
.points-rapport li:hover .retirer-point, .points-rapport li:focus-within .retirer-point { opacity: 1; }
.bloc-liste .ajouter-point { margin-top: .3rem; display: inline-flex; align-items: center; gap: .3rem; }
.bloc-liste .aide-point { margin: .3rem 0 0; }
.photos-rapport { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .55rem; }
.photos-rapport figure { margin: 0; }
.photos-rapport img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; border: 1px solid var(--border); background: #f3f4f6; }
.photos-rapport figcaption { display: flex; gap: .3rem; align-items: center; margin-top: .3rem; }
.photos-rapport figcaption form { margin: 0; }
.piece-rapport { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; padding: .5rem .65rem; border: 1px solid var(--border); border-radius: 8px; background: #fafafa; margin-top: .45rem; }
.piece-rapport .ico-pdf { width: 36px; height: 44px; border-radius: 4px; background: #fee2e2; color: #b91c1c; display: flex; align-items: center; justify-content: center; font-size: .68rem; font-weight: 700; flex: none; }
.piece-rapport .nom-piece { flex: 1 1 12rem; min-width: 0; display: flex; flex-direction: column; overflow-wrap: anywhere; }
.piece-rapport form { margin: 0; display: inline-flex; gap: .3rem; align-items: center; }
.piece-rapport select { font: inherit; font-size: .85rem; padding: .2rem; border: 1px solid var(--border); border-radius: 5px; }
.envoi-fichiers { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; margin-top: .55rem; }
.envoi-fichiers label.btn { display: inline-flex; align-items: center; gap: .3rem; cursor: pointer; margin: 0; }
.envoi-fichiers.envoi label { opacity: .4; pointer-events: none; }
.croquis { border: 1px solid #e2e8f0; border-radius: 10px; overflow: hidden; background: #fff; }
.croquis canvas { display: block; width: 100%; height: 300px; touch-action: none; cursor: crosshair; background-color: #fff; background-image: linear-gradient(#e0f2fe 1px, transparent 1px); background-size: 100% 32px; }
.croquis.avec-fond canvas { background-image: none; }
.croquis.stylet-seul canvas { touch-action: pan-x pan-y; }
.croquis[data-lecture] canvas { touch-action: auto; cursor: default; }
.barre-croquis { display: flex; gap: .3rem; align-items: center; flex-wrap: wrap; padding: .35rem .5rem; background: #f8fafc; border-bottom: 1px solid #e2e8f0; }
.barre-croquis button { display: inline-flex; align-items: center; gap: .25rem; border: 1px solid #e2e8f0; background: #fff; border-radius: 6px; padding: .3rem .6rem; min-height: 34px; cursor: pointer; font: inherit; font-size: .82rem; color: var(--text); }
.barre-croquis button.actif { border-color: var(--primary); background: #fff7ed; color: var(--primary-dark); }
.barre-croquis .couleur { width: 1.7rem; min-height: 1.7rem; height: 1.7rem; padding: 0; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px #cbd5e1; }
.barre-croquis .couleur.actif { box-shadow: 0 0 0 2px var(--primary); background-clip: padding-box; }
.barre-croquis .stylet-seul { margin-left: auto; display: inline-flex; align-items: center; gap: .3rem; font-size: .8rem; color: var(--muted); font-weight: 400; }
.pied-rapport { margin-top: 1.5rem; padding-top: .6rem; border-top: 1px solid var(--border); }
@media (max-width: 720px) {
  .carnet { grid-template-columns: minmax(0, 1fr); border-radius: 10px; }
  .pages-rapports { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid #e9d5ff; padding: .45rem; scrollbar-width: none; }
  .pages-rapports::-webkit-scrollbar { display: none; }
  .pages-rapports .entete-pages { display: none; }
  .pages-rapports a { flex: none; max-width: 190px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-left: 0; border-bottom: 3px solid transparent; }
  .pages-rapports a.actif { border-bottom-color: #7e22ce; }
  .pages-rapports a.nouvelle { margin-top: 0; }
  .feuille { padding: .8rem .75rem 1.5rem; }
  .entete-rapport h1 { font-size: 1.2rem; }
  .bloc-rapport { padding: .45rem .3rem .6rem; }
  .tete-bloc .actions-bloc { opacity: 1; }
  .tete-bloc .actions-bloc .btn-icone { min-height: 38px; }
  .points-rapport .vers-note-choix { max-width: 6.5rem; }
  .points-rapport .retirer-point { opacity: 1; min-height: 36px; }
}
@media print {
  .page-rapport .fil, .page-rapport .bandeau-corbeille, .pages-rapports, .actions-rapport, .outils-rapport, .actions-bloc, .etat-enreg, .ecran-seul, .ajouter-point, .aide-point, .retirer-point, .vers-note-choix, .barre-croquis, .envoi-fichiers { display: none !important; }
  .impression-seule { display: block; }
  .carnet { display: block; border: 0; min-height: 0; }
  .feuille { padding: 0; }
  .bloc-rapport { border: 0 !important; padding: .3rem 0; break-inside: avoid; }
  .bloc-croquis, .photos-rapport figure { break-inside: avoid; }
  .tete-bloc input.titre-bloc { border: 0; padding: 0; }
  .points-rapport input.texte-point { border: 0; padding: .1rem 0; }
  .croquis { border-color: #ccc; }
  .croquis canvas { background-image: none; }
  .photos-rapport { grid-template-columns: repeat(3, 1fr); }
}

/* ---- 25/10/2026 : cartes des devis compactes sur téléphone (demande d'Arnaud, sur le modèle des cartes des clients) ----
   Trois lignes au lieu de six blocs titrés : n° + objet (coupé par « … ») et statut ; client · ville (· chantier) et
   total HT ; date · suivi en petit. Plus de bouton « Ouvrir » : le lien du n° s'étend sur toute la carte (flèche ›).
   Vaut aussi pour la liste des bons d'intervention (même gabarit). Sur ordinateur, rien ne change. */
@media (max-width: 720px) {
  table.liste-devis.en-cartes > tbody > tr {
    grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-areas: "numero numero objet etat" "client client client total" "date suivi suivi suivi";
    gap: .15rem .45rem; padding: .55rem 1.6rem .55rem .75rem; margin-bottom: .45rem; position: relative; cursor: pointer;
  }
  table.liste-devis.en-cartes > tbody > tr > td::before { content: none; }
  table.liste-devis.en-cartes > tbody > tr > td.numero { grid-area: numero; padding-right: 0; font-size: 1rem; font-weight: 700; white-space: nowrap !important; overflow-wrap: normal; }
  table.liste-devis.en-cartes td.numero a.principal { color: var(--text); text-decoration: none; }
  table.liste-devis.en-cartes td.numero br { display: none; }
  table.liste-devis.en-cartes td.numero .sous { display: inline; margin-left: .3rem; font-size: .72rem; font-weight: 500; }
  table.liste-devis.en-cartes td.numero .etq-batappli { display: none; }            /* trop large ici : visible sur ordinateur et dans le devis */
  table.liste-devis.en-cartes > tbody > tr > td.objet { grid-area: objet; align-self: center; font-size: .9rem; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  table.liste-devis.en-cartes > tbody > tr > td.etat { grid-area: etat; align-self: center; }
  table.liste-devis.en-cartes td.etat .statut { font-size: .72rem; padding: .05rem .5rem; }
  table.liste-devis.en-cartes > tbody > tr > td.client { grid-area: client; font-size: .9rem; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  table.liste-devis.en-cartes td.client .sous { display: inline; font-size: .82rem; }
  table.liste-devis.en-cartes td.client .sous:not(:empty)::before { content: ' · '; }
  table.liste-devis.en-cartes > tbody > tr > td.date { padding-right: .1rem; }
  table.liste-devis.en-cartes > tbody > tr:not(:has(> td.total)) > td.client { grid-column: 1 / -1; }
  table.liste-devis.en-cartes > tbody > tr > td.total { grid-area: total; color: var(--text); font-weight: 700; white-space: nowrap !important; text-align: right !important; }
  table.liste-devis.en-cartes > tbody > tr > td.date { grid-area: date; font-size: .78rem; color: var(--muted); white-space: nowrap !important; }
  table.liste-devis.en-cartes > tbody > tr > td.suivi { grid-area: suivi; font-size: .78rem; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  table.liste-devis.en-cartes > tbody > tr > td.suivi:not(:empty)::before { content: '· '; display: inline; color: var(--muted); font-size: inherit; text-transform: none; letter-spacing: 0; }
  table.liste-devis.en-cartes > tbody > tr > td.actions { display: none; }
  table.liste-devis.en-cartes > tbody > tr > td.ttc { display: none; }                 /* 15/11/2026 : la carte garde le seul total HT */
  /* Toute la carte ouvre le devis ; la flèche › le dit. */
  table.liste-devis.en-cartes td.numero a.principal::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: 10px; }
  table.liste-devis.en-cartes td.numero a.principal:active::after { background: rgba(180, 83, 9, .06); }
  table.liste-devis.en-cartes > tbody > tr::after { content: '›'; position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); color: #9ca3af; font-size: 1.3rem; line-height: 1; pointer-events: none; }
}

/* ---- 25/10/2026 : cartes des chantiers compactes sur téléphone (demande d'Arnaud, comme les clients et les devis) ----
   Trois lignes : n° + chantier (coupé par « … ») et statut (sa raison ou son alerte en petit dessous) ; client · ville ·
   responsable et montant HT ; avancement (barre courte) · planning en petit, et « Facturé ✓ » quand il y a lieu. Plus de
   boutons « Ouvrir », « Planning », « Bon » sur la carte : le lien du chantier s'étend sur toute la carte (flèche ›).
   Indicateur des achats : le montant engagé sur une 4e ligne. Sur ordinateur, rien ne change (ville sous le chantier). */
table.liste-chantiers .lieu-carte { display: none; }
@media (max-width: 720px) {
  table.liste-chantiers.en-cartes > tbody > tr {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    grid-template-areas: "numero objet objet etat" "client client client montant" "avancement avancement planning actions" "achats achats achats achats";
    gap: .15rem .45rem; padding: .55rem 1.6rem .55rem .75rem; margin-bottom: .45rem; position: relative; cursor: pointer;
  }
  table.liste-chantiers.en-cartes > tbody > tr > td::before { content: none; }
  table.liste-chantiers.en-cartes > tbody > tr > td.numero { grid-area: numero; padding-right: 0; color: var(--text); font-size: 1rem; font-weight: 700; white-space: nowrap !important; overflow-wrap: normal; }
  table.liste-chantiers.en-cartes > tbody > tr > td.objet { grid-area: objet; font-size: .95rem; line-height: 1.5; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  table.liste-chantiers.en-cartes td.objet a.principal { color: var(--text); text-decoration: none; font-weight: 600; }
  table.liste-chantiers.en-cartes td.objet .sous { display: none; }
  table.liste-chantiers.en-cartes > tbody > tr > td.etat { grid-area: etat; max-width: 7.5rem; text-align: right !important; }
  table.liste-chantiers.en-cartes td.etat .statut { font-size: .72rem; padding: .05rem .5rem; }
  table.liste-chantiers.en-cartes td.etat .sous { font-size: .72rem; line-height: 1.25; }
  table.liste-chantiers.en-cartes > tbody > tr > td.client { grid-area: client; font-size: .9rem; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  table.liste-chantiers.en-cartes td.client .lieu-carte { display: inline; font-size: .82rem; color: var(--muted); }
  table.liste-chantiers.en-cartes td.client .lieu-carte::before { content: ' · '; }
  table.liste-chantiers.en-cartes > tbody > tr:not(:has(> td.montant-ht)) > td.client { grid-column: 1 / -1; }
  table.liste-chantiers.en-cartes > tbody > tr > td.montant-ht { grid-area: montant; color: var(--text); font-weight: 700; white-space: nowrap !important; text-align: right !important; }
  table.liste-chantiers.en-cartes > tbody > tr > td.avancement-cell { grid-area: avancement; align-self: center; }
  table.liste-chantiers.en-cartes td.avancement-cell .avancement { min-width: 0; width: 5rem; gap: .3rem; font-size: .75rem; }
  table.liste-chantiers.en-cartes > tbody > tr > td.planning-cell { grid-area: planning; align-self: center; font-size: .78rem; color: var(--muted); white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  table.liste-chantiers.en-cartes > tbody > tr > td.planning-cell .alerte { font-size: inherit; }
  table.liste-chantiers.en-cartes > tbody > tr > td.achats { grid-area: achats; font-size: .8rem; text-align: left !important; }
  table.liste-chantiers.en-cartes td.achats .sous { display: inline; margin-left: .3rem; font-size: inherit; }
  /* Seul « Facturé ✓ » reste sur la carte (action de gestion) ; Ouvrir, Planning et Bon sont dans le chantier. */
  table.liste-chantiers.en-cartes > tbody > tr > td.actions { grid-area: actions; position: static; justify-self: end; align-self: center; max-width: none; }
  table.liste-chantiers.en-cartes > tbody > tr > td.actions .btn:not(.facture) { display: none; }
  table.liste-chantiers.en-cartes > tbody > tr > td.actions:not(:has(.facture)) { display: none; }
  table.liste-chantiers.en-cartes td.actions .facture { position: relative; z-index: 2; padding: .1rem .5rem; font-size: .75rem; min-height: 0; }
  /* Toute la carte ouvre le chantier ; la flèche › le dit. */
  table.liste-chantiers.en-cartes td.objet a.principal::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: 10px; }
  table.liste-chantiers.en-cartes td.objet a.principal:active::after { background: rgba(180, 83, 9, .06); }
  table.liste-chantiers.en-cartes > tbody > tr::after { content: '›'; position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); color: #9ca3af; font-size: 1.3rem; line-height: 1; pointer-events: none; }
}

/* Paramétrage › Entreprise : total des heures de la semaine, aligné sur les cases des jours. */
.form-entreprise .total-semaine { margin: 1.9rem 0 0; }
@media (max-width: 720px) { .form-entreprise .total-semaine { margin-top: 0; } }

/* Barre du haut : famille et entrée du fil d'Ariane cliquables (la famille ouvre le menu, l'entrée mène à sa page). */
.barre-haut .fil-lien { color: inherit; font: inherit; background: none; border: 0; padding: .35rem 0; margin: 0; cursor: pointer; text-decoration: none; border-radius: 4px; }
.barre-haut a.fil-lien:not([href]) { cursor: default; }
.barre-haut .fil-lien:hover, .barre-haut .fil-lien:focus-visible { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
/* Appareil dans la page ouvert par « Prendre une photo » (31/10/2026) : secours si la caméra est refusée. */
dialog.rafale-photos .rafale-secours { position: absolute; top: 8rem; left: 1rem; right: 1rem; margin: 0; text-align: center; }
dialog.rafale-photos .rafale-secours[hidden] { display: none; }
/* Types d'absence : code SILAE (31/10/2026) — liste étroite, libellé complet dans le menu déroulant. */
.familles-articles select.code-silae { max-width: 13rem; }
/* Pointage › Export : fichier de paie SILAE (31/10/2026). */
.fichier-silae { margin: 1rem 0; }
.fichier-silae summary { cursor: pointer; list-style: none; }
.fichier-silae summary h2 { display: inline; font-size: 1.1rem; }
.fichier-silae .tableau-defilant { overflow-x: auto; }
.fichier-silae table.silae-lignes td, .fichier-silae table.silae-lignes th { white-space: nowrap; }

/* RH › Pointage — Primes du mois (01/11/2026) */
.primes-mois { margin-top: 1rem; }
.primes-mois h2 { font-size: 1.1rem; margin: 0 0 .6rem; }
.primes-mois table.primes td { vertical-align: middle; }
.primes-mois table.primes td.num input { width: 7rem; text-align: right; }
.primes-mois table.primes input[name$="[motif]"] { width: 100%; min-width: 12rem; }
.primes-mois table.primes tfoot td { font-weight: 700; }
.primes-mois .actions-primes { margin: .7rem 0 .4rem; }

/* ---- Planning : équipe changée à la journée, alerte « équipe trop faible » (01/11/2026) ---- */
.compo .personne .jours-compo { font-size: .64rem; font-weight: 400; opacity: .8; }
.alerte-effectif { flex-shrink: 0; border: 1px solid #fca5a5; background: #fee2e2; color: #991b1b; border-radius: 999px; padding: .05rem .45rem; font: inherit; font-size: .72rem; font-weight: 700; cursor: pointer; white-space: nowrap; }
.alerte-effectif:hover { background: #fecaca; }
.compo.resume .alerte-effectif { padding: 0 .3rem; margin-right: .2rem; }
.jours-equipe { display: flex; flex-wrap: wrap; gap: 0 .9rem; margin: -.1rem 0 .3rem 1.6rem; }
.modale-planning .jours-equipe label.checkbox { display: inline-flex; gap: .3rem; align-items: center; margin: .15rem 0; }
.alerte-effectif-texte { grid-column: 1 / -1; margin: 0 0 .5rem; color: #991b1b; background: #fee2e2; border: 1px solid #fca5a5; border-radius: 8px; padding: .45rem .7rem; font-size: .88rem; }

/* ---- Paramétrage › Modèles de véhicules : filtre par véhicule, opération sur deux lignes au téléphone (01/11/2026) ---- */
.filtre-modeles { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .8rem; }
.filtre-modeles label { font-weight: 600; margin: 0; }
.filtre-modeles select { flex: 1; min-width: 0; max-width: 32rem; }
.modele-vehicule table.operations .lib-court { display: none; }
@media (max-width: 900px) {
  /* Ligne 1 : le nom de l'opération, les boutons à droite ; ligne 2 : les quatre nombres côte à côte. */
  .modele-vehicule table.operations.en-cartes > tbody > tr { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .1rem .45rem; padding: .45rem .55rem .5rem; margin-bottom: .45rem; }
  .modele-vehicule table.operations.en-cartes > tbody > tr > td:first-of-type { grid-column: 1 / -1; padding-right: 5.6rem; font-size: .95rem; }
  .modele-vehicule table.operations.en-cartes > tbody > tr.ajout > td:first-of-type { padding-right: 6.6rem; }
  .modele-vehicule table.operations.en-cartes > tbody > tr > td:first-of-type::before { content: none; }
  .modele-vehicule table.operations.en-cartes > tbody > tr > td.actions { position: absolute !important; top: .4rem; right: .45rem; grid-column: auto !important; max-width: none; padding-top: 0 !important; flex-wrap: nowrap; gap: .25rem; }
  .modele-vehicule table.operations.en-cartes > tbody > tr > td.actions .btn { min-height: 34px; min-width: 38px; padding: .2rem .55rem; }
  .modele-vehicule table.operations.en-cartes > tbody > tr > td.num::before { font-size: .6rem; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .modele-vehicule table.operations.en-cartes input[type=text] { border-color: #e5e7eb; background: #fff; padding: .25rem .35rem; font-size: .9rem; }
  .modele-vehicule table.operations.en-cartes input.court { width: 100%; }
  .modele-vehicule table.operations .lib-long { display: none; }
  .modele-vehicule table.operations .lib-court { display: inline; font-weight: 700; }
}
@media (max-width: 600px) {
  .filtre-modeles select { flex-basis: 100%; max-width: none; order: 2; }
  .filtre-modeles .btn { order: 3; }
}

/* ---- Planning : jour(s) d'une tâche libre bien marqués (01/11/2026) ---- */
.piste .tache-planning { background: repeating-linear-gradient(135deg, #cbd5e1 0 6px, #b6c2d1 6px 12px); border-color: #64748b; border-left-color: #334155; }
.piste .tache-planning > span { text-shadow: 0 0 2px #fff, 0 0 2px #fff; }

/* ---- Notes : listes internes (Atelier, Besoins EPI) en tête de « Notes des chantiers » (01/11/2026) ---- */
.listes-internes { margin-bottom: 1rem; }
.liste-interne { border-left: 4px solid #0f766e; }
.liste-interne h2 { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .6rem; }
.liste-interne h2 .nom-liste { font-weight: 700; }
.liste-interne h2 .ajout-liste { margin-left: auto; }
.liste-interne .faites-recemment { margin-top: .5rem; font-size: .9rem; }
.liste-interne .faites-recemment summary { cursor: pointer; color: var(--muted); }
.groupe-notes-tv.liste-interne { border-left: 3px solid #5eead4; padding-left: .4rem; }
@media print { .liste-interne .ajout-liste, .liste-interne .faites-recemment { display: none; } }

/* Consultations : pièces jointes au mail (05/11/2026) */
.fiche-consultation ul.pieces-jointes { list-style: none; padding: 0; margin: .25rem 0 .75rem; display: flex; flex-direction: column; gap: .35rem; }
.fiche-consultation ul.pieces-jointes li { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.fiche-consultation ul.pieces-jointes a { display: inline-flex; align-items: center; gap: .3rem; overflow-wrap: anywhere; }
.fiche-consultation ul.pieces-jointes svg, .fiche-consultation #pieces-jointes svg { width: 1em; height: 1em; }

/* Registre du personnel (06/11/2026) : champs conseillés de la fiche employé, jamais obligatoires. */
.form-employe .conseille > label::after { content: " (conseillé)"; font-weight: normal; color: #92400e; font-size: .85em; }
.flash-avert.employe-conseilles { margin-top: .6rem; }

/* ===== Module 4.4 — Gestion › Documents (dossiers et documents communs de l'entreprise) ===== */
.documents-entreprise .chemin-dossiers { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: 0 0 .5rem; color: var(--muted); font-size: .92rem; }
.documents-entreprise .chemin-dossiers a { display: inline-flex; align-items: center; gap: .3rem; }
.documents-entreprise .chemin-dossiers b { color: var(--text); display: inline-flex; align-items: center; gap: .3rem; }
.documents-entreprise .page-head .actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: flex-start; }
.documents-entreprise details.action-document { position: relative; }
.documents-entreprise details.action-document > summary { list-style: none; cursor: pointer; }
.documents-entreprise details.action-document > summary::-webkit-details-marker { display: none; }
.documents-entreprise details.action-document .volet { position: absolute; right: 0; top: calc(100% + .4rem); z-index: 20; width: min(26rem, calc(100vw - 2rem)); display: flex; flex-direction: column; gap: .5rem; box-shadow: 0 8px 24px rgba(0, 0, 0, .12); }
.documents-entreprise table.liste-documents td .principal { display: inline-flex; align-items: center; gap: .45rem; overflow-wrap: anywhere; }
.documents-entreprise table.liste-documents tr.ligne-dossier .principal .ico { color: #d97706; }
.documents-entreprise table.liste-documents td.actions { text-align: right; white-space: nowrap; }
.documents-entreprise .pastille-version { display: inline-block; font-size: .72rem; font-weight: 600; padding: .05rem .4rem; border-radius: 999px; background: #eef2ff; color: #4338ca; }
.documents-entreprise .gestion-dossier { margin-top: 1rem; display: flex; flex-direction: column; gap: .75rem; }
.documents-entreprise .ligne-formulaire { display: flex; flex-wrap: wrap; gap: .75rem; align-items: flex-end; }
.documents-entreprise .ligne-formulaire > div { display: flex; flex-direction: column; gap: .25rem; min-width: 12rem; }
.documents-entreprise .ligne-formulaire .form-actions { margin: 0; }
.fiche-document .page-head h1 { display: flex; align-items: center; gap: .5rem; overflow-wrap: anywhere; }
.fiche-document .infos-document { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .75rem 1.5rem; margin: 0; }
.fiche-document .infos-document dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); }
.fiche-document .infos-document dd { margin: .15rem 0 0; overflow-wrap: anywhere; }
.fiche-document .description-document { margin: 0 0 .75rem; }
.fiche-document ul.versions-document { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .4rem; }
.fiche-document ul.versions-document li { overflow-wrap: anywhere; }
.fiche-document .formulaire-document { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem 1rem; }
.fiche-document .formulaire-document > div { display: flex; flex-direction: column; gap: .25rem; }
.fiche-document .formulaire-document .large, .fiche-document .formulaire-document .form-actions { grid-column: 1 / -1; }
.fiche-document #supprimer-document { margin-top: 1rem; }
.documents-entreprise .ligne-formulaire > .form-actions, .fiche-document .formulaire-document > .form-actions { flex-direction: row; align-items: center; min-width: 0; }
.fiche-document .formulaire-document > .form-actions { margin-top: .25rem; }
.documents-entreprise .filtres input[type="search"] { flex: 1 1 14rem; min-width: 0; }
@media (max-width: 720px) {
    .documents-entreprise details.action-document .volet { position: fixed; left: 1rem; right: 1rem; top: auto; width: auto; }
    .documents-entreprise table.liste-documents th:nth-child(n+3):not(:last-child), .documents-entreprise table.liste-documents td:nth-child(n+3):not(:last-child) { display: none; }
    .fiche-document .formulaire-document { grid-template-columns: 1fr; }
    .documents-entreprise .ligne-formulaire > div { min-width: 0; width: 100%; }
}

/* ---------- Écran TV (06/11/2026) : photos d'un chantier en grand, par-dessus le planning (#photosTv, planning.js) ---------- */
dialog.photos-tv { border: 0; border-radius: 12px; padding: 0; width: 94vw; height: 92vh; max-width: none; max-height: none; background: #0f172a; color: #f8fafc; overflow: hidden; }
dialog.photos-tv::backdrop { background: rgba(15,23,42,.85); }
dialog.photos-tv [hidden] { display: none !important; }
.photos-tv .photos-tv-fermer { position: absolute; top: .8rem; right: .8rem; z-index: 3; background: rgba(255,255,255,.92); color: #0f172a; border: 0; border-radius: 999px; padding: .55rem 1.1rem; font-size: 1.05rem; font-weight: 600; cursor: pointer; }
.photos-tv .photos-tv-contenu { height: 100%; overflow-y: auto; padding: 1.2rem 1.5rem 2rem; }
.photos-tv .photos-tv-tete { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; padding-right: 8rem; margin-bottom: 1rem; }
.photos-tv .photos-tv-tete h2 { margin: .1rem 0; font-size: 1.6rem; color: #fff; }
.photos-tv .photos-tv-tete .num { font-size: .95rem; color: #93c5fd; font-weight: 600; }
.photos-tv .muted { color: #cbd5e1; }
.photos-tv .avancement { color: #cbd5e1; white-space: nowrap; }
.photos-tv .photos-tv-etape h3 { margin: 1.2rem 0 .6rem; font-size: 1.2rem; color: #fff; }
.photos-tv .photos-tv-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .8rem; }
.photos-tv .photos-tv-vignette { padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: #1e293b; aspect-ratio: 4 / 3; cursor: pointer; }
.photos-tv .photos-tv-vignette img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .15s; }
.photos-tv .photos-tv-vignette:hover img, .photos-tv .photos-tv-vignette:focus-visible img { transform: scale(1.04); }
.photos-tv .photos-tv-vide { margin: 4rem auto; text-align: center; font-size: 1.3rem; color: #cbd5e1; }
.photos-tv .photos-tv-grand { position: absolute; inset: 0; box-sizing: border-box; padding: 4rem 6rem 3.8rem; display: flex; align-items: center; justify-content: center; background: #0f172a; }
.photos-tv .photos-tv-grand img { max-width: 100%; max-height: 100%; object-fit: contain; touch-action: pan-y; user-select: none; }
.photos-tv .photos-tv-grand .fleche { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.85); color: #0f172a; border: 0; border-radius: 50%; width: 64px; height: 64px; font-size: 2.2rem; cursor: pointer; }
.photos-tv .photos-tv-grand .fleche.gauche { left: 1rem; } .photos-tv .photos-tv-grand .fleche.droite { right: 1rem; }
.photos-tv .photos-tv-legende { position: absolute; left: 0; right: 0; bottom: 0; padding: .8rem 1.2rem; background: rgba(15,23,42,.8); font-size: 1.05rem; display: flex; gap: .8rem; flex-wrap: wrap; align-items: baseline; }
.photos-tv .photos-tv-legende span { color: #cbd5e1; }
.photos-tv .photos-tv-rang { margin-left: auto; }
.photos-tv .photos-tv-retour { position: absolute; top: .8rem; left: .8rem; background: rgba(255,255,255,.92); color: #0f172a; border: 0; border-radius: 999px; padding: .55rem 1.1rem; font-size: 1.05rem; font-weight: 600; cursor: pointer; }
@media (max-width: 700px) {
    dialog.photos-tv { width: 100vw; height: 100vh; border-radius: 0; }
    .photos-tv .photos-tv-tete { padding-right: 0; padding-top: 2.8rem; flex-wrap: wrap; }
    .photos-tv .photos-tv-grille { grid-template-columns: repeat(2, 1fr); }
    .photos-tv .photos-tv-grand { padding: 3.6rem .5rem 3.6rem; }
    .photos-tv .photos-tv-grand .fleche { width: 48px; height: 48px; font-size: 1.7rem; }
}

/* ---------- Ma journée (06/11/2026) : lien « Chantier suivant » sous les boutons de la carte du jour ---------- */
.carte-jour a.chantier-suivant { display: flex; align-items: center; gap: .7rem; margin-top: .8rem; padding: .7rem .8rem; min-height: 48px; border: 1px solid var(--border); border-radius: 10px; background: #f8fafc; color: var(--text); text-decoration: none; }
.carte-jour a.chantier-suivant:hover, .carte-jour a.chantier-suivant:focus-visible { border-color: var(--primary); background: #fffbeb; }
.carte-jour a.chantier-suivant .couleur { flex: 0 0 6px; align-self: stretch; border-radius: 3px; }
.carte-jour a.chantier-suivant .lib { display: grid; gap: .1rem; min-width: 0; flex: 1; }
.carte-jour a.chantier-suivant .lib b { overflow-wrap: anywhere; }
.carte-jour a.chantier-suivant .lib small { color: var(--muted); font-size: .8rem; }
.carte-jour a.chantier-suivant .lib small:first-child { text-transform: uppercase; letter-spacing: .03em; font-weight: 600; color: var(--primary); }
.carte-jour a.chantier-suivant .fleche { font-size: 1.6rem; color: var(--muted); line-height: 1; }
.carte-jour p.chantier-suivant.aucun { margin: .8rem 0 0; }
/* ---- Retouche du 07/11/2026 : lignes du devis lisibles au téléphone ----
   Chaque ligne en saisie devient une carte : la désignation en haut sur toute la largeur, puis des cases de saisie
   bien visibles (bord, fond blanc), chacune avec son intitulé au-dessus, rangées en rangées régulières :
   Type | Unité, puis P.U. HT | Qté | TVA, puis total, option et boutons. Rien ne change sur ordinateur.
   Préfixe #tableau-devis : passe devant le rangement générique du bloc téléphone plus haut (td:not(…) { order: 3 }). */
@media (max-width: 720px) {
  table#tableau-devis tr:not(.chapitre):not(.sous-total):not(.lecture):not(.intertitre-options) { margin: .45rem 0; border: 1px solid var(--border); border-left: 4px solid #cbd5e1; border-radius: 10px; padding: .55rem .55rem .45rem; gap: .5rem .5rem; align-items: flex-end; }
  table#tableau-devis tr.vide:not(.futur-chapitre) { border-style: dashed; border-left-style: solid; border-left-color: #e5e7eb; }
  table#tableau-devis tr:focus-within:not(.chapitre) { border-left-color: var(--primary); }
  table#tableau-devis tr.chapitre { border-radius: 10px; margin-top: 1rem; }
  table#tableau-devis tr.chapitre textarea, table#tableau-devis tr.chapitre input[type=text] { font-weight: 600; }
  /* Les cases de saisie : visibles sans survol (il n'y en a pas au doigt), 16 px pour que le téléphone ne zoome pas. */
  table#tableau-devis tr:not(.lecture) input[type=text], table#tableau-devis tr:not(.lecture) select, table#tableau-devis tr:not(.lecture) textarea { border: 1px solid #cbd5e1; background-color: #fff; border-radius: 8px; font-size: 16px; min-height: 2.6rem; padding: .4rem .55rem; }
  table#tableau-devis tr:not(.lecture) select { padding-right: 1.6rem; background-position: right .55rem center; }
  table#tableau-devis tr:not(.lecture) td.type select { font-size: 15px; color: var(--text); }
  table#tableau-devis td.designation textarea { width: 100%; }
  /* Intitulé au-dessus de chaque case. */
  table#tableau-devis td:has(> input[name=prix_unitaire])::before,
  table#tableau-devis td:has(> input[name=quantite])::before,
  table#tableau-devis td:has(> select[name=unite])::before,
  table#tableau-devis tr:not(.chapitre) td.type::before,
  table#tableau-devis td:has(select[name=taux_tva])::before { display: block; margin: 0 0 .15rem .15rem; font-size: .72rem; font-weight: 600; color: #64748b; text-transform: uppercase; letter-spacing: .03em; text-align: left; }
  table#tableau-devis tr:not(.chapitre) td.type::before { content: "Type"; }
  table#tableau-devis td:has(> select[name=unite])::before { content: "Unité"; }
  table#tableau-devis td:has(select[name=taux_tva])::before { content: "TVA"; }
  /* Rangées : Type | Unité, puis P.U. | Qté | TVA, puis total / option / boutons. */
  table#tableau-devis tr:not(.chapitre) td.type { order: 2; flex: 1 1 calc(50% - .5rem); }
  table#tableau-devis td:has(> select[name=unite]) { order: 2; flex: 1 1 calc(50% - .5rem); }
  table#tableau-devis td:has(> input[name=prix_unitaire]) { order: 3; flex: 1 1 calc(36% - .5rem); }
  table#tableau-devis td:has(> input[name=quantite]) { order: 3; flex: 1 1 calc(28% - .5rem); }
  table#tableau-devis td:has(select[name=taux_tva]) { order: 3; flex: 1 1 calc(36% - .5rem); }
  table#tableau-devis td.tva.avec-regles { order: 5; flex-basis: 100%; }
  table#tableau-devis td.tva .tva-regles { gap: .5rem; }
  table#tableau-devis tr:not(.lecture) td input[name=prix_unitaire], table#tableau-devis tr:not(.lecture) td input[name=quantite], table#tableau-devis tr:not(.lecture) td select[name=unite], table#tableau-devis tr:not(.lecture) td select[name=taux_tva], table#tableau-devis tr:not(.lecture) td.type select { width: 100%; }
  table#tableau-devis td.tva .tva-regles select[name="taux_tva"] { flex: 0 0 8rem; }
  table#tableau-devis tr:not(.chapitre):not(.sous-total) td.montant { order: 6; align-self: center; font-size: 1.05rem; }
  table#tableau-devis tr:not(.chapitre):not(.sous-total) td.col-opt { order: 6; align-self: center; }
  table#tableau-devis tr:not(.chapitre):not(.sous-total) td.actions { order: 7; align-self: center; }
  table#tableau-devis td.col-opt label.option-ligne { display: inline-flex; align-items: center; gap: .3rem; margin: 0; font-size: .85rem; color: var(--muted); }
  table#tableau-devis td.col-opt label.option-ligne::after { content: "Option"; }
  table#tableau-devis td.col-opt input[type=checkbox] { width: 1.2rem; height: 1.2rem; }
  table#tableau-devis tr.vide td.montant:empty, table#tableau-devis tr.vide td.col-opt:empty, table#tableau-devis tr.vide td.actions:empty { display: none; }
}
@media (max-width: 720px) {
  table#tableau-devis td.designation { align-self: stretch; }
  table#tableau-devis td.ordre { align-self: flex-start; padding-top: .7rem; }
}
@media (max-width: 720px) and (pointer: coarse) {
  table#tableau-devis tr:not(.chapitre):not(.futur-chapitre) td.designation textarea[name="designation"] { padding-right: 3rem; }
}

/* Module 8.2 — Analyse › KPI */
.kpi-onglets { border-bottom: 1px solid var(--border); margin-bottom: 1rem; }
.kpi-barre { display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: 1rem; }
.kpi-barre p { margin: 0; }
.kpi-barre .actions-tete, .kpi-barre .actions-tete form { display: flex; gap: .5rem; flex-wrap: wrap; }
.kpi-groupe { margin-bottom: 1.5rem; }
.kpi-groupe > h2 { font-size: 1.05rem; margin: 0 0 .6rem; }
.kpi-grille-cartes { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.kpi-grille-cartes.a-plusieurs { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.kpi-carte { padding: 1rem; min-width: 0; }
.kpi-carte-tete { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.kpi-carte-tete h3 { margin: 0; font-size: .95rem; font-weight: 600; }
.kpi-trace svg { display: block; width: 100%; height: auto; }
.kpi-axe { font-size: 11px; fill: var(--muted); font-variant-numeric: tabular-nums; }
.kpi-grille { stroke: #eef0f3; stroke-width: 1; }
.kpi-zero { stroke: #cbd5e1; stroke-width: 1; }
.kpi-repere { stroke: #94a3b8; stroke-width: 1; }
.kpi-legende { display: flex; flex-wrap: wrap; gap: .3rem .9rem; font-size: .8rem; color: var(--muted); margin-bottom: .4rem; }
.kpi-legende-item { display: inline-flex; align-items: center; gap: .35rem; }
.kpi-pastille { width: 10px; height: 10px; border-radius: 3px; display: inline-block; flex: none; }
.kpi-pastille.pointilles { height: 0; border-top: 2px dashed; border-radius: 0; width: 14px; }
.kpi-info { position: fixed; z-index: 60; background: #111827; color: #fff; font-size: .78rem; padding: .45rem .6rem; border-radius: 8px; max-width: 300px; pointer-events: none; }
.kpi-info-ligne { display: flex; align-items: center; gap: .4rem; margin-top: .15rem; }
.kpi-info-ligne b { margin-left: auto; padding-left: .8rem; font-variant-numeric: tabular-nums; }
.kpi-details { margin-top: .4rem; font-size: .85rem; }
.kpi-details summary { cursor: pointer; color: var(--muted); }
.kpi-chiffres { width: 100%; border-collapse: collapse; font-size: .82rem; margin-top: .4rem; }
.kpi-chiffres th, .kpi-chiffres td { padding: .25rem .5rem; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
.kpi-chiffres .num, .kpi-saisie .num { text-align: right; font-variant-numeric: tabular-nums; }
.kpi-repartition { margin-bottom: .6rem; }
.kpi-repart-ligne { display: grid; grid-template-columns: 5.5rem 1fr 2rem; align-items: center; gap: .5rem; font-size: .85rem; margin-bottom: .25rem; }
.kpi-repart-piste { background: #f1f5f9; border-radius: 4px; height: 10px; overflow: hidden; }
.kpi-repart-barre { display: block; height: 100%; border-radius: 4px; }
.kpi-repart-ligne b { text-align: right; }
.kpi-reglage { border-top: 1px solid var(--border); margin-top: .8rem; padding-top: .8rem; }
.kpi-reglage label, .kpi-sources label, .kpi-filtres label { display: flex; flex-direction: column; gap: .15rem; font-size: .78rem; color: var(--muted); }
.kpi-reglage input[type=text], .kpi-reglage input[type=number], .kpi-reglage select { font: inherit; font-size: .85rem; padding: .3rem; border: 1px solid var(--border); border-radius: 6px; width: 100%; min-width: 0; }
.kpi-reglage-grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .5rem; }
.kpi-reglage h4 { margin: .8rem 0 .3rem; font-size: .85rem; }
.kpi-series { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .5rem; }
.kpi-serie { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .4rem; align-items: end; background: var(--bg); padding: .5rem; border-radius: 8px; }
.kpi-reglage-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .7rem; }
.kpi-filtres { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: .5rem; }
.kpi-filtres select, .kpi-filtres input { font: inherit; padding: .35rem; border: 1px solid var(--border); border-radius: 6px; }
.kpi-regle { font-size: .85rem; }
.kpi-saisie { width: 100%; border-collapse: collapse; font-size: .88rem; background: var(--surface); }
.kpi-saisie th, .kpi-saisie td { padding: .3rem .5rem; border-bottom: 1px solid var(--border); text-align: left; }
.kpi-saisie input { width: 7.5rem; text-align: right; font: inherit; padding: .25rem .35rem; border: 1px solid var(--border); border-radius: 5px; }
.kpi-saisie .kpi-annee { background: #fff7ed; }
.kpi-sources { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 1rem; margin-bottom: 1rem; }
.kpi-sources .card { padding: 1rem; }
.kpi-sources h2 { font-size: 1rem; margin: 0 0 .4rem; }
.kpi-sources label { margin-top: .5rem; }
.kpi-sources input { font: inherit; padding: .35rem; border: 1px solid var(--border); border-radius: 6px; }

/* Paramétrage › Liens / API */
.onglets.groupe-parametrage { border-bottom: 1px solid var(--border); margin-bottom: 1rem; }
#cle-climat { margin-bottom: 1rem; }

/* Consultation : devis fournisseur glissé sur la carte (09/11/2026) */
.fournisseur-carte.depot-actif { outline: 2px dashed var(--primary); outline-offset: -2px; background: #fffbeb; }
.fournisseur-carte .depot-indice { align-self: center; }
.fournisseur-carte .depot-erreur { color: var(--danger); }

/* Bloc météo de la page principale (09/11/2026) : 5 jours et radar, empilés sur téléphone, côte à côte sur grand écran */
.meteo-accueil { margin: 1rem 0; }
.meteo-accueil h2 { margin: 0 0 .6rem; font-size: 1.05rem; }
.meteo-accueil-grille { display: grid; gap: .75rem; }
.meteo-accueil-jours { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--border); align-content: stretch; }
.meteo-accueil-jours .meteo-tv-vide { grid-column: 1 / -1; background: var(--surface); padding: 1rem; text-align: center; margin: 0; }
.meteo-jour-accueil { background: var(--surface); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; padding: .55rem .15rem; min-width: 0; font-variant-numeric: tabular-nums; }
.meteo-jour-accueil.aujourdhui { background: #fef3c7; }
.meteo-jour-accueil .d { font-weight: 700; font-size: .85rem; color: var(--muted); white-space: nowrap; }
.meteo-jour-accueil .meteo-picto, .meteo-jour-accueil .sans-picto { width: 30px; height: 30px; }
.meteo-jour-accueil .t { font-size: 1rem; white-space: nowrap; }
.meteo-jour-accueil .t small { font-size: .82em; color: var(--muted); }
.meteo-jour-accueil .p { font-size: .8rem; color: #1d4ed8; font-weight: 600; min-height: 1.15em; white-space: nowrap; }
.meteo-jour-accueil.jour-attendu .m { font-size: .8rem; font-style: italic; color: var(--muted); }
.meteo-accueil-radar { height: clamp(300px, 80vw, 380px); }
@media (min-width: 900px) {
  .meteo-accueil-grille { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .meteo-accueil-radar { height: 320px; }
}

/* Relier un chantier à son projet 3D (09/11/2026) */
#choix-projet-3d .ligne-choix { display: block; padding: .45rem 0; border-bottom: 1px solid var(--border); }

/* Paramétrage › Entreprise : fermetures de l'entreprise (10/11/2026) */
#fermetures { margin-top: 1rem; }
#fermetures .ligne-fermeture { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .4rem 0; border-bottom: 1px solid var(--border); }
#fermetures .ajout-fermeture { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem; margin-top: .75rem; }

/* Écran TV : raccourci 3D à côté du nom du chantier, dans la fenêtre des photos (10/11/2026) */
.photos-tv .photos-tv-titre-ligne { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem 1rem; }
.photos-tv .photos-tv-titre-ligne .btn { background: #fff; color: #0f172a; font-weight: 700; padding: .4rem 1rem; }
.photos-tv .photos-tv-sans-3d { color: #cbd5e1; font-size: .95rem; font-style: italic; }

/* Écran TV sur le boîtier (10/11/2026) : les cases d'heure y sont étroites, l'unité du vent n'est écrite que sur la première. */
@media (max-width: 1500px) {
  .meteo-heure .v small { display: none; }
  .meteo-heure:first-child .v small { display: inline; }
}

/* Écran TV : anniversaire du jour, en bas à droite (10/11/2026) */
.anniversaire-tv { display: none; }
body.planning-plein-ecran .anniversaire-tv:not([hidden]), body:has(#planning-app[data-tv="1"]) .anniversaire-tv:not([hidden]) {
  display: flex; align-items: center; gap: .5rem; position: fixed; right: 1rem; bottom: 1rem; z-index: 900;
  background: #fff7ed; color: #9a3412; border: 2px solid #fdba74; border-radius: 999px; padding: .35rem 1rem .35rem .6rem;
  font-weight: 700; font-size: clamp(.85rem, 1.8vh, 1.3rem); box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
}
.anniversaire-tv .gateau { font-size: 1.6em; line-height: 1; }

/* Liens client 3D (11/11/2026) : QR code et adresse du lien créé. */
.lien-client-cree { border-left: 4px solid #2c7be5; }
.lien-client-qr canvas { width: 220px; height: 220px; image-rendering: pixelated; display: block; margin: .5rem 0; }
.lien-client-url input { width: 100%; font-family: monospace; font-size: .85rem; }
.lien-client-pin b#lien-client-pin { font-size: 1.3rem; letter-spacing: .2em; }
/* Module 6.1.8 — réservations d'équipe sur devis : barre hachurée aux couleurs de l'équipe, texte foncé ; un devis
   qui n'est plus brouillon ni envoyé (accepté sans chantier) passe en bordure rouge pointillée. Avis « attention ». */
#planning .barre.reservation-devis {
    background: repeating-linear-gradient(135deg, #ffffff 0 7px, color-mix(in srgb, var(--teinte, #8a95a1) 30%, #ffffff) 7px 14px);
    color: #12181f; border: 2px dashed var(--teinte, #8a95a1);
}
#planning .barre.reservation-devis.a-revoir { border-color: #dc2626; }
.modale-planning .message.avert, #avis .message.avert { background: #fffbeb; border-color: #fcd34d; color: #92400e; }
.reservations-devis ul { margin: .3rem 0 .5rem; padding-left: 1.2rem; }

/* Audit code navigateur, constat 8 : plus aucune page plus large que l'écran du téléphone.
   - Fiche consultation : ses 5 à 6 actions passent sur deux lignes (au lieu d'une seule, prévue pour les 4 du chantier).
   - Trames : un nom de document long (adresse web) se coupe au lieu d'élargir la page ; une colonne sur téléphone.
   - Barre d'actions des formulaires : retour à la ligne quand elle ne tient pas (aide sous les boutons). */
form .form-actions { flex-wrap: wrap; }
.options-trame { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.options-trame label { overflow-wrap: anywhere; }
@media (max-width: 720px) {
  #entete-consultation .ligne-titre .actions { flex-wrap: wrap; }
  #entete-consultation .ligne-titre .actions > * { flex: 1 1 calc(50% - .35rem); }
  .options-trame { grid-template-columns: minmax(0, 1fr); }
}

/* Module 2.11.1 — lignes d'un contrat de maintenance (éditeur du formulaire et fiche). */
table.lignes-contrat { width: 100%; border-collapse: collapse; }
table.lignes-contrat th { text-align: left; font-size: .78rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; padding: .3rem .35rem; border-bottom: 1px solid var(--border); }
table.lignes-contrat td { padding: .3rem .35rem; vertical-align: top; border-bottom: 1px solid var(--border); }
table.lignes-contrat .num { text-align: right; white-space: nowrap; }
table.lignes-contrat td.designation { width: 100%; min-width: 16rem; }
table.lignes-contrat textarea { width: 100%; resize: vertical; min-height: 2.1rem; }
table.lignes-contrat input[data-quantite], table.lignes-contrat input[data-prix] { width: 5.5rem; text-align: right; }
table.lignes-contrat input.unite { width: 3.5rem; }
table.lignes-contrat input.tva { width: 3.5rem; text-align: right; }
table.lignes-contrat select { width: auto; }
table.lignes-contrat td.outils { white-space: nowrap; }
table.lignes-contrat td.outils .btn { padding: .15rem .45rem; margin-left: .15rem; }
table.lignes-contrat tr.sorte-titre td.chiffre > *, table.lignes-contrat tr.sorte-texte td.chiffre > * { visibility: hidden; }
table.lignes-contrat tr.sorte-titre textarea { font-weight: 700; }
table.lignes-contrat tr.sorte-texte textarea { font-style: italic; }
table.lignes-contrat tfoot td { border-bottom: 0; padding-top: .5rem; }
.lignes-contrat-bloc .actions-lignes { display: flex; gap: .4rem; flex-wrap: wrap; margin: .6rem 0 1rem; }
/* Fiche : lignes en lecture. */
table.lignes-contrat.lecture tr.titre td { font-weight: 700; padding-top: .6rem; }
table.lignes-contrat.lecture tr.texte td.designation { color: var(--muted); }
table.lignes-contrat.lecture td.designation { white-space: pre-line; }
table.lignes-contrat.lecture tfoot td { text-align: right; }
@media (max-width: 720px) {
  table.lignes-contrat td.designation { min-width: 12rem; }
}

/* ---- Photos du drone (12/11/2026) : bloc replié sous les photos habituelles (devis, bon, chantier) ---- */
details.photos-drone > summary { cursor: pointer; list-style: none; }
details.photos-drone > summary::-webkit-details-marker { display: none; }
details.photos-drone > summary h2 { display: inline-flex; align-items: center; gap: .4rem; }
details.photos-drone > summary h2::before { content: '▸'; color: var(--muted, #6b7280); transition: transform .15s; }
details.photos-drone[open] > summary h2::before { transform: rotate(90deg); }
details.photos-drone .photos-drone-barre { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin: .5rem 0 .75rem; }
details.photos-drone .photos-drone-barre p { margin: 0; flex: 1 1 18rem; }

/* Options retenues à l'acceptation du devis (12/11/2026) : même présentation que la fenêtre « Créer le chantier ». */
dialog.accepter-options form { padding: 1.25rem 1.5rem; }
dialog.accepter-options fieldset { border: 1px solid var(--border); border-radius: 8px; padding: .6rem .9rem; margin: 0 0 .75rem; max-height: 50vh; overflow-y: auto; }
dialog.accepter-options legend { font-weight: 600; padding: 0 .3rem; }
dialog.accepter-options label.checkbox { display: block; margin: .3rem 0; }