/*
 * CRYOFAST PLUNGE — woocommerce.css
 * Habillage WooCommerce : notices, archive, single product v2 « ultra premium »,
 * blocs Flexible Content Apple-style enrichis, carrousel produits liés, fade-in.
 *
 * Le mini-cart drawer + checkout viendront à l'étape 11.
 *
 * Snazzy Digital Agency.
 */

/* =====================================================================
 * Mini-cart drawer — §11.1 du cahier des charges.
 * Tiroir glissant depuis la droite, AJAX cart fragments WooCommerce.
 * ===================================================================== */

.cf-cart-overlay {
	position: fixed;
	inset: 0;
	background: rgba(20, 18, 16, .45);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	z-index: 998;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s cubic-bezier(.4, 0, .2, 1);
}
.cf-cart-overlay.is-visible {
	opacity: 1;
	pointer-events: auto;
}

.cf-cart-drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(92vw, 460px);
	background: var(--cream);
	z-index: 999;
	transform: translateX(100%);
	transition: transform .35s cubic-bezier(.4, 0, .2, 1);
	display: flex;
	flex-direction: column;
	box-shadow: -20px 0 60px rgba(20, 18, 16, .18);
	overflow: hidden;
}
.cf-cart-drawer.is-open { transform: translateX(0); }

.cf-cart-head {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 22px;
	border-bottom: 1px solid var(--bsand);
	background: var(--cream);
	position: relative;
	z-index: 5;
	min-height: 72px;
	/* Ombre douce vers le bas pour bien démarquer la barre quand le
	   contenu items scrolle juste dessous. */
	box-shadow: 0 1px 0 var(--bsand), 0 6px 14px -10px rgba(20, 18, 16, .12);
}
.cf-cart-title {
	font-family: var(--font-titles);
	font-size: 22px;
	font-weight: 400;
	letter-spacing: -.2px;
	color: var(--charcoal);
	margin: 0;
}
.cf-cart-close {
	background: none;
	border: none;
	cursor: pointer;
	color: var(--charcoal);
	padding: 8px;
	border-radius: var(--btn-radius);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background .15s;
	min-height: 40px;
	min-width: 40px;
}
.cf-cart-close:hover { background: var(--sand); }

/* La zone scrollable contient les items + le footer. La liste prend uniquement
   la hauteur de son contenu (pas de flex-grow), et le footer reste sticky en
   bas de la zone visible quand le panier déborde — sinon il suit naturellement
   les items, sans vide énorme au milieu. */
.cf-cart-scroll {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 0 !important;
	margin: 0 !important;
}
.cf-cart-body,
.cf-cart-scroll .widget_shopping_cart_content {
	display: block !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* --- Liste des items ---------------------------------------------------
   La liste a plusieurs classes potentielles selon le contexte
   (woocommerce-mini-cart, cart_list, product_list_widget). Toutes peuvent
   se voir appliquer des padding/margin par les CSS natives WC ou par
   d'autres plugins. On force ici un padding-top large (36px) avec
   !important pour garantir que le 1er item reste pleinement visible
   sous la barre de titre du drawer, sur tous les rendus. */
.cf-cart-scroll .cf-cart-items,
.cf-cart-scroll ul.cf-cart-items,
.cf-cart-scroll ul.woocommerce-mini-cart,
.cf-cart-scroll ul.cart_list,
.cf-cart-scroll ul.product_list_widget {
	list-style: none !important;
	margin: 0 !important;
	padding: 36px 0 12px !important;
}
/* Garde aussi un scroll-margin-top large pour les ancres/focus
   (clavier qui scrolle vers un item). */
.cf-cart-item { scroll-margin-top: 80px; }
.cf-cart-item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 16px 22px;
	border-bottom: 1px solid var(--bsand);
	position: relative;
}
.cf-cart-item-thumb {
	flex-shrink: 0;
	width: 72px;
	height: 88px;
	border-radius: 6px;
	overflow: hidden;
	background: var(--sand2);
	border: 1px solid var(--bsand);
	display: block;
}
.cf-cart-item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.cf-cart-item-body {
	flex: 1;
	min-width: 0;
	padding-right: 24px;
}
.cf-cart-item-name {
	display: block;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	color: var(--charcoal);
	line-height: 1.3;
	margin-bottom: 6px;
}
.cf-cart-item-name:hover { color: var(--navy); }
.cf-cart-item-body .variation,
.cf-cart-item-body .wc-item-meta {
	margin: 4px 0;
	padding: 0;
	list-style: none;
	font-size: 11px;
	color: var(--taupe);
}
.cf-cart-item-body .variation dt,
.cf-cart-item-body .variation dd,
.cf-cart-item-body .wc-item-meta dt,
.cf-cart-item-body .wc-item-meta dd {
	display: inline;
	margin: 0;
}
.cf-cart-item-body .variation dt::after { content: ' : '; }
.cf-cart-item-meta { margin-top: 6px; }
.cf-cart-item-qty {
	font-size: 13px;
	font-weight: 600;
	color: var(--navy);
	font-family: var(--font-titles);
	letter-spacing: .2px;
}
.cf-cart-item-remove {
	position: absolute;
	top: 14px;
	right: 18px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--white);
	border: 1px solid var(--bsand);
	color: var(--taupe);
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 400;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	text-decoration: none;
	transition: background .15s, color .15s, border-color .15s;
}
.cf-cart-item-remove:hover {
	background: var(--charcoal);
	color: #fff;
	border-color: var(--charcoal);
}

/* --- Footer (subtotal + buttons) — sticky bottom du scroll ------------- */
.cf-cart-footer {
	position: sticky;
	bottom: 0;
	padding: 18px 22px 22px;
	border-top: 1px solid var(--bsand);
	background: var(--white);
	display: flex;
	flex-direction: column;
	gap: 12px;
	z-index: 1;
}
.cf-cart-subtotal {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	padding-bottom: 4px;
}
.cf-cart-subtotal-label {
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--taupe);
}
.cf-cart-subtotal-amount {
	font-family: var(--font-titles);
	font-size: 24px;
	font-weight: 500;
	color: var(--charcoal);
	line-height: 1;
}
.cf-cart-subtotal-amount .woocommerce-Price-currencySymbol { font-weight: 400; }
.cf-cart-buttons {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.cf-cart-buttons .btn {
	display: block;
	text-align: center;
	font-size: 13px;
	letter-spacing: .4px;
	padding: 14px 18px;
	width: 100%;
}
/* Voir le panier — secondaire mais lisible (fond crème + border charcoal). */
.cf-cart-buttons .cf-cart-btn-view {
	background: var(--cream);
	color: var(--charcoal);
	border: 1px solid rgba(44, 42, 39, .35);
}
.cf-cart-buttons .cf-cart-btn-view:hover {
	background: var(--sand);
	border-color: var(--charcoal);
}
.cf-cart-buttons .cf-cart-btn-checkout {
	font-weight: 700;
	letter-spacing: .8px;
	text-transform: uppercase;
}

/* --- Panier vide -------------------------------------------------------- */
.cf-cart-empty {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 40px 28px;
	text-align: center;
}
.cf-cart-empty svg { color: var(--taupe); margin-bottom: 18px; opacity: .6; }
.cf-cart-empty-title {
	font-family: var(--font-titles);
	font-size: 22px;
	font-weight: 400;
	color: var(--charcoal);
	margin: 0 0 6px;
}
.cf-cart-empty-text {
	font-size: 12px;
	color: var(--warm-gray);
	line-height: 1.6;
	margin: 0 0 22px;
	max-width: 280px;
}

/* --- Loading state du bouton add-to-cart -------------------------------- */
button.single_add_to_cart_button.loading {
	opacity: .6;
	cursor: wait;
	pointer-events: none;
}

/* --- Body scroll lock pendant l'ouverture du drawer -------------------- */
body.cf-cart-locked { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
	.cf-cart-drawer, .cf-cart-overlay { transition: none !important; }
}

/* =====================================================================
 * Auto-rendu WC sur pages spéciales — wrapper article.
 * Gutenberg étant désactivé sur les pages, l'auto-rendu (inc/wc-page-
 * rendering.php) injecte le shortcode WC dans the_content(). L'article
 * wrapper reste minimal pour ne pas dupliquer paddings et backgrounds.
 * ===================================================================== */

.cf-wc-page {
	background: var(--white);
	margin: 0;
	padding: 0;
}
.cf-wc-page > .entry-content {
	margin: 0;
	padding: 0;
	max-width: none;
}

/* Page « Mon compte » WC — padding header + max-width centré. */
body.woocommerce-account .site-main {
	padding-top: calc(var(--header-height) + 28px);
}
.cf-wc-page .woocommerce-account,
.cf-wc-page .woocommerce-MyAccount-navigation,
.cf-wc-page .woocommerce-MyAccount-content {
	font-family: var(--font-body);
}
.cf-wc-page .woocommerce-account {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 clamp(20px, 5vw, 72px) clamp(40px, 5vw, 80px);
}
.cf-wc-page .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 4px;
}
.cf-wc-page .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 12px 16px;
	border-radius: var(--btn-radius);
	border: 1px solid var(--bsand);
	background: var(--white);
	color: var(--charcoal);
	font-size: 13px;
	font-weight: 500;
	transition: border-color .15s, background .15s;
}
.cf-wc-page .woocommerce-MyAccount-navigation li a:hover,
.cf-wc-page .woocommerce-MyAccount-navigation li.is-active a {
	border-color: var(--navy);
	background: rgba(27, 63, 114, .04);
}

/* Page RDV (slug prendre-rendez-vous ou autre) — padding header + centrage. */
.cf-wc-page > .entry-content > .cf-rdv,
.cf-wc-page .cf-rdv:first-child {
	padding-top: calc(var(--header-height) + 28px);
	padding-bottom: clamp(40px, 5vw, 80px);
	padding-left: clamp(20px, 5vw, 72px);
	padding-right: clamp(20px, 5vw, 72px);
	max-width: 860px;
	margin: 0 auto;
}

/* =====================================================================
 * Notices WooCommerce.
 * ===================================================================== */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error {
	background: var(--white);
	border: 1px solid var(--bsand);
	border-left: 3px solid var(--navy);
	border-radius: 4px;
	padding: 14px 20px;
	font-size: 13px;
	color: var(--charcoal);
	margin: 0 0 18px;
}
.woocommerce-notices-wrapper .woocommerce-error { border-left-color: #B43F2E; }

/* =====================================================================
 * Archive produits.
 * ===================================================================== */
.cf-shop-archive { padding-top: calc(var(--header-height) + 28px); }
.cf-shop-archive-header { max-width: 720px; margin-bottom: 18px; }
.cf-shop-archive-header h1 {
	font-family: var(--font-titles);
	font-size: clamp(34px, 3.4vw, 50px);
	font-weight: 400;
	line-height: 1.06;
	letter-spacing: -.4px;
	margin: 6px 0 0;
}
.cf-shop-grid { margin-top: 24px; }

.woocommerce-result-count,
.woocommerce-ordering { display: inline-block; font-size: 11px; color: var(--warm-gray); margin: 8px 0; }
.woocommerce-ordering { float: right; }
.woocommerce-ordering select {
	font-family: var(--font-body);
	font-size: 12px;
	border: 1px solid var(--bsand);
	border-radius: 4px;
	padding: 6px 10px;
	background: var(--white);
	color: var(--charcoal);
}

.cf-shop-pagination { margin-top: 36px; text-align: center; }
.cf-shop-pagination .woocommerce-pagination ul { display: inline-flex; list-style: none; gap: 6px; padding: 0; }
.cf-shop-pagination .woocommerce-pagination li a,
.cf-shop-pagination .woocommerce-pagination li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 34px;
	height: 34px;
	padding: 0 10px;
	border: 1px solid var(--bsand);
	border-radius: 4px;
	font-size: 12px;
	font-weight: 500;
	color: var(--charcoal);
	background: var(--white);
}
.cf-shop-pagination .woocommerce-pagination li span.current {
	background: var(--navy);
	color: #fff;
	border-color: var(--navy);
}
.cf-shop-pagination .woocommerce-pagination li a:hover { border-color: var(--charcoal); }

