/* =========================================================
   Ficha de producto v2 (piloto) — acotado a body.dg-ficha-v2
   Basado en tareas/Rediseño/mockup-ficha-producto.html
   ========================================================= */

/* Mismo ancho que el contenido superior: fórmula idéntica a la que aplica
   el tema (Customizer) a .product-details-wrapper y .related.products. */
.dg-ficha-v2 .dg-ficha-ancho {
	max-width: calc(1250px + 5.2325em);
	margin-left: auto;
	margin-right: auto;
	padding-left: 1em;
	padding-right: 1em;
}

@media (min-width: 993px) {
	.dg-ficha-v2 .dg-ficha-ancho {
		padding-left: 2.617924em;
		padding-right: 2.617924em;
	}
}

/* Estrellas: mismo ámbar en toda la ficha */
.dg-ficha-v2 {
	--dg-estrella: #ffa41c;
}

/* =========================================================
   Fondo de página gris cálido, como el carrito (los mismos
   selectores que .woocommerce-cart en la sección del carrito)
   ========================================================= */
body.dg-ficha-v2,
body.dg-ficha-v2 .site-content,
body.dg-ficha-v2 #content {
	background: var(--dg-bg);
}

/* El tema pinta de blanco el wrapper que envuelve nuestras secciones,
   y de casi blanco (#f8f8f8) el .col-full de la zona superior */
body.dg-ficha-v2 .related-wrapper,
body.dg-ficha-v2 .site-content .col-full {
	background: transparent;
}

/* =========================================================
   Elementos del tema que el mockup no lleva
   ========================================================= */
/* body.* delante para ganar también a reglas !important de los plugins */
body.dg-ficha-v2 .shoptimizer-product-prevnext,
body.dg-ficha-v2 .summary span.onsale,
body.dg-ficha-v2 .summary .woocommerce-product-details__short-description,
/* Solo el texto de stock EN existencias ("N disponibles"); el de agotado
   se conserva (en variables agotados es lo único que informa) y lo
   sustituimos por la tarjeta .dg-oos-aviso desde PHP. */
body.dg-ficha-v2 .summary p.stock.in-stock,
body.dg-ficha-v2 .summary p.stock.available-on-backorder,
body.dg-ficha-v2 .summary .commercekit-inventory,
body.dg-ficha-v2 .commercekit-inventory,
body.dg-ficha-v2 .summary .product-widget,
body.dg-ficha-v2 .summary .sale-item.type-bubble,
body.dg-ficha-v2 .product_meta {
	display: none !important;
}

/* La pill AHORRAS solo en el resumen (no en barra sticky ni clones) */
.dg-ficha-v2 .commercekit-sticky-add-to-cart .dg-ahorro,
.dg-ficha-v2 .commercekit-pdp-sticky-inner .dg-ahorro {
	display: none !important;
}

/* =========================================================
   Galería: sticky, esquinas suaves, badges en rojo
   ========================================================= */
.dg-ficha-v2 .product-details-wrapper {
	overflow: visible;
}

@media (min-width: 993px) {
	.dg-ficha-v2 .product-details-wrapper {
		display: flex;
		align-items: flex-start;
		gap: 32px;
	}

	.dg-ficha-v2 .product-details-wrapper .images {
		float: none;
		width: 53%;
		flex: 0 0 auto;
		position: sticky;
		top: 120px;
	}

	.dg-ficha-v2 .product-details-wrapper .summary {
		float: none;
		width: auto;
		flex: 1;
		min-width: 0;
	}
}

.dg-ficha-v2 .woocommerce-product-gallery .flex-viewport,
.dg-ficha-v2 .woocommerce-product-gallery__image img {
	border-radius: var(--dg-radius);
}

/* La imagen como tarjeta blanca sobre el fondo gris */
.dg-ficha-v2 .woocommerce-product-gallery .flex-viewport {
	background: #fff;
	border: 1px solid var(--dg-border);
}

.dg-ficha-v2 .woocommerce-product-gallery ol.flex-control-thumbs li img {
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius-sm);
	opacity: 0.75;
	transition: all 0.15s ease;
}

.dg-ficha-v2 .woocommerce-product-gallery ol.flex-control-thumbs li img.flex-active,
.dg-ficha-v2 .woocommerce-product-gallery ol.flex-control-thumbs li img:hover {
	border: 2px solid var(--dg-black);
	opacity: 1;
}

/* Badges: pills rojas en horizontal; con flex-wrap pasan a segunda línea
   en pantallas estrechas, así que nunca se superponen */
.dg-ficha-v2 .dg-badges {
	position: absolute;
	top: 16px;
	left: 16px;
	right: 60px; /* hueco para la lupa/zoom de la galería */
	z-index: 99;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 8px;
	pointer-events: none;
}

.dg-ficha-v2 .dg-badge {
	display: inline-block;
	background: var(--dg-red);
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	line-height: 1.2;
	border-radius: var(--dg-radius-pill);
	padding: 6px 14px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* =========================================================
   Resumen (columna de compra)
   ========================================================= */
.dg-ficha-v2 .dg-marca-fila {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 2px;
}

.dg-ficha-v2 .dg-marca {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--dg-gray-500);
}

/* REF con la tipografía del sitio (nada de monospace) */
.dg-ficha-v2 .dg-ref {
	font-family: inherit;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	color: #b3b0aa;
	letter-spacing: 0.08em;
}

.dg-ficha-v2 .summary h1.product_title {
	font-size: 26px;
	line-height: 1.2;
	font-weight: 750;
	margin: 6px 0 10px;
}

/* Valoración bajo el título */
.dg-ficha-v2 .dg-valoracion {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	color: var(--dg-gray-500);
	margin-bottom: 14px;
}

/* Shoptimizer pinta las estrellas con máscara SVG + background-color
   (no con color): el relleno iba en amarillo #fff102 del Customizer. */
.dg-ficha-v2 .dg-valoracion .star-rating span::before {
	background-color: #ffa41c !important;
}

.dg-ficha-v2 .dg-valoracion .star-rating,
.dg-ficha-v2 .dg-valoracion .star-rating::before,
.dg-ficha-v2 .dg-valoracion .star-rating span,
.dg-ficha-v2 .dg-valoracion .star-rating span::before {
	color: #ffa41c !important;
}

.dg-ficha-v2 .dg-valoracion .star-rating {
	font-size: 16px; /* estrellas un poco más grandes bajo el título */
	margin: 0;
}

.dg-ficha-v2 .dg-valoracion-nota {
	font-weight: 600;
	color: var(--dg-ink);
}

.dg-ficha-v2 .dg-valoracion-enlace {
	color: var(--dg-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Tarjeta de compra */
.dg-ficha-v2 .dg-compra-card {
	background: var(--dg-card);
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius);
	box-shadow: var(--dg-shadow);
	padding: 20px 22px;
	margin-bottom: 14px;
}

.dg-ficha-v2 .dg-compra-card p.price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px;
	font-size: 34px !important;
	font-weight: 800;
	color: var(--dg-ink);
	margin: 0;
}

