/* ==========================================================================
   ALEN / Ensueño — Product page
   Paleta: #0a1690 azul marino · #80144c vino · #0d6af1 azul · #48c5ff celeste
   ========================================================================== */

:root{
	--ens-navy:#0a1690;
	--ens-wine:#80144c;
	--ens-blue:#0d6af1;
	--ens-sky:#48c5ff;
	--ens-ink:#2b2f45;
	--ens-line:#e3e8f5;
}

/* --- Catálogo: nada de precios ni carrito -------------------------------- */
.single-product .price,
.single-product .quantity,
.woocommerce-variation-price,
.single_add_to_cart_button,
.woocommerce-variation-availability{ display:none !important; }

/* --- Título y encabezado ------------------------------------------------- */
.single-product .product_title{
	color:var(--ens-navy);
	font-weight:600;
	line-height:1.15;
	margin-bottom:.35em;
}
.alen-bv-rating{ margin:0 0 1.25rem; min-height:22px; }

/* --- Selectores de variante --------------------------------------------- */
.single-product .variations{ margin-bottom:1rem; }
.single-product .variations th.label label{
	color:var(--ens-navy);
	font-size:.8rem;
	font-weight:600;
	letter-spacing:.03em;
	text-transform:uppercase;
}
.single-product .variations select{
	width:100%;
	padding:.7rem .9rem;
	border:1px solid var(--ens-line);
	border-radius:10px;
	background:#fff;
	color:var(--ens-ink);
	font-size:1rem;
}
.single-product .variations select:focus{
	outline:2px solid var(--ens-blue);
	outline-offset:1px;
	border-color:var(--ens-blue);
}
.reset_variations{ font-size:.8rem; color:var(--ens-blue); }

/* --- Loads + UPC --------------------------------------------------------- */
.alen-var-meta{
	display:flex;
	align-items:center;
	gap:.75rem;
	flex-wrap:wrap;
	margin:.35rem 0 1.1rem;
	min-height:26px;
}
.alen-loads{
	background:#eef2ff;
	color:var(--ens-wine);
	font-weight:600;
	font-size:.9rem;
	padding:.3rem .75rem;
	border-radius:999px;
}
.alen-loads[data-empty]{ display:none; }
.alen-upc{ font-size:.78rem; color:#8b90a6; }

/* --- Where to Buy -------------------------------------------------------- */
.alen-wtb{
	display:block;
	width:100%;
	text-align:center;
	background:var(--ens-navy);
	color:#fff !important;
	padding:.95rem 1.5rem;
	border-radius:10px;
	font-weight:600;
	font-size:1rem;
	text-decoration:none;
	transition:background .18s ease, transform .18s ease;
}
.alen-wtb:hover{ background:var(--ens-blue); transform:translateY(-1px); }
.alen-wtb:focus-visible{ outline:3px solid var(--ens-sky); outline-offset:2px; }
.alen-wtb-note{
	margin:.5rem 0 0;
	text-align:center;
	font-size:.78rem;
	color:#8b90a6;
}

/* --- Cuadro de beneficios ------------------------------------------------ */
.alen-benefits{ margin:3.5rem 0; }
.alen-benefits > h2{
	color:var(--ens-navy);
	font-size:1.6rem;
	font-weight:600;
	margin-bottom:1.25rem;
}
.alen-benefits-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
	gap:1rem;
}
.alen-benefit{
	background:#f7f9ff;
	border:1px solid var(--ens-line);
	border-radius:14px;
	padding:1.4rem 1.2rem;
}
.alen-benefit-ico{
	width:38px;
	height:38px;
	color:var(--ens-blue);
	margin-bottom:.6rem;
}
.alen-benefit h3{
	color:var(--ens-navy);
	font-size:1rem;
	font-weight:600;
	margin:0 0 .3rem;
}
.alen-benefit p{
	margin:0;
	font-size:.88rem;
	line-height:1.55;
	color:#5c6280;
}

/* --- Reseñas / Q&A ------------------------------------------------------- */
.alen-bv-widgets{ margin:3.5rem 0; }
.alen-bv-widgets > h2{
	color:var(--ens-navy);
	font-size:1.6rem;
	font-weight:600;
	margin-bottom:1rem;
}
#alen-bv-reviews{ min-height:120px; }

/* --- Relacionados por aroma --------------------------------------------- */
.alen-related{ margin:3.5rem 0; }
.alen-related > h2{
	color:var(--ens-navy);
	font-size:1.6rem;
	font-weight:600;
	margin-bottom:1.25rem;
}