/* =====================================================================
 * Single product — fiche produit définitive (maquette cryofast_flex_page).
 * Reproduction strict de la maquette, hauteur du .ph réduite (70vh au lieu
 * de 88vh, jugée trop imposante à l'arrivée sur la page).
 * ===================================================================== */

/* Breadcrumb */
.bc {
	padding: calc(var(--header-height) + 18px) clamp(20px, 5vw, 64px) 0;
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	color: var(--taupe);
}
.bc a { color: var(--taupe); transition: color .14s; }
.bc a:hover { color: var(--charcoal); }
.bc-sep { opacity: .4; }

/* HERO produit : grid 55% / 1fr, hauteur ajustée (min 580px, plancher modeste). */
.ph {
	display: grid;
	grid-template-columns: 55% 1fr;
	min-height: 70vh;
}
.ph[data-min-height="hard-580"] { min-height: 580px; }

/* Galerie */
.ph-gal {
	position: relative;
	background: var(--sand);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.ph-main {
	flex: 1;
	overflow: hidden;
	position: relative;
	min-height: 360px;
}
.ph-main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	transition: opacity .3s;
}
.ph-badge {
	position: absolute;
	top: 20px;
	left: 20px;
	background: var(--charcoal);
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	padding: 5px 12px;
	border-radius: 3px;
	z-index: 2;
}
.ph-thumbs {
	display: flex;
	gap: 6px;
	padding: 12px 16px;
	background: rgba(237, 232, 225, .9);
	border-top: 1px solid var(--bsand);
	overflow-x: auto;
	scrollbar-width: none;
}
.ph-thumbs::-webkit-scrollbar { display: none; }
.pht {
	width: 56px;
	height: 44px;
	border-radius: 4px;
	overflow: hidden;
	cursor: pointer;
	border: 2px solid transparent;
	transition: border-color .15s;
	flex-shrink: 0;
	padding: 0;
	background: none;
	position: relative;
}
.pht img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pht.on,
.pht:hover { border-color: var(--charcoal); }
.pht-video-badge {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(20, 18, 16, .35);
	color: #fff;
	font-size: 11px;
}

/* Info achat à droite */
.ph-info {
	background: var(--white);
	padding: 28px 32px 24px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	overflow-y: auto;
}
.p-lbl {
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 2.5px;
	text-transform: uppercase;
	color: var(--taupe);
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.p-lbl::before { content: ''; width: 12px; height: 1px; background: var(--taupe); }
.p-name {
	font-family: var(--font-titles);
	font-size: clamp(38px, 4.6vw, 60px);
	font-weight: 300;
	line-height: .98;
	letter-spacing: -.5px;
	margin: 0 0 10px;
	color: var(--charcoal);
}
.p-name em { font-style: italic; }
.p-tagline {
	font-size: 13px;
	color: var(--warm-gray);
	font-weight: 300;
	margin-bottom: 20px;
	line-height: 1.6;
	border-left: 2px solid var(--bsand);
	padding-left: 12px;
}
.p-tagline strong { color: var(--charcoal); font-weight: 500; font-style: italic; }

/* Prix */
.p-price-box {
	margin-bottom: 14px;
	padding: 16px 18px;
	background: var(--sand);
	border-radius: 6px;
	border: 1px solid var(--bsand);
}
.p-price {
	font-family: var(--font-titles);
	font-size: 44px;
	font-weight: 500;
	color: var(--charcoal);
	line-height: 1;
}
.p-price del { color: var(--taupe); font-size: 24px; margin-right: 10px; }
.p-price ins { text-decoration: none; }
.p-price-vat { font-size: 10px; color: var(--taupe); margin-top: 2px; letter-spacing: .3px; }
.p-finance-row {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--bsand);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}
.p-finance-lbl { font-size: 11px; color: var(--warm-gray); }
.p-finance-amt { font-size: 15px; font-weight: 700; color: var(--navy); white-space: nowrap; }

/* Variantes (variations WC) */
.p-var-lbl {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: var(--charcoal);
	margin-bottom: 8px;
}
.p-vars {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 18px;
}
.pv {
	padding: 11px 14px;
	border-radius: 5px;
	border: 1px solid var(--bsand);
	font-size: 13px;
	cursor: pointer;
	transition: border-color .15s, background .15s;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	background: var(--white);
	text-align: left;
	font-family: var(--font-body);
	color: var(--charcoal);
}
.pv:hover,
.pv.on { border-color: var(--navy); background: rgba(27, 63, 114, .04); }
.pv-name { font-weight: 500; }
.pv-price { font-size: 12px; color: var(--navy); font-weight: 600; }

/* Variations natives WC : on cache la table générée par WC UNIQUEMENT si
   notre sélecteur custom .p-vars prend le relais (classe cf-pdp-has-custom-vars
   posée par le template quand $wc_variations est rempli côté PHP).

   Pour les produits variable où le mapping custom n'est pas possible (Edge,
   etc.), WC garde son rendu natif → on le restyle pour qu'il reste lisible. */
.cf-pdp-has-custom-vars form.cart .variations,
.cf-pdp-has-custom-vars form.cart .single_variation { display: none; }
.cf-pdp .woocommerce-variation-add-to-cart { display: block; }

/* Restyle de la table WC native quand on l'expose (fallback Edge & co). */
.cf-pdp form.cart .variations {
	width: 100%;
	margin-bottom: 14px;
	border-collapse: collapse;
}
.cf-pdp form.cart .variations th,
.cf-pdp form.cart .variations td {
	padding: 6px 0;
	font-family: var(--font-body);
	font-size: 13px;
	color: var(--charcoal);
	vertical-align: middle;
	border: none;
}
.cf-pdp form.cart .variations th {
	font-weight: 700;
	letter-spacing: .8px;
	text-transform: uppercase;
	font-size: 10px;
	color: var(--charcoal);
	width: 110px;
}
.cf-pdp form.cart .variations select {
	width: 100%;
	font-family: var(--font-body);
	font-size: 13px;
	border: 1px solid var(--bsand);
	border-radius: 5px;
	padding: 11px 14px;
	background: var(--white);
	color: var(--charcoal);
}
.cf-pdp form.cart .reset_variations {
	display: inline-block;
	font-size: 11px;
	color: var(--taupe);
	margin-top: 6px;
}
.cf-pdp form.cart .single_variation_wrap .woocommerce-variation-price { margin: 8px 0; }
.cf-pdp form.cart .single_variation_wrap .woocommerce-variation-availability { font-size: 11px; color: var(--warm-gray); }

/* CTAs */
.p-ctas {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 14px;
}

/* Bouton « Ajouter au panier » WC : restyle complet avec specificity forte
   pour battre les défauts du plugin (qui peut hériter d'un violet vif si le
   thème courant ou un plugin tiers redéfinit la couleur de base).
   Couvre toutes les variantes : single_add_to_cart_button, button.alt,
   add_to_cart_button, et le bouton générique du form.cart. */
body.single-product .cf-pdp form.cart button.single_add_to_cart_button,
body.single-product .cf-pdp form.cart button[name="add-to-cart"],
body.single-product .cf-pdp form.cart .button.alt,
body.single-product .cf-pdp button.add_to_cart_button,
.cf-pdp form.cart button.single_add_to_cart_button,
.cf-pdp form.cart button.button,
.cf-pdp form.cart .single_add_to_cart_button {
	background: var(--navy) !important;
	background-color: var(--navy) !important;
	background-image: none !important;
	color: #fff !important;
	border: none !important;
	border-radius: 5px !important;
	padding: 15px 20px !important;
	font-family: var(--font-body) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	letter-spacing: .2px !important;
	text-transform: none !important;
	text-shadow: none !important;
	text-align: center !important;
	white-space: normal !important;
	line-height: 1.25 !important;
	min-height: 48px !important;
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
	box-sizing: border-box !important;
	box-shadow: 0 1px 0 rgba(44, 42, 39, .04), 0 4px 14px rgba(27, 63, 114, .14) !important;
	transition: background .15s, transform .15s, box-shadow .15s !important;
	cursor: pointer !important;
	float: none !important;
	margin: 0 !important;
}
body.single-product .cf-pdp form.cart button.single_add_to_cart_button:hover,
body.single-product .cf-pdp form.cart .button.alt:hover,
.cf-pdp form.cart button.single_add_to_cart_button:hover,
.cf-pdp form.cart button.button:hover {
	background: var(--navy-d) !important;
	background-color: var(--navy-d) !important;
	color: #fff !important;
	transform: translateY(-1px);
	box-shadow: 0 1px 0 rgba(44, 42, 39, .04), 0 8px 20px rgba(27, 63, 114, .22) !important;
}
body.single-product .cf-pdp form.cart button.single_add_to_cart_button.disabled,
body.single-product .cf-pdp form.cart button.single_add_to_cart_button:disabled,
.cf-pdp form.cart button.single_add_to_cart_button.disabled,
.cf-pdp form.cart button.single_add_to_cart_button:disabled {
	opacity: .5 !important;
	cursor: not-allowed !important;
	transform: none !important;
	box-shadow: none !important;
}
body.single-product .cf-pdp form.cart button.single_add_to_cart_button.loading,
.cf-pdp form.cart button.single_add_to_cart_button.loading {
	opacity: .65 !important;
	cursor: wait !important;
}
/* Structure du form.cart dans .p-ctas : flex column, full-width, marges
   reset. La quantité est cachée globalement (la valeur 1 reste soumise via
   l'input hidden). Couvre simples + variables + groupés. */
.cf-pdp .p-ctas form.cart,
body.single-product .cf-pdp .p-ctas form.cart {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}
.cf-pdp form.cart .quantity,
body.single-product .cf-pdp form.cart .quantity,
.cf-pdp form.cart .qty-wrapper,
.cf-pdp form.cart .quantity input[type="number"],
.cf-pdp form.cart .quantity input.qty {
	display: none !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}
/* Le wrapper variation_add_to_cart de WC : flex column, plein largeur. */
.cf-pdp form.cart .woocommerce-variation-add-to-cart,
body.single-product .cf-pdp form.cart .woocommerce-variation-add-to-cart {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	gap: 8px !important;
	margin: 0 !important;
	padding: 0 !important;
}
/* Bloc variation_wrap : largeur totale, pas de contrainte. */
.cf-pdp form.cart .single_variation_wrap,
body.single-product .cf-pdp form.cart .single_variation_wrap {
	width: 100% !important;
	display: block !important;
}
.cf-pdp form.cart .single_variation {
	margin: 0 0 8px !important;
}
/* Message de variation requise (« veuillez choisir une option ») — sobre. */
.cf-pdp form.cart .stock,
.cf-pdp form.cart .woocommerce-variation-availability {
	font-size: 11px !important;
	color: var(--warm-gray) !important;
	font-weight: 400 !important;
	margin: 4px 0 !important;
}