.dg-ficha-v2 .dg-compra-card p.price ins {
	order: 1;
	text-decoration: none;
	background: none;
}

.dg-ficha-v2 .dg-compra-card p.price del {
	order: 2;
	font-size: 17px;
	font-weight: 400;
	color: var(--dg-gray-500);
	opacity: 1;
}

.dg-ficha-v2 .dg-compra-card p.price .dg-ahorro {
	order: 3;
	background: var(--dg-red);
	color: #fff;
	font-size: 11.5px;
	font-weight: 700;
	border-radius: var(--dg-radius-pill);
	padding: 4px 12px;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	white-space: nowrap;
}

.dg-ficha-v2 .dg-compra-card p.price .dg-ahorro .woocommerce-Price-amount {
	font-size: 11.5px;
	font-weight: 700;
	color: #fff;
}

.dg-ficha-v2 .dg-compra-card p.price .woocommerce-price-suffix {
	order: 4;
	display: block;
	width: 100%;
	font-size: 12px;
	font-weight: 400;
	color: var(--dg-gray-500);
	margin-top: 2px;
}

/* Pills de disponibilidad */
.dg-ficha-v2 .dg-pills {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 14px 0 4px;
}

.dg-ficha-v2 .dg-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border-radius: var(--dg-radius-pill);
	padding: 5px 13px;
	font-size: 12.5px;
	font-weight: 500;
	line-height: 1.4;
}

.dg-ficha-v2 .dg-pill--verde {
	background: var(--dg-green-soft);
	color: var(--dg-green);
}

.dg-ficha-v2 .dg-pill--stock::before {
	content: "✓";
	font-weight: 700;
}

.dg-ficha-v2 .dg-pill--linea {
	border: 1px solid var(--dg-border);
	color: var(--dg-gray-700);
}

/* Cantidad + añadir al carrito: [− nº +] alineado con el botón, misma altura */
.dg-ficha-v2 .summary form.cart {
	margin: 16px 0 10px;
}

body.dg-ficha-v2 .summary form.cart .commercekit-sticky-atc-intersector {
	display: flex;
	align-items: stretch;
	flex-wrap: wrap; /* el separador "o" baja a su propia fila */
	gap: 10px;
}

/* Separador "— o —" entre añadir al carrito y el pago exprés */
.dg-ficha-v2 .dg-sep-o {
	flex-basis: 100%;
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 18px 0 0;
	color: var(--dg-gray-500);
	font-size: 13px;
}

.dg-ficha-v2 .dg-sep-o::before,
.dg-ficha-v2 .dg-sep-o::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--dg-border);
}

/* =========================================================
   Producto agotado (sin reservas) — aviso sobre el botón de
   lista de espera de CommerceKit (#ckwtl-button2)
   ========================================================= */
.dg-ficha-v2 .dg-oos-aviso,
/* Mensaje "sin existencias" de la plantilla variable.php de WooCommerce
   (variables totalmente agotados): misma tarjeta de aviso */
body.dg-ficha-v2 .summary form.variations_form > p.stock.out-of-stock {
	display: flex;
	flex-direction: column;
	gap: 3px;
	background: var(--dg-bg);
	border: 1px solid var(--dg-border);
	border-left: 3px solid var(--dg-red);
	border-radius: var(--dg-radius-sm);
	padding: 13px 16px;
	margin: 18px 0 14px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	color: var(--dg-ink);
}

/* El tema añade un icono "×" (máscara SVG) en ::before del texto de
   agotado; sobra en nuestra tarjeta */
body.dg-ficha-v2 .summary form.variations_form > p.stock.out-of-stock::before {
	display: none !important;
}

.dg-ficha-v2 .dg-oos-titulo {
	font-size: 14px;
	font-weight: 700;
	color: var(--dg-ink);
	line-height: 1.35;
}

.dg-ficha-v2 .dg-oos-texto {
	font-size: 13px;
	line-height: 1.5;
	color: var(--dg-gray-700);
}

/* El botón "Recibir notificaciones" de CommerceKit, con el aspecto de la
   ficha (pill, ancho completo) */
.dg-ficha-v2 .dg-compra-card #ckwtl-button2 {
	display: block;
	width: 100%;
	height: 52px;
	border: 0;
	border-radius: var(--dg-radius-pill);
	background: var(--dg-ink);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.15s ease;
}

.dg-ficha-v2 .dg-compra-card #ckwtl-button2:hover {
	background: #000;
}

/* En productos VARIABLES agotados usamos el botón #ckwtl-button2 que
   CommerceKit embebe dentro del availability_html de la variación (lleva su
   propio popup y funciona siempre). El #ckwtl-button3 se oculta porque no
   aparece de forma fiable con 2 atributos. Así sale UN solo botón. */
body.dg-ficha-v2 #ckwtl-button3,
body.dg-ficha-v2 .sticky-ckwtl-button3 {
	display: none !important;
}

/* En una variación agotada, el "Añadir al carrito" deshabilitado sobra:
   dejamos solo el botón de aviso */
body.dg-ficha-v2 .woocommerce-variation-add-to-cart-disabled .single_add_to_cart_button {
	display: none !important;
}

/* El botón de aviso embebido, con el aspecto de la ficha, dentro del área
   de disponibilidad de la variación. Solo en el formulario PRINCIPAL: el
   clon de la barra sticky (.commercekit_sticky-atc) lo gestiona CommerceKit
   y mostrarlo ahí duplicaba el botón. */
body.dg-ficha-v2 form.variations_form:not(.commercekit_sticky-atc) .woocommerce-variation-availability #ckwtl-button2 {
	display: block;
	width: 100%;
	height: 52px;
	margin: 12px 0 0;
	border: 0;
	border-radius: var(--dg-radius-pill);
	background: var(--dg-ink);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.15s ease;
}

body.dg-ficha-v2 form.variations_form:not(.commercekit_sticky-atc) .woocommerce-variation-availability #ckwtl-button2:hover {
	background: #000;
}

body.dg-ficha-v2 form.commercekit_sticky-atc .woocommerce-variation-availability #ckwtl-button2 {
	display: none !important;
}

/* ---------- Popup de lista de espera (CommerceKit) — restyle ---------- */

/* Overlay: atenuado y difuminado, como el carrito lateral */
body.dg-ficha-v2 #commercekit-waitlist-popup {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(17, 17, 17, 0.5) !important;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

/* El plugin abre el popup añadiendo esta clase (no un display inline) */
body.dg-ficha-v2 #commercekit-waitlist-popup.commercekit-waitlist-popup--active {
	display: flex;
}

body.dg-ficha-v2 #commercekit-waitlist-wrap {
	position: relative;
	width: 100%;
	max-width: 440px;
	background: var(--dg-card) !important;
	border: 1px solid var(--dg-border);
	border-radius: 18px !important;
	box-shadow: 0 24px 60px rgba(17, 17, 17, 0.28);
	overflow: hidden;
	animation: dg-oos-pop 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes dg-oos-pop {
	from { opacity: 0; transform: translateY(12px) scale(0.98); }
	to   { opacity: 1; transform: none; }
}

