/* Page produit WooCommerce - style harmonise avec l'accueil */

body.single-product {
	background: #fff;
	color: var(--cd-primary-blue);
	--cd-primary-blue: #545ec9;
	--cd-primary-orange: #e58765;
	--cd-font-display: "Darumadrop One", cursive;
	--cd-font-body: "Zilla Slab", "Times New Roman", serif;
	font-family: "Zilla Slab", "Times New Roman", serif;
	--cd-purple: var(--cd-primary-blue);
	--cd-purple-dark: color-mix(in srgb, var(--cd-primary-blue) 82%, #1e1e1e);
	--cd-orange: var(--cd-primary-orange);
	--cd-gallery-gutter: 0.75rem;
}

body.single-product .wp-site-blocks {
	padding-top: 0;
}

body.single-product .cd-header--product {
	position: relative;
	z-index: 100;
}

body.single-product .cd-header--product,
body.single-product .cd-header--product .cd-nav a,
body.single-product .cd-header--product .cd-header__tools a,
body.single-product .cd-header--product .cd-header__social a {
	font-family: var(--cd-font-display);
	color: var(--cd-primary-blue);
}

body.single-product .site-main,
body.single-product main {
	max-width: 1200px;
	margin: 0 auto;
	padding: 2rem 1rem 3rem;
}

/* Mobile uniquement : titre + infos au-dessus de la galerie (desktop inchangé) */
@media (max-width: 781px) {
	body.single-product main .wp-block-columns.cd-product-columns {
		flex-direction: column;
	}

	body.single-product main .cd-product-columns__gallery {
		order: 2;
	}

	body.single-product main .cd-product-columns__summary {
		order: 1;
	}
}

body.single-product div.product {
	border-radius: 16px;
	padding: 1.5rem;
	font-family: var(--cd-font-body);
}

body.single-product div.product .woocommerce-product-gallery,
body.single-product .wp-block-woocommerce-product-image-gallery .woocommerce-product-gallery {
	background: #fff;
	border-radius: 12px;
	padding: 0;
}

/* Vignettes sous l’image principale — grille 4 colonnes + gouttières (maquette) */
body.single-product.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs,
body.single-product .woocommerce-product-gallery .flex-control-thumbs,
body.single-product .wp-block-woocommerce-product-image-gallery .flex-control-thumbs {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--cd-gallery-gutter);
	width: 100%;
	margin-top: var(--cd-gallery-gutter) !important;
	margin-bottom: 0 !important;
	padding: 0;
	list-style: none;
	overflow: visible;
	float: none;
	zoom: 1;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs li,
body.single-product .wp-block-woocommerce-product-image-gallery .flex-control-thumbs li {
	float: none !important;
	clear: none !important;
	width: 100% !important;
	margin: 0 !important;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs li img,
body.single-product .wp-block-woocommerce-product-image-gallery .flex-control-thumbs li img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	margin: 0;
	opacity: 0.72;
	border-radius: 4px;
	transition: opacity 0.2s ease;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active,
body.single-product .woocommerce-product-gallery .flex-control-thumbs li img:hover,
body.single-product .wp-block-woocommerce-product-image-gallery .flex-control-thumbs li img.flex-active,
body.single-product .wp-block-woocommerce-product-image-gallery .flex-control-thumbs li img:hover {
	opacity: 1;
}

/* Galerie blocs WooCommerce (nouveau composant) */
body.single-product .wc-block-product-gallery-thumbnails {
	margin-top: var(--cd-gallery-gutter) !important;
}

body.single-product .wc-block-product-gallery-thumbnails__scrollable {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--cd-gallery-gutter) !important;
	width: 100%;
	margin-top: 0 !important;
	overflow: visible;
	scrollbar-width: none;
}

body.single-product .wc-block-product-gallery-thumbnails__thumbnail {
	min-width: 0;
}

body.single-product .wc-block-product-gallery-thumbnails__thumbnail__image {
	width: 100% !important;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 4px;
}

@media (max-width: 520px) {
	body.single-product .woocommerce-product-gallery .flex-control-thumbs,
	body.single-product .wp-block-woocommerce-product-image-gallery .flex-control-thumbs,
	body.single-product .wc-block-product-gallery-thumbnails__scrollable {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

body.single-product div.product .product_title,
body.single-product .wp-block-post-title,
body.single-product h1.wp-block-post-title {
	font-family: "Darumadrop One", cursive;
	font-weight: 400;
	/* ~1,25× l’ancienne taille clamp(2rem, 4vw, 2.8rem) */
	font-size: clamp(1.6rem, 3.2vw, 2.2rem);
	line-height: 1.08;
	color: var(--cd-primary-blue);
	margin-bottom: 0.75rem;
}

body.single-product div.product .price,
body.single-product div.product .price .amount,
body.single-product main > .wp-block-columns .wp-block-woocommerce-product-price,
body.single-product main > .wp-block-columns .wc-block-components-product-price,
body.single-product main > .wp-block-columns .woocommerce-Price-amount,
body.single-product main > .wp-block-columns .wc-block-components-product-price__value {
	color: var(--cd-primary-orange) !important;
}

body.single-product div.product .price,
body.single-product main > .wp-block-columns .wp-block-woocommerce-product-price {
	font-weight: 700;
	font-size: 1.3rem;
	margin-bottom: 1rem;
}

/* Prix variation + mention TTC */
body.single-product .woocommerce-variation-price,
body.single-product .single_variation_wrap .woocommerce-variation-price {
	color: var(--cd-primary-orange);
	font-weight: 700;
	font-size: 1.3rem;
	line-height: 1.3;
	margin-bottom: 0.75rem;
}

body.single-product .woocommerce-variation-price .price,
body.single-product .woocommerce-variation-price .amount {
	color: inherit;
}

body.single-product .cd-price-tax-suffix,
body.single-product .woocommerce-variation-price .cd-price-tax-suffix,
body.single-product main > .wp-block-columns .cd-price-tax-suffix {
	font-family: var(--cd-font-body);
	font-size: 0.72em;
	font-weight: 600;
	margin-left: 0.2em;
	white-space: nowrap;
}

body.single-product div.product .woocommerce-product-details__short-description,
body.single-product div.product .woocommerce-product-details__short-description p,
body.single-product div.product .woocommerce-product-details__short-description li,
body.single-product div.product .woocommerce-product-details__short-description strong,
body.single-product div.product .woocommerce-product-details__short-description em {
	font-family: var(--cd-font-body);
	color: color-mix(in srgb, var(--cd-primary-blue) 82%, #1f1f1f);
	line-height: 1.65;
}

/* Même sélecteur que WooCommerce + body pour primer sur vertical-align: middle */
body.single-product.woocommerce div.product form.cart table.variations th,
body.single-product.woocommerce div.product form.cart table.variations td,
body.single-product.woocommerce div.product form.cart table.variations th.label,
body.single-product.woocommerce div.product form.cart table.variations td.value {
	vertical-align: top !important;
}

body.single-product.woocommerce div.product form.cart table.variations th.label {
	padding-top: 0.5rem;
	padding-right: 1rem;
}

body.single-product div.product form.cart .variations label {
	font-family: var(--cd-font-body);
	font-weight: 700;
	color: var(--cd-primary-blue);
	line-height: 1.4;
	display: inline-block;
}

body.single-product div.product form.cart .variations select {
	border: 1px solid color-mix(in srgb, var(--cd-primary-blue) 26%, #ffffff);
	border-radius: 8px;
	padding: 0.5rem 0.75rem;
	color: var(--cd-primary-blue);
	background: #fff;
}

body.single-product div.product form.cart .quantity input.qty {
	border: 1px solid color-mix(in srgb, var(--cd-primary-blue) 26%, #ffffff);
	border-radius: 8px;
	min-height: 42px;
}

body.single-product div.product form.cart .single_add_to_cart_button {
	background: var(--cd-primary-orange);
	color: #fff;
	border-radius: 999px;
	border: 2px solid var(--cd-primary-orange);
	font-family: var(--cd-font-display);
	font-weight: 400;
	text-transform: lowercase;
	padding: 0.7rem 1.4rem;
}

body.single-product div.product form.cart .single_add_to_cart_button:hover {
	background: #fff;
	color: var(--cd-primary-orange);
}

body.single-product .cd-product-info-blocks {
	margin-top: 1.75rem;
	display: flex;
	flex-direction: column;
	gap: 1.35rem;
}

body.single-product .cd-product-info-block__title {
	margin: 0 0 0.35rem;
	font-family: var(--cd-font-display);
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.35;
	color: var(--cd-primary-blue);
}

body.single-product .cd-product-info-block__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.single-product .cd-product-info-block__list li {
	position: relative;
	padding-left: 0.95rem;
	font-family: var(--cd-font-body);
	font-size: 0.95rem;
	line-height: 1.55;
	color: color-mix(in srgb, var(--cd-primary-blue) 82%, #1f1f1f);
}

body.single-product .cd-product-info-block__list li::before {
	content: ".";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--cd-primary-blue);
	font-weight: 700;
}

body.single-product .woocommerce-tabs {
	margin-top: 1.6rem;
	background: #fff;
	border-radius: 12px;
	padding: 1rem 1.25rem;
}

body.single-product .woocommerce-tabs .tabs li a {
	color: var(--cd-primary-blue) !important;
	font-family: var(--cd-font-display);
	font-weight: 400;
}

body.single-product .woocommerce-tabs .panel h2,
body.single-product .woocommerce-tabs .panel h3 {
	font-family: var(--cd-font-display);
	font-weight: 400;
	color: var(--cd-primary-blue);
}

body.single-product .woocommerce-tabs .panel,
body.single-product .woocommerce-tabs .panel p,
body.single-product .woocommerce-tabs .panel li,
body.single-product .woocommerce-tabs .panel td,
body.single-product .woocommerce-tabs .panel th {
	font-family: var(--cd-font-body);
}

body.single-product .cd-related-products {
	position: relative;
	margin-top: 2rem;
	padding: 1rem 0 0.75rem;
}

body.single-product .cd-related-products::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	height: clamp(8.5rem, 18vw, 12rem);
	background: var(--cd-primary-blue);
	z-index: 0;
}

body.single-product .cd-related-products__head {
	position: relative;
	z-index: 1;
	text-align: center;
	margin-bottom: 0.9rem;
}

body.single-product .cd-related-products__head h2 {
	margin: 0;
	font-family: var(--cd-font-display);
	font-weight: 400;
	color: #fff;
	font-size: clamp(1.7rem, 3vw, 2.2rem);
	line-height: 1.1;
	text-transform: lowercase;
}

body.single-product .cd-related-products__subtitle {
	margin: 0.15rem 0 0;
	font-family: var(--cd-font-body);
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.2;
}

body.single-product .cd-related-products ul.products {
	position: relative;
	z-index: 1;
	max-width: 1120px;
	margin: 0 auto !important;
	padding: 0 0.5rem !important;
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.1rem;
}

body.single-product .cd-related-products ul.products::before,
body.single-product .cd-related-products ul.products::after {
	content: none !important;
	display: none !important;
}

body.single-product .cd-related-products ul.products li.product {
	background: #fff;
	margin: 0 !important;
	border-radius: 8px;
	padding-bottom: 0.75rem !important;
	box-shadow: 0 4px 16px rgba(84, 94, 201, 0.12);
}

/* Produits similaires : pas de prix (wc-block-grid__product-price = boucle uniquement) */
body.single-product .wc-block-grid__product-price,
body.single-product .wp-block-woocommerce-product-template .wc-block-components-product-price,
body.single-product .wp-block-woocommerce-product-collection .wc-block-components-product-price,
body.single-product .wp-block-woocommerce-related-products .wc-block-components-product-price {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}

body.single-product .cd-related-products ul.products li.product .price {
	display: none !important;
}

@media (max-width: 1024px) {
	body.single-product .cd-related-products ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	body.single-product .cd-related-products ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Compatibilite WooCommerce Blocks (si le template PHP related.php n'est pas utilise). */
body.single-product .wp-block-woocommerce-related-products {
	position: relative;
	margin-top: 2rem;
	padding: 1rem 0 0.75rem;
}

body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] {
	position: relative;
	margin-top: 2rem;
	padding: 1rem 0 0.75rem;
}

body.single-product .related.products,
body.single-product .wc-block-related-products {
	position: relative;
	margin-top: 2rem;
	padding: 1rem 0 0.75rem;
}

body.single-product .cd-related-products-block {
	position: relative;
	margin-top: 2rem;
	padding: 1rem 0 0.75rem;
}

body.single-product .wp-block-woocommerce-related-products::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	height: clamp(8.5rem, 18vw, 12rem);
	background: var(--cd-primary-blue);
	z-index: 0;
}

body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"]::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	height: clamp(8.5rem, 18vw, 12rem);
	background: var(--cd-primary-blue);
	z-index: 0;
}

body.single-product .related.products::before,
body.single-product .wc-block-related-products::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	height: clamp(8.5rem, 18vw, 12rem);
	background: var(--cd-primary-blue);
	z-index: 0;
}

body.single-product .cd-related-products-block::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	height: clamp(8.5rem, 18vw, 12rem);
	background: var(--cd-primary-blue);
	z-index: 0;
}

body.single-product .wp-block-woocommerce-related-products > h2 {
	position: relative;
	z-index: 1;
	margin: 0 0 0.9rem;
	text-align: center;
	color: transparent;
	font-size: 0;
	line-height: 0;
}

body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] > h2 {
	position: relative;
	z-index: 1;
	margin: 0 0 0.9rem;
	text-align: center;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
}

body.single-product .related.products > h2,
body.single-product .wc-block-related-products > h2 {
	position: relative;
	z-index: 1;
	margin: 0 0 0.9rem;
	text-align: center;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
}

body.single-product .related.products > h2::before,
body.single-product .wc-block-related-products > h2::before {
	content: "jette un coup d'oeil !";
	display: block;
	font-family: var(--cd-font-display);
	font-weight: 400;
	color: #fff;
	font-size: clamp(1.7rem, 3vw, 2.2rem);
	line-height: 1.1;
	text-transform: lowercase;
}

body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] > h2::before {
	content: "jette un coup d'oeil !";
	display: block;
	font-family: var(--cd-font-display);
	font-weight: 400;
	color: #fff;
	font-size: clamp(1.7rem, 3vw, 2.2rem);
	line-height: 1.1;
	text-transform: lowercase;
}