/* Prix dans .p-price-box : forcer typo Cormorant 44px partout, même
   à l'intérieur des spans WC (woocommerce-Price-amount, bdi, ins, del). */
.p-price-box .p-price,
.p-price-box .p-price .woocommerce-Price-amount,
.p-price-box .p-price .woocommerce-Price-amount bdi,
.p-price-box .p-price ins,
.p-price-box .p-price ins .woocommerce-Price-amount,
.p-price-box .p-price ins bdi {
	font-family: var(--font-titles) !important;
	font-size: 44px !important;
	font-weight: 500 !important;
	color: var(--charcoal) !important;
	line-height: 1 !important;
	text-decoration: none !important;
	background: transparent !important;
}
.p-price-box .p-price del,
.p-price-box .p-price del .woocommerce-Price-amount {
	color: var(--taupe) !important;
	font-size: 24px !important;
	font-weight: 400 !important;
	margin-right: 10px !important;
	text-decoration: line-through !important;
}
.p-price-box .p-price .woocommerce-Price-currencySymbol {
	font-weight: 400 !important;
}

.btn-buy {
	background: var(--navy);
	color: #fff;
	padding: 14px;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 700;
	border: none;
	cursor: pointer;
	font-family: var(--font-body);
	transition: background .15s, transform .15s, box-shadow .15s;
	text-align: center;
	display: block;
	width: 100%;
	letter-spacing: .2px;
	box-shadow: 0 1px 0 rgba(44, 42, 39, .04), 0 4px 14px rgba(27, 63, 114, .14);
}
.btn-buy:hover { background: var(--navy-d); transform: translateY(-1px); box-shadow: 0 1px 0 rgba(44, 42, 39, .04), 0 8px 20px rgba(27, 63, 114, .22); }
.btn-buy.loading { opacity: .6; cursor: wait; pointer-events: none; }
.btn-fin {
	background: transparent;
	color: var(--charcoal);
	border: 1px solid rgba(44, 42, 39, .25);
	padding: 12px;
	border-radius: 5px;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	font-family: var(--font-body);
	transition: border-color .15s, background .15s;
	text-align: center;
	display: block;
	width: 100%;
}
.btn-fin:hover { border-color: var(--charcoal); background: var(--sand); }
.btn-rdv {
	background: transparent;
	color: var(--charcoal);
	border: 1px solid rgba(44, 42, 39, .25);
	padding: 11px;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 500;
	cursor: pointer;
	font-family: var(--font-body);
	transition: border-color .15s, background .15s;
	text-align: center;
	display: block;
	width: 100%;
	letter-spacing: .4px;
}
.btn-rdv:hover { border-color: var(--charcoal); background: var(--sand); }
.p-wa { text-align: center; font-size: 11px; color: var(--taupe); padding: 4px 0 6px; }
.p-wa a { color: var(--charcoal); font-weight: 600; }

/* Réassurance */
.p-re {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 14px 0;
	border-top: 1px solid var(--bsand);
}
.pre-item {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 11px;
	color: var(--warm-gray);
	line-height: 1.5;
}
.pre-icon { color: var(--navy); font-size: 12px; margin-top: 1px; flex-shrink: 0; }

/* Specs rapides */
.p-specs {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--bsand);
}
.p-specs-lbl {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: var(--taupe);
	margin-bottom: 8px;
}
.p-specs-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5px;
}
.psg {
	background: var(--sand);
	border-radius: 4px;
	padding: 8px 10px;
}
.psg-v { font-size: 13px; font-weight: 600; color: var(--charcoal); }
.psg-k { font-size: 9px; color: var(--taupe); margin-top: 1px; letter-spacing: .3px; }

/* Sections sous le hero */
.cf-pdp-section { padding: clamp(36px, 4vw, 60px) clamp(20px, 5vw, 52px); }
.cf-pdp-section h2 {
	font-family: var(--font-titles);
	font-size: clamp(26px, 2.6vw, 38px);
	font-weight: 400;
	line-height: 1.06;
	letter-spacing: -.3px;
	margin-bottom: 8px;
}
.cf-pdp-section h2 em { font-style: italic; }
.cf-pdp-section .body-t {
	font-size: 13px;
	color: var(--warm-gray);
	line-height: 1.75;
	font-weight: 300;
}

/* Performance — 2 colonnes texte / visuel */
.cf-pdp-perf .two-col,
.cf-pdp-conception .two-col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(28px, 4vw, 56px);
	align-items: center;
	max-width: 1280px;
	margin: 0 auto;
}
.cf-pdp-perf .vis,
.cf-pdp-conception .vis {
	border-radius: 10px;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	background: var(--sand);
	border: 1px solid var(--bsand);
}
.cf-pdp-perf .vis img,
.cf-pdp-conception .vis img,
.cf-pdp-perf .vis video,
.cf-pdp-conception .vis video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Conception — feature list numérotée */
.feat-list { display: flex; flex-direction: column; }
.fr {
	display: flex;
	gap: 14px;
	padding: 12px 0;
	border-bottom: 1px solid var(--bsand);
}
.fr:first-child { padding-top: 0; }
.fr-n {
	font-family: var(--font-titles);
	font-size: 12px;
	color: var(--taupe);
	letter-spacing: 1px;
	min-width: 22px;
	padding-top: 1px;
}
.fr-t {
	font-size: 14px;
	font-weight: 600;
	color: var(--charcoal);
	margin-bottom: 4px;
}
.fr-b {
	font-size: 12px;
	color: var(--warm-gray);
	line-height: 1.65;
	font-weight: 300;
}

/* Inclus — grid 4 cartes */
.inc-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
	margin-top: 18px;
}
.inc {
	background: var(--white);
	border: 1px solid var(--bsand);
	border-radius: 8px;
	padding: 16px 16px;
}
.inc-ico { font-size: 22px; margin-bottom: 10px; }
.inc-t {
	font-size: 14px;
	font-weight: 600;
	color: var(--charcoal);
	margin-bottom: 4px;
}
.inc-b {
	font-size: 12px;
	color: var(--warm-gray);
	line-height: 1.55;
	font-weight: 300;
}

/* Fiche technique */
.specs-wrap {
	margin-top: 18px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	border-radius: 7px;
	overflow: hidden;
	border: 1px solid var(--bsand);
	max-width: 1100px;
}
.sk {
	background: var(--white);
	padding: 12px 18px;
	font-size: 12px;
	font-weight: 500;
	color: var(--charcoal);
	border-bottom: 1px solid var(--bsand);
}
.sv {
	background: var(--cream);
	padding: 12px 18px;
	font-size: 12px;
	color: var(--warm-gray);
	border-bottom: 1px solid var(--bsand);
}
.specs-wrap > div:nth-last-child(-n+2) { border-bottom: none; }

/* FAQ accordion */
.qa-wrap { max-width: 760px; margin-top: 18px; }
.qa {
	border-bottom: 1px solid var(--bsand);
}
.qa-q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0;
	cursor: pointer;
	gap: 12px;
	background: none;
	border: none;
	width: 100%;
	font-family: var(--font-body);
	text-align: left;
}
.qa-qt {
	font-size: 13px;
	font-weight: 500;
	color: var(--charcoal);
	line-height: 1.4;
	flex: 1;
}
.qa-ico {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 1px solid var(--bsand);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-size: 12px;
	color: var(--taupe);
	transition: transform .25s cubic-bezier(.4,0,.2,1), background .2s, border-color .2s, color .2s;
}
.qa.op .qa-ico {
	transform: rotate(45deg);
	background: var(--navy);
	border-color: var(--navy);
	color: #fff;
}
.qa-a {
	font-size: 12px;
	color: var(--warm-gray);
	line-height: 1.75;
	font-weight: 300;
	padding-bottom: 16px;
	display: none;
}
.qa.op .qa-a { display: block; }