/* Botón de cerrar en círculo */
body.dg-ficha-v2 #commercekit-waitlist-close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--dg-card);
	border: 1px solid var(--dg-border);
	border-radius: 50%;
	color: var(--dg-gray-500);
	cursor: pointer;
	z-index: 2;
	transition: border-color 0.15s ease, color 0.15s ease;
}

body.dg-ficha-v2 #commercekit-waitlist-close:hover {
	border-color: var(--dg-ink);
	color: var(--dg-ink);
}

body.dg-ficha-v2 #commercekit-waitlist-close svg {
	width: 18px;
	height: 18px;
}

/* Cabecera con la miniatura del producto */
body.dg-ficha-v2 .commercekit-waitlist-head {
	display: flex;
	align-items: center;
	gap: 16px;
	background: var(--dg-bg) !important;
	border-bottom: 1px solid var(--dg-border);
	padding: 22px 24px !important;
}

body.dg-ficha-v2 .cgkit-product-image {
	flex: 0 0 auto;
}

body.dg-ficha-v2 .cgkit-waitlist-image {
	width: 72px !important;
	height: 72px !important;
	object-fit: cover;
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius-sm);
	background: #fff;
}

body.dg-ficha-v2 .cgkit-product-name {
	font-size: 14px !important;
	font-weight: 700;
	line-height: 1.35;
	color: var(--dg-ink);
	/* que el título no pase por debajo del botón de cerrar (círculo 32px
	   arriba a la derecha) */
	padding-right: 40px;
}

body.dg-ficha-v2 .cgkit-product-price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px;
	margin-top: 5px;
	font-size: 14px;
}

body.dg-ficha-v2 .cgkit-product-price del,
body.dg-ficha-v2 .cgkit-product-price del .woocommerce-Price-amount {
	color: var(--dg-gray-500);
	font-size: 13px;
}

body.dg-ficha-v2 .cgkit-product-price ins {
	text-decoration: none;
	background: none;
	font-weight: 800;
	color: var(--dg-ink);
}

body.dg-ficha-v2 .cgkit-product-price .woocommerce-price-suffix {
	font-size: 12px;
	color: var(--dg-gray-500);
}

/* La pill "Ahorras" no aporta dentro del popup */
body.dg-ficha-v2 .cgkit-product-price .dg-ahorro {
	display: none;
}

/* Cuerpo del formulario */
body.dg-ficha-v2 .commercekit-waitlist {
	padding: 22px 24px 24px;
}

body.dg-ficha-v2 .commercekit-waitlist > p {
	font-size: 17px !important;
	font-weight: 750;
	line-height: 1.3;
	color: var(--dg-ink);
	margin: 0 0 16px;
	text-wrap: balance;
}

body.dg-ficha-v2 #ckwtl-email {
	width: 100%;
	height: 48px !important;
	box-sizing: border-box;
	border: 1px solid var(--dg-border) !important;
	border-radius: var(--dg-radius-sm) !important;
	padding: 0 14px !important;
	/* 16px evita el zoom automático de Safari iOS al enfocar el campo */
	font-size: 16px !important;
	color: var(--dg-ink);
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.dg-ficha-v2 #ckwtl-email:focus {
	outline: none;
	border-color: var(--dg-ink) !important;
	box-shadow: 0 0 0 3px rgba(17, 17, 17, 0.08);
}

body.dg-ficha-v2 .commercekit-waitlist label {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 14px 0 18px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--dg-gray-700);
	cursor: pointer;
}

body.dg-ficha-v2 #ckwtl-consent {
	width: 18px;
	height: 18px;
	margin: 1px 0 0;
	flex: 0 0 auto;
	accent-color: var(--dg-red);
	cursor: pointer;
}

body.dg-ficha-v2 #ckwtl-button {
	width: 100%;
	height: 52px !important;
	border: 0 !important;
	border-radius: var(--dg-radius-pill) !important;
	background: var(--dg-red) !important;
	color: #fff !important;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.01em;
	cursor: pointer;
	box-shadow: 0 6px 16px rgba(222, 1, 0, 0.22);
	transition: filter 0.15s ease, transform 0.1s ease;
}

body.dg-ficha-v2 #ckwtl-button:not(:disabled):hover {
	filter: brightness(1.07);
	transform: translateY(-1px);
}

body.dg-ficha-v2 #ckwtl-button:disabled {
	background: var(--dg-border) !important;
	color: var(--dg-gray-500) !important;
	box-shadow: none;
	cursor: not-allowed;
}

/* Móvil: hoja inferior que sube desde abajo */
@media (max-width: 560px) {
	body.dg-ficha-v2 #commercekit-waitlist-popup {
		align-items: flex-end;
		/* tarjeta flotante: márgenes laterales + elevada del borde inferior */
		padding: 0 14px calc(18px + env(safe-area-inset-bottom, 0px));
	}

	body.dg-ficha-v2 #commercekit-waitlist-wrap {
		max-width: 100%;
		border-radius: 18px !important;
		animation: dg-oos-sheet 0.3s cubic-bezier(0.22, 1, 0.36, 1);
	}

	@keyframes dg-oos-sheet {
		from { transform: translateY(calc(100% + 18px)); }
		to   { transform: none; }
	}
}

@media (prefers-reduced-motion: reduce) {
	body.dg-ficha-v2 #commercekit-waitlist-wrap {
		animation: none;
	}
}

body.dg-ficha-v2 .summary form.cart div.quantity {
	position: relative;
	display: flex;
	align-items: center;
	height: 52px;
	/* el tema lo fuerza a 58px (stepper vertical) y recortaría los botones */
	width: 142px !important;
	min-width: 142px;
	max-width: none !important;
	margin: 0;
	flex: 0 0 auto;
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius-pill);
	overflow: hidden;
	background: #fff;
}

body.dg-ficha-v2 .summary form.cart .quantity input.qty {
	order: 2;
	width: 56px; /* sitio para 3 cifras (100+) */
	height: 100%;
	border: 0;
	padding: 0;
	background: transparent;
	text-align: center;
	font-size: 15px;
	font-weight: 600;
	-moz-appearance: textfield;
	appearance: textfield;
}

body.dg-ficha-v2 .summary form.cart .quantity input.qty::-webkit-outer-spin-button,
body.dg-ficha-v2 .summary form.cart .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* El tema envuelve los botones en .quantity-nav; con display:contents los
   botones pasan a ser hijos directos del flex y obedecen al orden [− nº +] */
body.dg-ficha-v2 .summary form.cart .quantity .quantity-nav {
	display: contents;
}

/* !important: el CSS crítico del tema los deja en absoluto (stepper vertical) */
body.dg-ficha-v2 .summary form.cart .quantity .quantity-button {
	position: static !important;
	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	left: auto !important;
	width: 42px !important;
	height: 100% !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	user-select: none;
	transition: background 0.15s ease;
}

