/* Ficha de producto. La rejilla es la del div.product de WooCommerce: fotos y compra arriba, y debajo, a lo ancho,
   la descripción, las preguntas, las valoraciones y los relacionados. */

.os-woo__migas {
	padding-top: clamp(40px, 5vw, 64px);
}

.os-woo__avisos:empty,
.os-woo__avisos:not(:has(.woocommerce-message, .woocommerce-error, .woocommerce-info)) {
	display: none;
}

.os-woo__avisos {
	padding-top: 12px;
}

.os-ficha {
	display: grid;
	grid-template-columns: minmax(var(--os-medianil), 1fr) minmax(0, 620px) minmax(0, 620px) minmax(var(--os-medianil), 1fr);
	align-items: start;
	padding-top: clamp(4px, 1vw, 12px);
}

.os-ficha > * {
	grid-column: 2 / 4;
	min-width: 0;
}

/* Las fotos no se pegan al bajar: en la rejilla de la ficha, una foto sticky se queda fija hasta el final. */
.os-ficha__fotos {
	grid-column: 2;
	margin: 0 clamp(24px, 4vw, 64px) 0 0;
}

.os-ficha__foto {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	border-radius: 999px 999px var(--os-radio) var(--os-radio);
	background: var(--os-niebla);
	overflow: hidden;
}

.os-ficha__foto img {
	position: absolute;
	inset: 14% 12% 6%;
	width: 76%;
	height: 80%;
	object-fit: contain;
	object-position: center bottom;
}

.os-ficha__foto .os-sellos {
	top: 12%;
}

