/* gestion.css — espace de gestion G&M, direction « Atelier & Plaque » (design A, 2026-08-12).
 *
 * Feuille AUTONOME (le back-office et la vitrine n'ont pas le même cycle de vie), mais
 * alignée sur le même langage que gm-atelier.css : profondeur par la LUMIÈRE et
 * l'ÉLÉVATION, jamais la couleur. Bleu = trait/identité, noir = action, rouge = seul
 * danger. Contrainte dominante conservée : ÇA DOIT MARCHER SUR TÉLÉPHONE.
 * CSP : aucun style inline. Polices auto-hébergées.
 */

@font-face { font-family: "Archivo"; src: url("/fonts/archivo-var-latin.woff2") format("woff2");
  font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url("/fonts/source-sans-3-var-latin.woff2") format("woff2");
  font-weight: 200 900; font-display: swap; }

:root {
  --ink:#1a1a1e; --muted:#585860; --hair:#d2d2d7; --page:#e5e5e8; --card:#fff; --sunken:#f3f3f5;
  --deep-a:#232326; --deep-b:#17171a; --deep-ink:#f4f4f5; --deep-muted:#a9a9b0;
  --bleu:#2242e8; --noir:#232326; --danger:#b91c1c;
  --mono: ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace;
  --sh-sm:0 1px 2px rgb(20 20 24/.07); --sh-md:0 6px 18px rgb(20 20 24/.10),0 2px 5px rgb(20 20 24/.06);
  --r-lg:14px; --r-md:10px; --r-sm:7px;
}
* { box-sizing: border-box; }
body { margin:0; font:16px/1.55 "Source Sans 3", system-ui, sans-serif; color:var(--ink); background:var(--page);
  -webkit-font-smoothing:antialiased; }