body.dg-ficha-v2 .summary form.cart .quantity .quantity-button:hover {
	background: #11111108;
}

body.dg-ficha-v2 .summary form.cart .quantity .quantity-down {
	order: 1;
	border-right: 1px solid var(--dg-border);
}

body.dg-ficha-v2 .summary form.cart .quantity .quantity-up {
	order: 3;
	border-left: 1px solid var(--dg-border);
}

/* Símbolos + y − en texto (se anulan los chevrons por máscara del tema y
   su transform translate(-50%,-50%), que descentraba los símbolos) */
body.dg-ficha-v2 .summary form.cart .quantity .quantity-button::before {
	content: "+";
	position: static;
	width: auto;
	height: auto;
	top: auto !important;
	left: auto !important;
	transform: none !important;
	-webkit-mask-image: none !important;
	mask-image: none !important;
	background: none !important;
	background-color: transparent !important;
	font-size: 18px;
	font-weight: 600;
	line-height: 1;
	color: var(--dg-ink);
}

body.dg-ficha-v2 .summary form.cart .quantity .quantity-down::before {
	content: "−";
}

body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button {
	border-radius: var(--dg-radius-pill) !important;
	font-weight: 700;
	height: 52px;
	/* que ocupe TODO el ancho sobrante junto a la cantidad (el tema lo
	   encoge en los productos variables) */
	flex: 1 1 auto !important;
	width: auto !important;
	max-width: none !important;
	min-width: 0;
	margin-left: 0 !important; /* el tema le mete 40px y separaba demasiado */
}

/* Texto SIEMPRE blanco, también al hacer clic / cargando / añadido
   (el estado de carga lo dejaba negro sobre negro y no se veía) */
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button:hover,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button:focus,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button:active,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button.loading,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button.disabled,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button.added {
	color: #ffffff !important;
}

/* Rueda de carga en blanco junto al texto (el CSS global la ponía negra) */
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button::after,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button.loading::after,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button::before,
body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button.loading::before {
	border-color: #ffffff !important;
	border-left-color: rgba(255, 255, 255, 0.35) !important;
	color: #ffffff !important;
}

/* =========================================================
   Selector de variaciones propio (tarjetas + círculos de color)
   ========================================================= */

/* La tabla de variaciones de Woo, como bloques apilados; los <select>
   nativos quedan ocultos (los maneja el JS de la ficha) */
.dg-ficha-v2 form.cart table.variations,
.dg-ficha-v2 form.cart table.variations tbody,
.dg-ficha-v2 form.cart table.variations tr,
.dg-ficha-v2 form.cart table.variations th,
.dg-ficha-v2 form.cart table.variations td {
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
	border: 0;
	background: none;
}

.dg-ficha-v2 form.cart table.variations {
	margin: 4px 0 0;
}

.dg-ficha-v2 form.cart table.variations th.label {
	display: none; /* usamos nuestra etiqueta propia */
}

.dg-ficha-v2 form.cart table.variations select {
	display: none !important;
}

.dg-ficha-v2 form.cart .reset_variations {
	display: inline-block;
	margin: 6px 0 0;
	font-size: 12px;
	color: var(--dg-gray-500);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.dg-ficha-v2 .dg-var-grupo {
	margin: 14px 0 2px;
}

.dg-ficha-v2 .dg-var-etiqueta {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--dg-gray-500);
	margin: 0 0 8px;
}

.dg-ficha-v2 .dg-var-etiqueta .dg-var-elegido {
	text-transform: none;
	letter-spacing: 0;
	font-size: 12.5px;
	color: var(--dg-ink);
	margin-left: 8px;
}

.dg-ficha-v2 .dg-var-opciones {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

/* Tarjetas (tamaño, formato…) con su precio */
.dg-ficha-v2 .dg-var-tarjeta {
	flex: 1 1 150px;
	max-width: 220px;
	display: flex;
	flex-direction: column;
	gap: 2px;
	text-align: left;
	background: #fff;
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius);
	padding: 12px 14px;
	cursor: pointer;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.dg-ficha-v2 .dg-var-tarjeta b {
	font-size: 14px;
	font-weight: 700;
	color: var(--dg-ink);
	overflow-wrap: anywhere;
	/* algunos valores de "Opciones" (Cadena) son larguísimos: se recortan */
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.dg-ficha-v2 .dg-var-tarjeta small,
.dg-ficha-v2 .dg-var-tarjeta small .woocommerce-Price-amount {
	font-size: 12.5px;
	font-weight: 500;
	color: var(--dg-gray-500);
}

.dg-ficha-v2 .dg-var-tarjeta:hover {
	border-color: var(--dg-ink);
}

.dg-ficha-v2 .dg-var-tarjeta.dg-var-activa {
	border-color: var(--dg-ink);
	box-shadow: inset 0 0 0 1.5px var(--dg-ink);
	background: #11111105;
}

/* Círculos de color */
.dg-ficha-v2 .dg-var-color {
	width: 34px;
	height: 34px;
	padding: 3px;
	background: #fff;
	border: 1px solid var(--dg-border);
	border-radius: 50%;
	cursor: pointer;
	flex: 0 0 auto;
	transition: border-color 0.15s ease, transform 0.1s ease;
}

.dg-ficha-v2 .dg-var-color:hover {
	border-color: var(--dg-ink);
	transform: scale(1.08);
}

.dg-ficha-v2 .dg-var-muestra {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.dg-ficha-v2 .dg-var-color.dg-var-activa {
	border: 2px solid var(--dg-ink);
	padding: 3px;
}

/* Opciones cuya combinación no existe con la selección actual de OTROS
   atributos. Se dejan CLICABLES a propósito: al pulsarlas se limpia el
   atributo que estorba y el cliente re-elige el resto entre lo compatible
   (evita el "botón muerto" que confunde). Se ven normales. */
.dg-ficha-v2 .dg-var-desactivada {
	cursor: pointer;
}

/* Opción NO DISPONIBLE en esta combinación (no existe la variación con la
   selección actual del resto): atenuada y tachada, pero clicable —al pulsarla
   se limpia el atributo que estorba y el cliente re-elige. En GRIS para
   distinguirla del "Sin stock" (rojo). */
.dg-ficha-v2 .dg-var-tarjeta.dg-var-desactivada {
	color: var(--dg-gray-500);
	opacity: 0.6;
	border-style: dashed;
}

.dg-ficha-v2 .dg-var-tarjeta.dg-var-desactivada b {
	color: var(--dg-gray-500);
	font-weight: 600;
	text-decoration: line-through;
}

.dg-ficha-v2 .dg-var-tarjeta.dg-var-desactivada::after {
	content: "No disponible";
	font-size: 11px;
	font-weight: 600;
	color: var(--dg-gray-500);
}

.dg-ficha-v2 .dg-var-color.dg-var-desactivada {
	position: relative;
	opacity: 0.4;
}

.dg-ficha-v2 .dg-var-color.dg-var-desactivada::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: linear-gradient(to top right, transparent calc(50% - 1px), var(--dg-gray-500) calc(50% - 1px), var(--dg-gray-500) calc(50% + 1px), transparent calc(50% + 1px));
}

/* Opción AGOTADA (existe pero sin stock): visible y clicable —al elegirla
   se ofrece el aviso de reposición—, pero atenuada y con "Sin stock". Si
   además no existe con la selección actual, manda "No disponible" (arriba). */
.dg-ficha-v2 .dg-var-tarjeta.dg-var-agotada:not(.dg-var-desactivada) {
	color: var(--dg-gray-500);
	border-style: dashed;
}

.dg-ficha-v2 .dg-var-tarjeta.dg-var-agotada:not(.dg-var-desactivada) b {
	color: var(--dg-gray-500);
	font-weight: 600;
}

.dg-ficha-v2 .dg-var-tarjeta.dg-var-agotada:not(.dg-var-desactivada)::after {
	content: "Sin stock";
	font-size: 11px;
	font-weight: 600;
	color: var(--dg-red);
}

/* Círculo de color agotado: atenuado con una barra diagonal roja */
.dg-ficha-v2 .dg-var-color.dg-var-agotada:not(.dg-var-desactivada) {
	position: relative;
	opacity: 0.55;
}

.dg-ficha-v2 .dg-var-color.dg-var-agotada:not(.dg-var-desactivada)::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: linear-gradient(to top right, transparent calc(50% - 1px), var(--dg-red) calc(50% - 1px), var(--dg-red) calc(50% + 1px), transparent calc(50% + 1px));
}

/* Aviso "sin existencias" de la variación seleccionada (Woo / CommerceKit) */
.dg-ficha-v2 .single_variation_wrap .woocommerce-variation-availability p.stock.out-of-stock,
.dg-ficha-v2 .woocommerce-variation .stock.out-of-stock {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: none;
	border: 0;
	padding: 0;
	margin: 8px 0 0;
	font-size: 13px;
	font-weight: 600;
	color: var(--dg-red);
}

/* En una variación agotada no tiene sentido el selector de cantidad ni el
   separador "— o —" (no hay carrito ni pago exprés) */
.dg-ficha-v2 .woocommerce-variation-add-to-cart-disabled .quantity,
.dg-ficha-v2 .woocommerce-variation-add-to-cart-disabled .dg-sep-o {
	display: none !important;
}

/* Zona de compra del producto variable: precio de la variación elegida,
   cantidad y botón alineados igual que en el producto simple */
.dg-ficha-v2 .summary form.cart .single_variation_wrap .woocommerce-variation-price .price {
	font-size: 22px !important;
	font-weight: 800;
	color: var(--dg-ink);
}

body.dg-ficha-v2 .summary form.cart .woocommerce-variation-add-to-cart {
	display: flex !important;
	width: 100%;
	align-items: stretch;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px;
}

/* En variables, CommerceKit anida su contenedor dentro del wrap y no
   crecía: el botón quedaba recortado */
body.dg-ficha-v2 .summary form.cart .woocommerce-variation-add-to-cart > .commercekit-sticky-atc-intersector {
	flex: 1 1 auto;
	width: 100%;
}

/* =========================================================
   Tarjeta de envíos (4 filas)
   ========================================================= */
.dg-ficha-v2 .dg-envios-card {
	background: var(--dg-card);
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius);
	box-shadow: var(--dg-shadow);
	overflow: hidden;
	margin-top: 14px;
}