.os-ficha__miniaturas {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.os-ficha__miniatura {
	display: block;
	width: 76px;
	height: 76px;
	padding: 4px;
	border: 1px solid var(--os-linea);
	border-radius: var(--os-radio);
	background: var(--os-niebla);
	cursor: pointer;
	transition: border-color var(--os-d-estado) ease;
}

.os-ficha__miniatura img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.os-ficha__miniatura[aria-pressed="true"] {
	border: 2px solid var(--os-hoja);
}

.os-ficha > .summary {
	grid-column: 3;
	margin: 0;
	padding-bottom: clamp(40px, 5vw, 72px);
}

.os-ficha > .os-ficha__detalle {
	grid-column: 1 / -1;
}

.os-ficha > .related,
.os-ficha > .up-sells {
	grid-column: 2 / 4;
	padding-block: var(--os-seccion);
}

.os-ficha > .related > h2 {
	margin-bottom: clamp(24px, 3vw, 36px);
	font-size: var(--os-t-titular);
}

/* Compra */
.os-ficha .product_title {
	margin: 0 0 10px;
	font-size: var(--os-t-producto);
	line-height: 1.12;
}

.os-ficha .summary > .price {
	margin: 0 0 6px;
	font-size: var(--os-t-precio);
	line-height: 1.1;
}

.os-ficha__formato {
	margin: 0 0 18px;
	color: var(--os-tinta-suave);
	font-size: var(--os-t-pequeno);
}

.os-ficha .woocommerce-product-details__short-description {
	margin-bottom: 22px;
	color: var(--os-tinta-suave);
	font-size: var(--os-t-cuerpo);
	line-height: 1.55;
}

.os-ficha .woocommerce-product-details__short-description p:last-child {
	margin-bottom: 0;
}

.os-ficha form.cart {
	margin: 0 0 16px;
	padding-top: 20px;
	border-top: 1px solid var(--os-linea);
}

.os-ficha table.variations {
	width: 100%;
	margin: 0 0 16px;
	border-collapse: collapse;
}

.os-ficha table.variations th,
.os-ficha table.variations td {
	display: block;
	padding: 0;
	text-align: left;
}

.os-ficha table.variations th.label {
	margin-bottom: 8px;
}

.os-ficha table.variations select {
	max-width: 22rem;
}

.os-ficha .reset_variations {
	display: inline-block;
	margin-top: 8px;
	font-size: var(--os-t-etiqueta);
}

/* Cantidad de garrafas o formato como botones de opción con su precio (ficha.js, sobre el select de WooCommerce) */
.os-opciones {
	margin: 0 0 16px;
	padding: 0;
	border: 0;
}

.os-opciones legend {
	margin-bottom: 10px;
	padding: 0;
	font-weight: 700;
	font-size: var(--os-t-pequeno);
}

.os-opciones__lista {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
}

.os-opcion {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-height: 64px;
	padding: 12px 16px;
	border: 1px solid var(--os-linea-campo);
	border-radius: var(--os-radio);
	background: var(--os-blanco);
	cursor: pointer;
	font: inherit;
	transition: border-color var(--os-d-estado) ease, background-color var(--os-d-estado) ease, box-shadow var(--os-d-estado) ease, transform var(--os-d-pulsar) var(--os-ease-salida);
}

.os-opcion input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.os-opcion__texto {
	font-weight: 700;
	font-size: var(--os-t-pequeno);
}

.os-opcion__precio {
	font: 700 1.3125rem / 1 var(--os-titular);
	font-variant-numeric: lining-nums tabular-nums;
}

.os-opcion:has(input:checked) {
	border-color: var(--os-hoja);
	background: var(--os-niebla);
	box-shadow: inset 0 0 0 1px var(--os-hoja);
}

.os-opcion:has(input:focus-visible) {
	outline: 2px solid var(--os-foco);
	outline-offset: 3px;
}

.os-opcion:has(input:disabled) {
	opacity: 0.45;
	cursor: not-allowed;
}

.os-opcion:active {
	transform: scale(0.98);
}

@media (hover: hover) and (pointer: fine) {
	.os-opcion:not(:has(input:checked, input:disabled)):hover {
		border-color: var(--os-verde-hondo);
	}
}

.os-js .os-ficha .woocommerce-variation-price,
.os-js .os-ficha .reset_variations {
	display: none !important;
}

.os-ficha .woocommerce-variation-availability .stock {
	margin: 0 0 12px;
}

.os-ficha .woocommerce-variation-add-to-cart,
.os-ficha form.cart:not(.variations_form) {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 10px;
}

.os-ficha form.cart:not(.variations_form) > :not(.quantity):not(.single_add_to_cart_button) {
	flex-basis: 100%;
}

.os-ficha .quantity {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--os-linea-campo);
	border-radius: var(--os-radio);
	background: var(--os-blanco);
	overflow: hidden;
}

.os-ficha .quantity .qty {
	width: 56px;
	min-height: 54px;
	padding: 0 4px;
	border: 0;
	border-radius: 0;
	text-align: center;
	font: 700 var(--os-t-cuerpo) / 1 var(--os-texto);
	font-variant-numeric: tabular-nums;
	-moz-appearance: textfield;
}

.os-ficha .quantity .qty::-webkit-outer-spin-button,
.os-ficha .quantity .qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.os-cantidad__boton {
	width: 46px;
	border: 0;
	background: none;
	color: var(--os-hoja);
	cursor: pointer;
	transition: background-color var(--os-d-estado) ease;
}

.os-cantidad__boton .os-icono {
	width: 18px;
	height: 18px;
	margin: auto;
}

.os-cantidad__boton:active {
	background: var(--os-niebla-honda);
}

@media (hover: hover) and (pointer: fine) {
	.os-cantidad__boton:hover {
		background: var(--os-niebla);
	}
}

/* Garrafas: una sola pregunta, cuántas, con el total y el envío gratis al lado (woo.php y ficha.js). El formato queda
   fijo en la garrafa suelta y su tabla no se ve, también sin JavaScript. */
.os-ficha--garrafas table.variations,
.os-ficha--garrafas .reset_variations {
	display: none;
}