body.single-product .related.products > h2::after,
body.single-product .wc-block-related-products > h2::after {
	content: "peut-etre que ca te plaira";
	display: block;
	margin-top: 0.15rem;
	font-family: var(--cd-font-body);
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.2;
}

body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] > h2::after {
	content: "peut-etre que ca te plaira";
	display: block;
	margin-top: 0.15rem;
	font-family: var(--cd-font-body);
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.2;
}

body.single-product .cd-related-products-block > h2 {
	position: relative;
	z-index: 1;
	margin: 0;
	text-align: center;
	font-family: var(--cd-font-display);
	font-weight: 400;
	color: #fff;
	font-size: clamp(1.7rem, 3vw, 2.2rem);
	line-height: 1.1;
	text-transform: lowercase;
}

body.single-product .wp-block-woocommerce-related-products > h2::before {
	content: "jette un coup d'oeil !";
	display: block;
	font-family: var(--cd-font-display);
	font-weight: 400;
	color: #fff;
	font-size: clamp(1.7rem, 3vw, 2.2rem);
	line-height: 1.1;
	text-transform: lowercase;
}

body.single-product .wp-block-woocommerce-related-products > h2::after {
	content: "peut-etre que ca te plaira";
	display: block;
	margin-top: 0.15rem;
	font-family: var(--cd-font-body);
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.2;
}