.dg-ficha-v2 .dg-envios-fila {
	display: flex;
	gap: 12px;
	padding: 13px 18px;
	font-size: 13px;
	align-items: flex-start;
}

.dg-ficha-v2 .dg-envios-fila + .dg-envios-fila {
	border-top: 1px solid var(--dg-border);
}

.dg-ficha-v2 .dg-envios-ico {
	width: 20px;
	text-align: center;
	flex: 0 0 auto;
}

.dg-ficha-v2 .dg-envios-fila > div {
	flex: 1;
	min-width: 0;
}

.dg-ficha-v2 .dg-envios-fila b {
	display: block;
	font-size: 13.5px;
	color: var(--dg-ink);
}

.dg-ficha-v2 .dg-envios-fila small {
	color: var(--dg-gray-500);
	font-size: 12.5px;
}

.dg-ficha-v2 .dg-envios-fila small .edw_date {
	display: inline !important;
	color: var(--dg-gray-500);
	font-size: 12.5px;
	margin: 0;
	padding: 0;
}

.dg-ficha-v2 .dg-envios-gratis {
	color: var(--dg-green);
	font-weight: 700;
	margin-left: auto;
	font-size: 12.5px;
	white-space: nowrap;
	flex: 0 0 auto;
}

/* =========================================================
   Descripción (1.5fr) + Características (1fr)
   ========================================================= */
.dg-ficha-v2 .dg-ficha-detalles {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 28px;
	margin-top: 40px;
	margin-bottom: 28px;
}

.dg-ficha-v2 .dg-ficha-detalles--solo-descripcion {
	grid-template-columns: 1fr;
}

.dg-ficha-v2 .dg-ficha-seccion {
	display: flex;
	flex-direction: column;
	min-height: 300px;
	background: var(--dg-card);
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius);
	box-shadow: var(--dg-shadow);
	padding: 24px 26px;
}

/* Anclas: dejar hueco para la cabecera sticky al aterrizar */
.dg-ficha-v2 .dg-ficha-seccion,
.dg-ficha-v2 .dg-ficha-valoraciones,
.dg-ficha-v2 #reviews {
	scroll-margin-top: 120px;
}

.dg-ficha-v2 .dg-ficha-titulo {
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--dg-gray-500);
	font-weight: 700;
	margin: 0 0 14px;
}

.dg-ficha-v2 .dg-ficha-contenido p {
	font-size: 14px;
	line-height: 1.7;
	color: var(--dg-gray-700);
	margin: 0 0 12px;
}

.dg-ficha-v2 .dg-ficha-contenido p:last-child {
	margin-bottom: 0;
}

/* ----- Plegado con "Ver más" (altura corta: se ve poco y se despliega) ----- */
.dg-ficha-v2 .dg-ficha-contenido {
	--dg-clamp: 280px;
}

.dg-ficha-v2 .dg-ficha-contenido.dg-clamp {
	max-height: var(--dg-clamp);
	overflow: hidden;
	position: relative;
}

.dg-ficha-v2 .dg-ficha-contenido.dg-clamp::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 72px;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--dg-card));
	pointer-events: none;
}

.dg-ficha-v2 .dg-ver-mas {
	margin-top: auto;
	align-self: center;
	background: transparent;
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius-pill);
	padding: 9px 26px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--dg-ink);
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease;
}

.dg-ficha-v2 .dg-ver-mas:hover {
	border-color: var(--dg-ink);
	background: #11111108;
}

.dg-ficha-v2 .dg-ver-mas:not([hidden]) {
	margin-top: 16px;
}