.os-garrafas__pregunta {
	flex-basis: 100%;
	font-weight: 700;
	font-size: var(--os-t-pequeno);
}

.os-garrafas__total {
	flex: 1 1 auto;
	align-self: center;
	margin: 0;
	padding-left: 6px;
	color: var(--os-tinta-suave);
	font-size: var(--os-t-pequeno);
}

.os-garrafas__total strong {
	margin-left: 4px;
	color: var(--os-tinta);
	font: 700 1.5rem / 1 var(--os-titular);
	font-variant-numeric: lining-nums tabular-nums;
}

.os-garrafas__envio {
	flex-basis: 100%;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	padding: 12px 14px;
	border-radius: var(--os-radio);
	background: var(--os-niebla);
	font-size: var(--os-t-pequeno);
	line-height: 1.4;
}

.os-garrafas__envio .os-icono {
	flex: none;
	width: 22px;
	height: 22px;
	color: var(--os-hoja);
}

.os-garrafas__envio--gratis {
	color: var(--os-hoja);
	font-weight: 700;
}

.os-ficha--garrafas .single_add_to_cart_button {
	flex-basis: 100%;
}

.os-ficha .single_add_to_cart_button {
	flex: 1;
	min-width: 220px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 56px;
	padding: 14px 28px;
	border: 1px solid var(--os-hoja);
	border-radius: var(--os-radio);
	background: var(--os-hoja);
	color: var(--os-blanco);
	font: 700 1.125rem / 1.2 var(--os-texto);
	cursor: pointer;
	transition: background-color var(--os-d-estado) ease, border-color var(--os-d-estado) ease, transform var(--os-d-pulsar) var(--os-ease-salida);
}

.os-ficha .single_add_to_cart_button:active {
	transform: scale(0.97);
}

.os-ficha .single_add_to_cart_button.disabled,
.os-ficha .single_add_to_cart_button:disabled {
	border-color: var(--os-linea-campo);
	background: var(--os-niebla);
	color: var(--os-tinta-suave);
	cursor: not-allowed;
}

@media (hover: hover) and (pointer: fine) {
	.os-ficha .single_add_to_cart_button:not(.disabled):hover {
		border-color: var(--os-verde-hondo);
		background: var(--os-verde-hondo);
	}
}

.os-ficha .stock.out-of-stock:empty,
.os-ficha p.stock:empty {
	display: none;
}

.os-ficha__stock {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0 0 20px;
	color: var(--os-hoja);
	font-weight: 700;
	font-size: var(--os-t-pequeno);
}

.os-ficha__stock .os-icono {
	width: 22px;
	height: 22px;
	margin-top: 1px;
}

.os-ficha__stock--agotado {
	padding: 14px 16px;
	border-radius: var(--os-radio);
	background: var(--os-niebla);
	color: var(--os-tinta);
	font-weight: 400;
}

.os-ficha__stock--agotado .os-icono {
	color: var(--os-hoja);
}

/* Garantías: una línea, sin tarjetas */
.os-garantias {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px 20px;
	margin: 0 0 22px;
	padding: 16px 0;
	border-block: 1px solid var(--os-linea);
	list-style: none;
}

.os-garantias li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	color: var(--os-tinta-suave);
	font-size: var(--os-t-etiqueta);
	line-height: 1.35;
}

.os-garantias strong {
	display: block;
	color: var(--os-tinta);
}

.os-garantias .os-icono {
	width: 24px;
	height: 24px;
	color: var(--os-hoja);
}


/* Gastos de envío desplegables */
.os-envio {
	border: 1px solid var(--os-linea);
	border-radius: var(--os-radio);
	background: var(--os-blanco);
}

.os-envio summary {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 56px;
	padding: 12px 16px;
	cursor: pointer;
	list-style: none;
}

.os-envio summary::-webkit-details-marker {
	display: none;
}

.os-envio__icono {
	width: 24px;
	height: 24px;
	color: var(--os-hoja);
}

