/* =========================================================
   YO, TURO — COLORES DE NAVIDAD EN TODO EL SITIO
   Con la campaña activa (navidad.php) el cuerpo lleva la clase
   turo-navidad-theme y el violeta de la marca pasa a rojo. Los CSS del
   tema leen el violeta de estas variables (var(--turo-violet, #bb9efa)),
   así que fuera de la campaña todo queda como siempre.
   Para cambiar el tono, editar solo estas variables.
========================================================= */
body.turo-navidad-theme {
	--turo-violet: #e0323c;       /* acentos, insignias, sombras, hover */
	--turo-violet-soft: #ffe5e7;  /* fondos claros que eran lavanda */
	--turo-violet-dark: #a8141f;  /* el violeta oscuro */
	--turo-violet-light: #ff8d93; /* el violeta claro */

	/* Variables base del tema (01-base.css), que se calculan en :root. */
	--turo-avocado: #e0323c;
	--turo-lilac: #e0323c;
	--turo-pink: #e0323c;
	--turo-blue: #e0323c;
	--turo-accent: #e0323c;
	--turo-accent-soft: color-mix(in srgb, #e0323c 10%, #fff);

	/* Color violeta-azulado de la paleta de Astra/Elementor (etiquetas de oferta y similares). */
	--ast-global-color-8: #e0323c;
	--e-global-color-astglobalcolor8: #e0323c;
}

/* Etiqueta "Oferta" de las tarjetas de producto (Astra). */
body.turo-navidad-theme .ast-on-card-button.ast-onsale-card,
body.turo-navidad-theme .woocommerce span.onsale {
	background-color: #d6222e;
}

/* Club de ofertas (newsletter): sobre el rojo, el título, el texto y las ventajas van en blanco. */
body.turo-navidad-theme .turo-newsletter__content h2 { color: #fff !important; }
body.turo-navidad-theme .turo-newsletter__content p { color: #fff; font-weight: 600; }

body.turo-navidad-theme .turo-newsletter__perks li {
	border-color: rgba(255, 255, 255, .7);
	background: rgba(0, 0, 0, .16);
	color: #fff;
}

/* Club de ofertas: fondo verde, sin sombra dura y con doodles navideños. */
body.turo-navidad-theme .turo-newsletter__inner {
	overflow: visible;
	background:
		radial-gradient(circle at 12% 18%, rgba(255, 255, 255, .13) 0 3px, transparent 4px) 0 0 / 46px 46px,
		radial-gradient(circle at 70% 80%, rgba(255, 255, 255, .1) 0 2px, transparent 3px) 0 0 / 38px 38px,
		#1f6f3e;
	border-color: #165530;
	box-shadow: none;
}

body.turo-navidad-theme .turo-newsletter__form { box-shadow: none; border-color: #165530; }
body.turo-navidad-theme .turo-newsletter__sticker { box-shadow: none; background: #f7c948; border-color: #165530; }
body.turo-navidad-theme .turo-newsletter__eyebrow { border-color: #165530; }

body.turo-navidad-theme .turo-newsletter__inner::before,
body.turo-navidad-theme .turo-newsletter__inner::after {
	position: absolute;
	z-index: 0;
	pointer-events: none;
	animation: turo-navidad-bob 5s ease-in-out infinite;
}

body.turo-navidad-theme .turo-newsletter__inner::before { content: "🎄 ⭐ ❄️"; left: 3%; bottom: -22px; font-size: 38px; letter-spacing: 10px; }
body.turo-navidad-theme .turo-newsletter__inner::after { content: "🎁 ❄️ 🦴"; right: 4%; top: -22px; font-size: 34px; letter-spacing: 10px; animation-delay: -2s; }

body.turo-navidad-theme .turo-newsletter__content,
body.turo-navidad-theme .turo-newsletter__form { position: relative; z-index: 1; }

/* Carrito y checkout: hero verde navideño (navidad.php) en lugar del encabezado de Elementor. */
body:has(.turo-navidad-hero-cart).woocommerce-cart .elementor-element-07bb248,
body:has(.turo-navidad-hero-cart).woocommerce-cart .elementor-element-c81bd27,
body:has(.turo-navidad-hero-cart).woocommerce-cart .elementor-element-b362b70,
body:has(.turo-navidad-hero-cart).woocommerce-checkout .elementor-element-877e1d5,
body:has(.turo-navidad-hero-cart).woocommerce-checkout .elementor-element-219e3d8,
body:has(.turo-navidad-hero-cart).woocommerce-checkout .elementor-element-c7c8195 { display: none !important; }

.turo-navidad-hero-cart {
	position: relative;
	display: grid;
	justify-items: center;
	gap: 6px;
	grid-column: 1 / -1 !important;
	grid-row: 1;
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 24px;
	padding: clamp(28px, 4vw, 46px) 24px;
	overflow: hidden;
	border-radius: clamp(24px, 3vw, 34px);
	background:
		radial-gradient(circle at 12% 28%, rgba(255, 255, 255, .14) 0 3px, transparent 4px) 0 0 / 46px 46px,
		radial-gradient(circle at 68% 76%, rgba(255, 255, 255, .1) 0 2px, transparent 3px) 0 0 / 38px 38px,
		#1f6f3e;
	color: #fff;
	text-align: center;
}

/* El resumen sigue empezando en la misma fila que el aviso de envío: el hero suma una fila arriba. */
.woocommerce-cart .woocommerce:has(.turo-navidad-hero-cart) > .cart-collaterals { grid-row: 3 / span 3 !important; }

.turo-navidad-hero-cart__emoji { font-size: clamp(34px, 4vw, 46px); line-height: 1; animation: turo-navidad-bob 4.6s ease-in-out infinite; }
.turo-navidad-hero-cart > strong { font-size: clamp(28px, 4vw, 44px); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.turo-navidad-hero-cart > span:not([class]) { color: #f7e9a8; font-size: clamp(14px, 1.5vw, 17px); font-weight: 600; }

.turo-navidad-hero-cart__deco {
	position: absolute;
	font-size: clamp(30px, 4vw, 46px);
	letter-spacing: 12px;
	pointer-events: none;
	animation: turo-navidad-bob 5s ease-in-out infinite;
}

.turo-navidad-hero-cart__deco--a { left: 4%; top: 16%; }
.turo-navidad-hero-cart__deco--b { right: 4%; bottom: 14%; animation-delay: -2s; }

@media (max-width: 767px) {
	.turo-navidad-hero-cart { padding: 22px 16px; }
	.turo-navidad-hero-cart__deco { opacity: .45; font-size: 24px; }
}

/* Celular: el aviso del carrito y del checkout es una franja baja; el resumen queda a la vista. */
@media (max-width: 767px) {
	.turo-navidad-hero-cart {
		gap: 3px;margin-bottom: 14px;padding: 14px 16px;border-radius: 20px;
	}

	.turo-navidad-hero-cart__deco,
	.turo-navidad-hero-cart__emoji {
		display: none;
	}

	.turo-navidad-hero-cart > strong {
		font-size: 20px;
	}

	.turo-navidad-hero-cart > span:not([class]) {
		font-size: 13px;line-height: 1.4;
	}
}

/* Celular y tablet: el resumen va después de los productos (arriba lo mandaba una fila fija del escritorio). */
@media (max-width: 1100px) {
	.woocommerce-cart .woocommerce:has(.turo-navidad-hero-cart) > .cart-collaterals { grid-row: auto !important; }
}

/* Celular: el aviso de Navidad ocupa todo el ancho de la pantalla, sin forma de bloque. */
@media (max-width: 767px) {
	.turo-navidad-hero-cart {
		width: 100vw !important;max-width: 100vw !important;margin: 0 calc(50% - 50vw) 12px !important;padding: 12px 16px;border-radius: 0 !important;
	}
}

/* Celular: el aviso de Navidad del carrito y del checkout queda pegado al header, sin espacio arriba. */
@media (max-width: 767px) {
	body:has(.turo-navidad-hero-cart) #content,
	body:has(.turo-navidad-hero-cart) #primary,
	body:has(.turo-navidad-hero-cart) #main,
	body:has(.turo-navidad-hero-cart) .entry-content,
	body:has(.turo-navidad-hero-cart) .e-con:has(.turo-navidad-hero-cart),
	body:has(.turo-navidad-hero-cart) .elementor-section:has(.turo-navidad-hero-cart),
	body:has(.turo-navidad-hero-cart) .elementor-widget-shortcode:has(.turo-navidad-hero-cart),
	body:has(.turo-navidad-hero-cart) .elementor-widget-container:has(.turo-navidad-hero-cart),
	body:has(.turo-navidad-hero-cart) .woocommerce:has(> .turo-navidad-hero-cart) {
		padding-top: 0 !important;margin-top: 0 !important;
	}

	body:has(.turo-navidad-hero-cart) .turo-navidad-hero-cart { margin-top: 0 !important; }
}

/* Celular: más aire en la franja verde del carrito y checkout. */
@media (max-width: 767px) {
	.turo-navidad-hero-cart {
		gap: 6px;padding: 26px 28px !important;
	}
}

/* El aviso verde mide lo que mide su texto: en el checkout se estiraba y separaba el título de la bajada. */
.turo-navidad-hero-cart {
	align-self: start;align-content: center;flex: 0 0 auto;grid-auto-rows: max-content;height: auto !important;min-height: 0 !important;
}

/* Celular: el aviso es una columna simple (no una grilla), así su alto es solo el de su texto. */
@media (max-width: 767px) {
	.turo-navidad-hero-cart {
		display: flex !important;flex-direction: column;align-items: center;justify-content: center;gap: 6px;height: auto !important;min-height: 0 !important;max-height: none !important;
	}

	.turo-navidad-hero-cart > strong,
	.turo-navidad-hero-cart > span:not([class]) { margin: 0 !important;padding: 0 !important; }
}

/* WordPress mete <br> entre los elementos del aviso (autop); cada uno sumaba una línea vacía. */
.turo-navidad-hero-cart br { display: none !important; }