/* Avis */
.rv-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	margin-top: 18px;
}
.rv {
	background: var(--white);
	border: 1px solid var(--bsand);
	border-radius: 7px;
	padding: 16px;
}
.rv-s {
	color: #C4A97D;
	font-size: 12px;
	letter-spacing: 1px;
	margin-bottom: 8px;
}
.rv-t {
	font-size: 12px;
	color: var(--warm-gray);
	font-style: italic;
	line-height: 1.65;
	margin-bottom: 10px;
}
.rv-a {
	font-size: 10px;
	font-weight: 700;
	color: var(--charcoal);
	letter-spacing: .4px;
	text-transform: uppercase;
}
.rv-sub {
	font-size: 10px;
	color: var(--taupe);
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
}
.cf-pdp-avis-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}
.cf-pdp-avis-score {
	display: flex;
	align-items: center;
	gap: 14px;
}
.cf-pdp-avis-score-val {
	font-family: var(--font-titles);
	font-size: 48px;
	font-weight: 300;
	line-height: 1;
}
.cf-pdp-avis-score-meta { display: flex; flex-direction: column; gap: 2px; }
.cf-pdp-avis-score-stars { color: #C4A97D; font-size: 16px; letter-spacing: 2px; }
.cf-pdp-avis-score-count { font-size: 11px; color: var(--taupe); }

/* CTA band (variante sombre charcoal) */
.cta-band {
	background: var(--charcoal);
	padding: 28px clamp(20px, 5vw, 52px);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	flex-wrap: wrap;
}
.cb-l h3 {
	font-family: var(--font-titles);
	font-size: clamp(24px, 2.6vw, 32px);
	font-weight: 300;
	color: #fff;
	margin: 0 0 8px;
	letter-spacing: -.2px;
	line-height: 1.15;
}
.cb-l p {
	font-size: 12px;
	color: rgba(247, 244, 240, .55);
	line-height: 1.65;
	max-width: 480px;
	margin: 0;
}
.cb-r {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.btn-cr {
	background: var(--cream);
	color: var(--charcoal);
	padding: 13px 22px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 700;
	border: none;
	cursor: pointer;
	font-family: var(--font-body);
	display: inline-block;
	transition: background .15s;
	text-decoration: none;
	letter-spacing: .3px;
}
.btn-cr:hover { background: var(--sand); }
.btn-oc {
	background: transparent;
	color: rgba(247, 244, 240, .75);
	border: 1px solid rgba(247, 244, 240, .25);
	padding: 13px 18px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 400;
	cursor: pointer;
	font-family: var(--font-body);
	display: inline-block;
	transition: border-color .15s, color .15s;
	text-decoration: none;
}
.btn-oc:hover { border-color: rgba(247, 244, 240, .55); color: #fff; }

/* Autres modèles */
.models-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
	margin-top: 18px;
}
.mc {
	background: var(--white);
	border: 1px solid var(--bsand);
	border-radius: 7px;
	overflow: hidden;
	display: block;
	color: inherit;
	transition: border-color .2s, transform .2s, box-shadow .2s;
}
.mc:hover {
	border-color: #9BAAB5;
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(44, 42, 39, .08);
}
.mc-img {
	width: 100%;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--sand);
	border-bottom: 1px solid var(--bsand);
}
.mc-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mc-body { padding: 12px 14px; }
.mc-name {
	font-family: var(--font-titles);
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 2px;
}
.mc-price { font-size: 11px; color: var(--taupe); }
.mc-cta {
	margin-top: 8px;
	display: block;
	width: 100%;
	background: var(--navy);
	color: #fff;
	border: none;
	border-radius: 3px;
	padding: 7px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .5px;
	text-transform: uppercase;
	text-align: center;
	font-family: var(--font-body);
}
.mc:hover .mc-cta { background: var(--navy-d); }

/* =====================================================================
 * Overrides protégés — sélecteurs .cta-band et .models-grid sont génériques
 * (specificity 0,0,1) et peuvent être battus par d'autres styles globaux
 * ou block.css. On les ré-affirme sous le scope .cf-pdp pour gagner.
 * ===================================================================== */
body.single-product .cf-pdp .cta-band,
.cf-pdp .cta-band {
	background: var(--charcoal) !important;
	background-color: var(--charcoal) !important;
	background-image: none !important;
	color: #fff !important;
	padding: 28px clamp(20px, 5vw, 52px) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 28px !important;
	flex-wrap: wrap !important;
}
.cf-pdp .cta-band .cb-l h3 { color: #fff !important; }
.cf-pdp .cta-band .cb-l p { color: rgba(247, 244, 240, .55) !important; }
.cf-pdp .cta-band .cb-r {
	display: flex !important;
	gap: 8px !important;
	flex-wrap: wrap !important;
}
.cf-pdp .cta-band .btn-cr {
	background: var(--cream) !important;
	color: var(--charcoal) !important;
	border: none !important;
	padding: 13px 22px !important;
	border-radius: 4px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	font-family: var(--font-body) !important;
	display: inline-block !important;
	text-decoration: none !important;
	letter-spacing: .3px !important;
}
.cf-pdp .cta-band .btn-cr:hover { background: var(--sand) !important; }
.cf-pdp .cta-band .btn-oc {
	background: transparent !important;
	color: rgba(247, 244, 240, .75) !important;
	border: 1px solid rgba(247, 244, 240, .25) !important;
	padding: 13px 18px !important;
	border-radius: 4px !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	font-family: var(--font-body) !important;
	display: inline-block !important;
	text-decoration: none !important;
}
.cf-pdp .cta-band .btn-oc:hover { border-color: rgba(247, 244, 240, .55) !important; color: #fff !important; }

body.single-product .cf-pdp .models-grid,
.cf-pdp .models-grid {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 12px !important;
	margin-top: 18px !important;
}
.cf-pdp .models-grid .mc {
	background: var(--white) !important;
	border: 1px solid var(--bsand) !important;
	border-radius: 7px !important;
	overflow: hidden !important;
	display: block !important;
	color: inherit !important;
}
.cf-pdp .models-grid .mc-img {
	width: 100% !important;
	aspect-ratio: 4 / 3 !important;
	overflow: hidden !important;
	background: var(--sand) !important;
	border-bottom: 1px solid var(--bsand) !important;
}
.cf-pdp .models-grid .mc-img img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}
.cf-pdp .models-grid .mc-body { padding: 12px 14px !important; }
.cf-pdp .models-grid .mc-name {
	font-family: var(--font-titles) !important;
	font-size: 18px !important;
	font-weight: 500 !important;
	margin-bottom: 2px !important;
}
.cf-pdp .models-grid .mc-price { font-size: 11px !important; color: var(--taupe) !important; }
.cf-pdp .models-grid .mc-cta {
	margin-top: 8px !important;
	display: block !important;
	width: 100% !important;
	background: var(--navy) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 3px !important;
	padding: 7px !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	letter-spacing: .5px !important;
	text-transform: uppercase !important;
	text-align: center !important;
	font-family: var(--font-body) !important;
}

/* =====================================================================
 * Fade-in au scroll (activé seulement si JS détecte le support).
 * Réutilisé par .cf-fade-in sur la fiche produit et ailleurs.
 * ===================================================================== */
html.cf-js .cf-fade-in {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .8s cubic-bezier(.2, .4, .2, 1), transform .8s cubic-bezier(.2, .4, .2, 1);
	will-change: opacity, transform;
}
html.cf-js .cf-fade-in.is-in-view { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
	html.cf-js .cf-fade-in { opacity: 1; transform: none; transition: none; }
}

/* =====================================================================
 * Responsive — fiche produit définitive + archive.
 * Breakpoints alignés sur la maquette cryofast_flex_page (900px, 480px)
 * et étendus pour couvrir 320-1440px sans débordement horizontal.
 * Zones tactiles ≥ 44px à tous les niveaux.
 * ===================================================================== */

/* 1024-1279 : laptop, juste ajuster les gap des grilles 2-col. */
@media (max-width: 1279px) and (min-width: 1025px) {
	.cf-pdp-perf .two-col,
	.cf-pdp-conception .two-col { gap: 40px; }
	.cf-pdp .models-grid { grid-template-columns: repeat(4, 1fr) !important; }
}

/* 1024px et moins : compactage progressif. */
@media (max-width: 1024px) {
	.cf-pdp-perf .two-col,
	.cf-pdp-conception .two-col { gap: 32px; }
	.ph-info { padding: 24px 24px 20px; }
}

/* 900px et moins : breakpoint majeur — passage en colonne unique. */
@media (max-width: 900px) {
	.bc { padding: calc(var(--header-height) + 12px) var(--sec-pad-x-mob) 0; }

	.ph {
		grid-template-columns: 1fr !important;
		min-height: auto !important;
	}
	.ph-main { min-height: 55vw; }
	.ph-info {
		padding: 28px 20px 24px;
		overflow: visible;
	}

	/* Hero — typographie ajustée */
	.p-name { font-size: clamp(32px, 8vw, 48px); }
	.p-tagline { font-size: 14px; }

	/* Bloc d'achat : CTAs full-width tactiles ≥ 48px */
	.cf-pdp .p-ctas { gap: 10px; }
	.cf-pdp form.cart button.single_add_to_cart_button,
	body.single-product .cf-pdp form.cart button.single_add_to_cart_button {
		padding: 16px !important;
		min-height: 52px !important;
		font-size: 14px !important;
	}
	.btn-fin, .btn-rdv { padding: 14px !important; min-height: 48px; }

	/* Variantes : items confortables au tap */
	.p-vars { gap: 8px; }
	.pv { padding: 14px 16px !important; min-height: 48px; }

	/* Specs rapides : grid 1 col (la maquette le précise) */
	.p-specs-grid { grid-template-columns: 1fr !important; }

	/* Sections sous le hero : padding réduit */
	.cf-pdp-section { padding: 36px 20px !important; }

	/* Performance / Conception en 1 colonne */
	.cf-pdp-perf .two-col,
	.cf-pdp-conception .two-col {
		grid-template-columns: 1fr !important;
		gap: 28px;
	}

	/* Inclus : 2 colonnes en tablet */
	.inc-grid { grid-template-columns: 1fr 1fr !important; }

	/* Fiche technique : 1 colonne (label sur sa propre ligne) */
	.specs-wrap { grid-template-columns: 1fr !important; }
	.sk, .sv { padding: 11px 14px !important; }
	.sk { border-bottom: none !important; padding-bottom: 0 !important; font-size: 11px !important; letter-spacing: 1px; text-transform: uppercase; color: var(--taupe) !important; }

	/* Avis : grid 1 col */
	.rv-grid { grid-template-columns: 1fr !important; }
	.cf-pdp-avis-head { flex-direction: column; align-items: flex-start; gap: 14px; }

	/* Modèles : 2 colonnes */
	.cf-pdp .models-grid,
	body.single-product .cf-pdp .models-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	/* CTA band : passage en colonne, boutons full-width */
	.cf-pdp .cta-band,
	body.single-product .cf-pdp .cta-band {
		flex-direction: column !important;
		align-items: flex-start !important;
		padding: 32px 20px !important;
		gap: 18px !important;
	}
	.cf-pdp .cta-band .cb-r {
		width: 100% !important;
		flex-direction: column !important;
	}
	.cf-pdp .cta-band .btn-cr,
	.cf-pdp .cta-band .btn-oc {
		width: 100% !important;
		min-height: 48px !important;
		padding: 14px 18px !important;
	}

	/* FAQ : zones tactiles ≥ 44px */
	.qa-q { min-height: 48px; padding: 16px 0 !important; }

	/* Archive */
	.cf-shop-archive { padding-top: calc(var(--header-height) + 18px); }
}

/* 480px et moins : 1 colonne partout, gap resserrés. */
@media (max-width: 480px) {
	.bc { font-size: 10px; padding-right: 12px; flex-wrap: wrap; }
	.bc a, .bc span { white-space: nowrap; }

	.p-name { font-size: clamp(28px, 9vw, 40px); }
	.p-price { font-size: 36px !important; }
	.p-price-box { padding: 14px 16px; }
	.p-finance-row { gap: 8px; }
	.p-finance-amt { font-size: 14px !important; }

	.inc-grid { grid-template-columns: 1fr !important; }
	.cf-pdp .models-grid,
	body.single-product .cf-pdp .models-grid {
		grid-template-columns: 1fr !important;
	}
	.p-vars { gap: 8px; }
	.ph-thumbs { padding: 10px 12px; }
	.pht { width: 48px; height: 40px; }

	/* CTA band : titres plus compacts */
	.cf-pdp .cta-band .cb-l h3 { font-size: 22px !important; }
	.cf-pdp .cta-band .cb-l p { font-size: 11px !important; }
}

/* 360px et moins : ajustements micro-écrans (iPhone SE, anciens Android). */
@media (max-width: 360px) {
	.ph-info { padding: 22px 16px 20px; }
	.cf-pdp-section { padding: 28px 16px !important; }
	.cf-pdp .cta-band,
	body.single-product .cf-pdp .cta-band { padding: 26px 16px !important; }
}

/* =====================================================================
 * CART + CHECKOUT — Réécriture complète (CRYOFAST_VERSION 0.5.0)
 *
 * Apple-style. Beaucoup d'espace blanc, typo sobre, hiérarchie claire,
 * mobile-first. Aucune fioriture, aucun breadcrumb, aucune bordure
 * lourde. La charte (navy, charcoal, bsand, stone, white, Cormorant,
 * Outfit) est respectée mais en mode minimal.
 *
 * Snazzy Digital Agency.
 * ===================================================================== */

/* -------------------------------------------------------------------------
 * Tokens locaux + reset de l'enveloppe
 * ------------------------------------------------------------------------- */

body.cf-cart-mode,
body.cf-checkout-mode {
	background: var(--white);
}

body.cf-cart-mode .site-main,
body.cf-checkout-mode .site-main {
	background: var(--white);
	padding-top: calc(var(--header-height) + 12px);
	padding-bottom: 80px;
}

/* Header simplifié sur checkout : tunnel concentré. Le panier garde la nav
   pour que l'utilisateur puisse continuer ses achats. */
body.cf-checkout-mode .topbar,
body.cf-checkout-mode header > nav > a.nl,
body.cf-checkout-mode header > nav > .ni,
body.cf-checkout-mode header > nav > .shop-cta,
body.cf-checkout-mode header > nav > .cf-burger {
	display: none !important;
}
body.cf-checkout-mode header > nav { justify-content: flex-end; gap: 12px; }
body.cf-checkout-mode footer .fg { display: none; }

/* Titres de page natifs (the_title) : masqués sur ces pages — nos templates
   gèrent leur propre titre, et les blocs WC ont leur propre hiérarchie. */
body.cf-cart-mode .entry-title,
body.cf-cart-mode h1.page-title,
body.cf-checkout-mode .entry-title,
body.cf-checkout-mode h1.page-title {
	display: none;
}

/* Wrapper article : pas de bordure, pas de padding parasité. */
body.cf-cart-mode .cf-wc-page,
body.cf-checkout-mode .cf-wc-page {
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0 auto;
	max-width: none;
}

/* -------------------------------------------------------------------------
 * PAGE PANIER — Réécriture Plunge-spirit (référence client).
 *
 * Layout 2 col desktop : items à gauche (vignette + info + qty + prix),
 * récap dark à droite (sticky 400px). Mobile : empilé + CTA fixe bas.
 * Wrapper .cf-cart-page rendu par woocommerce/cart/cart.php override.
 * ------------------------------------------------------------------------- */

.cf-cart-page {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 48px);
	color: var(--charcoal);
	font-family: var(--font-body);
}

.cf-cart-page-head {
	padding: clamp(24px, 4vw, 44px) 0 clamp(20px, 3vw, 28px);
	border-bottom: 1px solid var(--bsand);
	margin-bottom: 4px;
}
.cf-cart-page-title {
	font-family: var(--font-body);
	font-size: clamp(22px, 2.4vw, 28px);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.2px;
	color: var(--charcoal);
	margin: 0;
	display: inline-flex;
	align-items: baseline;
	gap: 8px;
}
.cf-cart-page-count {
	font-weight: 500;
	color: var(--warm-gray);
	font-size: 0.85em;
}

.cf-cart-page-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 440px;
	gap: clamp(20px, 3vw, 48px);
	align-items: start;
	padding-bottom: 60px;
}