.nombre, .arch { font-family:"Archivo"; font-variant-numeric:tabular-nums; }
main { max-width:64rem; margin:0 auto; padding:1.3rem 1rem 4rem; }
main.seul { max-width:24rem; padding-top:4rem; }
h1 { font-family:"Archivo"; font-weight:800; font-size:1.5rem; letter-spacing:-.01em; margin:0 0 .25rem; }
h2 { font-family:"Archivo"; font-weight:700; font-size:1.06rem; margin:0 0 .75rem; }
.sous { color:var(--muted); margin:0 0 1.1rem; font-size:.93rem; }
.vide { color:var(--muted); font-style:italic; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
a { color:var(--bleu); }
:focus-visible { outline:3px solid var(--bleu); outline-offset:2px; }

/* ── Barre supérieure — graphite brossé ──────────────────────────────────────── */
.barre { display:flex; flex-wrap:wrap; align-items:center; gap:.7rem;
  padding:.7rem 1rem; background:linear-gradient(180deg,var(--deep-a),var(--deep-b)); color:#fff;
  border-bottom:3px solid var(--bleu); }
.marque { color:#fff; font-family:"Archivo"; font-weight:800; text-decoration:none; margin-right:auto; letter-spacing:.01em; }
.bnav { display:flex; gap:.3rem; font-size:.9rem; }
.bnav a { color:#fff; opacity:.82; text-decoration:none; padding:.5rem .6rem; border-radius:7px; min-height:44px; display:inline-flex; align-items:center; }
.bnav a:hover { opacity:1; background:rgb(255 255 255/.08); }
.chercher { display:flex; gap:.4rem; flex:1 1 20rem; order:3; }
@media (min-width:62rem){ .chercher{ order:0; max-width:32rem; } }
.chercher input { flex:1; padding:.55rem .75rem; border:1px solid transparent; border-radius:8px; font-size:1rem; min-width:0; min-height:44px; }
.chercher button { padding:.5rem 1rem; border:1px solid rgb(255 255 255/.4); background:transparent; color:#fff;
  border-radius:8px; cursor:pointer; font:inherit; min-height:44px; }
.qui { font-size:.85rem; color:var(--deep-muted); }
.qui a { color:#fff; }
.qui em { font-style:normal; opacity:.7; }
.sortie { display:inline; margin:0; }
.sortir { color:#fff; font:inherit; font-size:.85rem; background:none; border:0; padding:.4rem; cursor:pointer; text-decoration:underline; }

/* ── Bandeaux : filet + poids, jamais un wash pâle ───────────────────────────── */
.bandeau { padding:.7rem .9rem .7rem 1rem; border-radius:var(--r-md); margin:0 0 1.1rem; font-size:.95rem;
  background:var(--sunken); border-left:4px solid #42424a; }
.bandeau.ok { border-left-color:var(--bleu); }
.bandeau.attention { border-left-color:#42424a; }
.bandeau.erreur { border-left-color:var(--danger); color:var(--danger); background:#fff; box-shadow:inset 0 0 0 1px rgb(185 28 28/.22); }

/* ── Boutons — un seul noir par écran, cibles 44px ───────────────────────────── */
button { font:inherit; }
.principal { background:var(--noir); color:#fff; border:0; border-radius:var(--r-md); padding:.6rem 1.1rem;
  cursor:pointer; font-weight:600; min-height:44px; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.principal:hover { background:#0c0c0d; }
.principal[disabled] { opacity:.5; cursor:not-allowed; }
.fantome { background:#fff; color:var(--ink); border:1px solid #71717a; border-radius:var(--r-md);
  padding:.55rem 1rem; cursor:pointer; font-size:.92rem; min-height:44px; display:inline-flex; align-items:center; }
.fantome:hover { border-color:var(--ink); }

/* ── Badge de statut (poids + forme + rouge unique) ──────────────────────────── */
.badge { display:inline-flex; align-items:center; gap:.4rem; font-size:.78rem; font-weight:600;
  padding:.16rem .55rem .16rem .45rem; border-radius:999px; background:var(--sunken); color:var(--ink); border-left:3px solid #42424a; }
.badge .g { font-family:"Archivo"; font-weight:800; }
.badge.fait { color:var(--bleu); border-left-color:var(--bleu); background:#fff; box-shadow:inset 0 0 0 1px var(--hair); }
.badge.dgr { color:var(--danger); border-left-color:var(--danger); background:#fff; box-shadow:inset 0 0 0 1px rgb(185 28 28/.22); }

/* ── Connexion ───────────────────────────────────────────────────────────────── */
.connexion { background:var(--card); padding:1.75rem; border-radius:var(--r-lg); border:1px solid var(--hair); box-shadow:var(--sh-md); }
.connexion label { display:block; font-size:.9rem; margin-bottom:.3rem; }
.connexion input { width:100%; padding:.6rem .75rem; border:1px solid #71717a; border-radius:8px; font-size:1rem; min-height:44px; }

/* ── Registre (liste des dossiers) ───────────────────────────────────────────── */
.registre { width:100%; border-collapse:collapse; background:var(--card); font-size:.93rem;
  border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm); }
.registre th, .registre td { padding:.65rem .8rem; text-align:left; border-bottom:1px solid var(--hair); }
.registre thead th { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); background:var(--sunken); position:sticky; top:0; }
.registre tbody tr:nth-child(even) td { background:var(--sunken); }
.registre tbody tr:hover td { background:#ececee; }
.registre tr.ancien td:first-child { box-shadow:inset 3px 0 0 var(--danger); }
.etape { font-size:.85rem; color:var(--muted); }
@media (max-width:48rem){
  .registre, .registre tbody, .registre tr, .registre td { display:block; width:100%; }
  .registre thead { display:none; }
  .registre tr { background:var(--card); border:1px solid var(--hair); border-radius:var(--r-md); margin-bottom:.6rem; box-shadow:var(--sh-sm); padding:.2rem 0; overflow:hidden; }
  .registre td { border:0; padding:.3rem .9rem; }
  .registre td::before { content:attr(data-l); display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
  .registre td:first-child { font-family:"Archivo"; font-weight:700; font-size:1.05rem; padding-top:.6rem; }
  .registre td:first-child::before { display:none; }
  .registre tr.ancien { box-shadow:var(--sh-sm), inset 4px 0 0 var(--danger); }
}

/* ── Cartes / fiche ──────────────────────────────────────────────────────────── */
.bloc { background:var(--card); border:1px solid var(--hair); border-radius:var(--r-lg); padding:1.05rem 1.2rem; margin-bottom:1.1rem; box-shadow:var(--sh-sm); }
.presta { font-family:"Source Sans 3"; font-weight:600; font-size:.95rem; color:var(--muted); }
/* En-tête de dossier COLLANT : la référence, le client et le téléphone restent
   sous le pouce pendant qu'on fait défiler la fiche au téléphone. */
.fiche-tete { position:sticky; top:0; z-index:5; background:var(--page);
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin:0 -1rem .3rem; padding:.6rem 1rem;
  box-shadow:0 6px 12px -8px rgb(20 20 24/.25); }
.fiche-tete__meta { display:flex; flex-direction:column; gap:.1rem; }
.tel-fort { font-weight:700; color:var(--bleu); text-decoration:none; font-size:1.02rem; }
.plaque { display:inline-flex; align-items:stretch; border-radius:8px; overflow:hidden;
  box-shadow:0 2px 0 rgb(0 0 0/.18), inset 0 0 0 2px #111; background:#eceff2; }
.plaque .eu { background:#17171a; color:#fff; display:flex; align-items:center; justify-content:center; padding:.3rem .5rem; }
.plaque .eu b { font-family:"Archivo"; font-weight:900; font-size:.95rem; }
.plaque .num { font-family:"Archivo"; font-weight:800; font-size:1.2rem; letter-spacing:.08em; padding:.28rem .8rem; color:#141414; text-shadow:0 1px 0 #fff; }
.bloc dl { margin:0; display:grid; gap:.45rem; }
@media (min-width:40rem){ .bloc dl { grid-template-columns:repeat(2,1fr); } }
.bloc dl > div { display:flex; gap:.6rem; }
.bloc dt { color:var(--muted); font-size:.88rem; min-width:9rem; }
.bloc dd { margin:0; font-weight:600; word-break:break-word; }
.lien-vin { margin:.9rem 0 0; font-size:.9rem; }
.deux-colonnes { display:grid; gap:1rem; }
@media (min-width:44rem){ .deux-colonnes { grid-template-columns:1fr 1fr; } }

/* ── Chaîne d'étapes = colonne de progression ────────────────────────────────── */
.chaine { list-style:none; margin:0; padding:0; }
.chaine li { position:relative; padding:.15rem 0 .7rem 1.7rem; }
.chaine li::before { content:""; position:absolute; left:6px; top:6px; bottom:-2px; width:2px; background:var(--hair); }
.chaine li:last-child::before { display:none; }
.chaine .puce { position:absolute; left:0; top:3px; width:14px; height:14px; border-radius:50%; background:#fff; border:2px solid var(--hair); font-size:0; }
.chaine .faite .puce { background:var(--bleu); border-color:var(--bleu); }
.chaine .titre { display:flex; align-items:baseline; gap:.5rem; }
.chaine .libelle { font-weight:600; }
.chaine .a-faire .libelle { color:var(--muted); font-weight:400; }
.chaine .meta { margin:.15rem 0 0; font-size:.82rem; color:var(--muted); }
.envoi-ok { color:#14532d; } .envoi-ko { color:var(--danger); font-weight:600; }
.muet { font-style:italic; color:var(--muted); }
.valider { margin:.5rem 0 0; }
.rangee { display:flex; flex-wrap:wrap; gap:.5rem; }
.prematuree { font-size:.86rem; color:var(--danger); margin:.3rem 0 .5rem; }

.manquants { border-left:4px solid var(--danger); }
.manquants ul { margin:.3rem 0 0; padding-left:1.2rem; }
.corriger summary { cursor:pointer; list-style-position:outside; }
.corriger summary h2 { display:inline; }
.corriger .a-completer label { color:var(--danger); font-weight:600; }
.corriger select, .estimateur select { padding:.5rem .6rem; border:1px solid #71717a; border-radius:8px; font-size:1rem; min-height:44px; }
.estimateur { margin-top:1rem; padding-top:1rem; border-top:1px solid var(--hair); }
.regen { margin-top:.8rem; }
.etiq-gen { font-size:.7rem; background:var(--bleu); color:#fff; border-radius:.3rem; padding:.05rem .4rem; margin-left:.3rem; vertical-align:middle; }
.creer p, .valider p { margin:.5rem 0; }
.creer label { display:block; font-size:.9rem; margin-bottom:.3rem; font-weight:600; }
.creer input[type=text], .creer input[type=email], .creer input[type=url], .creer input[type=number], .creer input[type=password] {
  width:100%; max-width:26rem; padding:.55rem .7rem; border:1px solid #71717a; border-radius:8px; font-size:1rem; min-height:44px; }
.devis { margin:0; display:grid; gap:.4rem; }
.devis > div { display:flex; justify-content:space-between; gap:1rem; }
.devis dt { color:var(--muted); } .devis dd { margin:0; font-weight:600; }
.pieces-liste { list-style:none; margin:0 0 .6rem; padding:0; display:grid; gap:.35rem; }
.pieces-liste li { display:flex; justify-content:space-between; gap:1rem; padding:.4rem .6rem; background:var(--sunken); border-radius:var(--r-sm); font-size:.9rem; }
.p-meta { color:var(--muted); font-size:.8rem; white-space:nowrap; }
.issues .rangee { margin-top:.5rem; }
.mdp-unique { background:var(--sunken); border-left:4px solid var(--bleu); }
.mdp { font-family:var(--mono); font-size:1.1rem; font-weight:600; }

/* ── Tableau de bord ─────────────────────────────────────────────────────────── */
.tuiles { display:grid; gap:.75rem; margin-bottom:1.4rem; }
@media (min-width:34rem){ .tuiles { grid-template-columns:repeat(2,1fr); } }
@media (min-width:52rem){ .tuiles { grid-template-columns:repeat(3,1fr); } }
.tuile { background:var(--deep-b); color:var(--deep-ink); border-radius:var(--r-lg); padding:1rem 1.1rem; box-shadow:var(--sh-sm);
  display:block; text-decoration:none; }
a.tuile:hover { box-shadow:0 8px 20px rgb(20 20 24/.22); transform:translateY(-1px); }
a.tuile { transition:transform .12s, box-shadow .12s; }
@media (prefers-reduced-motion:reduce){ a.tuile { transition:none; } }
.tuile__libelle { color:var(--deep-muted); font-size:.8rem; }
.tuile__valeur { font-family:"Archivo"; font-weight:800; font-size:2.4rem; line-height:1; margin-top:.3rem; letter-spacing:.02em; }
.tuile--alerte { box-shadow:inset 4px 0 0 var(--danger), var(--sh-sm); }
.tuile--alerte .tuile__valeur { color:#ff6b6b; }
.compteurs { margin-top:2rem; }
.compteur-liste { list-style:none; padding:0; margin:0; display:grid; gap:.4rem; }
@media (min-width:40rem){ .compteur-liste { grid-template-columns:repeat(2,1fr); } }
.compteur-liste li { display:flex; justify-content:space-between; gap:1rem; background:var(--card);
  border:1px solid var(--hair); border-radius:var(--r-md); padding:.55rem .85rem; box-shadow:var(--sh-sm); }
.compteur-liste .nombre { font-weight:700; }

/* ── Grille tarifaire : liste éditable compacte ──────────────────────────────── */
.grille-tarifs { background:var(--card); border:1px solid var(--hair); border-radius:var(--r-lg); box-shadow:var(--sh-sm); overflow:hidden; }
.grille-tarifs__tete { display:grid; grid-template-columns:2fr 1fr 1fr 8.5rem 7rem; gap:.8rem; padding:.6rem .9rem;
  background:var(--sunken); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:600; }
.ligne-tarif { display:grid; grid-template-columns:2fr 1fr 1fr 8.5rem 7rem; gap:.8rem; align-items:center;
  padding:.55rem .9rem; border-top:1px solid var(--hair); }
.lt-nom { font-family:"Archivo"; font-weight:700; font-size:.95rem; display:flex; flex-direction:column; }
.lt-nom small { font-family:"Source Sans 3"; font-weight:400; font-size:.72rem; }
.lt-champ { margin:0; }
.note-tarif { margin-top:.8rem; }
.lt-champ input { width:100%; padding:.45rem .55rem; border:1px solid #71717a; border-radius:7px; font:inherit; min-height:40px; }
.lt-prov { display:flex; align-items:center; gap:.4rem; margin:0; cursor:pointer; }
.ligne-tarif .fantome { min-height:40px; justify-content:center; }
@media (max-width:52rem){
  .grille-tarifs__tete { display:none; }
  .ligne-tarif { grid-template-columns:1fr 1fr; gap:.5rem .8rem; }
  .lt-nom { grid-column:1 / -1; }
  .ligne-tarif .fantome { grid-column:1 / -1; }
}

/* ── Audience & navigation ───────────────────────────────────────────────────── */
.aud-tete { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.6rem; }
.aud-periode { display:inline-flex; gap:.3rem; background:var(--sunken); border:1px solid var(--hair); border-radius:999px; padding:.2rem; }
.aud-periode a { padding:.28rem .8rem; border-radius:999px; font-size:.85rem; font-weight:600; color:var(--muted); text-decoration:none; }
.aud-periode a.actif { background:var(--card); color:var(--ink); box-shadow:0 1px 2px rgb(20 20 24/.12); }
.aud-kpis { grid-template-columns:repeat(2,1fr); }
@media (min-width:52rem){ .aud-kpis { grid-template-columns:repeat(4,1fr); } }

/* Entonnoir */
.entonnoir { list-style:none; margin:.4rem 0 0; padding:0; display:flex; flex-direction:column; gap:.7rem; }
.ent-tete { display:flex; align-items:baseline; justify-content:space-between; gap:.5rem; }
.ent-lib { font-family:"Archivo","Source Sans 3",sans-serif; font-weight:600; font-size:.92rem; }
.ent-n { font-weight:800; font-size:1rem; }
.ent-barre { width:100%; height:11px; display:block; margin-top:.18rem; }
.ent-fond { fill:var(--sunken); }
.ent-plein { fill:var(--bleu); }
.ent-etape--fin .ent-plein { fill:var(--noir); }
.ent-chute { display:inline-block; margin-top:.2rem; font-size:.76rem; font-weight:600; color:var(--danger); }

/* Barres horizontales (sources) */
.barres { list-style:none; margin:.4rem 0 0; padding:0; display:flex; flex-direction:column; gap:.55rem; }
.barre-ligne { display:grid; grid-template-columns:9.5rem 1fr auto; align-items:center; gap:.6rem; }
.barre-lib { font-size:.88rem; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.src-barre { width:100%; height:12px; display:block; }
.barre-plein { fill:var(--bleu); }
.barre-n { font-weight:800; font-size:.92rem; min-width:2ch; text-align:right; }
@media (max-width:34rem){ .barre-ligne { grid-template-columns:7rem 1fr auto; } }

/* Tendance */
.aud-tendance { width:100%; height:90px; display:block; margin:.3rem 0 .4rem; }
.tend-aire { fill:color-mix(in srgb, var(--bleu) 14%, transparent); }
.tend-ligne { stroke:var(--bleu); stroke-width:1.4; vector-effect:non-scaling-stroke; stroke-linejoin:round; stroke-linecap:round; }

/* Analyse automatique */
.aud-analyse { border-left:4px solid var(--bleu); }
.insights { list-style:none; margin:.3rem 0 .6rem; padding:0; display:flex; flex-direction:column; gap:.55rem; }
.insight { display:flex; align-items:flex-start; gap:.6rem; font-size:.95rem; line-height:1.4; }
.insight-pastille { flex:0 0 auto; width:.7rem; height:.7rem; border-radius:50%; margin-top:.35rem; background:var(--muted); }
.insight--alerte .insight-pastille { background:var(--danger); }
.insight--positif .insight-pastille { background:var(--bleu); }
.insight--info .insight-pastille { background:#9a9aa2; }
.insight--alerte .insight-txt { font-weight:600; }

/* Chiffres détaillés (dépliable) */
.aud-details { background:var(--card); border:1px solid var(--hair); border-radius:var(--r-lg); box-shadow:var(--sh-sm); padding:.4rem .5rem; margin-bottom:1.1rem; }
.aud-details > summary { cursor:pointer; font-family:"Archivo"; font-weight:700; font-size:1rem; padding:.6rem .7rem; list-style:none; }
.aud-details > summary::-webkit-details-marker { display:none; }
.aud-details > summary::before { content:"▸ "; color:var(--muted); }
.aud-details[open] > summary::before { content:"▾ "; }
.det-actions { padding:0 .7rem .3rem; margin:0; }
.det-grille { display:grid; gap:.9rem; padding:.3rem .7rem .7rem; }
@media (min-width:44rem){ .det-grille { grid-template-columns:1fr 1fr; } }
.det-bloc h3 { font-family:"Archivo"; font-weight:700; font-size:.9rem; margin:0 0 .35rem; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.det-scroll { max-height:15rem; overflow:auto; border:1px solid var(--hair); border-radius:var(--r-sm); }
.det-table { width:100%; border-collapse:collapse; font-size:.9rem; background:var(--card); }
.det-table td { padding:.35rem .6rem; border-bottom:1px solid var(--hair); }
.det-table tr:last-child td { border-bottom:0; }
.det-n { text-align:right; font-weight:700; width:5rem; }
