/* ═══ Fiche produit — description à gauche, spécifications à droite ═══
   Les jetons de couleur viennent du thème : ce module n'en invente aucun. */

/* Le thème borne le contenu des onglets à 78ch et masque leurs titres ;
   les deux règles doivent être levées ici, sinon la grille se retrouve
   pliée dans une colonne de texte et sans intitulé. */
body.cd-theme.woocommerce div.product .woocommerce-tabs .panel > .cd-fi-panneau{max-width:none}
body.cd-theme.woocommerce div.product .woocommerce-tabs .panel .cd-fi-panneau h2{
  display:block;font-size:clamp(1.25rem,2.4vw,1.6rem);margin:0 0 1rem}

.cd-fi-panneau{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);
  gap:clamp(24px,3vw,48px);align-items:start}
.cd-fi-panneau.cd-fi-seul{grid-template-columns:minmax(0,1fr)}
.cd-fi-texte{min-width:0}
.cd-fi-texte p{max-width:74ch}
.cd-fi-cote{min-width:0;display:flex;flex-direction:column;gap:1.1rem;position:sticky;
  top:calc(var(--h-entete,132px) + 14px)}

@media(max-width:860px){
  .cd-fi-panneau{grid-template-columns:minmax(0,1fr)}
  .cd-fi-cote{position:static}
}
@media(prefers-reduced-motion:reduce){ .cd-fi-cote{position:static} }

/* ─── la carte ─── */
.cd-fi-specs,.cd-fi-video{background:var(--s);border:1px solid var(--b);border-radius:var(--r);
  padding:1.05rem 1.15rem 1.15rem}
.cd-fi-titre{display:flex;align-items:center;gap:.5rem;margin:0 0 .85rem;
  font-family:var(--corps);font-size:.82rem;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--t2)}
.cd-fi-titre svg{color:var(--a);flex:none}

.cd-fi-liste{display:grid;grid-template-columns:auto 1fr;gap:.1rem 1rem;margin:0;
  font-size:.9rem;font-variant-numeric:tabular-nums}
.cd-fi-liste dt{color:var(--d);padding:.42rem 0;border-top:1px solid var(--f2)}
.cd-fi-liste dd{margin:0;padding:.42rem 0;text-align:right;color:var(--t);
  border-top:1px solid var(--f2);overflow-wrap:anywhere}
.cd-fi-liste dt:first-of-type,.cd-fi-liste dd:first-of-type{border-top:0}
.cd-fi-liste a{color:var(--t)}
.cd-fi-liste a:hover{color:var(--a)}

.cd-fi-marque{margin:.95rem 0 0;padding-top:.9rem;border-top:1px solid var(--f2);
  font-size:.82rem;line-height:1.5;color:var(--d)}
.cd-fi-marque strong{font-weight:600;color:var(--a)}

/* ─── le lecteur ─── */
.cd-fi-cadre{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--r-p);
  overflow:hidden;background:#100c0e}
.cd-fi-cadre iframe,.cd-fi-cadre video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.cd-fi-liens{margin:.8rem 0 0;font-size:.84rem;line-height:1.7}

/* ─── le bouton posé sur la galerie ───
   ⚠ WooCommerce déclenche `woocommerce_product_thumbnails` À L'INTÉRIEUR de
   l'enveloppe du carrousel, que Flexslider laisse d'une hauteur NULLE : le
   bouton, calé sur `bottom`, remontait au-dessus de la galerie. Le script le
   déplace donc d'un cran, dans le bloc galerie, et lui pose la classe
   « pose ». Sans JavaScript il reste simplement sous l'image, dans le flux. */
body.cd-theme.woocommerce div.product div.images{position:relative}
.cd-fi-declencheur{display:inline-flex;align-items:center;gap:.5rem;border:0;cursor:pointer;
  margin:.7rem 0 0;padding:.5rem .95rem .5rem .75rem;border-radius:var(--r-pill);
  background:rgba(20,12,14,.78);color:#fff;font-family:var(--corps);
  font-size:.78rem;letter-spacing:.04em;text-decoration:none;
  transition:background .2s,transform .2s}
.cd-fi-declencheur.pose{position:absolute;left:1rem;bottom:1rem;z-index:5;margin:0}
.cd-fi-declencheur:hover{background:var(--a);color:#fff;transform:translateY(-1px)}
.cd-fi-triangle{width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;
  border-color:transparent transparent transparent currentColor;flex:none}
@media(min-width:700px){ .cd-fi-declencheur.pose{left:calc(84px + 12px + 1rem)} }

/* ─── la fenêtre du lecteur ───
   ⚠ Écrire `display:flex` sur la modale ÉCRASERAIT l'attribut `hidden` : la
   fenêtre fermée recouvrirait la page et avalerait tous les clics. On ne
   passe donc en flex que lorsqu'elle n'est PAS masquée. */
.cd-fi-modale:not([hidden]){position:fixed;inset:0;z-index:100000;
  display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,48px)}
.cd-fi-modale-fond{position:absolute;inset:0;background:rgba(20,12,14,.82)}
.cd-fi-modale-boite{position:relative;width:min(960px,100%);}
.cd-fi-modale-cadre{position:relative;width:100%;aspect-ratio:16/9;
  border-radius:var(--r);overflow:hidden;background:#000;box-shadow:var(--ombre-h)}
.cd-fi-modale-cadre iframe,.cd-fi-modale-cadre video{position:absolute;inset:0;width:100%;height:100%;border:0}
.cd-fi-fermer{position:absolute;top:-2.6rem;right:0;background:none;border:0;color:#fff;
  font-size:2rem;line-height:1;cursor:pointer;padding:.2rem .5rem}
.cd-fi-fermer:hover{color:var(--peau)}