/* Fiche produit (maquettes Produit + Mobile M5). Fiches uniquement, après base.css ; mobile d'abord, 768 / 1024 px.
   Habille le balisage natif de WooCommerce (galerie FlexSlider, déclinaisons, Variation Swatches, attributs). */

/* 1. Mise en page */
/* Pictogramme en masque CSS sur un élément natif (bouton panier) */
.lbdp-produit { --lbdp-masque-panier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='21' r='1'/%3E%3Ccircle cx='19' cy='21' r='1'/%3E%3Cpath d='M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12'/%3E%3C/svg%3E"); }
.lbdp-produit__haut { display: flex; flex-direction: column; gap: 1rem; }
/* Grille de la galerie : zone « photo » (galerie + badge, flèches, loupe superposés) et zone « vignettes » (section 2) */
.lbdp-produit__galerie { position: relative; display: grid; grid-template-areas: "photo" "vignettes"; grid-template-columns: minmax(0, 1fr); min-width: 0; margin-inline: calc(-1 * var(--lbdp-gouttiere)); }
.lbdp-produit__achat { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }

/* Fil d'Ariane (une ligne ; sur téléphone, le seul lien du parent : base.css) */
.single-product .lbdp-fil-ariane { margin-block: .5rem .125rem; } /* téléphone : moins de blanc avant la photo (Enes, 05/10/2026) */

@media (min-width: 1024px) {
	.single-product .lbdp-fil-ariane { margin-block: 1.25rem 1.5rem; }
	/* Galerie plus étroite, colonne d'achat plus large (demande d'Enes) */
	.lbdp-produit__haut { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 2.5rem; align-items: start; }
	.lbdp-produit__galerie { position: sticky; top: calc(var(--lbdp-sous-entete) + 1rem); margin-inline: 0; }
	.lbdp-produit__achat { gap: 1rem; }
}

/* 2. Galerie : piste à défilement accroché (photos natives de WooCommerce), vignettes, flèches, loupe.
   Grille posée en section 1 (.lbdp-produit__galerie) : zone « photo » et zone « vignettes » (bande sous la photo sur
   mobile, colonne à gauche sur ordinateur). */
/* opacity : WooCommerce sert la galerie en « opacity: 0 » (attribut style) et ne l'affiche qu'une fois son script
   chargé : la photo, élément que Google mesure (LCP), apparaissait après tout le JavaScript. Visible tout de suite. */
.woocommerce-product-gallery { grid-area: photo; min-width: 0; margin: 0; opacity: 1 !important; }
.woocommerce-product-gallery__wrapper { display: flex; margin: 0; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; border-bottom: 1px solid var(--lbdp-bord); background: #fff; }
.woocommerce-product-gallery__wrapper::-webkit-scrollbar { display: none; }
.woocommerce-product-gallery__image { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }
/* Curseur « main » et non « loupe » (zoom-in) : Opera affiche à la place de la loupe un rond de chargement (bug
   d'Opera BUG-29260, vu par Enes le 04/10/2026) ; le bouton loupe en bas à droite de la photo dit déjà qu'on agrandit. */
.woocommerce-product-gallery__image > a { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; background: #fff; cursor: pointer; }
.woocommerce-product-gallery__image img { display: block; width: 96%; height: 96%; object-fit: contain; mix-blend-mode: multiply; } /* téléphone : photo presque bord à bord (84 % laissait ~30 px de blanc au-dessus) */
.woocommerce-product-gallery__image > a:focus-visible { outline-offset: -3px; }
/* Glisser à la souris (produit.js) : accroche coupée pendant le geste */
.woocommerce-product-gallery__wrapper.est-libre { scroll-snap-type: none; }
/* Au doigt (produit.js, par défaut depuis le 04/10/2026 ; ?galerie=natif pour l'ancien comportement) : plus de
   défilement natif de côté, le script suit le doigt ; la page garde le défilement vertical, même pendant que la
   photo se pose. */
.woocommerce-product-gallery__wrapper.est-geste { overflow-x: hidden; touch-action: pan-y; }
.woocommerce-product-gallery__wrapper.est-glisse { cursor: grabbing; user-select: none; }
.woocommerce-product-gallery__wrapper.est-glisse a { cursor: grabbing; }

/* Badge -X % sur la photo */
.lbdp-produit__galerie > .onsale { grid-area: photo; align-self: start; justify-self: start; z-index: 2; margin: 12px; padding: 3px 7px; }
/* Badges groupés sur la photo : « -X % » puis « Déstockage » à sa droite (inc/produit.php, lbdp_produit_badges_photo()) */
.lbdp-produit__galerie > .lbdp-produit__badges { grid-area: photo; align-self: start; justify-self: start; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px; margin: 12px; pointer-events: none; }
.lbdp-produit__badges > :is(.onsale, .lbdp-badge) { padding: 3px 7px; }

/* Vignettes : bande de 5 sous la photo, qui défile au doigt (mobile, tablette) */
.lbdp-galerie__vignettes { grid-area: vignettes; min-width: 0; }
.lbdp-galerie__liste { position: relative; display: grid; grid-auto-columns: min(96px, calc((100% - 4 * 8px) / 5)); grid-auto-flow: column; gap: 8px; margin: 0; padding: 10px 16px 4px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scroll-padding-inline: 16px; scrollbar-width: none; list-style: none; }
.lbdp-galerie__liste::-webkit-scrollbar { display: none; }
.lbdp-galerie__liste li { margin: 0; scroll-snap-align: start; }
.lbdp-galerie__vignette { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1 / 1; padding: 6px; border: 1.5px solid var(--lbdp-bord); border-radius: var(--lbdp-r); background: #fff; cursor: pointer; }
.lbdp-galerie__vignette img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.lbdp-galerie__vignette:hover { border-color: var(--lbdp-texte-3); }
.lbdp-galerie__vignette[aria-current="true"] { border-color: var(--lbdp-orange); }
.lbdp-galerie__vignette:focus-visible { outline-offset: -4px; }
/* Vignettes tirées à la souris (produit.js) : pas d'accroche ni de sélection de texte pendant le geste */
.lbdp-galerie__liste.est-glisse { scroll-snap-type: none; user-select: none; }
.lbdp-galerie__liste.est-glisse .lbdp-galerie__vignette { cursor: grabbing; }

/* Flèches, défileurs et loupe : ordinateur seulement (au doigt, on glisse et on touche la photo) */
.lbdp-galerie__fleche,
.lbdp-galerie__defiler,
.lbdp-galerie__loupe { display: none; }

@media (min-width: 1024px) {
	.lbdp-produit__galerie--vignettes { grid-template-areas: "vignettes photo"; grid-template-columns: 76px minmax(0, 1fr); column-gap: 14px; }
	.woocommerce-product-gallery__wrapper { border: 1px solid var(--lbdp-bord); border-radius: var(--lbdp-r-carte); }
	.woocommerce-product-gallery__image img { width: 82%; height: 82%; }
	.lbdp-produit__galerie > .onsale { margin: 14px; padding: 4px 8px; }
	.lbdp-produit__galerie > .lbdp-produit__badges { margin: 14px; }
	.lbdp-produit__badges > :is(.onsale, .lbdp-badge) { padding: 4px 8px; }

	/* Colonne de vignettes à la hauteur de la photo (height 0 + min-height 100 % : la photo fixe la hauteur) */
	.lbdp-galerie__vignettes { display: flex; flex-direction: column; align-items: center; gap: 8px; height: 0; min-height: 100%; }
	.lbdp-galerie__liste { display: flex; flex: 1; flex-direction: column; gap: 10px; width: 76px; min-height: 0; padding: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scroll-snap-type: none; }
	.lbdp-galerie__liste li { flex: none; }

	.lbdp-galerie__defiler { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 1.5px solid var(--lbdp-orange-bord); border-radius: 50%; background: #fff; color: var(--lbdp-orange); cursor: pointer; }
	.lbdp-galerie__defiler:hover:not(:disabled) { border-color: var(--lbdp-orange); background: var(--lbdp-orange-clair); }
	.lbdp-galerie__defiler:disabled { opacity: .35; cursor: default; }

	.lbdp-galerie__fleche,
	.lbdp-galerie__loupe { grid-area: photo; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .94); color: var(--lbdp-texte); box-shadow: 0 2px 8px rgba(0, 0, 0, .12); cursor: pointer; transition: opacity .2s, color .2s; }
	.lbdp-galerie__fleche:hover,
	.lbdp-galerie__loupe:hover { color: var(--lbdp-orange); }
	.lbdp-galerie__fleche { align-self: center; margin-inline: 14px; }
	.lbdp-galerie__fleche--prec { justify-self: start; }
	.lbdp-galerie__fleche--suiv { justify-self: end; }
	.lbdp-galerie__loupe { align-self: end; justify-self: end; margin: 14px; }
}
/* Flèches discrètes : visibles au survol de la galerie ou au clavier ; masquées en bout de galerie */
@media (min-width: 1024px) and (hover: hover) {
	.lbdp-galerie__fleche { opacity: 0; }
	.lbdp-produit__galerie:hover .lbdp-galerie__fleche,
	.lbdp-produit__galerie:focus-within .lbdp-galerie__fleche { opacity: 1; }
}
.lbdp-produit__galerie .lbdp-galerie__fleche:disabled { visibility: hidden; opacity: 0; }

/* 3. Colonne d'achat : marque, titre, référence, note, prix, résumé */
.lbdp-produit__marque { margin: 0; color: var(--lbdp-texte-3); font-size: .8125rem; font-weight: 500; text-transform: uppercase; }
.lbdp-produit__marque a { display: inline-flex; color: inherit; text-decoration: none; }
.lbdp-produit__logo-marque { display: block; width: auto; max-width: 180px; height: 26px; object-fit: contain; object-position: left center; }
.product_title { margin: 0; font-size: 1.3125rem; font-weight: 700; line-height: 1.3; text-wrap: balance; } /* titre plus gras */
.lbdp-produit__ref { margin: -6px 0 0; color: var(--lbdp-texte-2); font-size: .8125rem; }
.lbdp-produit__ref .sku { color: var(--lbdp-texte); font-weight: 600; letter-spacing: .02em; }
.lbdp-produit__ref:has(.sku:empty) { display: none; }

.lbdp-note { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; color: var(--lbdp-texte); font-size: .8125rem; text-decoration: none; }
.lbdp-note__etoiles { display: inline-flex; gap: 1px; color: var(--lbdp-orange); }
.lbdp-note__etoile.est-pleine { fill: currentColor; }
.lbdp-note__nombre { color: var(--lbdp-texte-3); text-decoration: underline; text-underline-offset: .15em; }
.lbdp-note:hover .lbdp-note__nombre { color: var(--lbdp-orange); }

/* Prix de lbdp-core aplati (display: contents) : badge à côté du prix barré */
.lbdp-produit__prix { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; margin: 0; }
.lbdp-produit__prix .price-wrapper { display: contents; }
.lbdp-produit__prix .price-ttc { order: 1; font-size: .8125rem; font-weight: 500; }
.lbdp-produit__prix .price-ttc .amount { font-size: 1.625rem; font-weight: 700; line-height: 1.2; }
.lbdp-produit__prix .orig-price { order: 2; font-size: .875rem; }
.lbdp-produit__prix .onsale { order: 3; display: none; align-self: center; }
.lbdp-produit__prix .price-ht { order: 4; flex-basis: 100%; font-size: .8125rem; }
.woocommerce-product-details__short-description { color: var(--lbdp-texte-2); font-size: .875rem; line-height: 1.65; }
.woocommerce-product-details__short-description > :last-child { margin-bottom: 0; }

@media (min-width: 1024px) {
	.lbdp-produit__logo-marque { height: 32px; }
	.product_title { font-size: 1.75rem; line-height: 1.25; }
	.lbdp-produit__ref { margin-top: -12px; font-size: .875rem; }
	.lbdp-produit__prix { margin-top: -4px; column-gap: 10px; row-gap: 2px; }
	.lbdp-produit__prix .price-ttc { font-size: .875rem; }
	.lbdp-produit__prix .price-ttc .amount { font-size: 2rem; }
	.lbdp-produit__prix .orig-price { font-size: 1rem; }
	.lbdp-produit__prix .onsale { display: inline-flex; }
	.lbdp-produit__prix .price-ht { font-size: .875rem; }
}

/* 3 bis. Produit arrêté → modèle qui le remplace (lbdp_produit_arret()), dans le formulaire sous la barre de délai.
   En-tête plein orange foncé, texte blanc gras (--lbdp-orange-texte #B32F05 : 6,3:1 avec le blanc ; l'orange de la
   marque #FF4613 ne passe pas sous 19 px gras). Encore achetable : <details> natif replié, chevron qui tourne ;
   rien d'achetable : même encart, ouvert (aside). Corps orange clair, carte du remplaçant sur fond blanc = résumé
   du panneau d'achat (photo 64 px et nom sur deux lignes : règles partagées avec .lbdp-achat__photo /
   .lbdp-achat__nom, section 9), prix au format des cartes. */
.lbdp-produit__arret { min-width: 0; border: 2px solid var(--lbdp-texte-2); border-radius: var(--lbdp-r-carte); overflow: hidden; background: var(--lbdp-fond); }
/* Gris foncé (Enes, 09/10/2026 : orange sur orange à côté du bouton d'achat, peu lisible) ; fermé, le fond = la couleur du titre : plus de liseré clair dans les coins arrondis. */
details.lbdp-produit__arret:not([open]) { background: var(--lbdp-texte-2); }
/* Orange de la marque (demande d'Enes du 03/10) : blanc sur #FF4613 = 3,4:1, lisible seulement en gras ≥ 19 px, d'où 1.1875rem. */
.lbdp-produit__arret-titre { display: flex; align-items: center; gap: 10px; margin: 0; padding: 12px 14px; background: var(--lbdp-texte-2); color: #fff; font-size: 1rem; font-weight: 600; line-height: 1.3; }
.lbdp-produit__arret-titre .lbdp-icone { flex: none; }
.lbdp-produit__arret-titre > span { flex: 1; min-width: 0; }
/* Dans le formulaire (form.cart simple ou .variations_button, en flex) : une ligne entière avant la quantité */
form.cart .lbdp-produit__arret { flex-basis: 100%; margin-bottom: 2px; }
/* Produit arrêté avec du « sur commande » : message en clair entre la barre de délai et l'encart (09/10/2026) */
.lbdp-produit__arret-note { flex-basis: 100%; min-width: 0; margin: 0; padding-left: 10px; border-left: 3px solid var(--lbdp-orange); color: var(--lbdp-texte); font-size: .8125rem; line-height: 1.5; }
summary.lbdp-produit__arret-titre { list-style: none; cursor: pointer; }
summary.lbdp-produit__arret-titre::-webkit-details-marker { display: none; }
summary.lbdp-produit__arret-titre:hover > span { text-decoration: underline; text-underline-offset: 3px; }
summary.lbdp-produit__arret-titre:focus-visible { outline: 2px solid var(--lbdp-texte); outline-offset: -4px; }
.lbdp-produit__arret-chevron { transition: transform .2s; }
.lbdp-produit__arret[open] .lbdp-produit__arret-chevron { transform: rotate(180deg); }
.lbdp-produit__arret-corps { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px 14px; }
.lbdp-produit__arret-texte { margin: 0; color: var(--lbdp-texte); font-size: .875rem; line-height: 1.5; }
.lbdp-produit__arret-texte--fort { margin-top: 2px; font-weight: 600; }
.lbdp-produit__arret-carte { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 8px; border: 1px solid var(--lbdp-bord); border-radius: var(--lbdp-r); background: #fff; color: var(--lbdp-texte); text-decoration: none; transition: border-color .2s; }
.lbdp-produit__arret-carte:hover { border-color: var(--lbdp-orange); color: var(--lbdp-texte); }
.lbdp-produit__arret-textes { display: flex; flex: 1; flex-direction: column; gap: 4px; min-width: 0; }
.lbdp-produit__arret-carte:hover .lbdp-produit__arret-lien { color: var(--lbdp-orange-survol); }
.lbdp-produit__arret-carte:hover .lbdp-produit__arret-lien .lbdp-icone { transform: translateX(3px); }
/* Lien en bloc, flèche après le dernier mot ; sur un téléphone étroit, deux lignes équilibrées (jamais la flèche seule) */
.lbdp-produit__arret-lien { display: block; font-size: .8125rem; text-wrap: balance; }
.lbdp-produit__arret-lien .lbdp-icone { display: inline-block; margin-left: .25em; vertical-align: -.2em; }
/* Panneau « Couleur et taille » (téléphone) : la ligne délai + quantité + bouton y est collée en bas de l'écran,
   l'encart n'y entre pas (il reste dans la page, sous les tailles). */
.lbdp-achat :is(.lbdp-produit__arret, .lbdp-produit__arret-note) { display: none; }
@media (prefers-reduced-motion: reduce) {
	.lbdp-produit__arret-chevron { transition: none; }
}
@media (min-width: 1024px) {
	form.cart .lbdp-produit__arret { margin-bottom: 6px; }
	.lbdp-produit__arret-titre { padding: 13px 16px; }
	.lbdp-produit__arret-corps { padding: 14px 16px 16px; }
}

/* 4. Formulaire : déclinaisons (Variation Swatches), délai, quantité, bouton */
table.variations,
table.variations tbody { display: flex; flex-direction: column; gap: 1rem; width: 100%; margin: 0; border: 0; }
table.variations tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px 1rem; }
table.variations th,
table.variations td { padding: 0; border: 0; text-align: left; }
.lbdp-produit table.variations td.value { display: contents; }
table.variations th.label { grid-column: 1; font-size: .875rem; font-weight: 400; }
table.variations th.label label { font-size: inherit; font-weight: 600; }
.lbdp-produit table.variations th .woo-selected-variation-item-name { font-weight: 400; }
table.variations select { grid-column: 1 / -1; }
table.variations td.value > ul { grid-column: 1 / -1; }
.reset_variations { grid-column: 2; justify-self: end; color: var(--lbdp-texte-3); font-size: .8125rem; }
.reset_variations:hover { color: var(--lbdp-orange); }
/* Lien « Guide des tailles » et bouton « Trouver ma taille » (conseiller, inc/conseil-taille.php) côte à côte */
.lbdp-guide-tailles-liens { grid-column: 1; justify-self: start; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 1.25rem; }
.lbdp-guide-tailles { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; padding: 0; border: 0; background: none; color: var(--lbdp-orange); font-family: inherit; font-size: .8125rem; font-weight: 500; cursor: pointer; }
.lbdp-guide-tailles:hover { color: var(--lbdp-orange-survol); }
@media (min-width: 768px) {
	.lbdp-guide-tailles-liens { grid-column: 2; grid-row: 1; justify-self: end; }
	.lbdp-guide-tailles { text-decoration: none; }
	.reset_variations { grid-column: 1 / -1; justify-self: start; }
}

/* Variation Swatches réglé par SES variables : pastilles, boutons ; épuisé (disabled / no-stock) = barré gris */
.variations { --wvs-tick: none; --wvs-cross: linear-gradient(to top right, transparent calc(50% - 1px), var(--lbdp-texte-3) 0 calc(50% + 1px), transparent 0); --wvs-item-box-shadow: inset 0 0 0 1.5px var(--lbdp-champ); --wvs-hover-item-box-shadow: inset 0 0 0 1.5px var(--lbdp-orange); --wvs-selected-item-box-shadow: inset 0 0 0 2px var(--lbdp-orange); --wvs-item-text-color: var(--lbdp-texte); --wvs-hover-item-text-color: var(--lbdp-texte); --wvs-selected-item-text-color: var(--lbdp-orange); --wvs-selected-item-background-color: var(--lbdp-orange-clair); --wvs-single-product-item-width: auto; --wvs-single-product-item-height: 40px; --wvs-single-product-item-font-size: .8125rem; }
.variations .variable-items-wrapper { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.lbdp-produit .variations .variable-item:not(.radio-variable-item) { margin: 0; padding: 0; border-radius: var(--lbdp-r); }
/* Coins arrondis nets sur les couleurs et les tailles (demande d'Enes) : le bouton, son contenu (la photo : 7 px, plus bas) */
.lbdp-produit .variations .variable-items-wrapper .variable-item:not(.radio-variable-item),
.lbdp-produit .variations .variable-items-wrapper .variable-item .variable-item-contents { border-radius: 10px; overflow: hidden; }
.variations .button-variable-items-wrapper { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.button-variable-item.selected { font-weight: 600; }
/* Bouton seul (« Taille unique ») : à la largeur de son texte */
.variations .button-variable-items-wrapper:has(> .variable-item:only-child) { display: flex; }
.variations .button-variable-item:only-child .variable-item-span { padding-inline: 14px; white-space: nowrap; }
/* Libellés longs (« 35 / 39 », « S : 34-36 », classe posée par inc/pastilles.php) : à la largeur du texte, une ligne */
.variations .button-variable-items-wrapper.lbdp-pastilles--longues { display: flex; }
.variations .lbdp-pastilles--longues .button-variable-item { min-width: 3.25rem; }
.variations ul.lbdp-pastilles--longues[data-lbdp-pastilles] .variable-item-span { padding-inline: 12px; white-space: nowrap; } /* plus précis que la règle « padding: 0 5px » des pastilles maison */
.button-variable-item::before, .button-variable-item::after { content: none; }
/* Couleurs en photo : grandes vignettes (photo entière sur fond blanc, filet fin, sélection orange 2 px) */
.lbdp-produit .variations .image-variable-item:not(.radio-variable-item) { width: 52px; height: 52px; padding: 3px; }
.lbdp-produit .variations .image-variable-item img { width: 100%; height: 100%; border-radius: 7px; object-fit: contain; mix-blend-mode: multiply; }
.lbdp-produit .variations .color-variable-item:not(.radio-variable-item) { width: 36px; height: 36px; padding: 4px; border-radius: 50%; }
.color-variable-item .variable-item-span-color { border-radius: 50%; }
/* Indisponible mais toujours cliquable (on peut le choisir pour voir le délai) : texte lisible (#616161 sur #F5F5F5,
   5,7:1), l'indisponibilité est dite par la barre en travers (revue du 03/10/2026, WEB-18) */
.variable-item.disabled, .variable-item.no-stock { --wvs-item-background-color: var(--lbdp-fond); --wvs-item-text-color: var(--lbdp-texte-3); }
/* Pastilles maison (inc/pastilles.php, [data-lbdp-pastilles]) : la base que fournissait la feuille de l'extension.
   Sans effet tant que l'extension est active (elle ne pose pas cet attribut). */
select[data-lbdp-natif] { display: none; }
.variations ul[data-lbdp-pastilles] { list-style: none; }
.variations ul[data-lbdp-pastilles] .variable-item {
	position: relative; display: flex; align-items: center; justify-content: center; box-sizing: border-box;
	min-width: 40px; width: var(--wvs-single-product-item-width, auto); height: var(--wvs-single-product-item-height, 40px);
	background: var(--wvs-item-background-color, #fff); color: var(--wvs-item-text-color);
	box-shadow: var(--wvs-item-box-shadow); font-size: var(--wvs-single-product-item-font-size, .8125rem); line-height: 1.2;
	cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; transition: box-shadow .2s, background-color .2s, color .2s;
}
.variations ul[data-lbdp-pastilles] .variable-item:hover { box-shadow: var(--wvs-hover-item-box-shadow); color: var(--wvs-hover-item-text-color); }
.variations ul[data-lbdp-pastilles] .variable-item.selected { box-shadow: var(--wvs-selected-item-box-shadow); color: var(--wvs-selected-item-text-color); }
.variations ul[data-lbdp-pastilles] .button-variable-item.selected { background: var(--wvs-selected-item-background-color); }
.variations ul[data-lbdp-pastilles] .variable-item-contents { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.variations ul[data-lbdp-pastilles] .variable-item-span { display: block; padding: 0 5px; }
.variations ul[data-lbdp-pastilles] .variable-item-span-color { width: 100%; height: 100%; padding: 0; background: var(--lbdp-c, var(--lbdp-pastille)); }
.variations ul[data-lbdp-pastilles] .variable-item-span-color--bicolore { background: linear-gradient(135deg, var(--lbdp-c) 50%, var(--lbdp-c2) 50%); }
/* Indisponible : la couleur ou la photo pâlit, la barre reste foncée (--lbdp-texte-3 = #616161 depuis le 06/10/2026, avant #757575 à 4,2:1 ; elle était à 1,7:1 car pâlie
   avec le reste, audit A4). Le TEXTE des tailles ne pâlit plus (il tombait à 1,65:1, revue du 03/10/2026, WEB-18) */
.variations ul[data-lbdp-pastilles] .variable-item:is(.disabled, .no-stock) :is(.variable-item-span-color, img) { opacity: .6; }
.variations ul[data-lbdp-pastilles] .variable-item.disabled .variable-item-contents::before,
.variations ul[data-lbdp-pastilles] .variable-item.no-stock .variable-item-contents::before { content: ""; position: absolute; inset: 0; background-image: var(--wvs-cross); pointer-events: none; }
/* Taille en stock (expédié sous 24 h) : pastille verte en haut à droite (classe posée par produit.js) + légende */
.lbdp-produit .button-variable-item.lbdp-en-stock .variable-item-contents::after { content: ""; position: absolute; top: 5px; right: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--lbdp-vert); pointer-events: none; }
.lbdp-legende-stock { grid-column: 1 / -1; display: flex; align-items: center; gap: 6px; margin: -2px 0 0; color: var(--lbdp-texte-3); font-size: .75rem; line-height: 1.4; }
.lbdp-legende-stock::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--lbdp-vert); }
@media (min-width: 1024px) {
	/* Tailles et couleurs plus compactes (demande d'Enes) */
	.variations .button-variable-items-wrapper { grid-template-columns: repeat(auto-fill, 52px); }
	.lbdp-produit .variations .image-variable-item:not(.radio-variable-item) { width: 58px; height: 58px; padding: 4px; }
}

/* Prix (déjà en haut) et disponibilité (barre de délai) natifs de la déclinaison masqués */
.single_variation_wrap { margin-top: 1rem; }
.woocommerce-variation-price,
.woocommerce-variation-availability,
.lbdp-produit__achat .stock:not(.out-of-stock),
.lbdp-achat .stock:not(.out-of-stock) { display: none; }
/* L'extension de stock (woo-custom-stock-status) imprime `.woocommerce-variation-availability{display:block!important}`
   (idem pour le prix) : le texte « En rupture de stock » revenait en rouge au-dessus de la barre de délai, qui dit
   déjà la même chose (vu le 03/10/2026). Même règle, plus précise, pour qu'elle passe devant. */
.lbdp-produit__achat .woocommerce-variation-price,
.lbdp-produit__achat .woocommerce-variation-availability,
.lbdp-achat .woocommerce-variation-price,
.lbdp-achat .woocommerce-variation-availability { display: none !important; }
.woocommerce-variation-description { color: var(--lbdp-texte-2); font-size: .875rem; }
.lbdp-produit__achat .out-of-stock,
.lbdp-achat .out-of-stock { margin: 0; color: var(--lbdp-erreur); font-weight: 600; }

/* Délai + quantité + bouton (simple : form.cart ; variable : .variations_button) */
form.cart:not(.variations_form),
.variations_button { display: flex; flex-wrap: wrap; gap: 10px; }
.lbdp-produit__delai { display: block; flex-basis: 100%; margin-bottom: 2px; padding: 9px 14px; border-radius: 999px; font-size: .8125rem; font-weight: 400; line-height: 1.35; text-align: center; }
.lbdp-produit__delai::before { display: inline-block; width: 8px; height: 8px; margin-right: 8px; vertical-align: .05em; }
/* « Quantité maximale : 2 pièces disponibles dans cette taille » (produit.js, section 2) : ligne entière, avant la quantité */
.lbdp-qte-max { flex-basis: 100%; margin: 0; padding: 8px 12px; border: 1px solid #F0C36D; border-radius: var(--lbdp-r); background: #FFF6DB; color: #7A4B00; font-size: .8125rem; font-weight: 500; line-height: 1.4; } /* ambre lisible (avis UI du 05/10/2026) */
/* Téléphone : quantité compacte et « Ajouter au panier » sur une seule ligne (Enes, 02/10/2026) ; taille d'origine
   à partir de 768 px. */
.lbdp-produit .quantity { display: inline-flex; flex: none; align-items: center; height: 48px; border: 1px solid var(--lbdp-champ); border-radius: var(--lbdp-r); background: #fff; }
.lbdp-produit .quantity .lbdp-quantite__bouton { width: 34px; }
.lbdp-produit .quantity input.qty { width: 1.75rem; min-height: 0; height: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; font-weight: 600; text-align: center; -moz-appearance: textfield; appearance: textfield; }
.lbdp-produit .quantity input.qty:focus { box-shadow: none; }
.lbdp-produit .quantity:focus-within { border-color: var(--lbdp-orange); box-shadow: 0 0 0 3px var(--lbdp-halo); }
.lbdp-produit .quantity input.qty::-webkit-inner-spin-button,
.lbdp-produit .quantity input.qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.single_add_to_cart_button { flex: 1; min-width: 0; min-height: 48px; gap: 8px; padding-inline: .875rem; font-size: .9375rem; white-space: nowrap; }
.single_add_to_cart_button::before,
.lbdp-barre-achat__bouton .lbdp-icone { flex: none; }
.single_add_to_cart_button::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--lbdp-masque-panier) center / contain no-repeat; mask: var(--lbdp-masque-panier) center / contain no-repeat; }
/* Très petits écrans (320 px) : « Ajouter au panier » tient encore dans son bouton. */
@media (max-width: 359.98px) {
	.lbdp-produit .quantity .lbdp-quantite__bouton { width: 30px; }
	.single_add_to_cart_button { gap: 6px; padding-inline: .625rem; font-size: .875rem; }
}
@media (min-width: 768px) {
	.lbdp-produit .quantity { height: 52px; }
	.lbdp-produit .quantity .lbdp-quantite__bouton { width: 44px; }
	.lbdp-produit .quantity input.qty { width: 2.25rem; }
	.single_add_to_cart_button { min-height: 52px; gap: 10px; padding-inline: 1.5rem; font-size: 1rem; }
	.single_add_to_cart_button::before { width: 20px; height: 20px; }
}
/* Combinaison indisponible : .disabled posé par WooCommerce, bouton pâli */
.single_add_to_cart_button.disabled { opacity: .55; cursor: not-allowed; }
/* Taille ou couleur pas encore choisie : bouton plein (pâli à 2,08:1, il faisait « cassé ») ; le clic dit quoi choisir
   sous les tailles (produit.js, section 8 ; lot front n° 1 du 05/10/2026) */
.single_add_to_cart_button.disabled.wc-variation-selection-needed { opacity: 1; cursor: pointer; }
/* Ajout en cours (produit.js, section 8) : le pictogramme devient un cercle qui tourne, le bouton ne se reclique pas */
.single_add_to_cart_button.est-en-cours,
.lbdp-barre-achat__bouton.est-en-cours { background: var(--lbdp-orange-survol); border-color: var(--lbdp-orange-survol); cursor: progress; pointer-events: none; }
.single_add_to_cart_button.est-en-cours::before,
.lbdp-barre-achat__bouton.est-en-cours::before {
	content: ""; flex: none; box-sizing: border-box; width: 20px; height: 20px;
	border: 2.5px solid rgba(255, 255, 255, .4); border-top-color: #fff; border-radius: 50%;
	background: none; -webkit-mask: none; mask: none; animation: lbdp-tourne .7s linear infinite;
}
.lbdp-barre-achat__bouton.est-en-cours .lbdp-icone { display: none; }
@keyframes lbdp-tourne { to { transform: rotate(360deg); } }
/* Ajouté : coche blanche pendant deux secondes */
.single_add_to_cart_button.est-ajoute::before {
	box-sizing: border-box; width: 9px; height: 16px; margin: -3px 4px 0;
	border: solid #fff; border-width: 0 2.5px 2.5px 0; border-radius: 0;
	background: none; -webkit-mask: none; mask: none; transform: rotate(45deg);
}
@media (prefers-reduced-motion: reduce) {
	.single_add_to_cart_button.est-en-cours::before,
	.lbdp-barre-achat__bouton.est-en-cours::before { animation-duration: 2s; }
}
@media (min-width: 1024px) {
	.single_variation_wrap { margin-top: 1.25rem; }
	.lbdp-produit__delai { margin-bottom: 10px; padding-inline: 16px; font-size: .875rem; }
}

/* 5. Réassurance (3 tuiles) et bannière de personnalisation */
.lbdp-produit__reassurance { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.lbdp-produit__tuile { display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; padding: 10px 4px; border: 1px solid var(--lbdp-orange-bord); border-radius: var(--lbdp-r-carte); background: var(--lbdp-orange-clair); color: var(--lbdp-texte); font-size: .75rem; font-weight: 600; line-height: 1.3; text-align: center; text-decoration: none; }
.lbdp-produit__tuile .lbdp-icone { width: 22px; height: 22px; color: var(--lbdp-orange); }
.lbdp-produit__tuile:hover { border-color: var(--lbdp-orange); color: var(--lbdp-texte); }
/* Lien « Voir le panier » que WooCommerce ajoute sous le bouton après un ajout (add-to-cart.js, quand le bouton est
   transmis à l'événement added_to_cart pour les extensions de suivi) : le panier latéral s'ouvre déjà. */
form.cart .added_to_cart { display: none; }

/* Tarifs de livraison sous le formulaire d'achat (inc/produit.php, lbdp_produit_livraison ; audit V2) */
.lbdp-produit__livraison { display: flex; align-items: flex-start; gap: .5rem; margin: .75rem 0 0; color: var(--lbdp-texte-2); font-size: .8125rem; line-height: 1.5; }
.lbdp-produit__livraison .lbdp-icone { flex: none; margin-top: .15em; color: var(--lbdp-orange); }
.lbdp-produit__livraison .amount { color: var(--lbdp-texte); font-weight: 600; }
.lbdp-produit__livraison a { color: var(--lbdp-texte); font-weight: 600; text-underline-offset: .15em; }
.lbdp-produit__livraison a:hover { color: var(--lbdp-orange); }

.lbdp-produit__banniere { display: block; overflow: hidden; border-radius: var(--lbdp-r-carte); line-height: 0; }
.lbdp-produit__banniere-image { display: block; width: 100%; height: auto; }
/* Bannière de personnalisation : l'image, sur ordinateur comme sur téléphone (demande d'Enes du 03/10/2026). */
@media (min-width: 768px) {
	.lbdp-produit__reassurance { gap: 8px; }
	.lbdp-produit__tuile { gap: 8px; padding: 14px 8px; font-size: .8125rem; }
	.lbdp-produit__tuile .lbdp-icone { width: 26px; height: 26px; }
}

/* 6. Onglets (ordinateur) / accordéon (mobile) */
.lbdp-onglets { margin-top: 1.5rem; border-top: 1px solid var(--lbdp-bord); scroll-margin-top: 1rem; }
.lbdp-onglets__liste { display: none; }
.lbdp-onglets__section { border-bottom: 1px solid var(--lbdp-bord); }
.lbdp-onglets__entete { margin: 0; font-size: .9375rem; }
.lbdp-onglets__bascule { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; min-height: 52px; padding: 0; border: 0; background: none; color: var(--lbdp-texte); font-weight: 600; text-align: left; scroll-margin-top: .5rem; }
.lbdp-onglets__chevron { color: var(--lbdp-orange); transition: transform .2s; }
.lbdp-onglets__bascule[aria-expanded="true"] .lbdp-onglets__chevron { transform: rotate(180deg); }
.lbdp-onglets__panneau { padding-bottom: 1rem; color: var(--lbdp-texte-2); font-size: .875rem; line-height: 1.6; }

@media (min-width: 768px) {
	.lbdp-onglets { margin-top: 3.5rem; border-top: 0; }
	.lbdp-onglets__liste { display: flex; gap: 2rem; overflow-x: auto; border-bottom: 1px solid var(--lbdp-bord); scrollbar-width: none; }
	.lbdp-onglets__onglet { flex: none; margin-bottom: -1px; padding: 1rem 0; border: 0; border-bottom: 3px solid transparent; background: none; color: var(--lbdp-texte-3); font-size: 1rem; font-weight: 600; }
	.lbdp-onglets__onglet:hover { color: var(--lbdp-texte); }
	.lbdp-onglets__onglet[aria-selected="true"] { border-bottom-color: var(--lbdp-orange); color: var(--lbdp-texte); }
	.lbdp-onglets__onglet:focus-visible { outline-offset: -2px; }
	.lbdp-onglets__section { border: 0; }
	.lbdp-onglets__entete { display: none; }
	.lbdp-onglets__panneau { padding: 1.75rem 0 0; line-height: 1.75; }
}

/* Contenu des panneaux */
.lbdp-onglets__panneau > :first-child { margin-top: 0; }
.lbdp-onglets__panneau h2, .lbdp-onglets__panneau h3 { margin: 1.5rem 0 .5rem; color: var(--lbdp-texte); font-size: 1rem; text-align: left !important; }
.lbdp-onglets__panneau p { margin: 0 0 1em; }
.shop_attributes { width: 100%; margin: 0; border-collapse: collapse; font-size: .875rem; }
.shop_attributes tr { border-bottom: 1px solid var(--lbdp-bord); }
.shop_attributes th { width: 40%; padding: 12px 16px 12px 0; color: var(--lbdp-texte); font-weight: 600; text-align: left; vertical-align: top; }
.shop_attributes td { padding: 12px 0; color: var(--lbdp-texte-2); line-height: 1.6; }
.shop_attributes td p { margin: 0; }
@media (min-width: 768px) {
	.shop_attributes th { width: 240px; }
}

.lbdp-documents { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0; padding: 0; list-style: none; }
.lbdp-document { display: flex; align-items: center; gap: 14px; height: 100%; padding: 16px 18px; border: 1px solid var(--lbdp-bord); border-radius: var(--lbdp-r-carte); color: var(--lbdp-texte); text-decoration: none; }
.lbdp-document:hover { border-color: var(--lbdp-orange); color: var(--lbdp-texte); }
.lbdp-document__icone { color: var(--lbdp-orange); }
.lbdp-document__textes { display: flex; flex: 1; flex-direction: column; gap: 2px; min-width: 0; line-height: 1.4; }
.lbdp-document__titre { font-weight: 500; overflow-wrap: anywhere; }
.lbdp-document__detail { color: var(--lbdp-texte-3); font-size: .75rem; }
.lbdp-document__action { color: var(--lbdp-texte-3); }
@media (min-width: 768px) {
	.lbdp-documents { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
}

/* Avis Vérifiés (Netreviews) : police du site */
.woocommerce-Tabs-panel--reviews, .woocommerce-Tabs-panel--reviews * { font-family: var(--lbdp-police); }

/* 7. Ventes additionnelles et produits similaires */
.up-sells { padding-top: 2.5rem; }
.up-sells > h2 { margin: 0 0 1.5rem; font-size: 1.25rem; }
.lbdp-produit__similaires { padding-bottom: 1rem; }
.lbdp-produit__similaires .lbdp-section__titre { font-size: 1.25rem; }
@media (min-width: 1024px) {
	.up-sells { padding-top: var(--lbdp-section); }
	.up-sells > h2, .lbdp-produit__similaires .lbdp-section__titre { font-size: 1.625rem; }
	.lbdp-produit__similaires { padding-bottom: 2rem; }
}

/* 8. Barre d'achat collante (mobile et tablette) */
.lbdp-barre-achat { position: fixed; right: 0; bottom: 0; left: 0; z-index: 30; display: flex; align-items: center; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--lbdp-bord); background: #fff; box-shadow: 0 -6px 20px rgba(0, 0, 0, .06); transform: translateY(110%); visibility: hidden; transition: transform .2s ease, visibility .2s; }
.lbdp-barre-achat.est-visible { transform: none; visibility: visible; }
.lbdp-barre-achat__prix { display: flex; flex-direction: column; margin: 0; line-height: 1.25; }
.lbdp-barre-achat__prix .price-wrapper { display: flex; flex-direction: column; }
.lbdp-barre-achat__prix .price-ttc { font-size: .75rem; }
.lbdp-barre-achat__prix .price-ttc .amount { font-size: 1.125rem; }
.lbdp-barre-achat__prix .orig-price { display: none; }
.lbdp-barre-achat__prix .price-ht { font-size: .75rem; }
.lbdp-barre-achat__bouton { flex: 1; min-height: 48px; }
/* Place réservée : la barre ne masque jamais le pied de page */
body.single-product:has(.lbdp-barre-achat) { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
@media (min-width: 1024px) {
	.lbdp-barre-achat { display: none; }
	body.single-product:has(.lbdp-barre-achat) { padding-bottom: 0; }
}

/* 9. Panneau « Couleur et taille » (mobile et tablette) : <dialog> en bas d'écran, ouvert par la barre d'achat.
   Le formulaire natif de la fiche y est déplacé par produit.js : il garde les styles de la section 4. */
.lbdp-achat { position: fixed; inset: auto 0 0; width: 100%; max-width: 100%; max-height: 88dvh; margin: 0; padding: 0; border: 0; border-radius: 16px 16px 0 0; overflow: hidden; background: #fff; color: var(--lbdp-texte); }
.lbdp-achat[open] { display: flex; animation: lbdp-glisse-haut .25s ease-out; }
.lbdp-achat::backdrop { background: rgba(26, 26, 26, .4); }
@keyframes lbdp-glisse-haut { from { transform: translateY(100%); } to { transform: none; } }
.lbdp-achat__boite { display: flex; flex-direction: column; width: 100%; min-height: 0; }
.lbdp-achat__tete { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 60px; padding: .5rem .5rem .5rem 1rem; border-bottom: 1px solid var(--lbdp-bord); }
.lbdp-achat__titre { margin: 0; font-size: 1.125rem; font-weight: 600; }
.lbdp-achat__corps { display: flex; flex: 1; flex-direction: column; gap: 1rem; min-height: 0; padding: 1rem 1rem 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
/* Sans ligne d'achat collante (cas rare) : la marge du bas revient au corps. */
.lbdp-achat__corps:not(:has(.variations_button)) { padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); }
.lbdp-achat__resume { display: flex; align-items: center; gap: 12px; }
.lbdp-achat__photo,
.lbdp-produit__arret-photo { flex: none; width: 64px; height: 64px; border: 1px solid var(--lbdp-bord); border-radius: var(--lbdp-r); background: #fff; object-fit: contain; }
.lbdp-achat__textes { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.lbdp-achat__nom,
.lbdp-produit__arret-nom { display: -webkit-box; margin: 0; overflow: hidden; font-size: .875rem; font-weight: 600; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
/* Délai, quantité et bouton toujours visibles en bas du panneau, même quand couleurs et tailles dépassent (Enes,
   02/10/2026 : le bouton était coupé en bas de l'écran). Les enveloppes du formulaire s'effacent (display: contents)
   pour que cette ligne colle au bas de la zone qui défile ; dans la page, le formulaire garde sa mise en forme. */
.lbdp-achat__formulaire,
.lbdp-achat__formulaire form.variations_form,
.lbdp-achat__formulaire .single_variation_wrap { display: contents; }
.lbdp-achat .variations_button {
	position: sticky; bottom: 0; z-index: 2;
	/* Plus de marge négative en bas compensée par la marge du corps : Safari (iPhone) ne compte pas la marge basse
	   d'une zone qui défile, le bas du panneau devenait inatteignable sous cette ligne (Enes, 05/10/2026 : « j'arrive
	   pas à descendre »). La ligne garde sa propre marge de sécurité (barre de l'iPhone). */
	margin: 0 -1rem;
	padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--lbdp-bord); background: #fff;
}

/* Visionneuse des photos (PhotoSwipe de WooCommerce, au toucher de la photo) : fond noir à 80 % (inc/produit.php,
   bgOpacity) et croix de fermeture bien en évidence, ronde et blanche, calée en haut à droite (Enes, 05/10/2026). */
.pswp .pswp__top-bar { background: none; }
.pswp .pswp__top-bar .pswp__button--close {
	position: absolute; top: calc(10px + env(safe-area-inset-top, 0px)); right: 10px; float: none;
	width: 44px; height: 44px; margin: 0; border-radius: 50%; opacity: 1;
	/* !important : la feuille PhotoSwipe de WooCommerce force « button.pswp__button » en fond transparent !important. */
	background-color: #fff !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") !important;
	background-position: center !important; background-size: 22px !important; background-repeat: no-repeat !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .35);
}
.pswp .pswp__top-bar .pswp__button--close:hover,
.pswp .pswp__top-bar .pswp__button--close:focus-visible { background-color: #F2F2F2 !important; opacity: 1; }
