:root{
  --fond:#0c0a10;         /* fond très sombre */
  --fond2:#151119;        /* cartes */
  --fond3:#1d1826;        /* champs / en-têtes */
  --bord:#2c2436;
  --texte:#ece8f1;
  --gris:#9b93aa;
  --or:#cf9f68;           /* doré cuivré du logo */
  --or-clair:#e7c896;
  --or-sombre:#8a6636;
  --ok:#3ecf8e;
}
*{box-sizing:border-box}
body{
  margin:0;font-family:"Segoe UI",system-ui,Arial,sans-serif;
  color:var(--texte);background:var(--fond);line-height:1.5;
}
a{color:var(--or);text-decoration:none}
a:hover{color:var(--or-clair);text-decoration:underline}

/* En-tête */
.topbar{
  background:linear-gradient(180deg,#141019,#0b0810);
  border-bottom:1px solid var(--bord);
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 26px;flex-wrap:wrap;gap:14px;
}
.topbar .marque img{height:46px;display:block;border-radius:6px}
.topbar nav{display:flex;flex-wrap:wrap;gap:10px}
.topbar nav a{
  color:#efe7d8;font-size:15px;font-weight:600;
  padding:9px 16px;border-radius:8px;
  border:1px solid var(--bord);background:var(--fond3);
  transition:background .15s,border-color .15s,color .15s;
}
.topbar nav a:hover{
  background:var(--or);border-color:var(--or);color:#1a1206;text-decoration:none;
}
.topbar nav a.actif{background:var(--or);border-color:var(--or);color:#1a1206}
@media(max-width:640px){
  .topbar{justify-content:center}
  .topbar nav{width:100%;justify-content:center}
  .topbar nav a{flex:1 1 auto;text-align:center}
}

.wrap{max-width:960px;margin:26px auto;padding:0 18px}
h1{font-size:26px;margin:0 0 18px}
h2{font-size:19px;margin:26px 0 12px;color:var(--or)}

/* Boutons */
.btn{
  display:inline-block;background:var(--or);color:#1a1206;border:0;
  padding:10px 18px;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;
}
.btn:hover{background:var(--or-clair);text-decoration:none;color:#1a1206}
.btn.secondaire{background:transparent;color:var(--or);border:1px solid var(--or)}
.btn.secondaire:hover{background:rgba(207,159,104,.12);color:var(--or-clair)}
.btn.gris{background:var(--fond3);color:var(--texte);border:1px solid var(--bord)}
.btn.gris:hover{background:#251f30}

/* Cartes / tableaux */
.carte{
  background:var(--fond2);
  border:1px solid var(--bord);
  border-left:4px solid var(--or);
  border-radius:12px;padding:24px;margin-bottom:22px;
  box-shadow:0 6px 22px rgba(0,0,0,.45);
}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--bord)}
th{background:var(--fond3);color:var(--or-clair);font-size:14px}
tbody tr:hover{background:rgba(207,159,104,.06)}
td .muted{color:var(--gris);font-size:13px}
.txt-droite{text-align:right}

/* Formulaires — champs bien mis en valeur */
label{display:block;font-size:14px;font-weight:600;margin:14px 0 5px;color:var(--or-clair)}
input,select,textarea{
  width:100%;padding:11px 13px;border:1px solid #40374f;border-radius:9px;
  font-size:15px;font-family:inherit;background:#211b2c;color:var(--texte);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.35);
  transition:border-color .15s,box-shadow .15s,background .15s;
}
input::placeholder,textarea::placeholder{color:#7a7289}
input:hover,select:hover,textarea:hover{border-color:#5a4f6d}
input:focus,select:focus,textarea:focus{
  outline:none;background:#271f34;border-color:var(--or);
  box-shadow:0 0 0 3px rgba(207,159,104,.25);
}
option{background:var(--fond3);color:var(--texte)}
.grille2{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.grille3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 16px}
@media(max-width:640px){.grille2,.grille3{grid-template-columns:1fr}}

.pied-site{
  margin-top:40px;padding:18px 26px;border-top:1px solid var(--bord);
  background:linear-gradient(0deg,#0b0810,#141019);
  color:var(--gris);font-size:13px;text-align:center;line-height:1.7;
}
.pied-site strong{color:var(--or-clair)}
.pied-site a{color:var(--or)}

.oblig{color:#ff6b8a;font-weight:800}

/* Demandes d'évolution */
.pastille{
  display:inline-block;min-width:18px;padding:1px 6px;margin-left:4px;
  border-radius:20px;background:#ff6b8a;color:#2a0a12;
  font-size:11px;font-weight:800;text-align:center;vertical-align:1px;
}
.demande{border-left-width:4px}
.demande.urg-critique{border-left-color:#ff6b8a}
.demande.urg-haute{border-left-color:#efa14a}
.demande.urg-normale{border-left-color:var(--or)}
.demande.urg-basse{border-left-color:#5f5a6d}
.demande-tete{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.demande-desc{
  background:#1b1624;border:1px solid var(--bord);border-radius:9px;
  padding:12px 14px;margin-top:10px;font-size:14px;line-height:1.6;
}
.demande-reponse{
  background:rgba(62,207,142,.07);border-left:3px solid var(--ok);
  border-radius:0 9px 9px 0;padding:12px 14px;margin-top:10px;font-size:14px;line-height:1.6;
}
.demande-reponse .lab{
  display:block;font-size:12px;text-transform:uppercase;letter-spacing:.4px;
  color:var(--ok);margin-bottom:4px;
}
.badge.urg-critique{background:rgba(255,107,138,.16);color:#ff8ea4}
.badge.urg-haute{background:rgba(239,161,74,.16);color:#efa14a}
.badge.urg-normale{background:rgba(207,159,104,.16);color:var(--or-clair)}
.badge.urg-basse{background:rgba(155,147,170,.14);color:var(--gris)}
.badge.st-nouvelle{background:rgba(120,160,255,.15);color:#9db8ff}
.badge.st-en_cours{background:rgba(239,161,74,.16);color:#efa14a}
.badge.st-livree{background:rgba(62,207,142,.15);color:var(--ok)}
.badge.st-refusee{background:rgba(155,147,170,.14);color:var(--gris)}
.badge.dom{background:var(--fond3);color:var(--gris)}

/* Aperçu du message de réservation (calculateur) */
.apercu-msg{
  background:#211b2c;border:1px solid var(--bord);border-left:3px solid var(--ok);
  border-radius:9px;padding:12px 14px;margin-top:14px;
}
.apercu-msg .lab{font-size:12px;color:var(--gris);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px}
.apercu-msg pre{
  margin:0;font-family:inherit;font-size:13px;line-height:1.6;color:var(--texte);
  white-space:pre-wrap;word-break:break-word;
}

/* Boutons de réservation (calculateur) */
.cta-reserver{display:flex;flex-wrap:wrap;gap:10px}
.cta-reserver .btn{text-align:center}
@media(max-width:560px){.cta-reserver{flex-direction:column}.cta-reserver .btn{width:100%}}

/* Bouton d'action discret dans un tableau (ex. « Supprimer ») */
.lien-danger{
  background:none;border:0;padding:0;margin:0;width:auto;box-shadow:none;
  color:#ff6b8a;font:inherit;font-size:inherit;cursor:pointer;
}
.lien-danger:hover{text-decoration:underline;color:#ff8ea4}

/* Détail trajet en cases séparées */
.trajet-cases{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:640px){.trajet-cases{grid-template-columns:1fr 1fr}}
.trajet-cases .case{
  background:var(--fond3);border:1px solid var(--bord);border-left:3px solid var(--ok);
  border-radius:9px;padding:10px 12px;display:flex;flex-direction:column;gap:3px;
}
.trajet-cases .lab{font-size:12px;color:var(--gris);text-transform:uppercase;letter-spacing:.4px}
.trajet-cases .val{font-size:17px;font-weight:700;color:var(--texte)}
.trajet-cases .val.or{color:var(--or)}

/* Autocomplétion d'adresse (Base Adresse Nationale) */
.adr-wrap{position:relative}
.adr-list{
  list-style:none;margin:4px 0 0;padding:0;position:absolute;z-index:30;left:0;right:0;
  background:#1d1826;border:1px solid var(--or);border-radius:9px;overflow:hidden;display:none;
  box-shadow:0 12px 28px rgba(0,0,0,.6);
}
.adr-list.ouvert{display:block}
.adr-list li{padding:10px 13px;cursor:pointer;font-size:14px;border-bottom:1px solid var(--bord);color:var(--texte)}
.adr-list li:last-child{border-bottom:0}
.adr-list li:hover,.adr-list li.actif{background:var(--or);color:#1a1206}

.badge{display:inline-block;padding:2px 10px;border-radius:20px;font-size:12px;font-weight:700}
.badge.devis{background:rgba(120,160,255,.15);color:#9db8ff}
.badge.facture{background:rgba(62,207,142,.15);color:var(--ok)}

.total-box{background:var(--fond3);border:1px solid var(--bord);border-radius:10px;padding:16px 20px;margin-top:16px}
.total-box .ttc{font-size:22px;font-weight:800;color:var(--or)}
.muted{color:var(--gris)}
.aide{font-size:13px;color:var(--gris);margin-top:4px}
.estim{font-size:28px;font-weight:800;color:var(--or)}
.detail-tva{
  display:flex;gap:14px;flex-wrap:wrap;margin-top:4px;
  font-size:13px;color:var(--gris);
}
.detail-tva span:first-child{color:var(--texte);font-weight:600}

/* Document (devis / facture) — sombre à l'écran */
.doc{
  background:var(--fond2);max-width:820px;margin:20px auto;padding:40px;
  border:1px solid var(--bord);border-radius:10px;
}
.doc .entete{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;border-bottom:2px solid var(--or);padding-bottom:18px}
.doc .entete .logo-img{height:74px;border-radius:8px;display:block}
.doc .infos-soc{font-size:13px;color:var(--gris);line-height:1.6}
.doc .titre-doc{text-align:right}
.doc .titre-doc .num{font-size:22px;font-weight:800;color:var(--or)}
.doc .bloc-client{display:flex;justify-content:space-between;gap:30px;margin:24px 0;flex-wrap:wrap}
.doc .bloc-client .col{flex:1;min-width:220px}
.doc .bloc-client h3{font-size:13px;text-transform:uppercase;color:var(--or);margin:0 0 6px;letter-spacing:.5px}
.doc table.lignes th{background:var(--fond3);color:var(--or-clair)}
.doc .ligne-ttc td{background:rgba(207,159,104,.14);border-bottom:0}

/* Encart de règlement (factures) */
.doc .reglement{
  margin-top:24px;border:1px solid var(--or);border-radius:10px;padding:16px 18px;
  background:rgba(207,159,104,.07);
}
.doc .reglement h3{
  font-size:13px;text-transform:uppercase;color:var(--or);letter-spacing:.5px;margin:0 0 8px;
}
.doc .reglement .mode{margin:0;font-size:19px;font-weight:700;color:var(--texte)}
.doc .reglement .mode::first-letter{text-transform:uppercase}
.doc .reglement .detail{margin:6px 0 0;font-size:13px;color:var(--gris)}
.doc .reglement .detail strong{color:var(--texte)}

.doc .signatures{display:flex;justify-content:space-between;margin-top:40px;gap:40px}
.doc .signatures .sig{flex:1;border-top:1px solid var(--bord);padding-top:8px;font-size:13px;color:var(--gris)}
.barre-actions{max-width:820px;margin:0 auto;text-align:right}

/* Impression : document lisible sur papier (fond clair, encre économisée) */
/* Impression : une page A4, mise en page compacte et fond clair */
@page{size:A4 portrait;margin:12mm}

@media print{
  /* Tout ce qui relève de l'écran disparaît, y compris le pied de site
     dont les informations figurent déjà dans l'en-tête du document. */
  .topbar,.barre-actions,.no-print,.pied-site{display:none!important}

  html,body{height:auto;background:#fff;color:#111}
  body{font-size:11px;line-height:1.35}
  .wrap{margin:0;padding:0}
  .doc{border:0;margin:0;max-width:100%;padding:0;background:#fff;color:#111;font-size:11px}

  /* En-tête resserré */
  .doc .entete{padding-bottom:10px;gap:14px}
  .doc .entete .logo-img{height:54px}
  .doc .infos-soc{font-size:10px;line-height:1.45}
  .doc .titre-doc .num{font-size:18px}
  .doc .infos-soc,.doc .muted,.doc .signatures .sig{color:#555}

  /* Blocs client / trajet */
  .doc .bloc-client{margin:14px 0;gap:20px}
  .doc .bloc-client h3{font-size:11px;margin-bottom:4px}

  /* Tableaux : lignes serrées, en-têtes contrastés */
  .doc td,.doc th{padding:5px 8px;border-bottom:1px solid #ddd}
  .doc table.lignes th{background:#111;color:#fff;font-size:10px}
  .doc th{background:#f2edf4;color:#111}
  .doc .ligne-ttc td{background:#f5ede2;border-bottom:0}

  /* Encart de règlement */
  .doc .reglement{
    background:#faf5ee;border-color:#cf9f68;margin-top:14px;padding:10px 12px;
  }
  .doc .reglement h3{font-size:11px;margin-bottom:4px}
  .doc .reglement .mode{color:#111;font-size:15px}
  .doc .reglement .detail{color:#555;font-size:11px;margin-top:3px}
  .doc .reglement .detail strong{color:#111}

  /* Signatures (devis uniquement) */
  .doc .signatures{margin-top:22px;gap:30px}

  /* On évite qu'un bloc soit coupé en deux entre deux pages. */
  .doc .entete,.doc .bloc-client,.doc .reglement,.doc .signatures{break-inside:avoid}
  .doc table.lignes tr{break-inside:avoid}
  .doc table.lignes thead{display:table-header-group}
}