body.single-product .cd-related-products-block .cd-related-products__subtitle {
	position: relative;
	z-index: 1;
	margin: 0.15rem 0 0.9rem;
	text-align: center;
	font-family: var(--cd-font-body);
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.2;
}

body.single-product .wp-block-woocommerce-related-products ul.wc-block-grid__products,
body.single-product .wp-block-woocommerce-related-products ul.wc-block-product-template,
body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] ul.wc-block-grid__products,
body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] ul.wc-block-product-template {
	position: relative;
	z-index: 1;
	max-width: 1120px;
	margin: 0 auto !important;
	padding: 0 0.5rem !important;
}

body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] .wc-block-product-template.is-flex-container {
	justify-content: center;
}

body.single-product .wp-block-woocommerce-related-products li.wc-block-grid__product,
body.single-product .wp-block-woocommerce-related-products li.wc-block-product,
body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] li.wc-block-grid__product,
body.single-product .wp-block-woocommerce-product-collection[data-collection*="related"] li.wc-block-product {
	background: #fff;
	border-radius: 8px;
	padding: 0.5rem 0.5rem 0.75rem !important;
	box-shadow: 0 4px 16px rgba(84, 94, 201, 0.12);
}

/* Bandeau produits suggérés (fiche produit, au-dessus de la newsletter) */
body.single-product .cd-product-suggestions {
	--cd-suggestions-overlap: 4.1rem;
	--cd-suggestion-card-width: 200px;
	position: relative;
	background: #fff;
	margin-top: 2rem;
	margin-bottom: 0;
	padding: 0 0 2.5rem;
	overflow: visible;
}