/* Colonne gauche : liste articles ------------------------------------- */
.cf-cart-page-form {
	margin: 0;
}

.cf-cart-page .cf-cart-items {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cf-cart-page .cf-cart-item {
	display: grid;
	grid-template-columns: 140px minmax(0, 1fr);
	gap: 24px;
	padding: 28px 0;
	border-bottom: 1px solid var(--bsand);
}
.cf-cart-page .cf-cart-item:last-child {
	border-bottom: 0;
}

.cf-cart-page .cf-cart-item-thumb {
	width: 140px;
	height: 140px;
	border-radius: 12px;
	overflow: hidden;
	background: var(--stone);
	display: block;
}
.cf-cart-page .cf-cart-item-thumb a,
.cf-cart-page .cf-cart-item-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cf-cart-page .cf-cart-item-body {
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 8px;
	min-height: 140px;
}

/* Top : nom à gauche + sous-total (prix × qty) à droite. */
.cf-cart-page .cf-cart-item-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}
.cf-cart-page .cf-cart-item-name {
	font-family: var(--font-body);
	font-size: 17px;
	font-weight: 700;
	color: var(--charcoal);
	line-height: 1.3;
	text-decoration: none;
	min-width: 0;
}
.cf-cart-item-name:hover { color: var(--navy); }
.cf-cart-page .cf-cart-item-subtotal {
	font-family: var(--font-body);
	font-size: 17px;
	font-weight: 700;
	color: var(--charcoal);
	white-space: nowrap;
	flex-shrink: 0;
}
.cf-cart-page .cf-cart-item-subtotal .woocommerce-Price-amount,
.cf-cart-page .cf-cart-item-subtotal .amount,
.cf-cart-page .cf-cart-item-subtotal bdi {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}

/* Ligne prix : barré + actuel (si en sale). */
.cf-cart-page .cf-cart-item-prices {
	display: flex;
	align-items: baseline;
	gap: 8px;
	font-size: 14px;
	margin-top: -4px;
}
.cf-cart-page .cf-cart-item-strike {
	color: var(--warm-gray);
	text-decoration: line-through;
}
.cf-cart-page .cf-cart-item-strike .woocommerce-Price-amount,
.cf-cart-page .cf-cart-item-strike bdi {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
}
.cf-cart-page .cf-cart-item-now {
	color: var(--charcoal);
	font-weight: 500;
}
.cf-cart-page .cf-cart-item-now .woocommerce-Price-amount,
.cf-cart-page .cf-cart-item-now bdi {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}

/* Meta techniques (variation + wc-item-meta) en gris taupe. */
.cf-cart-page .cf-cart-item-meta {
	font-size: 13px;
	color: var(--warm-gray);
	line-height: 1.6;
	margin: 0;
}
.cf-cart-page .cf-cart-item-meta dl,
.cf-cart-page .cf-cart-item-meta .variation,
.cf-cart-page .cf-cart-item-meta .wc-item-meta {
	margin: 0;
	padding: 0;
	list-style: none;
}
.cf-cart-page .cf-cart-item-meta .variation dt,
.cf-cart-page .cf-cart-item-meta .variation dd,
.cf-cart-page .cf-cart-item-meta .wc-item-meta dt,
.cf-cart-page .cf-cart-item-meta .wc-item-meta dd {
	display: inline;
	margin: 0;
	font-weight: 400;
}
.cf-cart-page .cf-cart-item-meta .variation dt::after,
.cf-cart-page .cf-cart-item-meta .wc-item-meta-label::after {
	content: ': ';
}
.cf-cart-item-meta p { margin: 0; }

/* Badge promo (économie ou nom de campagne). */
.cf-cart-page .cf-cart-item-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--charcoal);
	font-weight: 600;
	letter-spacing: .2px;
	margin-top: 2px;
	background: var(--stone);
	padding: 6px 12px;
	border-radius: 999px;
	width: fit-content;
}
.cf-cart-page .cf-cart-item-badge svg {
	color: var(--navy);
	flex-shrink: 0;
}

/* Actions footer item : qty stepper + poubelle SVG. */
.cf-cart-page .cf-cart-item-actions {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 10px;
}

.cf-cart-page .cf-cart-item-qty .quantity,
.cf-cart-page .cf-cart-item-qty.product-quantity .quantity {
	display: inline-flex !important;
	align-items: center;
	border: 1px solid var(--bsand);
	border-radius: 999px;
	background: var(--white);
	overflow: hidden;
	height: 40px;
	padding: 0;
}
.cf-cart-page .cf-cart-item-qty input.qty {
	width: 36px;
	height: 100%;
	border: 0;
	background: transparent;
	text-align: center;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	color: var(--charcoal);
	padding: 0;
	-moz-appearance: textfield;
	box-shadow: none !important;
}
.cf-cart-page .cf-cart-item-qty input.qty::-webkit-outer-spin-button,
.cf-cart-page .cf-cart-item-qty input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.cf-cart-page .cf-cart-item-qty input.qty:focus {
	outline: none;
}

.cf-cart-page .cf-qty-btn {
	width: 40px;
	height: 40px;
	border: 0;
	background: transparent;
	color: var(--charcoal);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: color .15s;
	padding: 0;
}
.cf-cart-page .cf-qty-btn:hover {
	color: var(--navy);
}
.cf-cart-page .cf-qty-btn:disabled,
.cf-cart-page .cf-qty-btn[disabled] {
	color: var(--bsand);
	cursor: not-allowed;
}
.cf-cart-page .cf-cart-item-qty-static {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	font-size: 14px;
	font-weight: 600;
	padding: 0 8px;
}

/* Bouton « Retirer » — poubelle SVG seulement, pas de texte. */
.cf-cart-page .cf-cart-item-remove {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: transparent;
	border: 0;
	color: var(--warm-gray);
	cursor: pointer;
	text-decoration: none !important;
	font-size: 0 !important;
	font-weight: 400 !important;
	padding: 0 !important;
	margin: 0 !important;
	transition: background .15s, color .15s;
}
.cf-cart-page .cf-cart-item-remove:hover {
	color: var(--charcoal) !important;
	background: var(--stone) !important;
}
.cf-cart-page .cf-cart-item-remove svg {
	display: block;
}
/* Neutralise tout style WC natif sur la classe .remove. */
.cf-cart-page .cf-cart-item-remove::before,
.cf-cart-page .cf-cart-item-remove::after {
	display: none !important;
	content: none !important;
}