.os-envio__resumen {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	gap: 0 10px;
}

.os-envio__titulo {
	font-weight: 700;
}

.os-envio__nota {
	color: var(--os-tinta-suave);
	font-size: var(--os-t-etiqueta);
}

.os-envio__flecha {
	width: 24px;
	height: 24px;
	color: var(--os-hoja);
	transition: transform var(--os-d-estado) var(--os-ease-salida);
}

.os-envio[open] .os-envio__flecha {
	transform: rotate(180deg);
}

.os-envio__cuerpo {
	padding: 0 16px 16px;
	font-size: var(--os-t-pequeno);
}

.os-envio__tabla {
	width: 100%;
	margin: 0 0 12px;
	border-collapse: collapse;
}

.os-envio__tabla th,
.os-envio__tabla td {
	padding: 9px 0;
	border-top: 1px solid var(--os-linea);
	text-align: left;
	vertical-align: top;
}

.os-envio__tabla th {
	padding-right: 16px;
	font-weight: 400;
	color: var(--os-tinta-suave);
}

.os-envio__tabla td {
	font-weight: 700;
}

.os-envio__plazo {
	margin: 0;
	color: var(--os-tinta-suave);
}

/* Debajo de la compra */
.os-ficha__descripcion {
	padding-block: var(--os-seccion);
	border-top: 1px solid var(--os-linea);
}

.os-ficha__descripcion h2 {
	margin-bottom: 0.6em;
}

.os-ficha__descripcion-rejilla {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	gap: clamp(32px, 5vw, 80px);
	align-items: start;
}

.os-ficha__descripcion-rejilla > :only-child {
	grid-column: 1 / -1;
	max-width: 30rem;
}

.os-ficha__datos-caja {
	padding-top: 6px;
}

.os-ficha__descripcion .os-ficha__datos-titulo {
	margin: 0 0 14px;
	font-size: 1.375rem;
}

@media (max-width: 900px) {
	.os-ficha__descripcion-rejilla {
		grid-template-columns: minmax(0, 1fr);
	}

	.os-ficha__datos-caja {
		max-width: 30rem;
	}
}

.os-ficha__guia {
	margin-top: 1.5em;
}

.os-ficha__valoraciones {
	padding-block: var(--os-seccion);
}

/* Barra de compra fija en el móvil */
.os-barra-compra {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 30;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
	background: var(--os-blanco);
	box-shadow: 0 -8px 24px rgba(31, 38, 8, 0.16);
	transform: translateY(110%);
	transition: transform 320ms var(--os-ease-cajon);
}

.os-barra-compra[data-os-visible] {
	transform: none;
}

.os-barra-compra__datos {
	flex: 1;
	min-width: 0;
}

.os-barra-compra__nombre {
	margin: 0;
	overflow: hidden;
	color: var(--os-tinta-suave);
	font-size: var(--os-t-etiqueta);
	white-space: nowrap;
	text-overflow: ellipsis;
}

.os-barra-compra__precio {
	margin: 0;
	font-size: 1.25rem;
}

.os-barra-compra__boton {
	flex: none;
	min-height: 48px;
}

@media (min-width: 901px) {
	.os-barra-compra {
		display: none;
	}
}

@media (max-width: 900px) {
	.os-ficha {
		grid-template-columns: var(--os-medianil) minmax(0, 1fr) var(--os-medianil);
	}

	.os-ficha > *,
	.os-ficha__fotos,
	.os-ficha > .summary,
	.os-ficha > .related,
	.os-ficha > .up-sells {
		grid-column: 2;
	}

	.os-ficha__fotos {
		margin: 0 auto 24px;
		width: min(100%, 420px);
	}

	.os-ficha__foto {
		aspect-ratio: 1;
	}

	.os-ficha__foto img {
		inset: 12% 18% 5%;
		width: 64%;
		height: 83%;
	}

	.os-garantias {
		grid-template-columns: 1fr;
	}
}