/* ----- Características: filas etiqueta gris / valor, como el mockup ----- */
.dg-ficha-v2 .dg-ficha-caracteristicas .field-name-field-product-attributes-n .field-item {
	border-top: 0;
	border-bottom: 1px solid var(--dg-border);
	padding: 9px 0;
	font-size: 13.5px;
}

/* El HTML de Cadena 88 mete un div intermedio (.ds-1col) entre la fila y la
   etiqueta/valor; sin esto, la fila colapsa al ancho del contenido. */
.dg-ficha-v2 .dg-ficha-caracteristicas .field-name-field-product-attributes-n .field-item > .ds-1col {
	flex: 1 1 auto;
	display: flex;
	align-items: flex-start;
	min-width: 0;
}

/* Las unidades (cm, kg…) vienen en divs anidados que saltaban a una segunda
   línea y descuadraban las filas; en línea con el valor quedan limpias. */
.dg-ficha-v2 .dg-ficha-caracteristicas .group-atributo-valor div {
	display: inline;
}

/* El HTML de Cadena anida OTROS .field-item dentro de la etiqueta y del
   valor; el CSS del Customizer les ponía flex + borde + padding y por eso
   salían líneas dobles bajo cada etiqueta. Se neutralizan los anidados. */
.dg-ficha-v2 .dg-ficha-caracteristicas .field-name-field-product-attributes-n .field-item .field,
.dg-ficha-v2 .dg-ficha-caracteristicas .field-name-field-product-attributes-n .field-item .field-items,
.dg-ficha-v2 .dg-ficha-caracteristicas .field-name-field-product-attributes-n .field-item .field-item {
	display: inline !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	font-size: inherit;
	color: inherit;
}

.dg-ficha-v2 .dg-ficha-caracteristicas .group-atributo-etiqueta {
	flex: 0 0 46%;
	font-weight: 400;
	color: var(--dg-gray-500);
}

.dg-ficha-v2 .dg-ficha-caracteristicas .group-atributo-valor {
	color: var(--dg-ink);
}

.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
}

.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes tr {
	border: 0;
	border-bottom: 1px solid var(--dg-border);
	background: none;
}

.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes th,
.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes td {
	border: 0;
	background: none;
	padding: 9px 0;
	font-size: 13.5px;
	line-height: 1.5;
	text-align: left;
}

.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes th {
	width: 46%;
	font-weight: 400;
	color: var(--dg-gray-500);
	font-style: normal;
}

.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes td {
	color: var(--dg-ink);
}

.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes td p {
	margin: 0;
	font-size: 13.5px;
}

/* =========================================================
   Valoraciones — "Opiniones" estilo Molino sobre el grid de CusRev
   ========================================================= */
.dg-ficha-v2 .dg-ficha-valoraciones {
	margin-top: 8px;
	margin-bottom: 44px;
}

/* Títulos con la tipografía del sitio (sin fuentes externas) */
.dg-ficha-v2 .dg-opiniones-titulo {
	font-size: clamp(22px, 2.4vw, 28px);
	font-weight: 750;
	letter-spacing: -0.01em;
	text-align: center;
	color: var(--dg-ink);
	margin: 10px 0 2px;
}

.dg-ficha-v2 .dg-opiniones-sub {
	font-size: 15px;
	line-height: 1.5;
	text-align: center;
	color: var(--dg-gray-500);
	margin: 0 0 22px;
}

.dg-ficha-v2 .cr-reviews-grid {
	border-radius: 16px;
	padding: 24px;
}

.dg-ficha-v2 .cr-summaryBox-wrap {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px;
	background: var(--dg-card) !important;
	border: 1px solid var(--dg-border) !important;
	border-radius: var(--dg-radius) !important;
	box-shadow: var(--dg-shadow);
	padding: 26px 30px !important;
	margin-bottom: 24px;
}

.dg-ficha-v2 .cr-summary-separator-side,
.dg-ficha-v2 .cr-summary-separator {
	display: none !important;
}

.dg-ficha-v2 .cr-overall-rating-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	min-width: 180px;
	flex: 0 0 auto;
}

.dg-ficha-v2 .cr-average-rating span {
	font-size: 3.2rem;
	font-weight: 700;
	color: var(--dg-ink);
	line-height: 1;
}

.dg-ficha-v2 .cr-total-rating-count {
	color: var(--dg-gray-500);
	font-size: 0.85rem;
}

.dg-ficha-v2 .cr-rating-icon-base svg {
	stroke: #dad3c2;
}

.dg-ficha-v2 .cr-rating-icon-frnt svg {
	stroke: var(--dg-estrella) !important;
	fill: var(--dg-estrella) !important;
}

.dg-ficha-v2 .ivole-summaryBox {
	flex: 1 1 240px;
	min-width: 220px;
	float: none !important;
	width: auto !important;
}

.dg-ficha-v2 .cr-histogramTable {
	display: flex;
	flex-direction: column;
	gap: 7px;
}

.dg-ficha-v2 .ivole-histogramRow {
	display: flex !important;
	align-items: center;
	gap: 10px;
}

.dg-ficha-v2 .ivole-histogramCell1 {
	min-width: 34px;
}

.dg-ficha-v2 .ivole-histogramCell1 svg {
	width: 13px;
	height: 13px;
	stroke: var(--dg-estrella);
	fill: var(--dg-estrella);
}

.dg-ficha-v2 .cr-histogram-rating-value {
	font-size: 0.85rem;
	color: var(--dg-ink);
}

.dg-ficha-v2 .ivole-histogramCell2 {
	flex: 1;
}

.dg-ficha-v2 .ivole-meter {
	background: #efeae0 !important;
	border: none !important;
	border-radius: 999px !important;
	height: 8px !important;
	overflow: hidden;
}

.dg-ficha-v2 .ivole-meter-bar {
	background: var(--dg-estrella) !important;
	height: 8px !important;
	border-radius: 999px !important;
	font-size: 0 !important;
	color: transparent !important;
	line-height: 8px !important;
}

.dg-ficha-v2 .ivole-histogramCell3 {
	min-width: 38px;
	text-align: right;
	font-size: 0.8rem;
	color: var(--dg-gray-500);
}

.dg-ficha-v2 .cr-add-review-wrap {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
}

.dg-ficha-v2 button.cr-all-reviews-add-review {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	background: var(--dg-red) !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: var(--dg-radius-pill) !important;
	padding: 14px 28px !important;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	text-indent: 1.5px; /* compensa el letter-spacing del último carácter */
	font-size: 0.82rem !important;
	font-weight: 700;
	line-height: 1 !important;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: 0 6px 16px rgba(222, 1, 0, 0.22);
	transition: filter 0.15s ease, transform 0.15s ease;
}

.dg-ficha-v2 button.cr-all-reviews-add-review:hover {
	filter: brightness(1.08);
	transform: translateY(-1px);
}

/* Muro a 4 columnas en escritorio: la 4ª columna la inyecta el PHP y el
   masonry del plugin (Colcade) reparte solo entre las columnas visibles.
   <993px se oculta la 4ª (quedan 3), y el propio plugin baja a 2 (<801px)
   y a 1 (<551px). */
