/* Silere · producto.css — ficha de producto (PDP), segunda capa sobre tienda.css:
   selector de tamaño en botones (main.js), garantías (inc/tienda.php), galería,
   descripción, información adicional, valoraciones, relacionados y metadatos.
   Ancla #page-container #et-boc (2,x,x): le gana a los presets de Divi (1,4,1). */

/* ---- Columna de compra ------------------------------------------------------------------- */
/* Resumen, compra y avisos viven dentro de un módulo Contadores (herencia de Divi 4) que
   es una lista con sangría: se alinea con el título. */
#page-container #et-boc .et_pb_counters:has(.et_pb_wc_add_to_cart) {
	margin: 0;
	padding-left: 0;
}

#page-container #et-boc .et_pb_wc_description p {
	font-size: 1rem;
	line-height: 1.75;
	color: var(--cc-texto-suave);
}

/* ---- Tamaño en botones ---------------------------------------------------------------------- */
/* main.js crea los botones; el <select> de WooCommerce queda oculto y sincronizado. */
#page-container #et-boc .et_pb_wc_add_to_cart td.cc-con-tallas select {
	display: none;
}

#page-container #et-boc .cc-tallas {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 0.75rem;
}

#page-container #et-boc .cc-talla {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	padding: 0.9rem 1rem;
	border: 1px solid rgba(74, 66, 56, 0.3);
	border-radius: 8px;
	background-color: #fff;
	/* El preset del módulo pone todo label de .variations en mayúsculas y otra fuente. */
	font-family: "Quicksand", sans-serif;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
	transition: border-color var(--cc-duracion) var(--cc-curva), box-shadow var(--cc-duracion) var(--cc-curva);
}

/* El radio nativo queda accesible (foco y flechas) pero invisible: la tarjeta es el control. */
#page-container #et-boc .cc-talla input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

#page-container #et-boc .cc-talla:hover {
	border-color: var(--cc-texto);
}

#page-container #et-boc .cc-talla:has(input:checked) {
	border-color: var(--cc-texto);
	box-shadow: 0 0 0 1px var(--cc-texto);
	background-color: var(--cc-superficie);
}

#page-container #et-boc .cc-talla:has(input:focus-visible) {
	outline: 2px solid var(--cc-texto);
	outline-offset: 3px;
}

#page-container #et-boc .cc-talla.is-disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

#page-container #et-boc .cc-talla-nombre {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--cc-texto);
}

#page-container #et-boc .cc-talla-precio {
	font-size: 0.85rem;
	color: var(--cc-texto-suave);
}

/* El precio de la variación ya está en el botón: queda solo la disponibilidad. */
#page-container #et-boc .et_pb_wc_add_to_cart:has(.cc-tallas) .woocommerce-variation-price {
	display: none;
}

#page-container #et-boc .et_pb_wc_add_to_cart .woocommerce-variation.single_variation {
	margin-bottom: 1rem;
}

/* ---- Garantías bajo el botón ------------------------------------------------------------------ */
#page-container #et-boc .cc-ficha-garantias {
	display: grid;
	gap: 0.5rem;
	margin: 1.25rem 0 0;
	padding: 1.1rem 0 0;
	border-top: 1px solid var(--cc-borde);
	list-style: none;
}

#page-container #et-boc .cc-ficha-garantias li {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0;
	font-size: 0.85rem;
	line-height: 1.4;
	color: var(--cc-texto-suave);
}

#page-container #et-boc .cc-ficha-garantias li::before {
	content: "";
	flex: none;
	width: 0.9rem;
	height: 0.9rem;
	background-color: var(--cc-eucalipto-texto);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---- Galería: miniaturas en una fila ---------------------------------------------------------- */
body.single-product #page-container #et-boc .woocommerce-product-gallery .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)) !important; /* El módulo Imágenes fija su grilla con !important. */
	gap: 0.6rem;
	margin: 0.75rem 0 0;
	padding: 0;
}

body.single-product #page-container #et-boc .woocommerce-product-gallery .flex-control-thumbs li {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}

body.single-product #page-container #et-boc .woocommerce-product-gallery .flex-control-thumbs img {
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	border-radius: var(--gvid-cc-radio);
	object-fit: cover;
	opacity: 0.55;
	outline: 1px solid transparent;
	outline-offset: 2px;
	transition: opacity var(--cc-duracion) var(--cc-curva), outline-color var(--cc-duracion) var(--cc-curva);
}

body.single-product #page-container #et-boc .woocommerce-product-gallery .flex-control-thumbs img:hover,
body.single-product #page-container #et-boc .woocommerce-product-gallery .flex-control-thumbs img.flex-active {
	opacity: 1;
}

body.single-product #page-container #et-boc .woocommerce-product-gallery .flex-control-thumbs img.flex-active {
	outline-color: var(--cc-texto);
}

body.single-product #page-container #et-boc .woocommerce-product-gallery__trigger {
	box-shadow: 0 4px 12px -4px rgba(24, 48, 40, 0.3);
}

