/* ==========================================================
   FICHE VÉHICULE — habillage premium
   Additif, cible les classes existantes de style.css sans les
   renommer (chargé après, gagne la cascade à spécificité égale).
   ========================================================== */

.detail-grille{ margin-top:22px; gap:30px; }

/* --- Galerie --- */
.galerie-scene{
  background:linear-gradient(160deg,#1B3357,#0B1526 75%);
  box-shadow:0 20px 50px -20px rgba(11,21,38,.35);
  position:relative; overflow:hidden;
}
.galerie-scene:has(img:not(.chargee))::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(100deg,rgba(255,255,255,.03) 8%,rgba(255,255,255,.08) 18%,rgba(255,255,255,.03) 33%);
  background-size:200% 100%; animation:skelShimmer 1.4s ease-in-out infinite;
}
.galerie-scene img{ transition:transform .5s cubic-bezier(.2,.7,.2,1); cursor:zoom-in; }
.galerie-scene:hover img{ transform:scale(1.035); }
.g-compteur{
  position:absolute; left:12px; bottom:12px; z-index:2;
  background:rgba(11,21,38,.72); color:#fff; font-size:12px; font-weight:600;
  padding:6px 12px; border-radius:999px; backdrop-filter:blur(4px);
  display:flex; align-items:center; gap:6px;
}
.g-zoom{
  position:absolute; right:12px; top:12px; z-index:2; width:36px; height:36px; border-radius:999px;
  background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3); color:#fff; backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.g-zoom:hover{ background:rgba(255,255,255,.28); }