@media (max-width: 992px) {
	.dg-ficha-v2 .cr-reviews-grid-inner .cr-reviews-grid-col4 {
		display: none;
	}
}

.dg-ficha-v2 .cr-reviews-grid .cr-review-card {
	border-radius: 14px !important;
	transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.dg-ficha-v2 .cr-review-card .cr-review-card-content {
	font-size: 15px;
	line-height: 1.6;
}

.dg-ficha-v2 .cr-review-card .reviewer-name {
	font-size: 17px;
	font-weight: 700;
}

.dg-ficha-v2 .cr-review-card .reviewer-verified {
	font-size: 13.5px;
}

.dg-ficha-v2 .cr-reviews-grid .cr-review-card:hover {
	box-shadow: 0 10px 26px rgba(17, 17, 17, 0.10);
	transform: translateY(-2px);
}

.dg-ficha-v2 .cr-reviews-grid .image-row-img {
	border-radius: 10px;
}

/* =========================================================
   "Perfecto para complementar con" + "Vistos recientemente"
   ========================================================= */
.dg-ficha-v2 .dg-rel-seccion {
	margin-bottom: 40px;
}

/* Más aire antes de la franja de servicios (y el hueco ya no es blanco:
   el fondo del body es --dg-bg) */
.dg-ficha-v2 .dg-vistos-wrapper {
	margin-bottom: 72px;
}

/* Botón de PayPal a ancho completo bajo el pago exprés */
.dg-ficha-v2 .dg-compra-card [id^="ppc-button"] {
	margin-top: 10px;
}

/* Pago exprés en UNA fila (como en el checkout). El CSS del plugin de
   Stripe ya es flex con flex:1 por botón, pero un CSS antiguo del
   Customizer fuerza display:block en el contenedor (apilado) y
   min-width:90px !important en los botones, y además pinta la etiqueta
   "Pago exprés" (::before, que se conserva). Se recupera el flex del
   plugin con más especificidad y un mínimo que permite fila. */
body.dg-ficha-v2 #wc-stripe-express-checkout-element,
body.woocommerce-cart #wc-stripe-express-checkout-element {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
}

body.dg-ficha-v2 #wc-stripe-express-checkout-element > div,
body.woocommerce-cart #wc-stripe-express-checkout-element > div,
body.woocommerce-cart #wc-stripe-express-checkout-element > .StripeElement {
	flex: 1 1 0 !important;
	width: auto !important;
	min-width: 140px !important;
	margin: 0 !important;
}

@media (max-width: 600px) {
	body.dg-ficha-v2 #wc-stripe-express-checkout-element > div,
	body.woocommerce-cart #wc-stripe-express-checkout-element > div,
	body.woocommerce-cart #wc-stripe-express-checkout-element > .StripeElement {
		min-width: 100px !important;
	}
}

.dg-ficha-v2 .dg-vistos-wrapper[hidden] {
	display: none;
}

.dg-ficha-v2 .dg-rel-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
}

.dg-ficha-v2 .dg-rel-head h2 {
	font-size: 18px;
	font-weight: 750;
	color: var(--dg-ink);
	margin: 0;
}

.dg-ficha-v2 .dg-rel-head span {
	color: var(--dg-gray-500);
	font-size: 13px;
}

.dg-ficha-v2 .dg-rel-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}

.dg-ficha-v2 .dg-rel {
	background: var(--dg-card);
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius);
	padding: 14px;
	display: flex;
	flex-direction: column;
	transition: box-shadow 0.15s ease;
}

.dg-ficha-v2 .dg-rel:hover {
	box-shadow: 0 8px 20px rgba(17, 17, 17, 0.08);
}

.dg-ficha-v2 .dg-rel-img {
	display: block;
	margin-bottom: 10px;
}

.dg-ficha-v2 .dg-rel-img img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--dg-radius-sm);
	display: block;
}

.dg-ficha-v2 .dg-rel small {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--dg-gray-500);
}

.dg-ficha-v2 .dg-rel p {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
	margin: 2px 0 8px;
}

.dg-ficha-v2 .dg-rel p a {
	color: var(--dg-ink);
	text-decoration: none;
}

.dg-ficha-v2 .dg-rel-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: auto;
}

.dg-ficha-v2 .dg-rel-foot b,
.dg-ficha-v2 .dg-rel-foot b .woocommerce-Price-amount {
	font-size: 15px;
	color: var(--dg-ink);
}

.dg-ficha-v2 .dg-rel-foot b del,
.dg-ficha-v2 .dg-rel-foot b del .woocommerce-Price-amount {
	font-size: 12px;
	font-weight: 400;
	color: var(--dg-gray-500);
}

.dg-ficha-v2 .dg-rel-foot b ins {
	text-decoration: none;
	background: none;
}

.dg-ficha-v2 .dg-rel-add {
	width: 30px;
	height: 30px;
	flex: 0 0 auto;
	border-radius: 50%;
	border: 1.5px solid var(--dg-ink);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
	color: var(--dg-ink);
	text-decoration: none;
	background: transparent;
	padding: 0 !important;
	transition: all 0.15s ease;
}

.dg-ficha-v2 .dg-rel-add:hover {
	background: var(--dg-black);
	color: #fff;
	border-color: var(--dg-black);
}

.dg-ficha-v2 .dg-rel-add.added::after {
	display: none;
}

.dg-ficha-v2 .dg-rel .added_to_cart {
	font-size: 11px;
	margin-left: 8px;
}

/* =========================================================
   Carrito lateral (drawer) — GLOBAL: más ancho y look Droguemar
   (misma liga que el de Molino: tarjetas, barra de envío en
   tarjeta verde, subtotal grande, botón de borrar en círculo)
   ========================================================= */