body.single-product .cd-product-suggestions__head {
	background: var(--cd-primary-blue);
	color: #fff;
	text-align: center;
	padding: 1rem 1rem 10.25rem;
	margin: 0 calc(50% - 50vw);
}

body.single-product .cd-product-suggestions__head h2 {
	margin: 0;
	font-family: var(--cd-font-display);
	font-weight: 400;
	color: #fff;
	font-size: clamp(1.7rem, 3vw, 2.2rem);
	line-height: 1.1;
	text-transform: lowercase;
}

body.single-product .cd-product-suggestions__subtitle {
	margin: 0.15rem 0 0;
	font-family: var(--cd-font-body);
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.2;
}

body.single-product .cd-product-suggestions__body {
	max-width: 1120px;
	margin: calc(var(--cd-suggestions-overlap) * -2.2) auto 0;
	padding: 0 0.5rem;
	position: relative;
	z-index: 2;
}

body.single-product .cd-product-suggestions__body ul.products {
	display: flex !important;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	gap: 1.25rem;
	margin: 0 !important;
	padding: 0.5rem 0 1rem !important;
	list-style: none;
	width: 100%;
	grid-template-columns: unset !important;
}

body.single-product .cd-product-suggestions__body ul.products[class*="columns-"] li.product {
	width: var(--cd-suggestion-card-width) !important;
	max-width: var(--cd-suggestion-card-width) !important;
	margin: 0 !important;
}