/* ---- Descripción ------------------------------------------------------------------------------- */
#page-container #et-boc .et-l .et_pb_wc_tabs .et_pb_all_tabs .et_pb_tab {
	padding: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
	border-radius: 8px;
}

#page-container #et-boc .et-l .et_pb_wc_tabs:has(.description_tab) .et_pb_tab_content h3 {
	margin: 2rem 0 0.75rem;
	padding: 0;
	font-family: "Petit Formal Script", cursive;
	font-size: clamp(1.4rem, 1.2rem + 0.6vw, 1.75rem) !important; /* El preset por defecto de Texto fija el tamaño. */
	font-weight: 400;
	letter-spacing: 0 !important;
	line-height: 1.35 !important;
	color: var(--cc-texto) !important;
}

#page-container #et-boc .et-l .et_pb_wc_tabs:has(.description_tab) .et_pb_tab_content h3:first-child {
	margin-top: 0;
}

#page-container #et-boc .et-l .et_pb_wc_tabs:has(.description_tab) .et_pb_tab_content :is(p, li) {
	font-size: 0.98rem;
	line-height: 1.8;
	color: var(--cc-texto-suave);
}

#page-container #et-boc .et-l .et_pb_wc_tabs:has(.description_tab) .et_pb_tab_content ul {
	padding-left: 1.1rem;
}

#page-container #et-boc .et-l .et_pb_wc_tabs:has(.description_tab) .et_pb_tab_content li::marker {
	color: var(--cc-eucalipto-texto);
}

/* ---- Información adicional: ficha limpia, sin cebra ---------------------------------------------- */
#page-container #et-boc .et-l .et_pb_wc_tabs table.woocommerce-product-attributes {
	border: 0;
	border-collapse: collapse;
}

#page-container #et-boc .et-l .et_pb_wc_tabs table.woocommerce-product-attributes :is(th, td) {
	padding: 0.85rem 0;
	border: 0;
	border-bottom: 1px solid var(--cc-borde);
	background: transparent;
	font-size: 0.9rem;
	line-height: 1.5;
	text-align: left;
	vertical-align: top;
}

#page-container #et-boc .et-l .et_pb_wc_tabs table.woocommerce-product-attributes th {
	width: 45%;
	padding-right: 1rem;
	font-weight: 600;
	color: var(--cc-texto);
}

#page-container #et-boc .et-l .et_pb_wc_tabs table.woocommerce-product-attributes td {
	font-style: normal;
	color: var(--cc-texto-suave);
}

#page-container #et-boc .et-l .et_pb_wc_tabs table.woocommerce-product-attributes td p {
	padding: 0;
}

/* ---- Valoraciones --------------------------------------------------------------------------------- */
/* La pestaña ya dice "Valoraciones (N)": el título interno la repetía. */
#page-container #et-boc .et-l .et_pb_wc_tabs #reviews .woocommerce-Reviews-title {
	display: none;
}

#page-container #et-boc .et-l .et_pb_wc_tabs #reviews {
	max-width: 760px;
}

@media (min-width: 768px) {
	#page-container #et-boc #reviews #commentform {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: 1rem;
	}

	#page-container #et-boc #reviews #commentform > :not(.comment-form-author, .comment-form-email) {
		grid-column: 1 / -1;
	}
}

#page-container #et-boc #reviews #commentform .form-submit {
	text-align: right;
}

/* ---- Relacionados: cabecera de sección de la marca ----------------------------------------------- */
#page-container #et-boc .et_pb_wc_related_products section.related > h2 {
	margin-bottom: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
	padding: clamp(2rem, 1.5rem + 2vw, 3.5rem) 0 0;
	border-top: 1px solid var(--cc-borde);
	font-family: "Petit Formal Script", cursive !important; /* El módulo fija Quicksand 33px. */
	font-size: clamp(2rem, 1.5rem + 1.5vw, 2.75rem) !important;
	font-weight: 400;
	line-height: 1.3 !important;
	text-align: center;
	color: var(--cc-texto) !important;
}

/* ---- Metadatos: solo la categoría, discreta ------------------------------------------------------- */
#page-container #et-boc .et_pb_wc_meta .sku_wrapper {
	display: none;
}

#page-container #et-boc .et_pb_wc_meta .product_meta {
	padding: 0;
	border: 0;
	font-size: 0.8rem;
	letter-spacing: 0.05em;
	text-align: center;
	color: var(--cc-texto-suave);
}

#page-container #et-boc .et_pb_wc_meta .product_meta a {
	color: var(--cc-texto);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* ---- Móvil: el nombre manda sobre el precio --------------------------------------------------- */
@media (max-width: 767px) {
	#page-container #et-boc .et_pb_wc_title h1 {
		font-size: clamp(2.2rem, 1.6rem + 3vw, 2.8rem);
		line-height: 1.25;
	}

	#page-container #et-boc .et_pb_wc_price .cc-precio-desde {
		font-size: 1.2rem;
	}
}
