/* Tema temporal. La futura configuración de temporadas controlará esta clase. */
.tema-halloween-activo {
    --rosa: #ff8a24;
    --rosa-fuerte: #f06416;
    --rosa-claro: #fff3dd;
    --celeste: #9c59d1;
    --celeste-oscuro: #7030a0;
    --celeste-cantidad: #8b49bd;
    --tinta: #291638;
    --texto-suave: #715d78;
    --borde: #efbd73;
    --sombra: 0 15px 40px rgba(31, 8, 45, .22);
    position: relative;
    min-height: 100vh;
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(circle at 84% 9%, rgba(255, 178, 65, .27), transparent 19rem),
        radial-gradient(circle at 8% 76%, rgba(132, 58, 173, .22), transparent 24rem),
        linear-gradient(180deg, #211029 0, #391746 30rem, #fff5e8 68rem, #fffaf3 100%);
}

.tema-halloween-activo > :not(.tema-halloween) { position: relative; z-index: 2; }
.tema-halloween { position: fixed; inset: 0; z-index: 35; overflow: hidden; pointer-events: none; }
.tema-halloween__luna { position: absolute; top: 96px; right: 6vw; width: 112px; height: 112px; border-radius: 50%; background: #ffd87a; box-shadow: 0 0 0 12px rgba(255, 214, 116, .08), 0 0 54px rgba(255, 198, 80, .64); opacity: .92; }
.tema-halloween__luna::before, .tema-halloween__luna::after { content: ""; position: absolute; border-radius: 50%; background: rgba(166, 111, 79, .2); }
.tema-halloween__luna::before { width: 22px; height: 22px; top: 24px; left: 27px; }
.tema-halloween__luna::after { width: 14px; height: 14px; right: 25px; bottom: 29px; }
.tema-halloween__telarana { position: absolute; top: 0; width: 126px; height: 126px; opacity: .6; background: repeating-radial-gradient(circle at top left, transparent 0 14px, rgba(63,22,76,.92) 15px 16px, transparent 17px 25px), repeating-conic-gradient(from 0deg at top left, rgba(63,22,76,.88) 0 1deg, transparent 1deg 22.5deg); clip-path: polygon(0 0, 100% 0, 0 100%); filter: drop-shadow(0 2px 2px rgba(255,255,255,.8)); }
.tema-halloween__telarana--izquierda { left: 0; }
.tema-halloween__telarana--derecha { right: 0; transform: scaleX(-1); }
.tema-halloween__murcielago { position: absolute; opacity: .9; filter: grayscale(1) brightness(.12) drop-shadow(0 2px 1px rgba(255,255,255,.9)); animation: halloween-volar 8s ease-in-out infinite; }
.tema-halloween__murcielago--uno { top: 17%; left: 3%; font-size: 29px; }
.tema-halloween__murcielago--dos { top: 43%; left: 48%; font-size: 23px; animation-delay: -2.8s; }
.tema-halloween__murcielago--tres { top: 68%; right: 4%; font-size: 32px; animation-delay: -5.2s; }
.tema-halloween__fantasma { position: fixed; right: 1vw; bottom: 17%; font-size: clamp(34px, 4vw, 54px); opacity: .94; filter: drop-shadow(0 7px 7px rgba(31, 8, 45, .42)); animation: halloween-flotar 3.6s ease-in-out infinite; }
.tema-halloween__calaveras { position: fixed; left: 2.2vw; top: 42%; display: flex; align-items: center; gap: .2rem; padding: .32rem .62rem; border: 1px solid rgba(255, 190, 101, .74); border-radius: 999px; background: rgba(255, 248, 225, .92); color: #8145a3; font-size: clamp(18px, 2.2vw, 30px); filter: drop-shadow(0 6px 9px rgba(40, 12, 48, .2)); animation: halloween-calaverita 4.2s ease-in-out infinite; }
.tema-halloween__calabazas { position: fixed; left: 1vw; bottom: 16px; display: flex; align-items: center; gap: .45rem; color: #ffd8a2; font-size: clamp(27px, 3vw, 43px); filter: drop-shadow(0 6px 6px rgba(34, 8, 40, .42)); }
.tema-halloween__calabazas small { padding: .35rem .65rem; border: 1px solid rgba(255, 174, 55, .7); border-radius: 999px; background: rgba(35, 13, 46, .82); color: #ffb64b; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.tema-halloween__monstruos-centro { position: fixed; left: 50%; bottom: 8px; width: clamp(145px,15.5vw,260px); height: auto; object-fit: contain; filter: drop-shadow(0 8px 9px rgba(40,12,48,.23)); transform-origin: bottom center; animation: halloween-monstruos 4.8s ease-in-out infinite; }
.tema-halloween__calaveras-amigables { position: fixed; right: 1.4vw; bottom: 12px; width: clamp(88px,8.5vw,145px); height: auto; object-fit: contain; filter: drop-shadow(0 8px 9px rgba(40,12,48,.24)); transform-origin: bottom center; animation: halloween-calaverita-derecha 4.5s ease-in-out infinite; }

.tema-halloween-activo .encabezado { background: linear-gradient(105deg, rgba(29, 10, 40, .98), rgba(74, 25, 88, .98) 62%, rgba(173, 70, 24, .96)); border-bottom: 2px solid #ff982f; color: #fff7e7; box-shadow: 0 7px 22px rgba(22, 4, 29, .35); }
.tema-halloween-activo .encabezado__grupos-boton,
.tema-halloween-activo .encabezado__carrito { border-color: rgba(255, 174, 66, .52); background: rgba(255,255,255,.92); color: #32163c; }
.tema-halloween-activo .encabezado__busqueda { border-color: #ff9c35; box-shadow: 0 0 0 3px rgba(255, 144, 31, .14); }
.tema-halloween-activo .encabezado__busqueda button { background: linear-gradient(145deg, #ff9d2e, #f0661b); color: #2a102e; }
.tema-halloween-activo .encabezado__carrito-icono { color: #f06416; }
.tema-halloween-activo .encabezado__carrito-icono b { background: #71369d; }
.tema-halloween-activo main { background: transparent; }
.tema-halloween-activo .presentacion__marca,
.tema-halloween-activo .producto-tarjeta,
.tema-halloween-activo .producto-seccion,
.tema-halloween-activo .pagina-interna,
.tema-halloween-activo .pedido-contenido,
.tema-halloween-activo .identificacion-tarjeta { border-color: rgba(255, 151, 47, .58); background: rgba(255, 250, 241, .96); box-shadow: 0 16px 34px rgba(36, 10, 43, .2); }
.tema-halloween-activo .producto-tarjeta::before { background: linear-gradient(90deg, #ff9d2e, #7e3dad, #ff9d2e); }
.tema-halloween-activo .producto-tarjeta__agregar,
.tema-halloween-activo .boton-primario { border-color: #d95313; background: linear-gradient(135deg, #ff9d2e, #e85214 58%, #8b3dab); color: #fff; box-shadow: 0 8px 20px rgba(112, 39, 112, .27); }
.tema-halloween-activo .producto-tarjeta__precio,
.tema-halloween-activo .producto-seccion__titulo,
.tema-halloween-activo h1,
.tema-halloween-activo h2 { color: #692d82; }
.tema-halloween-activo .pie-pagina { border-top-color: #ff9633; background: linear-gradient(105deg, #21102d, #54205f 58%, #8c3c1d); color: #fff3dc; }
.tema-halloween-activo .carrito-panel,
.tema-halloween-activo .departamentos-panel { border-color: #f39133; background: #fff8ed; }
.tema-halloween-activo .producto-seccion { position: relative; }
.tema-halloween-activo .producto-seccion::after {
    content: "🦇  🕸️  🎃  👻  💀";
    position: absolute;
    z-index: 4;
    top: 9px;
    right: 1rem;
    padding: .25rem .65rem;
    border: 1px solid rgba(255, 150, 47, .7);
    border-radius: 999px;
    background: rgba(47, 17, 59, .9);
    box-shadow: 0 5px 13px rgba(34, 8, 40, .23);
    font-size: 19px;
    letter-spacing: .08em;
}
.tema-halloween-activo .producto-seccion > * { position: relative; z-index: 2; }
.tema-halloween-activo .producto-tarjeta::after { position: absolute; z-index: 6; top: 10px; right: 10px; min-width: 30px; height: 30px; display: grid; place-items: center; padding: 2px; border: 1px solid rgba(255, 147, 42, .65); border-radius: 50%; background: rgba(47, 17, 59, .92); font-size: 18px; line-height: 1; box-shadow: 0 4px 10px rgba(46, 14, 52, .22); pointer-events: none; }
.tema-halloween-activo .producto-tarjeta:nth-child(5n+1)::after { content: "🎃"; }
.tema-halloween-activo .producto-tarjeta:nth-child(5n+2)::after { content: "🦇"; }
.tema-halloween-activo .producto-tarjeta:nth-child(5n+3)::after { content: "👻"; }
.tema-halloween-activo .producto-tarjeta:nth-child(5n+4)::after { content: "🕸️"; }
.tema-halloween-activo .producto-tarjeta:nth-child(5n)::after { content: "💀"; background: #fff2c9; }

@keyframes halloween-volar {
    0%, 100% { transform: translate3d(0, 0, 0) rotate(-7deg); }
    35% { transform: translate3d(48px, -22px, 0) rotate(8deg) scale(1.08); }
    70% { transform: translate3d(-24px, 16px, 0) rotate(-3deg); }
}
@keyframes halloween-flotar {
    0%, 100% { transform: translateY(0) rotate(-4deg); }
    50% { transform: translateY(-17px) rotate(5deg); }
}
@keyframes halloween-calaverita {
    0%, 100% { transform: translateY(0) rotate(-3deg); }
    50% { transform: translateY(-9px) rotate(3deg) scale(1.04); }
}
@keyframes halloween-calaverita-derecha {
    0%, 100% { transform: translateY(0) rotate(2deg); }
    50% { transform: translateY(-8px) rotate(-2deg) scale(1.04); }
}
@keyframes halloween-monstruos {
    0%, 100% { transform: translateX(-50%) translateY(0) scale(1); }
    50% { transform: translateX(-50%) translateY(-7px) scale(1.02); }
}
@media (max-width: 720px) {
    .tema-halloween-activo { background: radial-gradient(circle at 84% 8%, rgba(255,177,65,.27), transparent 12rem), linear-gradient(180deg, #211029 0, #3d1847 19rem, #fff6e9 43rem, #fffaf3 100%); }
    .tema-halloween__luna { top: 88px; right: 5vw; width: 76px; height: 76px; }
    .tema-halloween__telarana { top: 0; width: 88px; height: 88px; }
    .tema-halloween__murcielago--uno { top: 18%; left: 3%; font-size: 22px; }
    .tema-halloween__murcielago--dos { top: 46%; left: 44%; font-size: 18px; }
    .tema-halloween__murcielago--tres { top: 70%; right: 3%; font-size: 25px; }
    .tema-halloween__fantasma { right: 7px; bottom: 15%; font-size: 37px; }
    .tema-halloween__calaveras { left: 7px; top: 40%; padding: .24rem .42rem; font-size: 17px; }
    .tema-halloween__calabazas { left: 9px; bottom: 66px; font-size: 29px; }
    .tema-halloween__calabazas small { display: none; }
    .tema-halloween__monstruos-centro { bottom: 65px; width: min(26vw,125px); }
    .tema-halloween__calaveras-amigables { right: 7px; bottom: 66px; width: 72px; }
    .tema-halloween-activo .producto-seccion::after { top: 7px; right: .65rem; padding: .2rem .45rem; font-size: 15px; }
    .tema-halloween-activo .producto-tarjeta::after { top: 7px; right: 7px; min-width: 25px; height: 25px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .tema-halloween__murcielago,
    .tema-halloween__fantasma,
    .tema-halloween__calaveras,
    .tema-halloween__monstruos-centro,
    .tema-halloween__calaveras-amigables { animation: none; }
    .tema-halloween__monstruos-centro { transform: translateX(-50%); }
}