.shoptimizer-mini-cart-wrap {
	width: 480px !important;
	max-width: 100vw;
	background: var(--dg-bg);
	/* el tema lo esconde con right:-420px fijo; con 480px asomaban 60px */
	right: -520px !important;
	transition: right 0.45s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body.drawer-open .shoptimizer-mini-cart-wrap {
	right: 0 !important;
	box-shadow: -16px 0 48px rgba(17, 17, 17, 0.18);
}

@media (max-width: 560px) {
	.shoptimizer-mini-cart-wrap {
		width: 100vw !important;
		right: -110vw !important;
	}

	body.drawer-open .shoptimizer-mini-cart-wrap {
		right: 0 !important;
	}
}

/* Fondo atenuado y difuminado al abrir (overlay del tema en escritorio
   y móvil) */
.drawer-open::before,
.drawer-open .mobile-overlay {
	background: rgba(17, 17, 17, 0.45) !important;
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

.shoptimizer-mini-cart-wrap .cart-drawer-heading {
	font-size: 18px;
	font-weight: 750;
	color: var(--dg-ink);
}

/* Barra de envío gratis (CommerceKit): tarjeta verde, texto encima */
.shoptimizer-mini-cart-wrap .cgkit-fsn-bar {
	display: flex;
	flex-direction: column-reverse;
	gap: 10px;
	background: var(--dg-green-soft);
	border: 1px solid #d3ecdc;
	border-radius: var(--dg-radius);
	padding: 14px 16px;
	margin: 18px 0 14px; /* aire respecto a la cabecera "Carrito" */
}

.shoptimizer-mini-cart-wrap .cgkit-fsn-title {
	color: var(--dg-green);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}

.shoptimizer-mini-cart-wrap .cgkit-fsn-progress-bar {
	background: #d8ecdf;
	border-radius: var(--dg-radius-pill);
	height: 8px;
	overflow: hidden;
}

.shoptimizer-mini-cart-wrap .cgkit-fsn-amount {
	display: block;
	height: 8px;
	border-radius: var(--dg-radius-pill);
	background: var(--dg-green) !important;
}

/* Cada producto como tarjeta blanca: imagen fija a la izquierda,
   borrar en círculo arriba a la derecha (sin pisar el nombre) */
.shoptimizer-mini-cart-wrap ul.woocommerce-mini-cart li.woocommerce-mini-cart-item {
	position: relative;
	background: var(--dg-card);
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius);
	box-shadow: var(--dg-shadow);
	padding: 14px 14px 14px 102px !important;
	min-height: 104px;
	margin: 0 0 10px;
}

.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item img {
	position: absolute;
	left: 14px;
	top: 14px;
	width: 72px !important;
	height: 72px;
	object-fit: cover;
	margin: 0 !important;
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius-sm);
}

.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item a.remove {
	position: absolute !important;
	top: 10px !important;
	right: 10px !important;
	left: auto !important;
	width: 26px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--dg-card) !important;
	border: 1px solid var(--dg-border);
	border-radius: 50%;
	color: var(--dg-gray-500) !important;
	font-size: 16px;
	line-height: 1;
	z-index: 2;
}

.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item a.remove:hover {
	border-color: var(--dg-red);
	color: var(--dg-red) !important;
}

/* El tema pinta ADEMÁS una papelera por máscara en ::before: fuera
   (nos quedamos solo con la ×, limpia y centrada) */
.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item a.remove::before,
.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item a.remove::after {
	display: none !important;
	content: none !important;
}

/* Nombre del producto */
.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item > a:not(.remove) {
	display: block;
	padding-right: 28px;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--dg-ink);
}

/* Entrega estimada (dl.variation) en una línea gris */
.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item dl.variation {
	margin: 3px 0 0;
	border: 0;
	padding: 0;
	font-size: 12px;
	color: var(--dg-gray-500);
}

.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item dl.variation dt,
.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item dl.variation dd,
.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item dl.variation dd p {
	display: inline;
	margin: 0;
	padding: 0;
	float: none;
	font-weight: 400;
	font-size: 12px;
	color: var(--dg-gray-500);
}

/* Precio */
.shoptimizer-mini-cart-wrap li.woocommerce-mini-cart-item > .woocommerce-Price-amount {
	display: block;
	margin: 6px 0 8px;
	font-size: 15px;
	font-weight: 700;
	color: var(--dg-ink);
}

/* Stepper de cantidad en pill */
.shoptimizer-mini-cart-wrap .shoptimizer-custom-quantity-mini-cart_container .quantity {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--dg-border);
	border-radius: var(--dg-radius-pill);
	background: #fff;
	overflow: hidden;
}

/* Subtotal: fila limpia con el importe grande */
.shoptimizer-mini-cart-wrap .woocommerce-mini-cart__total {
	background: transparent;
	border: 0;
	border-top: 1px solid var(--dg-border);
	border-radius: 0;
	box-shadow: none;
	padding: 14px 0 2px;
	margin: 10px 0 6px;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
}

.shoptimizer-mini-cart-wrap .woocommerce-mini-cart__total strong {
	font-size: 14px;
	font-weight: 600;
	color: var(--dg-gray-700);
}

.shoptimizer-mini-cart-wrap .woocommerce-mini-cart__total > .woocommerce-Price-amount {
	font-size: 22px;
	font-weight: 800;
	color: var(--dg-ink);
}

/* Botones: "Finalizar compra" negro pill, "Ver carrito" en línea */
.shoptimizer-mini-cart-wrap .buttons .button {
	border-radius: var(--dg-radius-pill) !important;
	font-weight: 700;
}

.shoptimizer-mini-cart-wrap .buttons a.button:not(.checkout) {
	background: transparent !important;
	border: 1px solid var(--dg-border) !important;
	color: var(--dg-ink) !important;
}

.shoptimizer-mini-cart-wrap .buttons a.button:not(.checkout):hover {
	border-color: var(--dg-ink) !important;
}

/* Iconos de pago y "Tu compra está protegida" */
.shoptimizer-mini-cart-wrap .cart-drawer-below {
	text-align: center;
	color: var(--dg-gray-500);
	font-size: 12px;
	padding-top: 4px;
}

.shoptimizer-mini-cart-wrap .cart-drawer-below img {
	margin: 0 auto 4px;
	opacity: 0.9;
}

/* PayPal del carrito lateral, con aire */
.shoptimizer-mini-cart-wrap #ppc-button-minicart {
	display: block;
	margin-top: 10px;
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 992px) {
	.dg-ficha-v2 .dg-ficha-detalles {
		grid-template-columns: 1fr;
		margin-top: 28px;
	}

	.dg-ficha-v2 .dg-ficha-seccion {
		min-height: 0;
		padding: 20px;
	}

	.dg-ficha-v2 .dg-ficha-contenido {
		--dg-clamp: 240px;
	}

	.dg-ficha-v2 .dg-ficha-caracteristicas .group-atributo-etiqueta {
		flex: 0 0 42%;
	}

	.dg-ficha-v2 .dg-ficha-caracteristicas .shop_attributes th {
		width: 42%;
	}

	.dg-ficha-v2 .dg-compra-card p.price {
		font-size: 28px !important;
	}

	/* Cantidad más compacta para que "Añadir al carrito" quepa en una línea */
	body.dg-ficha-v2 .summary form.cart div.quantity {
		width: 120px !important;
		min-width: 120px;
	}

	body.dg-ficha-v2 .summary form.cart .quantity .quantity-button {
		width: 34px !important;
	}

	body.dg-ficha-v2 .summary form.cart .quantity input.qty {
		width: 50px;
	}

	body.dg-ficha-v2 .summary form.cart .single_add_to_cart_button {
		font-size: 14px !important;
		white-space: nowrap;
	}

	.dg-ficha-v2 .cr-reviews-grid {
		padding: 14px;
	}

	.dg-ficha-v2 .cr-summaryBox-wrap {
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
		padding: 20px !important;
	}

	.dg-ficha-v2 .cr-overall-rating-wrap {
		min-width: 0;
	}

	.dg-ficha-v2 .cr-add-review-wrap {
		justify-content: center;
	}

	.dg-ficha-v2 .dg-rel-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.dg-ficha-v2 .dg-rel-head {
		flex-direction: column;
		gap: 2px;
	}
}