/* ==========================================================================
   FICHA DE PRODUCTO — dos columnas
   Salient ya maqueta imagen izquierda / resumen derecha con float.
   Aquí NO se toca el float ni el ancho: solo se acota la imagen y se
   ordena la columna derecha.
   ========================================================================== */

/* --- Columna de la imagen ------------------------------------------------ */
body.single-product div.product div.images,
body.single-product div.product .woocommerce-product-gallery{
	background:linear-gradient(160deg,#f7f9ff 0%,#eef3ff 100%);
	border:1px solid var(--ens-line);
	border-radius:20px;
	padding:2rem 1.5rem;
}
body.single-product div.product div.images img,
body.single-product .woocommerce-product-gallery__image img{
	max-height:440px;
	width:auto !important;
	height:auto;
	margin:0 auto;
	display:block;
	object-fit:contain;
	mix-blend-mode:multiply;   /* funde el fondo blanco del render */
}

/* Miniaturas */
body.single-product .flex-control-thumbs,
body.single-product div.product div.thumbnails{
	display:flex;
	gap:.6rem;
	justify-content:center;
	margin-top:1.25rem;
	padding:0;
	list-style:none;
}
body.single-product .flex-control-thumbs li,
body.single-product div.product div.thumbnails > *{
	width:64px;
	margin:0;
	border:1px solid var(--ens-line);
	border-radius:10px;
	background:#fff;
	padding:.35rem;
	cursor:pointer;
	transition:border-color .18s ease;
}
body.single-product .flex-control-thumbs li:hover{ border-color:var(--ens-blue); }
body.single-product .flex-control-thumbs li img{
	max-height:52px;
	width:auto;
	margin:0 auto;
	display:block;
	object-fit:contain;
}
/* ================ Estructura de cada producto - tipo Tide  ====== */
body.single-product .woocommerce-variation-description{ display:none !important; }

/* --- Rating arriba del título -------------------------------------------- */
.alen-bv-rating{ margin:0 0 .5rem; min-height:20px; }
body.single-product div.product .summary .product_title{
	font-size:2.1rem;
	letter-spacing:-.01em;
	margin:0 0 .5rem;
}

/* --- Descriptor de una línea --------------------------------------------- */
.alen-sub{
	color:#5c6280;
	font-size:1rem;
	line-height:1.5;
	margin:0 0 1.25rem;
	padding-bottom:1.25rem;
	border-bottom:1px solid var(--ens-line);
}

/* --- Bullets: lo que llena la columna sin estirarla ---------------------- */
.alen-bullets{
	list-style:none;
	margin:0 0 1.75rem;
	padding:0;
}
.alen-bullets li{
	position:relative;
	padding-left:1.75rem;
	margin-bottom:.7rem;
	font-size:.94rem;
	line-height:1.5;
	color:var(--ens-ink);
}
.alen-bullets li::before{
	content:"";
	position:absolute;
	left:0;
	top:.28em;
	width:1.05rem;
	height:1.05rem;
	border-radius:50%;
	background:var(--ens-blue)
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")
		center/.68rem no-repeat;
}
.alen-bullets:empty{ display:none; }

/* --- Overview + Features, lado a lado ------------------------------------ */
.alen-overview-wrap{
	clear:both;
	display:grid;
	grid-template-columns:1fr;
	gap:2.5rem;
	margin:3.5rem 0;
	padding-top:2.5rem;
	border-top:1px solid var(--ens-line);
}
@media (min-width:1000px){
	.alen-overview-wrap{ grid-template-columns:1.35fr 1fr; gap:4rem; }
	/* ================ Estructura de cada producto - tipo Tide  ====== */
	body.single-product div.product div.images,
	body.single-product div.product .woocommerce-product-gallery{
		display:flex;
		flex-direction:column;
		justify-content:center;
		min-height:540px;
	}
	/* ================ End Estructura de cada producto - tipo Tide  ====== */
}
.alen-overview-wrap h2{
	color:var(--ens-navy);
	font-size:1.6rem;
	font-weight:600;
	margin:0 0 1.25rem;
}
.alen-overview{
	font-size:.95rem;
	line-height:1.75;
	color:#4a5070;
}
.alen-overview p{ margin:0 0 1rem; }
.alen-overview p:last-child{ margin-bottom:0; }

.alen-features{
	list-style:none;
	margin:0;
	padding:0;
	background:#f7f9ff;
	border:1px solid var(--ens-line);
	border-radius:16px;
	overflow:hidden;
}
.alen-features li{
	padding:.85rem 1.25rem;
	font-size:.9rem;
	line-height:1.55;
	color:#4a5070;
	border-bottom:1px solid var(--ens-line);
}
.alen-features li:last-child{ border-bottom:0; }

/* --- Secciones de abajo, separadas parejo -------------------------------- */
.alen-benefits,
.alen-bv-widgets,
.alen-related{
	margin:3.5rem 0;
	padding-top:2.5rem;
	border-top:1px solid var(--ens-line);
}
.alen-overview-wrap + .alen-benefits{ border-top:0; padding-top:0; }
/* ================ End Estructura de cada producto - tipo Tide  ====== */

/* La imagen acompaña al scroll mientras se leen los datos */
@media (min-width:1000px){
	body.single-product div.product div.images,
	body.single-product div.product .woocommerce-product-gallery{
		position:sticky;
		top:120px;
	}
}

/* --- Columna derecha: título y datos ------------------------------------- */
body.single-product div.product .summary .product_title{
	font-size:2.1rem;
	letter-spacing:-.01em;
	margin-top:0;
}

/* Descripción de la variante */
.alen-var-desc{
	color:#4a5070;
	font-size:.95rem;
	line-height:1.7;
	margin:0 0 1.5rem;
}
.alen-var-desc p{ margin:0 0 .8rem; }
.alen-var-desc p:last-child{ margin-bottom:0; }
.alen-var-desc ul{ margin:.4rem 0 .8rem; padding-left:1.1rem; }
.alen-var-desc li{ margin-bottom:.35rem; }

/* Los selectores viven en su propia tarjeta, separados del texto */
body.single-product .variations_form{
	background:#fff;
	border:1px solid var(--ens-line);
	border-radius:16px;
	padding:1.5rem;
	box-shadow:0 2px 14px rgba(10,22,144,.05);
}
body.single-product .variations{ width:100%; }
body.single-product .variations tr{ display:block; margin-bottom:.9rem; }
body.single-product .variations th,
body.single-product .variations td{ display:block; width:100%; padding:0; text-align:left; }
body.single-product .variations th.label{ margin-bottom:.35rem; }

/* Metadatos del SKU: fuera de la tarjeta, discretos */
body.single-product .product_meta{
	margin-top:1.5rem;
	padding-top:1.25rem;
	border-top:1px solid var(--ens-line);
	font-size:.82rem;
	color:#8b90a6;
}
body.single-product .product_meta a{ color:var(--ens-blue); }

/* --- La tabla "Additional information" duplica los selectores ------------ */
body.single-product .woocommerce-tabs .additional_information_tab,
body.single-product .woocommerce-Tabs-panel--additional_information{ display:none !important; }

/* --- Secciones de abajo, a todo lo ancho --------------------------------- */
.alen-benefits,
.alen-bv-widgets,
.alen-related{ clear:both; }

/* ==========================================================================
   SHORTCODE [alen_aromas] — galería de familias por tipo
   ========================================================================== */
.alen-aromas{
	display:grid !important;
	grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)) !important;
	gap:1.5rem;
}