.g-vignette{ border-radius:8px; opacity:.65; transition:opacity .2s ease, transform .2s ease; }
.g-vignette:hover{ opacity:1; transform:translateY(-2px); }
.g-vignette.actif{ opacity:1; border-color:#C08A3E; }

/* --- Score AutoBénin --- */
.score-panneau{ background:linear-gradient(135deg,#0B1526,#1B3357); }
.score-tete{ padding:14px 20px; font-size:13px; font-weight:700; letter-spacing:.02em; border-bottom:1px solid rgba(255,255,255,.1); color:#F7F5F1; }
.score-corps{ padding:20px; display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
.score-global{ text-align:center; }
.score-global strong{ font-family:'Space Mono',monospace; font-size:34px; color:#E4B876; }
.score-global span{ color:rgba(255,255,255,.5); font-size:14px; }
.score-global small{ display:block; font-size:11px; color:rgba(255,255,255,.6); margin-top:2px; }
.score-detail{ list-style:none; margin:0; padding:0; flex:1; min-width:180px; }
.score-detail li{ display:flex; justify-content:space-between; font-size:12.5px; color:rgba(255,255,255,.65); padding:4px 0; }
.score-detail b{ color:#fff; font-family:'Space Mono',monospace; }

/* --- Bloc prix / fiche principale --- */
.fiche{ border-radius:16px; }
.fiche-prix{ font-size:32px; color:#0B1526; font-family:'Poppins',sans-serif; }
.badge-cat{ background:#F1F3F7; color:#0B1526; font-weight:600; }
.badge-nego, .badge-fixe{ font-size:12px; font-weight:600; padding:3px 9px; border-radius:999px; }
.badge-nego{ background:rgba(10,125,77,.1); color:#0A7D4D; }
.badge-fixe{ background:rgba(11,21,38,.06); color:#5B6270; }

.specs-liste li span:first-child{ font-size:13px; }
.specs-liste li span:last-child{ font-weight:600; color:#0B1526; }

/* Variante avec icône devant chaque étiquette */
.specs-liste--icones li{ padding:11px 2px; }
.specs-liste--icones li span:first-child{
  display:inline-flex; align-items:center; gap:9px; color:#5B6270;
}
.specs-liste--icones li span:first-child i{
  width:26px; height:26px; border-radius:7px; background:#F1F3F7;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:13px; color:#C08A3E; flex-shrink:0;
}
[data-theme="dark"] .specs-liste--icones li span:first-child i{ background:rgba(242,194,48,.1); color:var(--or); }

/* --- Estimation "juste prix" --- */
.juste-prix{ border-radius:12px; }
.jp-tete{ display:flex; align-items:center; gap:8px; font-size:14px; margin-bottom:4px; }

/* --- Import Chine --- */
.bloc-chine{ border-radius:12px; border-left-color:#C08A3E; background:#FBF6EC; }
.bloc-chine .bc-total{ font-family:'Space Mono',monospace; color:#0B1526; }

/* --- Encart douane -> vrai ticket, cohérent avec le hero et le catalogue --- */
.encart-douane{
  background:#fff; border:1px solid #E7E2D8; border-radius:16px; padding:22px 22px 18px;
  box-shadow:0 16px 40px -22px rgba(11,21,38,.25);
}
.encart-douane h3{
  font-family:'Space Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em;
  color:#5B6270; font-weight:700; margin-bottom:12px;
}
.encart-douane .specs-liste{ margin:0; }
.encart-douane .specs-liste li{ border-bottom:1px dashed #E7E2D8; font-size:13.5px; }
.encart-douane .specs-liste li span:last-child{ font-family:'Space Mono',monospace; font-weight:700; }
.encart-douane .total{
  font-family:'Space Mono',monospace; font-size:22px; color:#C08A3E;
  border-top:1px solid #E7E2D8; padding-top:12px; margin-top:8px;
}

/* --- Wizard de publication d'annonce --- */
.etapes-nav{ list-style:none; display:flex; margin:0 0 28px; padding:0; }
.etapes-nav li{
  flex:1; text-align:center; font-size:12.5px; color:var(--grey); cursor:pointer;
  position:relative; padding-top:34px;
}
.etapes-nav li span{
  position:absolute; top:0; left:50%; transform:translateX(-50%); width:26px; height:26px; border-radius:50%;
  background:#EEF0F3; color:var(--grey); font-weight:700; font-size:12px; display:flex; align-items:center; justify-content:center;
}
.etapes-nav li::after{
  content:""; position:absolute; top:13px; left:calc(50% + 20px); width:calc(100% - 40px); height:2px; background:#EEF0F3;
}
.etapes-nav li:last-child::after{ display:none; }
.etapes-nav li.fait span{ background:#C08A3E; color:#fff; }
.etapes-nav li.fait::after{ background:#C08A3E; }
.etapes-nav li.active span{ background:#0B1526; color:#fff; }
[data-theme="dark"] .etapes-nav li span, [data-theme="dark"] .etapes-nav li::after{ background:#232323; }

.etapes-actions{ display:flex; justify-content:space-between; gap:12px; margin-top:24px; }
.etapes-actions #btnPublier{ flex:1; }
.etapes-actions #btnEtapeSuiv{ margin-left:auto; }

.apercu-annonce{ margin-top:26px; padding-top:22px; border-top:1px dashed var(--bord); }
.apercu-eyebrow{ font-size:12px; font-weight:700; color:var(--cat-bronze); text-transform:uppercase; letter-spacing:.04em; display:block; margin-bottom:12px; }
.apercu-carte{ display:flex; gap:14px; align-items:center; border:1px solid var(--bord); border-radius:12px; padding:12px; background:var(--surface); max-width:420px; }
.apercu-img{
  width:76px; height:60px; border-radius:8px; background:#EEF0F3; flex-shrink:0; background-size:cover; background-position:center;
  display:flex; align-items:center; justify-content:center; color:#c7cdd8; font-size:20px;
}
[data-theme="dark"] .apercu-img{ background-color:#232323; }
.apercu-corps h3{ font-size:14.5px; margin:0 0 2px; }
.apercu-meta{ font-size:12px; color:var(--grey); margin-bottom:4px; }
.apercu-prix{ font-family:'Space Mono',monospace; font-weight:700; color:#0B1526; }
[data-theme="dark"] .apercu-prix{ color:var(--txt); }

/* --- Connexion Google --- */
.sep-ou{ display:flex; align-items:center; gap:12px; margin:18px 0; color:#9aa2b1; font-size:12.5px; }
.sep-ou::before, .sep-ou::after{ content:""; flex:1; height:1px; background:var(--bord); }
.btn-google{
  display:flex; align-items:center; justify-content:center; gap:10px; width:100%;
  padding:11px 16px; border:1px solid var(--bord); border-radius:10px; background:#fff;
  color:#1f1f1f; font-weight:600; font-size:14px; transition:box-shadow .15s ease, border-color .15s ease;
}
.btn-google:hover{ box-shadow:0 4px 14px rgba(11,21,38,.1); border-color:#c7cdd8; text-decoration:none; }
[data-theme="dark"] .btn-google{ background:var(--surface); color:var(--txt); border-color:var(--bord); }

/* --- Avis plateforme (pied de page) --- */
.avis-plateforme{
  background:#fff; border:1px solid #E7E2D8; border-radius:16px; padding:22px 24px; margin:6px 0 30px;
}
[data-theme="dark"] .avis-plateforme{ background:var(--surface); border-color:var(--bord); }
.avis-plateforme h3{ font-size:16px; color:#0B1526; margin-bottom:2px; }
[data-theme="dark"] .avis-plateforme h3{ color:var(--txt); }
.ap-form{ margin-top:14px; display:flex; flex-direction:column; gap:10px; max-width:460px; }
.ap-form textarea{
  border:1px solid var(--bord); border-radius:10px; padding:10px 12px; font-family:inherit; font-size:13.5px; resize:vertical;
}
.ap-merci{ margin-top:10px; }

/* Étoiles cliquables, ordre HTML inversé (5→1) + CSS ~ selector, zéro JS requis */
.ap-etoiles{ display:flex; flex-direction:row-reverse; justify-content:flex-end; gap:4px; }
.ap-etoiles input{ position:absolute; opacity:0; width:1px; height:1px; }
.ap-etoiles label{
  font-size:26px; color:#E2E8F1; cursor:pointer; transition:color .15s ease, transform .15s ease;
}
[data-theme="dark"] .ap-etoiles label{ color:#2a2a2a; }
.ap-etoiles label:hover, .ap-etoiles label:hover ~ label{ color:#F2C230; transform:scale(1.08); }
.ap-etoiles input:checked ~ label{ color:#C08A3E; }
.ap-etoiles input:focus-visible + label{ outline:2px solid #C08A3E; outline-offset:2px; border-radius:4px; }

/* --- Score et zones interactives : léger relief au survol desktop --- */
@media(hover:hover){
  .galerie-scene{ transition:box-shadow .3s ease; }
  .galerie-scene:hover{ box-shadow:0 26px 60px -18px rgba(11,21,38,.45); }
}