/* Update cart button : masqué visuellement (AJAX auto via cart-page.js). */
.cf-cart-page .cf-cart-page-update {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

/* Colonne droite : récap DARK ----------------------------------------- */
.cf-cart-page-summary {
	background: var(--charcoal);
	color: #ffffff;
	border-radius: 18px;
	padding: 28px 28px 24px;
	position: sticky;
	top: calc(var(--header-height) + 20px);
	align-self: start;
}

/* Adresse complète + lien « modifier » du shipping calculator = trop
   verbeux dans le récap dark. On masque ; l'adresse précise est de
   toute façon ressaisie au checkout. Le prix de livraison reste affiché. */
.cf-cart-page-summary .woocommerce-shipping-destination,
.cf-cart-page-summary .shipping-calculator-button {
	display: none !important;
}

.cf-cart-totals {
	display: flex;
	flex-direction: column;
	gap: 0;
}
.cf-cart-totals-title {
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: -.1px;
	color: #ffffff;
	margin: 0 0 20px;
	text-transform: none;
}

.cf-cart-totals-rows {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.cf-cart-totals-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	font-size: 14px;
}
.cf-cart-totals-row .cf-cart-totals-lbl {
	font-size: 14px;
	color: rgba(255, 255, 255, .85);
	font-weight: 500;
	font-family: var(--font-body);
	letter-spacing: 0;
	text-transform: none;
}
.cf-cart-totals-count {
	color: rgba(255, 255, 255, .55);
	font-weight: 400;
	margin-left: 2px;
}
.cf-cart-totals-row .cf-cart-totals-val {
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 700;
	color: #ffffff;
	text-align: right;
	white-space: nowrap;
}
.cf-cart-totals-row .cf-cart-totals-val .woocommerce-Price-amount,
.cf-cart-totals-row .cf-cart-totals-val .amount,
.cf-cart-totals-row .cf-cart-totals-val bdi {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}

/* Savings + coupon en vert. */
.cf-cart-totals-val-savings {
	color: #5eb371 !important;
}
.cf-cart-totals-val-savings .woocommerce-Price-amount,
.cf-cart-totals-val-savings .amount,
.cf-cart-totals-val-savings bdi {
	color: inherit !important;
}

/* Divider intermédiaire. */
.cf-cart-totals-divider {
	height: 1px;
	background: rgba(255, 255, 255, .15);
	margin: 18px 0;
}

/* Total + mensualité. */
.cf-cart-totals-row.order-total {
	align-items: baseline;
	gap: 16px;
}
.cf-cart-totals-row.order-total .cf-cart-totals-lbl {
	font-size: 17px;
	font-weight: 700;
	color: #ffffff;
	flex: 0 0 auto;
	letter-spacing: 0;
}
.cf-cart-totals-row.order-total .cf-cart-totals-val {
	font-family: var(--font-body);
	font-size: 20px;
	font-weight: 700;
	color: #ffffff;
	flex: 1 1 auto;
	text-align: right;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-end;
}
.cf-cart-totals-row.order-total .cf-cart-totals-val .woocommerce-Price-amount,
.cf-cart-totals-row.order-total .cf-cart-totals-val strong,
.cf-cart-totals-row.order-total .cf-cart-totals-val .amount {
	font-family: var(--font-body) !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	line-height: 1.1;
	white-space: nowrap;
}
.cf-cart-totals-row.order-total .cf-cart-totals-val small,
.cf-cart-totals-row.order-total .cf-cart-totals-val .includes_tax {
	font-family: var(--font-body) !important;
	font-size: 11px !important;
	color: rgba(255, 255, 255, .65) !important;
	font-weight: 400 !important;
	margin-top: 4px;
	white-space: nowrap;
	letter-spacing: 0;
	text-transform: none;
	display: block;
}

.cf-cart-totals-financing {
	margin-top: 6px;
	text-align: right;
	font-size: 12px;
	color: rgba(255, 255, 255, .75);
}
.cf-cart-totals-financing a {
	color: #ffffff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Shipping (markup natif WC <tr>/<th>/<td>) — neutralisé flex propre dans le dark. */
.cf-cart-totals tr.woocommerce-shipping-totals,
.cf-cart-totals tr.shipping {
	display: flex !important;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	padding: 0;
	border: 0;
	font-size: 14px;
}
.cf-cart-totals tr.woocommerce-shipping-totals th,
.cf-cart-totals tr.shipping th {
	font-family: var(--font-body);
	font-size: 14px;
	color: rgba(255, 255, 255, .85);
	font-weight: 500;
	border: 0;
	padding: 0;
	background: transparent;
	flex: 0 0 auto;
	letter-spacing: 0;
	text-transform: none;
}
.cf-cart-totals tr.woocommerce-shipping-totals td,
.cf-cart-totals tr.shipping td {
	border: 0;
	padding: 0;
	background: transparent;
	font-size: 14px;
	color: #ffffff;
	text-align: right;
	flex: 1 1 auto;
}
.cf-cart-totals tr.shipping td ul.woocommerce-shipping-methods {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-items: flex-end;
	font-size: 13px;
	color: #ffffff;
}
.cf-cart-totals tr.shipping td ul.woocommerce-shipping-methods label {
	color: #ffffff;
}
.cf-cart-totals .shipping-calculator-button {
	font-size: 12px;
	color: rgba(255, 255, 255, .75);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Code promo — input + Apply en ligne (style Plunge). */
.cf-cart-totals-coupon {
	display: flex;
	gap: 8px;
	margin: 22px 0 18px;
	padding: 0;
}
.cf-cart-totals-coupon-input {
	flex: 1;
	min-width: 0;
	height: 48px;
	border: 0;
	border-radius: 10px;
	padding: 0 16px;
	font-size: 14px;
	background: #ffffff;
	color: var(--charcoal);
	font-family: inherit;
}
.cf-cart-totals-coupon-input::placeholder {
	color: rgba(15, 24, 38, .45);
}
.cf-cart-totals-coupon-input:focus {
	outline: 2px solid rgba(255, 255, 255, .3);
	outline-offset: 2px;
}
.cf-cart-totals-coupon-btn {
	flex: 0 0 auto;
	height: 48px;
	min-width: 84px;
	padding: 0 18px;
	background: transparent;
	color: rgba(255, 255, 255, .85);
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: 10px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	letter-spacing: .3px;
	transition: background .15s, color .15s, border-color .15s;
}
.cf-cart-totals-coupon-btn:hover {
	background: rgba(255, 255, 255, .1);
	color: #ffffff;
	border-color: rgba(255, 255, 255, .5);
}

/* CTA Checkout — BLANC pill XL fort contraste. */
.cf-cart-totals-checkout {
	margin-top: 4px;
}
.cf-cart-checkout-btn,
.cf-cart-totals-checkout .checkout-button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 54px;
	padding: 14px 24px;
	background: #ffffff;
	color: var(--charcoal);
	border: 0;
	border-radius: 999px;
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .2px;
	text-transform: none;
	text-decoration: none;
	transition: transform .15s, box-shadow .15s, background .15s;
	cursor: pointer;
}
.cf-cart-checkout-btn:hover,
.cf-cart-totals-checkout .checkout-button:hover {
	background: rgba(255, 255, 255, .92);
	transform: translateY(-1px);
	color: var(--charcoal);
}

.cf-cart-totals-note {
	margin: 12px 0 18px;
	text-align: center;
	font-size: 11px;
	color: rgba(255, 255, 255, .55);
	letter-spacing: .2px;
}

/* Réassurance discrète. */
.cf-cart-totals-trust {
	list-style: none;
	margin: 4px 0 0;
	padding: 18px 0 0;
	border-top: 1px solid rgba(255, 255, 255, .15);
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 12px;
	color: rgba(255, 255, 255, .75);
}
.cf-cart-totals-trust li {
	display: flex;
	align-items: center;
	gap: 10px;
	line-height: 1.4;
}
.cf-cart-totals-trust svg {
	color: rgba(255, 255, 255, .95);
	flex-shrink: 0;
}

/* Cross-sells « Vous aimerez aussi » -------------------------------- */
.cf-cart-crosssell {
	padding: clamp(24px, 4vw, 48px) 0 60px;
	border-top: 1px solid var(--bsand);
	margin-top: 8px;
}
.cf-cart-crosssell .cross-sells > h2,
.cf-cart-crosssell h2 {
	font-family: var(--font-body);
	font-size: clamp(22px, 2.4vw, 28px);
	font-weight: 700;
	color: var(--charcoal);
	margin: 0 0 24px;
	letter-spacing: -.2px;
	text-transform: none;
}
.cf-cart-crosssell .products {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 20px;
}
.cf-cart-crosssell .products li.product {
	background: var(--white);
	border: 1px solid var(--bsand);
	border-radius: 14px;
	padding: 20px;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	transition: border-color .15s, transform .15s;
}
.cf-cart-crosssell .products li.product:hover {
	border-color: var(--charcoal);
	transform: translateY(-2px);
}
.cf-cart-crosssell .products li.product img {
	width: 100%;
	height: 140px;
	object-fit: contain;
	background: var(--stone);
	border-radius: 8px;
}
.cf-cart-crosssell .products li.product .woocommerce-loop-product__title,
.cf-cart-crosssell .products li.product h2,
.cf-cart-crosssell .products li.product h3 {
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 700;
	color: var(--charcoal);
	margin: 0;
	padding: 0;
	line-height: 1.3;
}
.cf-cart-crosssell .products li.product .price {
	font-family: var(--font-body);
	font-size: 14px;
	color: var(--charcoal);
	margin: 0;
}
.cf-cart-crosssell .products li.product .price del {
	color: var(--warm-gray);
	margin-right: 6px;
}
.cf-cart-crosssell .products li.product .price ins {
	background: transparent;
	text-decoration: none;
	font-weight: 600;
	color: var(--charcoal);
}
.cf-cart-crosssell .products li.product .button,
.cf-cart-crosssell .products li.product .added_to_cart {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 42px;
	background: transparent;
	color: var(--charcoal);
	border: 1px solid var(--charcoal);
	border-radius: 999px;
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .2px;
	text-transform: none;
	text-decoration: none;
	padding: 0 18px;
	transition: background .15s, color .15s;
	cursor: pointer;
}
.cf-cart-crosssell .products li.product .button:hover,
.cf-cart-crosssell .products li.product .added_to_cart:hover {
	background: var(--charcoal);
	color: #ffffff;
}

/* Sticky CTA mobile — affichée < 1024px uniquement (cf. responsive). */
.cf-cart-page-mobile-cta { display: none; }

/* -------------------------------------------------------------------------
 * PAGE CHECKOUT — Apple-style.
 * Cible à la fois les blocs WC modernes (.wp-block-woocommerce-checkout)
 * et le shortcode classique [woocommerce_checkout].
 * ------------------------------------------------------------------------- */

/* Wrapper global -------------------------------------------------------- */
body.cf-checkout-mode .wp-block-woocommerce-checkout,
body.cf-checkout-mode .wc-block-checkout,
body.cf-checkout-mode form.woocommerce-checkout {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 48px);
	color: var(--charcoal);
	font-family: var(--font-body);
	background: var(--white);
}

/* Titre tunnel discret en haut de page : nous laissons WC gérer son intro.
   Si l'admin a mis un H1 dans la page, on l'a masqué via .entry-title. */

/* Grid 60/40 desktop : WC Blocks utilise un layout flex interne. On force
   notre grille via le container .wc-block-checkout. */
@media (min-width: 1025px) {
	body.cf-checkout-mode .wc-block-checkout .wc-block-checkout__main,
	body.cf-checkout-mode .wp-block-woocommerce-checkout > .wp-block-woocommerce-checkout-fields-block {
		flex: 1 1 60% !important;
		max-width: 60% !important;
		padding-right: 48px !important;
	}
	body.cf-checkout-mode .wc-block-checkout .wc-block-checkout__sidebar,
	body.cf-checkout-mode .wp-block-woocommerce-checkout > .wp-block-woocommerce-checkout-order-summary-block,
	body.cf-checkout-mode .wp-block-woocommerce-checkout .wp-block-woocommerce-checkout-totals-block {
		flex: 1 1 40% !important;
		max-width: 40% !important;
	}

	/* CHECKOUT CLASSIQUE (shortcode [woocommerce_checkout]) : grid 2 col
	   où le récap (#order_review) est en colonne droite sticky. Le
	   #customer_details est aplati (billing+shipping+notes empilés)
	   pour libérer la place du récap. */
	body.cf-checkout-mode form.woocommerce-checkout {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 400px;
		grid-template-areas:
			"details review-h"
			"details review"
			"details review-end";
		gap: 12px 48px;
		align-items: start;
	}
	body.cf-checkout-mode form.woocommerce-checkout #customer_details {
		grid-area: details;
		display: block !important;
		width: 100% !important;
	}
	body.cf-checkout-mode form.woocommerce-checkout #customer_details::after {
		content: "";
		display: table;
		clear: both;
	}
	body.cf-checkout-mode form.woocommerce-checkout #customer_details .col-1,
	body.cf-checkout-mode form.woocommerce-checkout #customer_details .col-2 {
		width: 100% !important;
		max-width: 100% !important;
		float: none !important;
		padding: 0 !important;
		margin: 0 0 28px !important;
	}
	body.cf-checkout-mode form.woocommerce-checkout #customer_details .col-2 {
		margin-bottom: 12px !important;
	}
	body.cf-checkout-mode form.woocommerce-checkout #order_review_heading {
		grid-area: review-h;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		font-family: var(--font-body) !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		letter-spacing: 1.2px !important;
		text-transform: uppercase !important;
		color: var(--charcoal) !important;
	}
	body.cf-checkout-mode form.woocommerce-checkout #order_review {
		grid-area: review;
		position: sticky;
		top: calc(var(--header-height) + 20px);
	}
}

