.sss-eyebrow { font-size: 13px; letter-spacing: 0.2em; text-transform: uppercase; display:block; }
.sss-shop-header { text-align:center; max-width:1280px; margin:0 auto; padding: 70px 24px 36px; }
.sss-shop-header h1 { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:44px; margin: 14px 0 0; }
.sss-shop-subtitle { font-size:16px; margin: 12px 0 0; }
.sss-quiz-link { display:inline-block; margin-top:14px; font-size:13px; text-decoration:underline; }

body.sss-wishlist-standalone-page { background:#F9F6F1; }
.sss-wishlist-page { max-width:1280px; margin:0 auto; padding:0 24px 100px; }
.sss-wishlist-head { text-align:center; padding:70px 0 36px; }
.sss-wishlist-head .sss-eyebrow { color:#3B0510; margin-bottom:14px; }
.sss-wishlist-head h1 { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:40px; margin:0; color:#221516; }
.sss-wishlist-subtitle { font-size:15px; color:#5A4C48; margin:12px 0 0; }
.sss-wishlist-grid { margin:0; }
.sss-wishlist-empty { text-align:center; max-width:480px; margin:0 auto; padding:40px 0 60px; display:flex; flex-direction:column; align-items:center; gap:18px; }
.sss-wishlist-empty p { font-size:15px; color:#5A4C48; line-height:1.6; margin:0; }
.sss-wishlist-empty-link { font-size:13px; color:#3B0510; text-decoration:underline; font-weight:600; }

.sss-shop-filters { display:flex; justify-content:center; gap: 10px; flex-wrap:wrap; max-width: 1280px; margin: 16px auto 0; padding: 0 24px; }
.sss-filter-row { display:flex; flex-wrap:wrap; gap: 28px; align-items:flex-start; max-width: 1280px; margin: 24px auto 0; padding: 20px 24px; border-bottom: 1px solid rgba(0,0,0,0.08); }
.sss-filter-group { display:flex; flex-direction:column; gap:8px; }
.sss-filter-label { font-size:11px; letter-spacing:0.1em; text-transform:uppercase; opacity:0.7; }
.sss-filter-options { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }

.sss-pill { border-radius: 2px; font-size:14px; cursor:pointer; padding: 10px 22px; display:inline-flex; align-items:center; gap:6px; }
.sss-pill-off { border: 1px solid rgba(0,0,0,0.18); background: transparent; }
.sss-pill-on { border: 1px solid #221516; background: #221516; color: #F4F4F1 !important; }
.sss-open-filters-btn { padding:10px 22px; flex-shrink:0; margin-left:auto; }

.sss-swatch { width:26px; height:26px; border-radius:50%; border:1px solid rgba(0,0,0,0.12); cursor:pointer; padding:0; }
.sss-swatch.active { border:2px solid #221516; }

.sss-reassurance { display:flex; justify-content:center; gap: 48px; flex-wrap:wrap; padding: 28px 24px; max-width:1000px; margin: 0 auto; }
.sss-reassurance-item { display:flex; align-items:center; gap:10px; font-size:14px; }
.sss-reassurance-item .icon { width:34px; height:34px; border-radius:50%; border:1px solid rgba(0,0,0,0.18); display:flex; align-items:center; justify-content:center; font-size:15px; }

.sss-mobile-stickybar { display:none; }
.sss-mobile-cat-label { font-weight:700; font-size:14px; flex-shrink:0; }
.sss-active-chips { display:flex; gap:8px; overflow-x:auto; }
.sss-chip { flex-shrink:0; display:flex; align-items:center; gap:6px; border:1px solid #221516; background:#221516; color:#F4F4F1; padding:6px 12px; border-radius:2px; font-size:12px; cursor:pointer; }
.sss-results-label { text-align:center; font-size:14px; opacity:0.7; margin: 16px 0 0; }

.sss-mobile-sheet-bg { display:none; position:fixed; inset:0; z-index:60; background:rgba(43,38,32,0.4); align-items:flex-end; }
.sss-mobile-sheet-bg.open { display:flex; }
.sss-mobile-sheet { width:100%; max-height:82vh; overflow-y:auto; background:#F4F4F1; border-radius:2px 2px 0 0; padding:20px 20px 90px; display:flex; flex-direction:column; gap:8px; }
.sss-mobile-sheet-head { display:flex; align-items:center; justify-content:space-between; }
.sss-mobile-sheet-title { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:18px; }
.sss-mobile-sheet-actions { display:flex; align-items:center; gap:14px; }
.sss-clear-btn { border:none; background:transparent; color:#3B0510; font-size:13px; text-decoration:underline; cursor:pointer; }
.sss-close-btn { width:32px; height:32px; border-radius:50%; border:1px solid rgba(0,0,0,0.18); background:transparent; font-size:16px; cursor:pointer; }
.sss-mobile-cats { display:flex; gap:10px; flex-wrap:wrap; margin: 16px 0; }
.sss-apply-btn { position:sticky; bottom:0; margin-top:auto; background:#221516; color:#F4F4F1; border:none; padding:16px; border-radius:2px; font-size:15px; font-weight:700; cursor:pointer; }

@media (max-width: 768px) {
	.sss-shop-filters, .sss-filter-row { display:none !important; }
	.sss-mobile-stickybar { position: sticky; top: 0; z-index: 32; background: rgba(244,244,241,0.9); backdrop-filter: blur(10px); box-shadow: 0 4px 14px rgba(43,38,32,0.08); padding: 12px 16px; display:flex; align-items:center; gap: 10px; overflow-x:auto; }

	/* Le haut de la page boutique (titre + sous-titre + réassurance) prenait tout l'écran sur
	   mobile, obligeant à défiler avant même de voir un seul produit — resserré ici : padding
	   réduit, titre plus petit, réassurance en une seule ligne compacte plutôt qu'empilée. */
	.sss-shop-header { padding: 28px 20px 16px !important; }
	.sss-shop-header h1 { font-size: 28px !important; margin-top: 8px !important; }
	.sss-shop-subtitle { font-size: 14px !important; margin-top: 6px !important; }
	.sss-reassurance {
		gap: 18px !important; padding: 14px 20px !important; flex-wrap: nowrap !important;
		overflow-x: auto !important; justify-content: flex-start !important;
	}
	.sss-reassurance-item { font-size: 11.5px !important; gap: 6px !important; flex-shrink: 0; white-space: nowrap; }
	.sss-reassurance-item .icon { width: 24px !important; height: 24px !important; font-size: 11px !important; flex-shrink: 0; }
}

/* Le thème Uncode charge son propre CSS en dernier et déclare presque tout en !important —
   sans !important ici, nos règles de carte produit (taille de texte, marges) perdent
   systématiquement contre les styles par défaut du thème. */
/* Uncode fournit ses propres règles pour "ul.products li.product" (grille historique en
   float, library/css/woocommerce.css), chargées APRÈS ce fichier avec une spécificité plus
   élevée que nos simples sélecteurs de classe (.sss-shop-grid / .sss-product-card seuls) —
   d'où des propriétés qui passaient au travers (float, clear, margin) et cassaient la mise en
   page 2 colonnes sur mobile. "html body" + répétition de la classe font gagner nos règles sur
   TOUTES les propriétés concernées, pas seulement celles qu'on avait pensé à protéger. */
html body ul.products.sss-shop-grid {
	display:flex !important; flex-wrap:wrap !important; justify-content:center !important;
	gap: 32px !important; max-width: 1280px !important; margin: 20px auto 90px !important;
	padding: 0 24px !important; list-style:none !important; clear:both !important;
}
html body ul.products.sss-shop-grid li.product.sss-product-card {
	float:none !important; clear:none !important; text-decoration:none !important; display:flex !important;
	flex-direction:column !important; gap:12px !important; background:#FFFFFF !important; border-radius:2px !important;
	padding:16px !important; box-shadow:none !important; border:1px solid rgba(34,21,22,0.1) !important;
	flex: 1 1 240px !important; max-width: 300px !important; min-width: 240px !important; width:auto !important;
	margin:0 !important; position:relative !important; list-style:none !important;
}
@media (max-width: 640px) {
	/* display:grid plutôt que flex-wrap + calc() : deux colonnes strictement égales et
	   prévisibles (flex-basis en % laissait parfois un item seul sur sa ligne selon
	   l'arrondi des pixels). Un nombre impair d'articles laisse simplement le dernier seul
	   dans la colonne de gauche, sans qu'il s'étire — comportement natif d'une grille. */
	html body ul.products.sss-shop-grid {
		display: grid !important; grid-template-columns: repeat(2, 1fr) !important;
		justify-content: stretch !important; justify-items: stretch !important; align-items: start !important;
		grid-auto-flow: row !important; direction: ltr !important;
		gap: 14px !important; padding: 0 16px !important;
	}
	html body ul.products.sss-shop-grid li.product.sss-product-card {
		box-sizing: border-box !important; display: flex !important; width: 100% !important;
		max-width: none !important; min-width: 0 !important; flex: initial !important;
		grid-column: auto !important; padding: 10px !important; gap: 8px !important; margin:0 !important;
	}
	.sss-product-info h2 { font-size: 14px !important; }
}
.sss-product-link { text-decoration:none !important; display:flex !important; flex-direction:column !important; gap:12px !important; }
/* padding-top en % plutôt que aspect-ratio : Safari iOS calcule mal aspect-ratio sur un élément
   qui est À LA FOIS un item flex (.sss-product-card est flex-direction:column) ET, depuis le
   passage de la grille boutique en display:grid sur mobile, un descendant d'item de grille —
   la combinaison gonfle la hauteur bien au-delà du ratio voulu, d'où le "zoom" sur les photos
   (object-fit:cover recadre alors sur une boîte bien plus haute que 3/4 réel). La technique du
   padding-top est indépendante de flex/grid : fiable sur tous les navigateurs, sans exception. */
.sss-product-thumb { position:relative !important; border-radius:2px !important; overflow:hidden !important; height:0 !important; padding-top: 133.333% !important; }
.sss-wishlist-btn { border:none !important; background:transparent !important; cursor:pointer !important; font-size:18px !important; line-height:1 !important; color:#3B0510 !important; }
.sss-card-wishlist-btn { position:absolute !important; top:10px !important; right:10px !important; z-index:2 !important; width:30px !important; height:30px !important; border-radius:50% !important; background:rgba(244,244,241,0.9) !important; display:flex !important; align-items:center !important; justify-content:center !important; }
.sss-wishlist-btn.active { color:#3B0510 !important; }
.sss-pdp-wishlist-btn { width:52px; height:52px; border-radius:50%; border:1px solid rgba(0,0,0,0.18); background:transparent; font-size:18px; flex-shrink:0; }
.sss-product-thumb img { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; object-fit:cover !important; object-position: top center !important; display:block !important; margin:0 !important; }
.sss-badge { position:absolute !important; top:10px !important; left:10px !important; background:#F4F4F1 !important; font-size:10px !important; letter-spacing:0.08em !important; text-transform:uppercase !important; padding: 5px 10px !important; border-radius:2px !important; font-weight:700 !important; z-index:1 !important; }
.sss-product-info { display:flex !important; flex-direction:column !important; gap:4px !important; padding: 0 4px !important; }
.sss-product-info h2 { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif !important; font-weight:500 !important; font-size:17px !important; line-height:1.3 !important; margin:8px 0 0 !important; color:#221516 !important; }
/* Le prix vient de WooCommerce (get_price_html) sous forme de <ins>/<del>/<bdi>/.woocommerce-Price-amount
   imbriqués — chacun de ces éléments porte potentiellement sa propre taille/graisse ailleurs sur le
   site (fiche produit classique WooCommerce, Uncode), donc chaque niveau doit être fixé explicitement
   ici, sinon un seul d'entre eux (souvent .woocommerce-Price-amount) prend le dessus et le prix
   s'affiche démesuré par rapport au titre. Volontairement plus discret que le titre : le prix est une
   donnée d'appoint sur la vignette, pas l'élément dominant. */
.sss-product-info .price,
.sss-product-info .price ins,
.sss-product-info .price bdi,
.sss-product-info .price .woocommerce-Price-amount,
.sss-product-info .price .woocommerce-Price-currencySymbol {
	font-family: 'Jost', system-ui, sans-serif !important;
	font-size:14px !important; font-weight:500 !important; line-height:1.4 !important;
	color:#3B0510 !important; text-decoration:none !important; letter-spacing:0.01em !important;
}
.sss-product-info .price { margin:2px 0 0 !important; }
.sss-product-info .price del { text-decoration:line-through !important; color:#9A8C88 !important; font-weight:400 !important; margin-right:6px !important; opacity:1 !important; }
.sss-product-info .price del .woocommerce-Price-amount { color:inherit !important; font-weight:inherit !important; }
.sss-product-cta { text-align:center !important; margin-top:8px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:6px !important; background:#3B0510 !important; color:#F4F4F1 !important; border-radius:2px !important; padding:11px 16px !important; font-size:11px !important; letter-spacing:0.07em !important; text-transform:uppercase !important; font-weight:600 !important; text-decoration:none !important; transition: background .2s !important; }
.sss-product-cta:hover { background:#5C0A16 !important; }
/* Statut de disponibilité (surtout perruques/tissages) — décisif pour une cliente pressée
   (mariage, événement) : toujours visible sur la vignette, pas juste sur la fiche produit. */
.sss-dispo-badge { position:absolute !important; bottom:10px !important; left:10px !important; font-size:10px !important; letter-spacing:0.04em !important; padding:5px 10px !important; border-radius:2px !important; font-weight:700 !important; z-index:1 !important; display:flex !important; align-items:center !important; gap:4px !important; color:#FFFFFF !important; margin:0 !important; }
.sss-dispo-ready { background:#221516 !important; }
.sss-dispo-preorder { background:#3B0510 !important; }

/* ===== FICHE PRODUIT (PDP) ===== */
.sss-pdp-cols { display:flex; gap: 56px; max-width: 1200px; margin: 24px auto 0; padding: 0 24px; align-items:flex-start; }
.sss-pdp-gallery-wrap { display: flex; flex-direction: column; gap: 14px; width: 100%; flex: 1 1 520px; min-width: 0; }
.sss-pdp-gallery-media { display: flex; flex-direction: column; gap: 14px; width: 100%; }
.sss-pdp-main-image { width:100%; max-height:78vh; border-radius: 2px; overflow:hidden; box-shadow:none; border:1px solid rgba(34,21,22,0.1); display:flex; align-items:center; justify-content:center; background:#E1DBD7; order:1; }
.sss-pdp-main-image img, .sss-pdp-main-image video { width:100%; height:auto; max-height:78vh; display:block; object-fit:contain; }
.sss-pdp-thumbs { display: flex; gap: 12px; overflow-x: auto; order: 2; }
.sss-pdp-thumb { flex:0 0 70px; aspect-ratio:1; border-radius:2px; overflow:hidden; padding:0; cursor:pointer; background:#FFFFFF; border:1px solid rgba(0,0,0,0.08); position:relative; }
.sss-pdp-thumb.active { border:2px solid #221516; }
.sss-pdp-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.sss-pdp-thumb-play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(43,38,32,0.25); color:#F4F4F1; font-size:14px; }
@media (min-width: 901px) { .sss-pdp-gallery-media { flex-direction: row; } .sss-pdp-thumbs { flex-direction: column; overflow-x: visible; overflow-y: auto; width: 90px; flex-shrink: 0; order: 1; max-height: 620px; } .sss-pdp-main-image { order: 2; flex: 1 1 300px; min-width: 0; width: auto; } }

/* Uncode charge son CSS en dernier et gagne sinon systématiquement contre nos règles
   d'espacement (gap, margin) sur ces conteneurs flex — d'où des éléments collés les uns aux
   autres malgré le gap déclaré ici. */
.sss-pdp-info { flex: 1 1 380px !important; min-width: 300px !important; position: sticky !important; top: 110px !important; display:flex !important; flex-direction:column !important; gap:20px !important; }
#sss-pdp-cart-form { display:flex !important; flex-direction:column !important; gap:20px !important; }
.sss-pdp-badge { display:inline-block; width:fit-content; background:#F4F4F1; border:1px solid #3B0510; color:#3B0510; font-size:10px; letter-spacing:0.08em; text-transform:uppercase; padding: 5px 12px; border-radius:2px; font-weight:700; }
.sss-pdp-title { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:34px; margin:0; }
.sss-pdp-price,
.sss-pdp-price ins,
.sss-pdp-price bdi,
.sss-pdp-price del { text-decoration:none !important; }
.sss-pdp-price { font-size:26px; font-weight:700; color:#3B0510; }
.sss-pdp-gallery-caption { font-size:12px; color:#9A8C88; line-height:1.5; margin:0; padding:0 2px; }

.sss-pdp-dispo-card, .sss-pdp-bonnet-card { border-radius:8px; padding:14px 16px; }
.sss-pdp-dispo-card { display:flex; flex-direction:column; gap:4px; }
.sss-pdp-dispo-title { display:flex; align-items:center; gap:8px; font-weight:700; font-size:14px; }
.sss-pdp-dispo-title .icon { font-size:14px; line-height:1; }
.sss-pdp-dispo-card p { margin:0; font-size:12.5px; line-height:1.5; opacity:0.85; }
.sss-pdp-dispo-ready { background:#E7EFE8; color:#22432B; }
.sss-pdp-dispo-preorder { background:#F4E9DC; color:#5C3D1B; }
.sss-pdp-bonnet-card { background:#F4F0EA; }
.sss-pdp-bonnet-title { display:block; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; opacity:0.65; margin-bottom:4px; }
.sss-pdp-bonnet-card p { margin:0; font-size:13.5px; font-weight:600; color:#221516; }

.sss-pdp-measure-link { border:none; background:transparent; padding:0; cursor:pointer; font-size:13px; color:#3B0510; text-decoration:underline; font-weight:600; text-align:left; }

.sss-measure-modal-bg { display:none; position:fixed; inset:0; z-index:300; background:rgba(43,38,32,0); align-items:center; justify-content:center; padding:24px; transition:background .25s ease; }
.sss-measure-modal-bg.open { display:flex; background:rgba(43,38,32,0.5); }
.sss-measure-modal { background:#F9F6F1; border-radius:16px; padding:32px; max-width:460px; width:100%; max-height:85vh; overflow-y:auto; box-shadow:0 20px 60px rgba(34,21,22,0.25); }
.sss-measure-modal-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; }
.sss-measure-modal-head h3 { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:22px; margin:0; color:#221516; }
.sss-measure-modal-head .sss-close-btn { flex-shrink:0; width:32px; height:32px; border-radius:50%; border:1px solid rgba(34,21,22,0.18); background:transparent; cursor:pointer; font-size:14px; color:#221516; }
.sss-measure-modal > p { font-size:14px; line-height:1.6; color:#3B322E; margin:0 0 20px; }
.sss-measure-table { background:#F1EAE1; border-radius:10px; overflow:hidden; margin-bottom:20px; }
.sss-measure-table-row { display:flex; justify-content:space-between; padding:12px 18px; font-size:14px; }
.sss-measure-table-row:not(:last-child) { border-bottom:1px solid rgba(34,21,22,0.08); }
.sss-measure-table-row span:first-child { font-weight:700; color:#221516; }
.sss-measure-table-row span:last-child { color:#5A4C48; }
.sss-measure-note { font-size:12.5px; color:#9A8C88; line-height:1.6; margin:0; padding-top:16px; border-top:1px solid rgba(34,21,22,0.08); }

.sss-pdp-install-cta {
	background:#221516; border-radius:16px; padding:28px; display:flex; flex-direction:column; gap:8px;
	position:relative; overflow:hidden;
}
.sss-pdp-install-cta::before {
	content:''; position:absolute; inset:0; pointer-events:none;
	background:radial-gradient(circle at 100% 0%, rgba(176,141,87,0.28), transparent 60%);
}
.sss-pdp-install-cta-title {
	font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:20px;
	color:#F4F4F1; position:relative;
}
.sss-pdp-install-cta p { margin:0 0 6px; font-size:13.5px; color:#D8CFC7; position:relative; }
.sss-pdp-install-cta-btn {
	align-self:flex-start; margin-top:4px; background:#F4F4F1; color:#221516; border:none;
	padding:14px 28px; border-radius:999px; font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase;
	font-weight:700; text-decoration:none; transition:background .2s, transform .2s; position:relative;
}
.sss-pdp-install-cta-btn:hover { background:#B08D57; color:#221516; transform:translateY(-1px); }

.sss-pdp-specs { display:flex; flex-direction:column; gap:6px; font-size:13px; }
.sss-pdp-specs-row { display:flex; justify-content:space-between; gap:12px; }
.sss-pdp-specs-row .label { opacity:0.65; }
.sss-pdp-specs-row .value { font-weight:600; }
.sss-pdp-variant-group { margin:0 !important; }
.sss-pdp-variant-label { font-size:12px; letter-spacing:0.08em; text-transform:uppercase; opacity:0.65; }
.sss-pdp-variant-options { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.sss-pdp-variant-btn { border:1px solid rgba(0,0,0,0.18); background:transparent; padding:9px 18px; border-radius:2px; font-size:13px; cursor:pointer; }
.sss-pdp-variant-btn.active { border:1px solid #221516; background:#221516; color:#F4F4F1; }
.sss-pdp-reassurance { display:flex !important; gap: 20px !important; flex-wrap:wrap; padding: 18px 0 !important; margin:0 !important; border-top: 1px solid rgba(0,0,0,0.08); border-bottom: 1px solid rgba(0,0,0,0.08); row-gap: 12px !important; }
.sss-pdp-reassurance-item { display:flex; align-items:center; gap:8px; font-size:12px; }
.sss-pdp-reassurance-item .icon { width:26px; height:26px; border-radius:50%; border:1px solid rgba(0,0,0,0.2); display:flex; align-items:center; justify-content:center; font-size:12px; }
.sss-pdp-actions-row { display:flex; gap:12px; align-items:center; }
.sss-qty-selector { display:flex; align-items:center; border:1px solid rgba(34,21,22,0.15); border-radius:999px; overflow:hidden; background:#FFFFFF; }
.sss-qty-btn { width:42px; height:54px; border:none; background:transparent; font-size:16px; cursor:pointer; color:#221516; }
.sss-qty-input {
	width:34px !important; height:54px !important; line-height:54px !important; padding:0 !important;
	margin:0 !important; border:none !important; box-sizing:border-box !important; text-align:center !important;
	font-size:14px !important; font-family:inherit !important; color:#221516 !important;
	background:transparent !important; vertical-align:middle !important; -moz-appearance:textfield;
}
.sss-qty-input::-webkit-inner-spin-button, .sss-qty-input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.sss-add-to-cart-btn { flex:1; background:#221516; color:#F4F4F1; border:none; padding:18px; border-radius:999px; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; font-weight:600; cursor:pointer; white-space:nowrap; transition: background .2s; }
.sss-add-to-cart-btn:hover:not(:disabled) { background:#3B0510; }
.sss-add-to-cart-btn:disabled { opacity:0.5; cursor:not-allowed; }

/* Conteneur commun à TOUTES les sections sous le haut de fiche produit (description, avis,
   produits liés) — mêmes marges gauche/droite que .sss-pdp-cols/.sss-breadcrumb (1200px, 24px de
   padding latéral), et un espacement vertical généreux et cohérent via une seule variable, pour
   éviter exactement le bug remonté : sections collées au bord de l'écran et enchaînées sans respiration. */
:root { --sss-pdp-section-gap: 90px; }
.sss-pdp-section { max-width: 1200px; margin: var(--sss-pdp-section-gap) auto 0; padding: 0 24px; }
.sss-pdp-section h2 { font-family: Georgia, 'Playfair Display', serif; font-weight:600; font-size:24px; margin: 0 0 24px; color:#221516; }
.sss-breadcrumb { margin-top: 32px; font-size: 13px; color: #7A7268; }
.sss-breadcrumb a { color: inherit; }

/* Description produit : accroche, puis prose, puis repères techniques en liste — plutôt qu'un
   unique pavé de texte uniforme et dense (issu d'un simple <br /> par ligne dans la fiche). */
.sss-pdp-description { max-width: 720px; }
.sss-pdp-desc-tagline {
	font-family: 'Bodoni Moda', 'Playfair Display', Georgia, serif; font-style: italic;
	font-weight: 500; font-size: 20px; color: #3B0510; margin: 0 0 18px; line-height: 1.4;
}
.sss-pdp-desc-prose { font-size: 15px; line-height: 1.75; color: #4A413C; margin: 0 0 22px; }
.sss-pdp-desc-facts {
	list-style: none; margin: 0 0 22px; padding: 20px 22px; background: #F9F6F1; border-radius: 12px;
	display: grid; grid-template-columns: 1fr 1fr; gap: 14px 28px;
}
.sss-pdp-desc-facts li { font-size: 13.5px; line-height: 1.55; color: #4A413C; padding-left: 20px; position: relative; }
.sss-pdp-desc-facts li::before {
	content: ''; position: absolute; left: 0; top: 7px; width: 7px; height: 7px; border-radius: 50%;
	background: #B08D57;
}
.sss-pdp-desc-facts li strong { display: block; color: #221516; font-weight: 600; margin-bottom: 2px; }
@media (max-width: 640px) { .sss-pdp-desc-facts { grid-template-columns: 1fr; } }

.sss-bundle-section { background:#E1DBD7; border-radius:2px; padding:28px 24px; display:flex; flex-direction:column; gap:18px; max-width:900px; margin: var(--sss-pdp-section-gap) auto 0; }
.sss-bundle-items { display:flex; gap:16px; flex-wrap:wrap; }
.sss-bundle-item { display:flex; align-items:center; gap:10px; background:#FFFFFF; border-radius:2px; padding:10px 14px; flex:1; min-width:200px; }
.sss-bundle-item img { width:44px; height:44px; border-radius:2px; object-fit:cover; }
.sss-bundle-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; border-top:1px solid rgba(0,0,0,0.08); padding-top:16px; }
.sss-bundle-cta { border:none; background:#3B0510; color:#F4F4F1; padding:13px 26px; border-radius:2px; font-size:13px; font-weight:700; cursor:pointer; }

.sss-related-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media (min-width: 600px) { .sss-related-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .sss-related-grid { grid-template-columns: repeat(4, 1fr); } }
/* Toujours de l'air avant le footer, que la dernière section de la fiche produit soit les avis
   ou les suggestions (selon qu'il y ait ou non des produits liés). */
.sss-reviews-section, .sss-related-section { padding-bottom: var(--sss-pdp-section-gap); }
.sss-related-item, .sss-related-item:hover, .sss-related-item:visited {
	text-decoration:none !important; color:inherit !important;
	display:flex; flex-direction:column; gap:10px; background:#FFFFFF; border-radius:2px; padding:14px;
	box-shadow:none; border:1px solid rgba(34,21,22,0.1);
}
.sss-related-item img { width:100%; aspect-ratio:3/4; border-radius:2px; object-fit:cover; }
.sss-related-item h4 {
	font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif !important; font-weight:600 !important;
	font-size:15px !important; margin:0 !important; color:#221516 !important; text-decoration:none !important;
}
.sss-related-item > span,
.sss-related-item > span ins,
.sss-related-item > span bdi,
.sss-related-item > span .woocommerce-Price-amount {
	font-family:'Jost', system-ui, sans-serif !important; font-size:14px !important; font-weight:600 !important;
	color:#3B0510 !important; text-decoration:none !important;
}
.sss-related-item > span del { color:#9A8C88 !important; font-weight:400 !important; text-decoration:line-through !important; margin-right:6px; }

.sss-review-item { border-bottom:1px solid rgba(0,0,0,0.08); padding-bottom:20px; display:flex; gap:16px; margin-bottom:22px; }
.sss-review-photo { width:72px; height:72px; border-radius:2px; object-fit:cover; flex-shrink:0; }
.sss-review-form-wrap { background:#F1EAE1; border-radius:20px; padding:32px; margin-top:8px; }
.sss-review-form-wrap h3 {
	font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:20px;
	color:#221516; margin:0 0 20px;
}
.sss-review-form { background:transparent; padding:0; display:flex; flex-direction:column; gap:14px; }
.sss-review-form textarea, .sss-review-form input[type="text"], .sss-review-form input[type="email"] {
	padding:14px 18px; border:1px solid rgba(34,21,22,0.15); border-radius:12px; font-family:inherit;
	font-size:14px; background:#FFFFFF;
}
.sss-review-form textarea { resize:vertical; min-height:110px; }
.sss-review-form label { font-size:13.5px; color:#5A4C48; }
.sss-star-picker { display:flex; gap:6px; font-size:26px; cursor:pointer; }
.sss-review-submit-btn {
	align-self:flex-start; border:none; background:#221516; color:#F4F4F1; padding:14px 30px;
	border-radius:999px; font-size:13px; font-weight:600; letter-spacing:0.02em; cursor:pointer;
	transition:background .2s;
}
.sss-review-submit-btn:hover { background:#3B0510; }

@media (max-width: 900px) { .sss-pdp-cols { flex-direction: column !important; } .sss-pdp-info { position: static !important; } }

/* ===== MINI-PANIER (TIROIR) ===== */
.sss-cart-toggle { position:fixed; z-index:79; width:48px; height:48px; border-radius:50%; border:1px solid rgba(0,0,0,0.12); background:#F4F4F1; color:#221516; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow: 0 6px 18px rgba(43,38,32,0.15); }
.sss-cart-toggle-top-right { top:20px; right:20px; }
.sss-cart-toggle-bottom-right { bottom:20px; right:20px; }
.sss-cart-badge { position:absolute; top:-6px; right:-6px; background:#3B0510; color:#FFFFFF; font-size:11px; min-width:18px; height:18px; border-radius:2px; display:flex; align-items:center; justify-content:center; padding:0 4px; }
.sss-cart-badge.sss-pop { animation: sssPop .4s cubic-bezier(.36,1.6,.6,1); }
@keyframes sssPop { 0% { transform: scale(1); } 40% { transform: scale(1.5); } 100% { transform: scale(1); } }

.sss-drawer-bg { display:flex; position:fixed; inset:0; z-index:200; background:rgba(43,38,32,0); justify-content:flex-end; pointer-events:none; transition: background .3s ease; }
.sss-drawer-bg.open { background:rgba(43,38,32,0.45); pointer-events:auto; }
.sss-drawer-panel { width:420px; max-width:100vw; background:#F4F4F1; height:100%; display:flex; flex-direction:column; box-shadow:-8px 0 30px rgba(43,38,32,0.2); transform: translateX(100%); transition: transform .35s cubic-bezier(.22,.9,.35,1); }
.sss-drawer-bg.open .sss-drawer-panel { transform: translateX(0); }
.sss-drawer-head { display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:1px solid rgba(0,0,0,0.08); }
.sss-drawer-title { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:18px; }
.sss-drawer-empty { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:32px; text-align:center; }
.sss-drawer-empty-subtitle { font-size:14px; opacity:0.7; }
.sss-drawer-shop-link { border:1px solid #3B0510; color:#221516; padding:10px 24px; border-radius:2px; font-size:13px; }
.sss-drawer-items { flex:1; overflow-y:auto; padding:16px 22px; display:flex; flex-direction:column; gap:16px; }
.sss-drawer-item { display:flex; gap:12px; }
.sss-drawer-item-img { width:64px; height:80px; border-radius:2px; object-fit:cover; object-position:top center; flex-shrink:0; }
.sss-drawer-item-info { flex:1; display:flex; flex-direction:column; gap:4px; }
.sss-drawer-item-name { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif; font-weight:600; font-size:14px; }
.sss-drawer-item-variant { font-size:12px; opacity:0.7; }
.sss-drawer-item-price { font-size:13px; color:#3B0510; font-weight:700; }
.sss-drawer-item-actions { display:flex; align-items:center; gap:10px; margin-top:4px; }
.sss-drawer-qty { display:flex; align-items:center; border:1px solid rgba(0,0,0,0.18); border-radius:2px; overflow:hidden; }
.sss-drawer-qty-btn { width:26px; height:26px; border:none; background:transparent; font-size:14px; cursor:pointer; }
.sss-drawer-qty-val { min-width:20px; text-align:center; font-size:12px; }
.sss-drawer-remove { margin-left:8px; border:none; background:transparent; opacity:0.6; cursor:pointer; font-size:12px; text-decoration:underline; padding:0; }
.sss-drawer-item-booking .sss-drawer-remove { margin-left:0; }
.sss-drawer-booking-icon { width:64px; height:80px; border-radius:2px; background:#E1DBD7; color:#3B0510; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.sss-drawer-booking-services { font-size:13px; color:#221516; }
.sss-drawer-booking-when { font-size:12px; opacity:0.7; }
.sss-drawer-bundle { margin:0 22px 16px; background:#E1DBD7; border-radius:2px; padding:14px 16px; display:flex; flex-direction:column; gap:8px; }
.sss-drawer-bundle-title { font-size:13px; font-weight:700; }
.sss-drawer-bundle-item { display:flex; align-items:center; gap:10px; background:#FFFFFF; border-radius:2px; padding:8px 10px; }
.sss-drawer-bundle-item img { width:40px; height:40px; border-radius:2px; object-fit:cover; flex-shrink:0; }
.sss-drawer-bundle-item-info { flex:1; display:flex; flex-direction:column; font-size:12px; }
.sss-drawer-bundle-add { border:1px solid #3B0510; background:transparent; color:#221516; padding:7px 14px; border-radius:2px; font-size:12px; cursor:pointer; flex-shrink:0; }
.sss-drawer-footer { padding:18px 22px; border-top:1px solid rgba(0,0,0,0.08); display:flex; flex-direction:column; gap:10px; }
.sss-drawer-subtotal { display:flex; justify-content:space-between; font-size:15px; font-weight:700; }
.sss-drawer-note { font-size:11px; opacity:0.65; }
.sss-drawer-checkout-btn { text-align:center; background:#221516; color:#F4F4F1; padding:15px; border-radius:2px; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; font-weight:600; margin-top:8px; transition: background .2s; }
.sss-drawer-checkout-btn:hover { background:#3B0510; }
.sss-drawer-view-cart { text-align:center; font-size:12px; color:#3B0510; }

.sss-pulse { transform: scale(0.97); }
.sss-added { background:#221516 !important; }

/* ===== PAGE PANIER / CHECKOUT WOOCOMMERCE PAR DÉFAUT (mise en forme uniquement) ===== */
.woocommerce-cart table.cart, .woocommerce-checkout table.cart { border-radius:2px; overflow:hidden; }
.woocommerce table.shop_table { border: none; }
.woocommerce table.shop_table th { border-bottom: 1px solid rgba(0,0,0,0.08); opacity:0.7; font-size:12px; text-transform:uppercase; letter-spacing:0.08em; }
.woocommerce table.shop_table td { border-top: 1px solid rgba(0,0,0,0.08); }
.woocommerce #payment, .woocommerce-checkout-review-order { background:#FFFFFF; border-radius:2px; padding:24px; box-shadow:none; border:1px solid rgba(34,21,22,0.1) !important; }
.woocommerce #payment #place_order, .woocommerce-cart .checkout-button { width:100%; background:#221516 !important; color:#F4F4F1 !important; border:none !important; padding:18px !important; border-radius:2px !important; font-size:12px !important; letter-spacing:0.08em !important; text-transform:uppercase !important; font-weight:600 !important; }

/* ===== FIDÉLITÉ ===== */
.sss-loyalty-widget { background:#E1DBD7; border-radius:2px; padding:12px 16px; margin:0 22px 16px; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; font-size:13px; }
.sss-loyalty-apply-btn { border:1px solid #3B0510; background:transparent; color:#221516; padding:7px 16px; border-radius:2px; font-size:12px; cursor:pointer; }
.sss-loyalty-remove-btn { border:none; background:transparent; color:#3B0510; font-size:12px; text-decoration:underline; cursor:pointer; }
.sss-loyalty-progress { font-size:12px; opacity:0.7; margin:0 22px 16px; }
.sss-loyalty-balance-card { background:#221516; color:#F4F4F1; border-radius:2px; padding:28px 26px; margin-bottom:28px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.sss-loyalty-balance-label { font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:#F4F4F1; }
.sss-loyalty-balance-value { font-weight:600; font-size:34px; margin-top:4px; }
.sss-loyalty-balance-rate { font-size:13px; color:#F4F4F1; max-width:260px; }

/* ===== ESPACE CLIENT ===== */
.sss-account-empty { font-size:14px; opacity:0.7; }
.sss-account-list { display:flex; flex-direction:column; gap:12px; }
.sss-account-card { background:#FFFFFF; border-radius:2px; padding:16px 18px; box-shadow:none; border:1px solid rgba(34,21,22,0.1); display:flex; flex-direction:column; gap:6px; }
.sss-account-card-top { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.sss-account-card-title { font-weight:700; }
.sss-account-card-meta { font-size:12px; opacity:0.65; }
.sss-account-status { font-size:11px; padding:4px 10px; border-radius:2px; font-weight:700; }
.sss-status-ok { background:rgba(74,122,94,0.12); color:#221516; }
.sss-status-pending { background:rgba(201,162,39,0.15); color:#3B0510; }
.sss-status-muted { background:rgba(166,155,140,0.15); color:#9A8C88; }
.sss-status-done { background:rgba(138,106,82,0.15); color:#3B0510; }
.sss-negative { font-weight:700; color:#3B0510; }
.sss-positive { font-weight:700; color:#221516; }
.sss-account-rating { color:#3B0510; font-size:13px; }