body.single-product .cd-product-suggestions__body ul.products li.product {
	flex: 0 0 var(--cd-suggestion-card-width) !important;
	width: var(--cd-suggestion-card-width) !important;
	max-width: var(--cd-suggestion-card-width) !important;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
	background: #fff;
	border: 1px solid transparent;
	border-radius: 8px;
	overflow: hidden;
	padding-bottom: 0.85rem !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

body.single-product .cd-product-suggestions__body ul.products li.product:hover,
body.single-product .cd-product-suggestions__body ul.products li.product:focus-within {
	border-color: rgba(124, 58, 237, 0.25);
	box-shadow: 0 4px 16px rgba(124, 58, 237, 0.12);
}

body.single-product .cd-product-suggestions__body ul.products li.product a.woocommerce-loop-product__link {
	display: block;
	padding-top: 0.5rem;
	text-decoration: none;
}

body.single-product .cd-product-suggestions__body ul.products li.product .woocommerce-loop-product__link img,
body.single-product .cd-product-suggestions__body ul.products li.product img {
	display: block;
	width: 100% !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 11.5rem !important;
	aspect-ratio: auto !important;
	object-fit: contain;
	margin: 0 auto;
}

body.single-product .cd-product-suggestions__body ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--cd-font-display);
	font-weight: 400;
	font-size: 0.9rem !important;
	line-height: 1.35;
	color: var(--cd-primary-blue) !important;
	padding: 0 0.75rem !important;
	margin: 0.45rem 0 0.2rem !important;
	text-align: left;
}

body.single-product .cd-product-suggestions__body ul.products li.product .price {
	display: block !important;
	color: var(--cd-primary-orange) !important;
	font-family: var(--cd-font-body);
	font-weight: 600 !important;
	font-size: 0.95rem;
	padding: 0 0.75rem !important;
	margin: 0 !important;
	text-align: left;
}

body.single-product .cd-product-suggestions__body ul.products li.product .button,
body.single-product .cd-product-suggestions__body ul.products li.product .added_to_cart {
	display: none !important;
}

@media (max-width: 767px) {
	body.single-product .cd-product-suggestions {
		--cd-suggestions-overlap: 3.25rem;
		--cd-suggestion-card-width: min(200px, calc(50% - 0.625rem));
	}

	body.single-product .cd-product-suggestions__head {
		padding-bottom: 8.5rem;
	}
}

body.single-product .cd-product-suggestions__body ul.products::before,
body.single-product .cd-product-suggestions__body ul.products::after {
	content: none !important;
	display: none !important;
}