/* Bloc Sidebar (récap) ------------------------------------------------- */
body.cf-checkout-mode .wp-block-woocommerce-checkout-order-summary-block,
body.cf-checkout-mode .wc-block-checkout__sidebar,
body.cf-checkout-mode #order_review_heading,
body.cf-checkout-mode #order_review {
	background: var(--stone) !important;
	border: 1px solid var(--bsand) !important;
	border-radius: 14px !important;
	padding: 24px !important;
}
@media (min-width: 1025px) {
	body.cf-checkout-mode .wp-block-woocommerce-checkout-order-summary-block,
	body.cf-checkout-mode .wc-block-checkout__sidebar {
		position: sticky;
		top: calc(var(--header-height) + 20px);
		align-self: start;
	}
	/* #order_review en classique : sticky géré dans la règle grid du form
	   (.woocommerce-checkout), pour cohérence avec grid-area: review. */
}

/* Titre du sidebar (« Récapitulatif de commande »). */
body.cf-checkout-mode .wp-block-woocommerce-checkout-order-summary-block .wp-block-woocommerce-checkout-order-summary-block__title,
body.cf-checkout-mode .wc-block-components-checkout-step__title-text {
	font-family: var(--font-body) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 1.4px !important;
	text-transform: uppercase !important;
	color: var(--charcoal) !important;
	margin: 0 0 18px !important;
}

/* Items du récap : vignette 56×56, nom, prix à droite. */
body.cf-checkout-mode .wc-block-components-order-summary-item {
	padding: 14px 0 !important;
	border-bottom: 1px solid var(--bsand) !important;
	gap: 14px !important;
	align-items: flex-start !important;
}
body.cf-checkout-mode .wc-block-components-order-summary-item:last-child {
	border-bottom: 0 !important;
}
body.cf-checkout-mode .wc-block-components-order-summary-item__image,
body.cf-checkout-mode .wc-block-components-order-summary-item img {
	width: 56px !important;
	height: 56px !important;
	border-radius: 8px !important;
	object-fit: cover;
	background: var(--white);
}
body.cf-checkout-mode .wc-block-components-order-summary-item__description {
	font-size: 14px !important;
	color: var(--charcoal) !important;
}
body.cf-checkout-mode .wc-block-components-order-summary-item__quantity {
	font-size: 12px !important;
	color: var(--warm-gray) !important;
	margin-top: 2px;
}
body.cf-checkout-mode .wc-block-components-order-summary-item__total-price {
	font-family: var(--font-body) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--charcoal) !important;
}

/* Totaux du récap : Sous-total, livraison, taxes — Outfit petit, montants
   alignés à droite. */
body.cf-checkout-mode .wc-block-components-totals-item {
	padding: 8px 0 !important;
	font-size: 14px !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: baseline !important;
}
body.cf-checkout-mode .wc-block-components-totals-item__label {
	font-family: var(--font-body) !important;
	font-size: 12px !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	color: var(--warm-gray) !important;
	font-weight: 600 !important;
}
body.cf-checkout-mode .wc-block-components-totals-item__value {
	font-family: var(--font-body) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--charcoal) !important;
	white-space: nowrap;
}

/* Total final récap : Cormorant grand. */
body.cf-checkout-mode .wc-block-components-totals-footer-item {
	padding: 18px 0 4px !important;
	border-top: 1px solid var(--bsand) !important;
	margin-top: 8px !important;
}
body.cf-checkout-mode .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	font-size: 13px !important;
	letter-spacing: 1.5px !important;
	font-weight: 700 !important;
	color: var(--charcoal) !important;
}
body.cf-checkout-mode .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
body.cf-checkout-mode .wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
	font-family: var(--font-titles) !important;
	font-size: clamp(26px, 3vw, 32px) !important;
	font-weight: 400 !important;
	color: var(--charcoal) !important;
	white-space: nowrap;
}
body.cf-checkout-mode .wc-block-components-totals-footer-item .wc-block-components-totals-item__description,
body.cf-checkout-mode .wc-block-components-totals-taxes {
	font-family: var(--font-body) !important;
	font-size: 11px !important;
	color: var(--taupe) !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

/* Code promo : lien discret. */
body.cf-checkout-mode .wc-block-components-totals-coupon button,
body.cf-checkout-mode .wc-block-components-totals-coupon__button {
	color: var(--warm-gray) !important;
	font-size: 12px !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
	background: transparent !important;
	padding: 6px 0 !important;
	border: 0 !important;
}

/* Sections du form (Contact / Livraison / Paiement) ------------------- */
body.cf-checkout-mode .wc-block-components-checkout-step {
	background: transparent !important;
	border: 0 !important;
	padding: 32px 0 !important;
	margin: 0 !important;
	border-top: 1px solid var(--bsand) !important;
}
body.cf-checkout-mode .wc-block-components-checkout-step:first-of-type {
	border-top: 0 !important;
	padding-top: 8px !important;
}
body.cf-checkout-mode .wc-block-components-checkout-step__title,
body.cf-checkout-mode .wc-block-components-title.wc-block-components-checkout-step__title {
	font-family: var(--font-titles) !important;
	font-size: clamp(22px, 2.4vw, 28px) !important;
	font-weight: 400 !important;
	letter-spacing: -.2px !important;
	color: var(--charcoal) !important;
	margin: 0 0 6px !important;
	text-transform: none !important;
}
body.cf-checkout-mode .wc-block-components-checkout-step__description {
	font-size: 13px !important;
	color: var(--warm-gray) !important;
	margin: 0 0 20px !important;
}

/* Inputs Apple-style : grands, légers, focus charcoal. */
body.cf-checkout-mode .wc-block-components-text-input input,
body.cf-checkout-mode .wc-block-components-select select,
body.cf-checkout-mode .wc-block-components-textarea textarea,
body.cf-checkout-mode .wc-block-components-combobox-control input,
body.cf-checkout-mode form.woocommerce-checkout input[type="text"],
body.cf-checkout-mode form.woocommerce-checkout input[type="email"],
body.cf-checkout-mode form.woocommerce-checkout input[type="tel"],
body.cf-checkout-mode form.woocommerce-checkout input[type="number"],
body.cf-checkout-mode form.woocommerce-checkout select,
body.cf-checkout-mode form.woocommerce-checkout textarea {
	font-family: var(--font-body) !important;
	font-size: 15px !important;
	background: var(--white) !important;
	color: var(--charcoal) !important;
	border: 1px solid var(--bsand) !important;
	border-radius: 10px !important;
	padding: 14px 16px !important;
	min-height: 52px !important;
	width: 100% !important;
	box-sizing: border-box;
	transition: border-color .15s, box-shadow .15s;
	box-shadow: none !important;
}
body.cf-checkout-mode .wc-block-components-text-input input:focus,
body.cf-checkout-mode .wc-block-components-select select:focus,
body.cf-checkout-mode .wc-block-components-textarea textarea:focus,
body.cf-checkout-mode form.woocommerce-checkout input:focus,
body.cf-checkout-mode form.woocommerce-checkout select:focus,
body.cf-checkout-mode form.woocommerce-checkout textarea:focus {
	border-color: var(--charcoal) !important;
	box-shadow: 0 0 0 3px rgba(15, 24, 38, 0.08) !important;
	outline: none !important;
}

/* Labels — petit gris uppercase, plus discret que la valeur de l'input. */
body.cf-checkout-mode .wc-block-components-text-input label,
body.cf-checkout-mode .wc-block-components-select label,
body.cf-checkout-mode .wc-block-components-textarea label,
body.cf-checkout-mode form.woocommerce-checkout .form-row > label {
	font-family: var(--font-body) !important;
	font-size: 12px !important;
	letter-spacing: .8px !important;
	text-transform: uppercase !important;
	color: var(--warm-gray) !important;
	font-weight: 600 !important;
	margin-bottom: 6px !important;
}
/* Floating-label natif des blocs WC : on garde la couleur mais on lisse. */
body.cf-checkout-mode .wc-block-components-text-input.is-active label,
body.cf-checkout-mode .wc-block-components-text-input:focus-within label {
	color: var(--charcoal) !important;
}

/* Espacement entre champs. */
body.cf-checkout-mode .wc-block-components-text-input,
body.cf-checkout-mode .wc-block-components-select,
body.cf-checkout-mode .wc-block-components-textarea,
body.cf-checkout-mode form.woocommerce-checkout .form-row {
	margin-bottom: 14px !important;
}

/* Grille 2 colonnes pour ville/code postal etc. */
body.cf-checkout-mode .wc-block-components-address-form,
body.cf-checkout-mode .wc-block-components-address-form__address_1,
body.cf-checkout-mode .wc-block-components-address-form .wc-block-components-address-form__city,
body.cf-checkout-mode .wc-block-components-address-form .wc-block-components-address-form__postcode {
	flex-grow: 1;
}

/* Checkbox "Sauvegarder l'adresse" / "S'inscrire" / "Pour qqun d'autre". */
body.cf-checkout-mode .wc-block-components-checkbox {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	color: var(--charcoal);
}
body.cf-checkout-mode .wc-block-components-checkbox__input {
	width: 18px;
	height: 18px;
	accent-color: var(--charcoal);
}
body.cf-checkout-mode .wc-block-components-checkbox__label {
	font-size: 14px !important;
	color: var(--charcoal) !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	font-weight: 400 !important;
}

/* Méthodes de livraison ----------------------------------------------- */
body.cf-checkout-mode .wc-block-components-shipping-rates-control__package,
body.cf-checkout-mode .wc-block-components-radio-control {
	background: transparent !important;
	padding: 0 !important;
}
body.cf-checkout-mode .wc-block-components-radio-control__option {
	background: var(--white) !important;
	border: 1px solid var(--bsand) !important;
	border-radius: 12px !important;
	padding: 16px 18px !important;
	margin: 0 0 10px !important;
	transition: border-color .15s, box-shadow .15s;
	cursor: pointer;
}
body.cf-checkout-mode .wc-block-components-radio-control__option:hover {
	border-color: var(--navy) !important;
}
body.cf-checkout-mode .wc-block-components-radio-control__option--checked,
body.cf-checkout-mode .wc-block-components-radio-control__option[data-checked="true"],
body.cf-checkout-mode .wc-block-components-radio-control__option:has(input:checked) {
	border-color: var(--navy) !important;
	box-shadow: inset 0 0 0 1px var(--navy);
	background: rgba(27, 63, 114, 0.04) !important;
}
body.cf-checkout-mode .wc-block-components-radio-control__input {
	accent-color: var(--navy) !important;
	width: 18px !important;
	height: 18px !important;
}
body.cf-checkout-mode .wc-block-components-radio-control__label {
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--charcoal) !important;
}
body.cf-checkout-mode .wc-block-components-radio-control__description {
	font-size: 12px !important;
	color: var(--warm-gray) !important;
}