.alen-aroma-card{
	display:flex;
	flex-direction:column;
	text-decoration:none;
	color:inherit;
}

.alen-aroma-img{
	background:linear-gradient(160deg,#f7f9ff 0%,#eef3ff 100%);
	border:1px solid var(--ens-line);
	border-radius:18px;
	padding:1.25rem;
	margin-bottom:1rem;
	transition:border-color .18s ease, transform .18s ease;
}
/*.alen-aroma-img img{
	width:100%;
	height:230px;
	object-fit:contain;
	display:block;
	margin:0;
}*/
.alen-aroma-card:hover .alen-aroma-img{
	border-color:var(--ens-blue);
	transform:translateY(-3px);
}

.alen-aroma-name{
	color:var(--ens-navy);
	font-size:1.15rem;
	font-weight:600;
	line-height:1.25;
	margin:0 0 .35rem;
}
/* Etiqueta de línea (Original / Max) en las tarjetas. */
.alen-aroma-linea{
	display:inline-block;
	align-self:flex-start;
	margin:0 0 .5rem;
	padding:2px 10px;
	border:1px solid var(--ens-blue);
	border-radius:999px;
	color:var(--ens-blue);
	font-size:.7rem;
	font-weight:600;
	letter-spacing:.06em;
	text-transform:uppercase;
	line-height:1.7;
}
.alen-aroma-cta{
	color:var(--ens-blue);
	font-size:.9rem;
	font-weight:600;
	margin-top:auto;
	padding-top:.6rem;
}
.alen-aroma-card:hover .alen-aroma-cta{ text-decoration:underline; }
@media (max-width:600px){
	.alen-aromas{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1.5rem 1rem; }
	.alen-aroma-img img{ height:160px; }
	.alen-aroma-name{ font-size:1rem; }
}
/* ==========================================================================
   END -- SHORTCODE [alen_aromas] — galería de familias por tipo
   ========================================================================== */
/* ====== Benefits de cada producto ====== */
.alen-benefit-list{
	margin:0;
	padding-left:1.1rem;
	list-style:disc;
}
.alen-benefit-list li{
	margin:0 0 .45rem;
	font-size:.88rem;
	line-height:1.5;
	color:#5c6280;
}
.alen-benefit-list li:last-child{ margin-bottom:0; }
/* ====== End Benefits de cada producto ====== */

/* Resultados por aroma / need */
.alen-resultados-titulo{
	text-align:center;
	margin:0 0 1.5rem;
	color:#0B2E6F;
}
.alen-resultados-vacio{
	text-align:center;
	padding:2rem 0;
	color:#0B2E6F;
}
/* End Resultados por aroma / need */

/* ====== Botón de Questions de Bazaarvoice ====== */
.buQBrg {
    background-color: #80144c !important;
    width: 115px;
    height: 50px;
    padding: 10px !important;
    border-radius: 15px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
 }
/* ====== End Botón de Questions de Bazaarvoice ====== */

/* Quitar viñetas negras productos */
body.single-product ul.alen-bullets,
body.single-product ul.alen-bullets > li,
body.single-product ul.alen-features,
body.single-product ul.alen-features > li{
	list-style:none !important;
	list-style-type:none !important;
	list-style-image:none !important;
}
body.single-product ul.alen-bullets > li,
body.single-product ul.alen-features > li{
	background-image:none !important;
}
body.single-product ul.alen-bullets > li::marker,
body.single-product ul.alen-features > li::marker{
	content:"" !important;
	color:transparent !important;
	font-size:0 !important;
}
/* End Quitar viñetas negras productos */

/* El botón de Where to Buy solo tiene sentido con un SKU asignado */
.ps-widget:not([ps-sku]),
.ps-widget[ps-sku=""]{
	display:none !important;
}
.ps-widget:not([ps-sku]) + .alen-wtb-note,
.ps-widget[ps-sku=""] + .alen-wtb-note{
	display:none !important;
}
/* Iconos de benefits: se animan mientras la sección está en pantalla */
.alen-benefits .alen-benefit-ico{
	animation: ens-flota 3.4s ease-in-out infinite;
	animation-play-state: paused;
}
.alen-benefits.en-vista .alen-benefit-ico{ animation-play-state: running; }

.alen-benefits .alen-benefit:nth-child(2) .alen-benefit-ico{ animation-delay: .4s; }
.alen-benefits .alen-benefit:nth-child(3) .alen-benefit-ico{ animation-delay: .8s; }
.alen-benefits .alen-benefit:nth-child(4) .alen-benefit-ico{ animation-delay: 1.2s; }

/* LINE con una sola opción: la fila no aporta nada */
body.alen-linea-unica .variations tr:has(select[name="attribute_pa_linea"]),
body.alen-linea-unica .variations tr:has(#pa_linea){ display:none !important; }
/* El "Clear" borraría la línea escondida y dejaría la ficha sin variación */
body.alen-linea-unica .reset_variations{ display:none !important; }

/* Tamaños por línea bajo cada tarjeta de [alen_aromas] */
.alen-aroma-tamanos{
	margin:.3rem 0 0;
	font-size:.82rem;
	line-height:1.4;
}
.alen-tam-linea{
	display:block;
	color:#6b7280;
	font-size:.72rem;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:.04em;
	margin-top:.5rem;
}
.alen-tam-lista{
	display:block;
	color:var(--ens-navy);
}
@media (max-width:600px){
	.alen-aroma-tamanos{ font-size:.75rem; }
	.alen-tam-linea{ font-size:.68rem; }
}

@keyframes ens-flota{
	0%,100% { transform: translateY(0); }
	50%     { transform: translateY(-5px); }
}

@media (prefers-reduced-motion: reduce){
	.alen-benefits .alen-benefit-ico{ animation: none !important; }
}

/* Filtros By Type / By Need / By Aroma */
.ensueno-filters{ text-align:center; padding:20px 0 30px; }
.filter-tabs{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-bottom:16px; }
.filter-tab{
	border:2px solid #0B2E6F; background:transparent; color:#0B2E6F;
	padding:9px 28px; border-radius:30px; font-size:15px; font-weight:600;
	cursor:pointer; transition:background .25s ease, color .25s ease; font-family:inherit;
}
.filter-tab.is-active, .filter-tab:hover{ background:#0B2E6F; color:#fff; }
.filter-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.filter-chips.is-hidden{ display:none; }
.chip{
	border:1.5px solid #80144c; background:transparent; color:#80144c;
	padding:7px 18px; border-radius:30px; font-size:13px; font-weight:500;
	transition:background .2s ease, color .2s ease; font-family:inherit;
	text-decoration:none; display:inline-block; line-height:1.5;
}
.chip.is-active, .chip:hover{ background:#80144c; color:#fff; }
/* Tarjetas parejas: todas del mismo alto, con el CTA abajo. */
.alen-aromas{
	align-items:stretch;
}
.alen-aroma-card{
	height:100%;
}
.alen-aroma-img{
	display:flex;
	align-items:center;
	justify-content:center;
	height:300px;
}
.alen-aroma-img img{
	max-height:100%;
	width:auto;
	height:auto;
	object-fit:contain;
}
.alen-aroma-tamanos{
	min-height:2.6em;
}
@media (max-width:600px){
	.filter-tab{ padding:8px 18px; font-size:14px; }
	.chip{ padding:6px 14px; font-size:12px; }
	.alen-aromas .alen-aroma-card{
		padding-bottom:1.25rem;
		border-bottom:2px solid var(--ens-blue);
	}
}
/* End Filtros By Type / By Need / By Aroma */
/* Título de cada bloque de línea dentro de la rejilla de aromas. */
.alen-aromas-grupo{
	grid-column:1 / -1 !important;
	width:100%;
	margin:0;
	font-size:1.15rem;
	font-weight:700;
	color:var(--ens-blue);
}
.alen-aromas-grupo:not(:first-child){ margin-top:1.5rem; }

/* --- Móvil --------------------------------------------------------------- */
@media (max-width:999px){
	body.single-product div.product div.images,
	body.single-product div.product .woocommerce-product-gallery{
		padding:1.25rem;
		margin-bottom:1.75rem;
	}
	body.single-product div.product div.images img{ max-height:320px; }
	body.single-product div.product .summary .product_title{ font-size:1.6rem; }
	body.single-product .variations_form{ padding:1.1rem; }

	/* ================ Estructura de cada producto - tipo Tide  ====== */
	body.single-product div.product .summary .product_title{ font-size:1.6rem; }
	.alen-features li{ padding:.75rem 1rem; }
	/* ================ End Estructura de cada producto - tipo Tide  ====== */
}

/*** diseño de visualización de c/producto ****/
@media (min-width:1000px){
	body.single-product div.product div.images,
	body.single-product div.product .woocommerce-product-gallery{
		min-height:0;
	}
	body.single-product div.product:has(.variations_form) div.images,
	body.single-product div.product:has(.variations_form) .woocommerce-product-gallery{
		min-height:500px;
	}
}

/* Colchón por si el tema no limpia el float */
.alen-overview-wrap{ margin-top:4rem; }

/* Si solo hay Overview (sin bloque FEATURES), que ocupe todo el ancho
   en vez de dejar media rejilla vacía. */
.alen-overview-wrap .alen-col:only-child{ grid-column:1 / -1; }
@media (min-width:1000px){
	.alen-overview-wrap .alen-col:only-child .alen-overview{
		columns:2;
		column-gap:4rem;
	}
	.alen-overview-wrap .alen-col:only-child .alen-overview p{ break-inside:avoid; }
	.alen-overview-wrap .alen-col:only-child .alen-overview p:first-child{ margin-top:0; }
}

/* La lista vacía no debe dejar espacio */
.alen-bullets:empty,
.alen-features:empty{ display:none; }
.alen-sub:empty{ display:none; margin:0; padding:0; border:0; }
/* La rejilla se acomoda sola: con una columna ocupa todo el ancho,
   con dos las reparte. Más confiable que depender de :only-child. */
@media (min-width:1000px){
	.alen-overview-wrap{
		grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));
	}
}

/* Overview solo: a dos columnas de texto para no dejar la línea larguísima */
.alen-overview-wrap .alen-col:only-child .alen-overview{ column-gap:4rem; }
@media (min-width:1000px){
	.alen-overview-wrap .alen-col:only-child .alen-overview{ columns:2; }
	.alen-overview-wrap .alen-col:only-child .alen-overview p{ break-inside:avoid; }
}

/* El JS repinta .alen-features con TODAS las características al cambiar
   de presentación. Que respete el mismo criterio: las 4 primeras ya
   están arriba. */
.alen-features li.alen-dup{ display:none; }