/* ==========================================================================
   ACEADVANCE — Adornos de temporada (fragment/ace_temporada.php).
   Solo se carga cuando hay una temporada activa. Nada de esto recibe clics (pointer-events: none),
   salvo la cinta de arriba. Respeta "reducir movimiento" del sistema.
   ========================================================================== */

/* ---------- Cinta de arriba ---------- */
.ace-tp-cinta { position: relative; z-index: 61; font-family: var(--ace-font, system-ui, sans-serif); }
.ace-tp-cinta__in { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 42px; padding-top: 6px; padding-bottom: 6px; text-align: center; flex-wrap: wrap; }
.ace-tp-cinta__ico { width: 26px; height: 26px; flex: 0 0 auto; }
.ace-tp-cinta__txt { font-size: 14px; font-weight: 800; letter-spacing: .01em; }
.ace-page a.ace-tp-cinta__btn, a.ace-tp-cinta__btn { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 800; text-decoration: none; white-space: nowrap; }

.ace-tp-cinta--halloween { background: #1A0B2E; color: #FED7AA; }
.ace-page .ace-tp-cinta--halloween a.ace-tp-cinta__btn { background: #F97316; color: #1A0B2E; }
.ace-page .ace-tp-cinta--halloween a.ace-tp-cinta__btn:hover { background: #FB923C; color: #1A0B2E; }
.ace-tp-cinta--navidad { background: #0F3D2E; color: #FDE68A; }
.ace-page .ace-tp-cinta--navidad a.ace-tp-cinta__btn { background: #DC2626; color: #FFFFFF; }
.ace-page .ace-tp-cinta--navidad a.ace-tp-cinta__btn:hover { background: #EF4444; color: #FFFFFF; }
.ace-tp-cinta--patrias { background: #D91023; color: #FFFFFF; }
.ace-page .ace-tp-cinta--patrias a.ace-tp-cinta__btn { background: #FFFFFF; color: #D91023; }
.ace-page .ace-tp-cinta--patrias a.ace-tp-cinta__btn:hover { background: #FEE2E2; color: #B00D1D; }

/* ---------- Capa de animación (murciélagos, nieve) ---------- */
.ace-tp-capa { position: fixed; inset: 0; z-index: 65; pointer-events: none; overflow: hidden; }

/* Halloween */
/* línea naranja dibujada ENCIMA del borde del menú: no cambia la altura del header
   (al cambiarla quedaba medio píxel entre el menú y el banner y se veía una línea de otro color) */
body.ace-tp-halloween .ace-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 4px; background: #F97316; pointer-events: none; }
.ace-tp-bat { position: absolute; left: -60px; height: auto; opacity: .9; animation: aceTpVuelo 18s linear infinite; }
.ace-tp-bat path { transform-origin: 50px 22px; animation: aceTpAleteo .28s ease-in-out infinite alternate; }
@keyframes aceTpVuelo {
    0% { transform: translate(0, 0); }
    25% { transform: translate(28vw, -4vh); }
    50% { transform: translate(55vw, 3vh); }
    75% { transform: translate(82vw, -3vh); }
    100% { transform: translate(calc(100vw + 120px), 2vh); }
}
@keyframes aceTpAleteo { from { transform: scaleY(1); } to { transform: scaleY(.72); } }

.ace-tp-arana { position: absolute; top: 100%; right: 12%; z-index: 5; width: 34px; pointer-events: none; display: flex; flex-direction: column; align-items: center; }
.ace-tp-arana__hilo { width: 1.5px; height: 70px; background: rgba(148, 163, 184, .9); }
.ace-tp-arana svg { width: 34px; height: 34px; margin-top: -4px; }
.ace-tp-arana.is-anim { animation: aceTpBaja 6s ease-in-out infinite; transform-origin: top center; }
@keyframes aceTpBaja { 0%, 100% { transform: translateY(-20px); } 50% { transform: translateY(10px); } }

.ace-tp-suelo { position: relative; height: 0; pointer-events: none; }
.ace-tp-suelo svg { position: absolute; bottom: -2px; height: auto; }
.ace-tp-calabaza--l { left: 6%; }
.ace-tp-calabaza--m { left: calc(6% + 62px); }
.ace-tp-calabaza--r { right: 8%; }

/* Navidad: luces bajo el header + nieve */
.ace-tp-luces { position: absolute; left: 0; right: 0; bottom: -13px; height: 18px; display: flex; justify-content: space-between; padding: 0 6px; pointer-events: none; overflow: hidden; }
.ace-tp-luces::before { content: ""; position: absolute; left: 0; right: 0; top: 2px; height: 2px; background: #14532D; border-radius: 2px; }
.ace-tp-luces i { position: relative; flex: 0 0 auto; width: 9px; height: 13px; margin-top: 3px; border-radius: 50% 50% 50% 50% / 40% 40% 60% 60%; background: #EF4444; box-shadow: 0 0 8px 2px currentColor; color: rgba(239, 68, 68, .55); animation: aceTpLuz 1.6s ease-in-out infinite alternate; }
.ace-tp-luces i:nth-child(4n+2) { background: #FACC15; color: rgba(250, 204, 21, .55); animation-delay: .4s; }
.ace-tp-luces i:nth-child(4n+3) { background: #22C55E; color: rgba(34, 197, 94, .55); animation-delay: .8s; }
.ace-tp-luces i:nth-child(4n+4) { background: #60A5FA; color: rgba(96, 165, 250, .55); animation-delay: 1.2s; }
@keyframes aceTpLuz { from { opacity: 1; } to { opacity: .35; box-shadow: none; } }
.ace-tp-copo { position: absolute; top: -12px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 0 4px rgba(148, 163, 184, .9); opacity: .9; animation: aceTpNieve 12s linear infinite; }
@keyframes aceTpNieve {
    0% { transform: translate(0, -10px); }
    50% { transform: translate(18px, 50vh); }
    100% { transform: translate(-10px, 105vh); }
}
.ace-tp-regalo { height: auto; }

/* Fiestas Patrias: banderines bajo el header */
.ace-tp-banderines { position: absolute; left: 0; right: 0; bottom: -22px; height: 24px; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='24' viewBox='0 0 56 24'%3E%3Cpath d='M0 2 Q28 7 56 2' fill='none' stroke='%237A5C3B' stroke-width='1.5'/%3E%3Cpath d='M2 3 L14 4.6 L8 20Z' fill='%23D91023'/%3E%3Cpath d='M16 4.8 L28 5.6 L22 22Z' fill='%23FFFFFF' stroke='%23E5E7EB' stroke-width='.6'/%3E%3Cpath d='M30 5.6 L42 4.8 L36 21Z' fill='%23D91023'/%3E%3Cpath d='M44 4.6 L54 3 L49 18Z' fill='%23FFFFFF' stroke='%23E5E7EB' stroke-width='.6'/%3E%3C/svg%3E");
    background-repeat: repeat-x; background-size: 56px 24px; transform-origin: top center; }
.ace-tp-banderines.is-anim { animation: aceTpBrisa 4s ease-in-out infinite alternate; }
@keyframes aceTpBrisa { from { transform: skewX(-1.5deg); } to { transform: skewX(1.5deg); } }

/* ---------- Celular y tablet ---------- */
@media (max-width: 1024px) {
    .ace-tp-desk { display: none; } /* menos animación en pantallas chicas */
    .ace-tp-cinta__in { gap: 6px 10px; min-height: 38px; }
    .ace-tp-cinta__txt { font-size: 13px; }
    .ace-tp-arana { right: 22%; }
    .ace-tp-arana__hilo { height: 40px; }
}
@media (max-width: 640px) {
    .ace-tp-cinta__ico { width: 22px; height: 22px; }
    .ace-tp-cinta__txt { font-size: 12.5px; line-height: 1.3; }
    .ace-page a.ace-tp-cinta__btn, a.ace-tp-cinta__btn { height: 28px; font-size: 12px; }
    .ace-tp-calabaza--m { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ace-tp-capa { display: none; }
    .ace-tp-arana, .ace-tp-luces i, .ace-tp-banderines, .ace-tp-bat path { animation: none !important; }
}
@media print { .ace-tp-cinta, .ace-tp-capa, .ace-tp-arana, .ace-tp-suelo, .ace-tp-luces, .ace-tp-banderines { display: none !important; } }
@media (max-width: 640px) { /* en celular la cinta ocupa una sola franja */
    .ace-tp-cinta__in { flex-wrap: nowrap; justify-content: space-between; text-align: left; gap: 8px; padding-top: 6px; padding-bottom: 6px; }
    .ace-tp-cinta__txt { flex: 1; min-width: 0; font-size: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .ace-page a.ace-tp-cinta__btn, a.ace-tp-cinta__btn { flex: 0 0 auto; height: 28px; padding: 0 10px; }
}