/* Section Paiement : méthodes uniformes (CB / Apple Pay / Amex / PayPal) */
body.cf-checkout-mode .wp-block-woocommerce-checkout-payment-block,
body.cf-checkout-mode .wc-block-components-payment-methods,
body.cf-checkout-mode #payment {
	background: transparent !important;
}
body.cf-checkout-mode #payment ul.payment_methods {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}
body.cf-checkout-mode #payment ul.payment_methods li.wc_payment_method {
	background: var(--white) !important;
	border: 1px solid var(--bsand) !important;
	border-radius: 12px !important;
	padding: 16px 18px !important;
	margin: 0 0 10px !important;
	transition: border-color .15s, background .15s;
}
body.cf-checkout-mode #payment ul.payment_methods li.wc_payment_method:hover {
	border-color: var(--navy) !important;
}
body.cf-checkout-mode #payment ul.payment_methods li.wc_payment_method:has(input:checked),
body.cf-checkout-mode #payment ul.payment_methods li.wc_payment_method.is-active {
	border-color: var(--navy) !important;
	box-shadow: inset 0 0 0 1px var(--navy);
	background: rgba(27, 63, 114, 0.04) !important;
}
body.cf-checkout-mode #payment ul.payment_methods li.wc_payment_method label {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--charcoal) !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}
body.cf-checkout-mode #payment ul.payment_methods li.wc_payment_method input[type="radio"] {
	accent-color: var(--navy) !important;
	width: 18px;
	height: 18px;
	margin: 0;
}
body.cf-checkout-mode #payment ul.payment_methods li.wc_payment_method img {
	max-height: 22px;
	width: auto;
	margin-left: auto;
}
body.cf-checkout-mode #payment .payment_box {
	background: var(--stone) !important;
	border: 0 !important;
	border-radius: 10px !important;
	padding: 16px 18px !important;
	margin: 12px 0 0 !important;
	font-size: 13px;
	color: var(--charcoal);
}
body.cf-checkout-mode #payment .payment_box::before {
	display: none !important;
}
body.cf-checkout-mode #payment .payment_box p {
	margin: 0;
	font-size: 13px;
	color: var(--warm-gray);
}

/* PayPlug : forcer fond blanc strict, masquer mauve éventuel. */
body.cf-checkout-mode .payment_method_payplug,
body.cf-checkout-mode .payplug-gateway,
body.cf-checkout-mode .payplug-card-form,
body.cf-checkout-mode [data-payment-method*="payplug"] {
	background: var(--white) !important;
	color: var(--charcoal) !important;
}
body.cf-checkout-mode .payment_method_payplug *:not(iframe):not(input):not(button):not(svg):not(img),
body.cf-checkout-mode .payplug-gateway *:not(iframe):not(input):not(button):not(svg):not(img) {
	background-color: transparent !important;
}
body.cf-checkout-mode .payplug-gateway[style*="background"],
body.cf-checkout-mode .wc_payment_method.payment_method_payplug[style*="background"] {
	background: var(--white) !important;
}
/* Input fantôme "Nom du titulaire" (rendu doublon hors iframe) — cf. JS */
body.cf-checkout-mode .payment_method_payplug input[name*="cardholder" i],
body.cf-checkout-mode .payment_method_payplug input[name*="card-holder" i],
body.cf-checkout-mode .payment_method_payplug input[name*="card_holder" i],
body.cf-checkout-mode .payment_method_payplug input[id*="cardholder" i],
body.cf-checkout-mode .payment_method_payplug input[id*="card-holder" i],
body.cf-checkout-mode .payment_method_payplug input[id*="card_holder" i],
body.cf-checkout-mode .cf-checkout-payplug-shadow-input {
	display: none !important;
}
body.cf-checkout-mode .payplug-secure-payment,
body.cf-checkout-mode .payplug-secured-by,
body.cf-checkout-mode .payment_method_payplug .payment_box em,
body.cf-checkout-mode .payment_method_payplug .payment_box small {
	font-family: var(--font-body) !important;
	font-size: 11px !important;
	color: var(--taupe) !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	display: block;
	margin-top: 8px;
	line-height: 1.5;
}

/* Bouton paiement final ------------------------------------------------ */
body.cf-checkout-mode .wc-block-components-checkout-place-order-button,
body.cf-checkout-mode .wp-block-woocommerce-checkout-actions-block button,
body.cf-checkout-mode #payment #place_order,
body.cf-checkout-mode form.woocommerce-checkout #place_order {
	width: 100% !important;
	min-height: 56px !important;
	padding: 16px 24px !important;
	background: var(--navy) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 999px !important;
	font-family: var(--font-body) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	letter-spacing: 1.2px !important;
	text-transform: uppercase !important;
	cursor: pointer;
	transition: background .15s, transform .15s, box-shadow .15s;
	box-shadow: 0 6px 18px rgba(15, 24, 38, 0.14);
}
body.cf-checkout-mode .wc-block-components-checkout-place-order-button:hover,
body.cf-checkout-mode .wp-block-woocommerce-checkout-actions-block button:hover,
body.cf-checkout-mode #payment #place_order:hover,
body.cf-checkout-mode form.woocommerce-checkout #place_order:hover {
	background: var(--charcoal) !important;
	transform: translateY(-1px);
}

/* Réassurance sous le bouton — déjà rendue par PHP / JS. */
body.cf-checkout-mode .cf-checkout-trust {
	list-style: none;
	margin: 14px 0 0 !important;
	padding: 0 !important;
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 12px;
	color: var(--warm-gray);
}
body.cf-checkout-mode .cf-checkout-trust li {
	display: flex;
	align-items: center;
	gap: 8px;
	line-height: 1.4;
}
body.cf-checkout-mode .cf-checkout-trust svg {
	color: var(--navy);
	flex-shrink: 0;
}

/* Réassurance DANS le récap droite (style Plunge image 2). */
body.cf-checkout-mode .cf-checkout-summary-trust {
	list-style: none;
	margin: 24px 0 0 !important;
	padding: 22px 0 0 !important;
	border-top: 1px solid var(--bsand);
	display: flex;
	flex-direction: column;
	gap: 16px;
}
body.cf-checkout-mode .cf-checkout-summary-trust li {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	gap: 12px;
	align-items: flex-start;
}
body.cf-checkout-mode .cf-checkout-summary-trust-icon {
	color: var(--charcoal);
	display: inline-flex;
	align-items: flex-start;
	padding-top: 1px;
}
body.cf-checkout-mode .cf-checkout-summary-trust-icon svg {
	display: block;
}
body.cf-checkout-mode .cf-checkout-summary-trust-text {
	font-size: 14px;
	font-weight: 600;
	color: var(--charcoal);
	line-height: 1.45;
}

/* Notices d'erreur / succès — sobres. */
body.cf-checkout-mode .woocommerce-error,
body.cf-checkout-mode .woocommerce-message,
body.cf-checkout-mode .woocommerce-info,
body.cf-checkout-mode .wc-block-components-notice-banner {
	border-radius: 10px !important;
	font-size: 14px !important;
	padding: 14px 18px !important;
	border: 1px solid var(--bsand) !important;
	background: var(--stone) !important;
	color: var(--charcoal) !important;
}
body.cf-checkout-mode .woocommerce-error {
	background: rgba(180, 63, 46, 0.06) !important;
	border-color: rgba(180, 63, 46, 0.20) !important;
	color: #8a2c20 !important;
}

/* -------------------------------------------------------------------------
 * RESPONSIVE — Mobile first, tunnel pleinement utilisable < 1024px.
 * ------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.cf-cart-page-grid {
		grid-template-columns: 1fr;
		gap: 32px;
		padding-bottom: 120px;
	}
	.cf-cart-page-summary {
		position: static;
		padding: 24px;
	}

	/* Checkout : récap d'abord, form ensuite (priorité visuelle). */
	body.cf-checkout-mode .wc-block-checkout,
	body.cf-checkout-mode .wp-block-woocommerce-checkout,
	body.cf-checkout-mode form.woocommerce-checkout {
		display: flex !important;
		flex-direction: column !important;
	}
	body.cf-checkout-mode .wp-block-woocommerce-checkout > .wp-block-woocommerce-checkout-order-summary-block,
	body.cf-checkout-mode .wp-block-woocommerce-checkout > .wp-block-woocommerce-checkout-totals-block,
	body.cf-checkout-mode .wc-block-checkout__sidebar {
		order: -1;
		margin-bottom: 24px !important;
	}
	body.cf-checkout-mode .wp-block-woocommerce-checkout > .wp-block-woocommerce-checkout-fields-block,
	body.cf-checkout-mode .wc-block-checkout__main {
		padding-right: 0 !important;
	}
}

@media (max-width: 767px) {
	/* Items panier mobile : vignette 96px, structure conservée. */
	.cf-cart-item {
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 16px;
		padding: 20px 0;
	}
	.cf-cart-item-thumb {
		width: 96px;
		height: 96px;
		border-radius: 10px;
	}
	.cf-cart-item-name {
		font-size: 15px;
	}
	.cf-cart-item-subtotal {
		font-size: 15px;
	}
	.cf-cart-item-prices {
		font-size: 13px;
	}
	.cf-cart-item-meta {
		font-size: 12px;
	}

	/* CTA panier mobile sticky bas. */
	.cf-cart-page-mobile-cta {
		display: flex !important;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 100;
		padding: 14px 16px calc(14px + env(safe-area-inset-bottom, 0px));
		background: var(--white);
		border-top: 1px solid var(--bsand);
		box-shadow: 0 -10px 30px rgba(15, 24, 38, 0.08);
		gap: 14px;
		align-items: center;
	}
	.cf-cart-page-mobile-cta-total {
		display: flex;
		flex-direction: column;
		gap: 2px;
		min-width: 0;
	}
	.cf-cart-page-mobile-cta-lbl {
		font-size: 11px;
		letter-spacing: 1px;
		text-transform: uppercase;
		color: var(--warm-gray);
		font-weight: 600;
	}
	.cf-cart-page-mobile-cta-amt {
		font-family: var(--font-titles);
		font-size: 22px;
		font-weight: 400;
		color: var(--charcoal);
		line-height: 1;
		white-space: nowrap;
	}
	.cf-cart-page-mobile-cta-btn {
		flex: 1;
		min-height: 50px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		background: var(--navy);
		color: #fff;
		border-radius: 999px;
		font-size: 13px;
		font-weight: 600;
		letter-spacing: 1px;
		text-transform: uppercase;
		text-decoration: none;
		padding: 0 20px;
	}

	/* Hide bottom CTA récap si on est en bas de page (sticky panier OK).
	   Bouton "Passer commande" du panier visible dans le récap empilé. */
	.cf-cart-page-summary .cf-cart-totals-checkout {
		margin-top: 8px;
	}

	/* Checkout bouton paiement sticky bas mobile. */
	body.cf-checkout-mode .wp-block-woocommerce-checkout-actions-block,
	body.cf-checkout-mode form.woocommerce-checkout .form-row.place-order {
		position: sticky;
		bottom: 0;
		background: var(--white);
		padding: 14px 16px calc(14px + env(safe-area-inset-bottom, 0px));
		margin: 24px -16px 0;
		box-shadow: 0 -10px 30px rgba(15, 24, 38, 0.08);
		z-index: 50;
		border-top: 1px solid var(--bsand);
	}

	/* Récap mobile : padding réduit. */
	body.cf-checkout-mode .wp-block-woocommerce-checkout-order-summary-block,
	body.cf-checkout-mode .wc-block-checkout__sidebar,
	body.cf-checkout-mode #order_review {
		padding: 18px !important;
	}
}

@media (max-width: 420px) {
	.cf-cart-page-title { font-size: 30px; }
	.cf-cart-page-summary { padding: 20px; }
}

