/* Suivi Colis 2AF — feuille de style unique, sans dépendance externe. */
:root {
  --encre: #1c2430;
  --encre-douce: #5a6575;
  --fond: #f5f6f8;
  --carte: #ffffff;
  --bord: #d9dde3;
  --primaire: #1f4e79;
  --primaire-fonce: #163a5a;
  --ok: #1e7b45;
  --ok-fond: #e5f4e9;
  --alerte: #b42318;
  --alerte-fond: #fdecea;
  --attente: #8a5a00;
  --attente-fond: #fff4dc;
  --info-fond: #e8f1fb;
  --rayon: 8px;
  --marque: #1f4e79;
  --accent: #f2a900;
}
* { box-sizing: border-box; }
html { font-size: 100%; }
body { margin: 0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: var(--encre); background: var(--fond); line-height: 1.5; }
a { color: var(--primaire); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #f2a900; outline-offset: 2px; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .95em; }
h1 { font-size: 1.6rem; margin: 0 0 .5rem; }
h2 { font-size: 1.15rem; margin: 0 0 .75rem; }
.petit { font-size: .875rem; color: var(--encre-douce); }
.aide { font-size: .875rem; color: var(--encre-douce); margin: .25rem 0 .75rem; }
.vide { color: var(--encre-douce); font-style: italic; }
.centre { text-align: center; }
.visuellement-cache { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sauter { position: absolute; left: -999px; top: 0; background: #fff; padding: .5rem 1rem; z-index: 10; }
.sauter:focus { left: 1rem; }
.inline { display: inline; }

/* Barre interne */
.barre { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem 1.5rem; padding: .6rem 1.25rem; background: var(--primaire-fonce); color: #fff; }
.barre a, .barre .lien { color: #fff; }
.barre-gauche, .barre-droite { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.marque-app { font-weight: 700; }
.menu { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem; margin: 0; padding: 0; }
.menu a { display: block; padding: .35rem .7rem; border-radius: 6px; text-decoration: none; }
.menu a:hover { background: rgba(255,255,255,.12); }
.menu a[aria-current] { background: rgba(255,255,255,.2); font-weight: 600; }
.qui { opacity: .85; font-size: .9rem; }
.page { max-width: 1200px; margin: 0 auto; padding: 1.25rem; }

/* Éléments */
.carte { background: var(--carte); border: 1px solid var(--bord); border-radius: var(--rayon); padding: 1.25rem; margin-bottom: 1.25rem; }
.etroite { max-width: 560px; }
.carte-centree { max-width: 420px; margin: 8vh auto; padding: 0 1rem; }
.entete-page { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.grille-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1.25rem; align-items: start; }
.grille-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.25rem; align-items: start; }
.grille-2 > .carte, .grille-3 > .carte { margin-bottom: 0; }
.grille-2 { margin-bottom: 1.25rem; }

.bouton { display: inline-block; padding: .55rem 1rem; border: 1px solid var(--bord); border-radius: 6px; background: #fff; color: var(--encre); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; }
.bouton:hover { background: #eef1f5; }
.bouton-principal { background: var(--primaire); border-color: var(--primaire); color: #fff; }
.bouton-principal:hover { background: var(--primaire-fonce); }
.bouton-petit { padding: .3rem .65rem; font-size: .875rem; }
.bouton-danger { background: var(--alerte); border-color: var(--alerte); color: #fff; }
.lien { background: none; border: 0; padding: 0; color: var(--primaire); font: inherit; text-decoration: underline; cursor: pointer; }

.alerte { padding: .75rem 1rem; border-radius: 6px; margin-bottom: 1rem; border: 1px solid transparent; }
.alerte p { margin: .25rem 0; }
.alerte-succes { background: var(--ok-fond); border-color: #b7dfc4; }
.alerte-erreur { background: var(--alerte-fond); border-color: #f5c2bd; }
.alerte-info { background: var(--info-fond); border-color: #c4dbf3; }

.pastille { display: inline-block; padding: .1rem .55rem; border-radius: 999px; font-size: .8rem; font-weight: 600; background: #eef1f5; color: var(--encre); white-space: nowrap; }
.pastille-ok, .pastille-termine { background: var(--ok-fond); color: var(--ok); }
.pastille-alerte, .pastille-exception, .pastille-action { background: var(--alerte-fond); color: var(--alerte); }
.pastille-attente { background: var(--attente-fond); color: var(--attente); }
.pastille-transit, .pastille-arrivee, .pastille-livraison { background: var(--info-fond); color: var(--primaire-fonce); }
.etiquette { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--primaire); }
.etiquette-interne { color: var(--attente); }

/* Formulaires */
.formulaire label { display: block; font-weight: 600; margin: .75rem 0 .25rem; }
.formulaire label.case { font-weight: 400; display: flex; gap: .5rem; align-items: flex-start; }
input, select, textarea { width: 100%; padding: .55rem .65rem; border: 1px solid #b9c0ca; border-radius: 6px; font: inherit; background: #fff; color: var(--encre); }
input[type=checkbox] { width: auto; margin-top: .25rem; }
input[type=color] { height: 2.5rem; padding: .2rem; }
input.court { max-width: 7rem; }
fieldset { border: 1px solid var(--bord); border-radius: var(--rayon); margin: 0 0 1rem; padding: .75rem 1.25rem 1.25rem; }
legend { font-weight: 700; padding: 0 .35rem; }
.formulaire > button, .formulaire .actions { margin-top: 1rem; }
.ligne { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.filtres { display: flex; flex-wrap: wrap; gap: .75rem; align-items: flex-end; background: var(--carte); border: 1px solid var(--bord); border-radius: var(--rayon); padding: .9rem 1rem; margin-bottom: 1rem; }
.filtres > div { flex: 1 1 150px; }
.filtres .filtre-large { flex: 2 1 240px; }
.filtres label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: .2rem; }
.filtres-actions { flex: 0 0 auto !important; display: flex; gap: .75rem; align-items: center; }
.formulaire.en-ligne { display: flex; flex-wrap: wrap; gap: .5rem; align-items: flex-end; }
.formulaire.en-ligne label { width: 100%; margin: .25rem 0 0; }
.formulaire.en-ligne input { flex: 1 1 200px; }

/* Tableaux */
.tableau-defilant { overflow-x: auto; }
.tableau { width: 100%; border-collapse: collapse; background: var(--carte); }
.tableau th, .tableau td { text-align: left; padding: .6rem .7rem; border-bottom: 1px solid var(--bord); vertical-align: top; }
.tableau th { font-size: .85rem; color: var(--encre-douce); background: #fafbfc; }
.tableau td.nombre, .tableau th.nombre { text-align: right; }
.tableau tr.inactif, .liste-simple li.inactif { opacity: .55; }
.tableau-statuts input { margin-bottom: .3rem; }
.liste-simple { list-style: none; margin: 0; padding: 0; }
.liste-simple li { padding: .55rem 0; border-bottom: 1px solid var(--bord); display: flex; flex-wrap: wrap; gap: .35rem .75rem; align-items: center; }
.pagination { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: 1rem; }
.pagination a, .pagination span { padding: .3rem .65rem; border: 1px solid var(--bord); border-radius: 6px; background: #fff; text-decoration: none; }
.pagination span[aria-current] { background: var(--primaire); color: #fff; border-color: var(--primaire); }

/* Tableau de bord */
.compteurs { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .75rem; margin-bottom: 1.25rem; }
.compteur { display: flex; flex-direction: column; background: var(--carte); border: 1px solid var(--bord); border-radius: var(--rayon); padding: .8rem 1rem; text-decoration: none; color: var(--encre); }
.compteur:hover { border-color: var(--primaire); }
.compteur-n { font-size: 1.8rem; font-weight: 700; line-height: 1.1; }
.compteur-alerte .compteur-n { color: var(--alerte); }
.barres { width: 100%; border-collapse: collapse; }
.barres th { text-align: left; font-weight: 400; font-size: .85rem; padding: .2rem .5rem .2rem 0; white-space: nowrap; width: 5rem; }
.barres td { padding: .2rem 0; }
.barre-h { display: block; height: .9rem; background: var(--primaire); border-radius: 3px; min-width: 2px; }
.barres td.nombre { text-align: right; width: 3rem; font-size: .85rem; }
.fiche { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1rem; margin: 0; }
.fiche dt { font-weight: 600; color: var(--encre-douce); }
.fiche dd { margin: 0; }

/* Chronologie */
.chronologie { list-style: none; margin: 0; padding: 0 0 0 1.25rem; border-left: 2px solid var(--bord); }
.chronologie li { position: relative; padding: 0 0 1.1rem .75rem; }
.chronologie li::before { content: ""; position: absolute; left: -1.25rem; margin-left: -6px; top: .35rem; width: 10px; height: 10px; border-radius: 50%; background: var(--primaire); }
.chronologie li p { margin: .25rem 0 0; }
.chronologie li.annule { opacity: .6; }
.chronologie li.annule strong { text-decoration: line-through; }
.chrono-tete { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
details.annuler summary { cursor: pointer; font-size: .85rem; color: var(--encre-douce); margin-top: .35rem; }
.onglets { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 2px solid var(--bord); margin-bottom: 1.25rem; }
.onglets a { padding: .55rem .9rem; text-decoration: none; color: var(--encre); border-bottom: 3px solid transparent; margin-bottom: -2px; }
.onglets a[aria-current] { border-color: var(--primaire); font-weight: 700; color: var(--primaire); }
.apercu-logo { max-height: 80px; max-width: 240px; }

/* Page publique de suivi (couleurs de la PME via --marque et --accent) */
body.suivi { background: #f4f5f7; }
.suivi-entete { background: var(--marque); color: var(--marque-texte, #fff); }
.suivi-entete-int { max-width: 760px; margin: 0 auto; padding: .9rem 1.25rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.suivi-marque { color: inherit; text-decoration: none; display: flex; align-items: center; }
.suivi-logo { max-height: 48px; max-width: 220px; background: #fff; border-radius: 6px; padding: 4px 8px; }
.suivi-nom { font-size: 1.25rem; font-weight: 700; }
.suivi-langue { color: inherit; }
.suivi-page { max-width: 760px; margin: 0 auto; padding: 1.25rem; }
.suivi-carte { background: #fff; border-radius: 12px; padding: 1.5rem; margin-bottom: 1rem; box-shadow: 0 1px 2px rgba(0,0,0,.06); border: 1px solid #e4e7eb; }
.suivi-recherche label { display: block; font-weight: 600; margin-bottom: .35rem; }
.suivi-recherche-ligne { display: flex; gap: .5rem; flex-wrap: wrap; }
.suivi-recherche-ligne input { flex: 1 1 220px; font-size: 1.1rem; padding: .7rem .8rem; text-transform: uppercase; letter-spacing: .03em; }
.bouton-marque { background: var(--marque); border-color: var(--marque); color: var(--marque-texte, #fff); font-size: 1.05rem; padding: .7rem 1.4rem; }
.bouton-marque:hover { filter: brightness(.9); background: var(--marque); }
.suivi-numero { margin: 0 0 .25rem; color: var(--encre-douce); }
.suivi-statut { font-size: 1.7rem; margin: 0 0 .35rem; }
.suivi-statut.statut-termine { color: var(--ok); }
.suivi-statut.statut-exception, .suivi-statut.statut-action { color: var(--alerte); }
.suivi-message { font-size: 1.05rem; margin: 0 0 1rem; }
.encadre-alerte { background: var(--alerte-fond); border-left: 4px solid var(--alerte); padding: .75rem 1rem; border-radius: 6px; margin-bottom: 1rem; }
.encadre-alerte p { margin: .25rem 0 0; }
.progression { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: .25rem; margin: 1.25rem 0; padding: 0; counter-reset: e; }
.progression li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; font-size: .85rem; color: var(--encre-douce); }
.progression li::after { content: ""; position: absolute; top: 1rem; left: calc(50% + 1.1rem); right: calc(-50% + 1.1rem); height: 3px; background: #dfe3e8; }
.progression li:last-child::after { display: none; }
.progression li.fait::after { background: var(--marque); }
.pastille-etape { width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; background: #dfe3e8; color: var(--encre-douce); font-weight: 700; margin-bottom: .35rem; }
.progression li.fait .pastille-etape { background: var(--marque); color: #fff; }
.progression li.courant .pastille-etape { background: #fff; border: 3px solid var(--marque); color: var(--marque); }
.progression li.fait, .progression li.courant { color: var(--encre); font-weight: 600; }
.suivi-infos { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .75rem; margin: 0; }
.suivi-infos dt { font-size: .8rem; color: var(--encre-douce); text-transform: uppercase; letter-spacing: .03em; }
.suivi-infos dd { margin: 0; font-weight: 600; }
.chronologie-publique li.prevue { color: var(--encre-douce); }
.chronologie-publique li.prevue::before { background: #fff; border: 2px dashed #b9c0ca; }
.chronologie-publique li.fait::before { background: #9aa5b1; }
.chronologie-publique li.dernier::before { background: var(--marque); width: 14px; height: 14px; margin-left: -8px; }
.chronologie-publique li.alerte::before { background: var(--alerte); }
.suivi-pied { max-width: 760px; margin: 0 auto; padding: 1rem 1.25rem 2rem; text-align: center; font-size: .9rem; color: var(--encre-douce); }
.suivi-pied p { margin: .3rem 0; }


/* ---------- v0.4 : profils, adresse web, apparence ---------- */
.titre-actions { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.acces-ligne { display: flex; gap: .35rem; align-items: center; flex-wrap: wrap; margin-bottom: .2rem; }
.acces-ligne select { max-width: 15rem; padding: .3rem .4rem; }
.pastille-info { background: var(--info-fond); color: var(--primaire-fonce); }
.pastille-neutre { background: #eef0f3; color: var(--encre-douce); }
.liste-profils { list-style: none; padding: 0; margin: 0 0 1rem; }
.liste-profils > li { border: 1px solid var(--bord); border-radius: var(--rayon); padding: .75rem 1rem; margin-bottom: .6rem; }
.profil-tete { display: flex; justify-content: space-between; gap: .5rem; align-items: baseline; }
.puces-permissions { list-style: none; padding: 0; margin: .4rem 0 .6rem; display: flex; flex-wrap: wrap; gap: .3rem; }
.puces-permissions li { font-size: .78rem; background: #eef2f7; border-radius: 999px; padding: .1rem .55rem; }
.puces-permissions li.sensible { background: var(--attente-fond); color: var(--attente); }
.groupe-permissions { border: 1px solid var(--bord); border-radius: var(--rayon); padding: .5rem .9rem .7rem; margin: .8rem 0 0; }
.groupe-permissions legend { font-weight: 700; padding: 0 .3rem; }
.groupe-permissions .case { display: flex; gap: .5rem; align-items: flex-start; font-weight: 400; margin: .35rem 0; }
.groupe-permissions .case input { margin-top: .3rem; }
.etiquette-sensible { font-size: .72rem; background: var(--attente-fond); color: var(--attente); border-radius: 4px; padding: 0 .35rem; margin-left: .25rem; }
.champ-prefixe { display: flex; align-items: stretch; border: 1px solid var(--bord); border-radius: var(--rayon); overflow: hidden; background: #fff; }
.champ-prefixe span { background: #f1f3f6; color: var(--encre-douce); padding: .55rem .6rem; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 60%; }
.champ-prefixe input { border: 0; flex: 1; min-width: 6rem; border-radius: 0; }
.etapes-dns li { margin-bottom: .9rem; }
.tableau-dns { margin: .4rem 0; font-size: .85rem; }
.tableau-dns code { word-break: break-all; }
.aide-domaines { margin: 0 0 1rem; }
.aide-domaines summary { cursor: pointer; font-weight: 600; }
.bandeau-apercu { background: #111; color: #fff; text-align: center; padding: .5rem 1rem; font-size: .9rem; }
.bandeau-apercu a { color: #ffd479; margin-left: .75rem; }

/* Choix du modèle (miniatures dessinées en CSS avec les couleurs de la PME) */
.grille-themes { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; margin: 1rem 0; }
.choix-theme { position: relative; display: flex; flex-direction: column; }
.choix-theme input { position: absolute; opacity: 0; }
.choix-theme label { display: flex; flex-direction: column; gap: .3rem; cursor: pointer; border: 2px solid var(--bord); border-radius: 12px; padding: .7rem; flex: 1; font-weight: 400; }
.theme-nom { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.choix-theme input:checked + label { border-color: var(--primaire); box-shadow: 0 0 0 3px rgba(31,78,121,.18); }
.choix-theme input:focus-visible + label { outline: 3px solid var(--primaire); outline-offset: 2px; }
.choix-theme > a { display: inline-block; margin-top: .35rem; }
.miniature { display: block; height: 120px; border-radius: 8px; overflow: hidden; background: #f4f5f7; border: 1px solid #e4e7eb; position: relative; }
.mini-entete { display: block; height: 26px; background: var(--marque); }
.mini-carte { position: absolute; left: 12px; right: 12px; top: 36px; bottom: 10px; background: #fff; border-radius: 6px; padding: 8px; border: 1px solid #e4e7eb; display: flex; flex-direction: column; gap: 6px; }
.mini-titre { display: block; height: 8px; width: 55%; background: #2b3440; border-radius: 2px; }
.mini-barre { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; }
.mini-barre i { height: 6px; background: #dfe3e8; border-radius: 3px; }
.mini-barre i:nth-child(-n+2) { background: var(--marque); }
.mini-ligne { display: block; height: 5px; background: #e6e9ee; border-radius: 2px; }
.mini-ligne.courte { width: 60%; }
.miniature-moderne { background: #eef1f6; }
.miniature-moderne .mini-entete { height: 52px; background: linear-gradient(135deg, var(--marque), #0b1220); }
.miniature-moderne .mini-carte { top: 30px; border: 0; border-radius: 12px; box-shadow: 0 6px 14px rgba(15,23,42,.15); }
.miniature-moderne .mini-barre i { border-radius: 999px; }
.miniature-moderne .mini-barre i:nth-child(-n+2) { background: var(--accent); }
.miniature-epure { background: #fff; }
.miniature-epure .mini-entete { background: #fff; border-bottom: 1px solid #e5e7eb; height: 24px; }
.miniature-epure .mini-carte { border: 0; border-radius: 0; left: 18px; right: 18px; }
.miniature-epure .mini-titre { background: var(--marque); height: 7px; }
.miniature-epure .mini-barre i { height: 2px; margin-top: 2px; }
.miniature-express { background: #e9ebee; }
.miniature-express .mini-entete { background: #15181d; border-bottom: 4px solid var(--accent); }
.miniature-express .mini-carte { border-radius: 0; border: 0; border-top: 3px solid var(--marque); }
.miniature-express .mini-barre { gap: 2px; }
.miniature-express .mini-barre i { height: 10px; border-radius: 0; }
.miniature-express .mini-barre i:nth-child(3) { background: var(--accent); }

/* Modèle « Moderne » : bandeau en dégradé, cartes flottantes, boutons arrondis */
body.theme-moderne { background: #eef1f6; }
.theme-moderne .suivi-entete { color: var(--marque-texte); background: var(--marque); background: linear-gradient(135deg, var(--marque), color-mix(in srgb, var(--marque) 55%, #000)); padding-bottom: 4.5rem; }
.theme-moderne .suivi-entete-int { padding-top: 1.2rem; }
.theme-moderne .suivi-page { margin-top: -4rem; }
.theme-moderne .suivi-carte { border: 0; border-radius: 20px; box-shadow: 0 10px 30px rgba(15,23,42,.10); padding: 1.75rem; }
.theme-moderne .suivi-logo { border-radius: 12px; }
.theme-moderne .suivi-recherche-ligne input { border-radius: 999px; padding-left: 1.2rem; }
.theme-moderne .bouton-marque { border-radius: 999px; background: var(--accent); border-color: var(--accent); color: var(--accent-texte); font-weight: 700; }
.theme-moderne .bouton-marque:hover { background: var(--accent); }
.theme-moderne .suivi-statut { font-size: 2rem; letter-spacing: -.01em; }
.theme-moderne .pastille-etape { width: 2.3rem; height: 2.3rem; }
.theme-moderne .progression li::after { top: 1.15rem; height: 4px; border-radius: 4px; }
.theme-moderne .encadre-alerte { border-left: 0; border-radius: 14px; }

/* Modèle « Épuré » : fond blanc, lignes fines, aucune ombre */
body.theme-epure { background: #fff; }
.theme-epure .suivi-entete { background: #fff; color: var(--encre); border-bottom: 1px solid #e5e7eb; }
.theme-epure .suivi-marque, .theme-epure .suivi-langue { color: var(--marque); }
.theme-epure .suivi-logo { background: transparent; padding: 0; }
.theme-epure .suivi-carte { box-shadow: none; border: 0; border-bottom: 1px solid #eceef1; border-radius: 0; padding: 1.75rem 0; margin: 0; }
.theme-epure .suivi-statut { font-weight: 600; letter-spacing: -.01em; color: var(--marque); }
.theme-epure .suivi-statut.statut-termine { color: var(--ok); }
.theme-epure .suivi-statut.statut-exception, .theme-epure .suivi-statut.statut-action { color: var(--alerte); }
.theme-epure .suivi-numero strong { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .04em; }
.theme-epure .pastille-etape { width: .9rem; height: .9rem; font-size: 0; margin: .55rem 0 .65rem; }
.theme-epure .progression li.courant .pastille-etape { border-width: 2px; }
.theme-epure .progression li::after { top: .97rem; left: calc(50% + .6rem); right: calc(-50% + .6rem); height: 2px; }
.theme-epure .bouton-marque { border-radius: 4px; }
.theme-epure .suivi-recherche-ligne input { border-radius: 4px; }
.theme-epure .encadre-alerte, .theme-epure .encadre-info { border-radius: 0; }

/* Modèle « Express » : en-tête sombre, bande d'accent, barre de progression en segments */
body.theme-express { background: #e9ebee; }
.theme-express .suivi-entete { background: #15181d; color: #fff; border-bottom: 6px solid var(--accent); }
.theme-express .suivi-carte { border-radius: 0; border: 0; border-top: 4px solid var(--marque); box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.theme-express .suivi-carte h1, .theme-express .suivi-carte h2 { text-transform: uppercase; letter-spacing: .03em; }
.theme-express .suivi-statut { font-weight: 800; }
.theme-express .progression { gap: 4px; }
.theme-express .progression li { background: #dfe3e8; padding: .55rem .3rem; font-weight: 600; }
.theme-express .progression li::after { display: none; }
.theme-express .progression li.fait { background: var(--marque); color: var(--marque-texte); }
.theme-express .progression li.courant { background: var(--accent); color: var(--accent-texte); }
.theme-express .pastille-etape, .theme-express .progression li.fait .pastille-etape, .theme-express .progression li.courant .pastille-etape { background: transparent; border: 0; color: inherit; width: auto; height: auto; margin: 0 0 .15rem; }
.theme-express .suivi-recherche-ligne input { border-radius: 0; }
.theme-express .bouton-marque { border-radius: 0; text-transform: uppercase; font-weight: 800; letter-spacing: .04em; background: var(--accent); border-color: var(--accent); color: var(--accent-texte); }
.theme-express .bouton-marque:hover { background: var(--accent); }
.theme-express .encadre-alerte { border-radius: 0; }


/* ---------- v0.5 : départs et réservations ---------- */
.suivi-nav { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.suivi-nav a { color: inherit; }
.badge-nb { display: inline-block; min-width: 1.3em; padding: 0 .35em; border-radius: 999px; background: #e0473c; color: #fff; font-size: .75rem; font-weight: 700; text-align: center; line-height: 1.4; }
.liste-departs { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .8rem; }
.depart { border: 1px solid #e4e7eb; border-radius: 10px; padding: 1rem; background: #fff; }
.depart-ferme, .depart-complet { opacity: .85; }
.depart-tete { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .5rem; }
.depart-tete strong { font-size: 1.1rem; }
.depart-mode { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--encre-douce); }
.depart-infos { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .5rem; margin: 0 0 .75rem; }
.depart-infos dt { font-size: .78rem; color: var(--encre-douce); text-transform: uppercase; letter-spacing: .03em; }
.depart-infos dd { margin: 0; font-weight: 600; }
.resume-depart { background: #f6f7f9; border-radius: 8px; padding: .75rem 1rem; }
.formulaire-resa fieldset { border: 1px solid #e4e7eb; border-radius: 10px; padding: .6rem 1rem 1rem; margin: 0 0 1rem; }
.formulaire-resa legend { font-weight: 700; padding: 0 .3rem; }
.formulaire-resa .case { display: flex; gap: .55rem; align-items: flex-start; font-weight: 400; margin: .5rem 0; }
.formulaire-resa .case input { margin-top: .3rem; flex: none; }
.choix-remise { border: 1px solid #e4e7eb; border-radius: 8px; padding: .6rem .75rem; }
.choix-remise:has(input:checked) { border-color: var(--marque); box-shadow: 0 0 0 2px color-mix(in srgb, var(--marque) 25%, transparent); }
.bloc-ramassage { margin: .25rem 0 .5rem; }
.formulaire-resa:has(input[name="remise"][value="ramassage"]:not(:checked)) .bloc-ramassage { display: none; }
.piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.numero-grand { font-size: 1.3rem; letter-spacing: .04em; }
.adresse-collecte { background: #f6f7f9; border-left: 4px solid var(--marque); padding: .6rem .9rem; border-radius: 6px; }
.champ-prix { max-width: 8rem; }
.carte-publication .formulaire-ligne .ligne { margin-top: .5rem; }
.theme-express .depart, .theme-epure .depart { border-radius: 0; }
.theme-moderne .depart { border: 0; box-shadow: 0 4px 14px rgba(15,23,42,.08); border-radius: 16px; }

/* Téléphone */
@media (max-width: 640px) {
  .page { padding: .9rem; }
  .ligne { grid-template-columns: 1fr; }
  .fiche { grid-template-columns: 1fr; }
  .fiche dd { margin-bottom: .5rem; }
  .tableau-cartes thead { display: none; }
  .tableau-cartes tr { display: block; border: 1px solid var(--bord); border-radius: var(--rayon); margin-bottom: .75rem; background: #fff; }
  .tableau-cartes td { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px solid #eef0f3; }
  .tableau-cartes td::before { content: attr(data-label); font-weight: 600; color: var(--encre-douce); font-size: .85rem; }
  .progression li { font-size: .75rem; }
  .suivi-statut { font-size: 1.4rem; }
}

/* Envois groupés */
.liste-cases { max-height: 22rem; overflow-y: auto; margin-bottom: .75rem; }
.liste-cases label.case { margin: 0; font-weight: 400; }
h3.petit { margin: 1rem 0 .5rem; }

/* Impression (manifeste) */

/* v0.3 — QR, reçus, factures, double authentification */
.qr svg { display: block; max-width: 100%; height: auto; }
.recu-qr { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.recu-qr .qr { width: 180px; }
.encadre-important { border: 2px solid var(--attente); background: var(--attente-fond); }
.encadre-info { background: var(--info-fond); border-radius: var(--rayon); padding: .75rem 1rem; }
.codes-secours { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: .4rem; list-style: none; padding: 0; font-size: 1.1rem; }
.cle-secrete { font-size: 1rem; word-break: break-all; background: #fff; padding: .2rem .4rem; border-radius: 4px; }
.code-2fa { font-size: 1.4rem; letter-spacing: .2em; max-width: 12rem; }
.liste-cartes { list-style: none; padding: 0; margin: 0; }
.liste-cartes > li { border-bottom: 1px solid var(--bord); padding: .75rem 0; }
.liste-cartes > li:last-child { border-bottom: 0; }
.liste-cartes .actions { margin-top: .4rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.cartes-chiffres { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem; }
.chiffre { display: flex; flex-direction: column; min-width: 12rem; margin-bottom: 0; }
.chiffre strong { font-size: 1.4rem; }
pre.code { background: #f0f2f5; padding: .75rem; border-radius: 6px; overflow-x: auto; font-size: .85rem; }
.document-tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.document .tableau { width: 100%; margin: 1rem 0; }
.nombre { text-align: right; white-space: nowrap; }
.numero-grand { font-family: Consolas, Menlo, monospace; font-size: 1.4rem; letter-spacing: .05em; }
.mentions { border-top: 1px solid var(--bord); padding-top: .75rem; }
.page-etiquette { background: #fff; padding: 1rem; }
.etiquette { width: 100mm; border: 2px solid #000; padding: 4mm; font-size: 11pt; }
.etiquette-tete { display: flex; justify-content: space-between; border-bottom: 1px solid #000; padding-bottom: 2mm; margin-bottom: 2mm; }
.etiquette-corps { display: flex; gap: 4mm; align-items: flex-start; }
.etiquette-corps .qr { width: 32mm; flex: none; }
.etiquette-corps p { margin: 0 0 1mm; }
.etiquette-numero { font-family: Consolas, Menlo, monospace; font-size: 15pt; font-weight: 700; }

@media print {
  .barre, .sauter, .ne-pas-imprimer, .suivi-entete, .suivi-pied, .suivi-langue { display: none !important; }
  .document { box-shadow: none; border: 0; }
  body { background: #fff; }
  .page { max-width: none; padding: 0; }
  .carte { border: 1px solid #999; break-inside: avoid; }
}
.grille-employes { grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); }
.grille-employes .acces-ligne select { min-width: 11rem; }
@media (max-width: 900px) { .grille-employes { grid-template-columns: 1fr; } }
.formulaire-resa .case input[type="radio"], .formulaire-resa .case input[type="checkbox"] { width: auto; min-width: 0; padding: 0; }
.formulaire-resa .choix-remise { font-weight: 400; }
@media (max-width: 640px) { .suivi-entete-int { flex-wrap: wrap; } .suivi-nav { gap: .6rem; font-size: .92rem; } }

/* v0.6 — espace transporteur (pensé pour le téléphone) */
.espace-tp { background: var(--fond); }
.tp-entete { background: var(--primaire); color: #fff; }
.tp-entete-in { max-width: 640px; margin: 0 auto; padding: .75rem 1rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.tp-marque { font-weight: 700; font-size: 1.05rem; }
.tp-deco { color: #fff; }
.tp-contenu { max-width: 640px; margin: 0 auto; padding: 1rem; }
.tp-contenu section { margin-bottom: 1.5rem; }
.tp-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.tp-colis { background: var(--carte); border: 1px solid var(--bord); border-left: 4px solid var(--accent); border-radius: var(--rayon); padding: .85rem 1rem; }
.tp-colis-ramasse { border-left-color: var(--ok); }
.tp-colis p { margin: .3rem 0; }
.tp-colis-tete { display: flex; justify-content: space-between; gap: .5rem; flex-wrap: wrap; align-items: baseline; }
.tp-pme { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--primaire); }
.tp-numero { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85rem; color: var(--encre-douce); }
.tp-client a { font-weight: 600; white-space: nowrap; }
.tp-lieu { font-size: 1rem; }
.tp-conditions li { margin-bottom: .5rem; }
.tp-pied { margin-top: 2rem; }
.bouton-large { width: 100%; justify-content: center; padding: .8rem 1rem; font-size: 1rem; margin-top: .5rem; }
.acces-transporteur { display: flex; flex-wrap: wrap; gap: .4rem .75rem; align-items: center; margin: .4rem 0; }
.acces-transporteur form { margin: 0; }
.estompe td{opacity:.6}
.actions-entete{display:flex;flex-wrap:wrap;gap:.5rem}