/* ══════════════════════════════════════════════
   Efectos navideños (Admin → CMS → Navidad)
   Solo se carga cuando la temporada está encendida. Lógica en js/navidad.js.
   ══════════════════════════════════════════════ */

.urb-xmas-canvas { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1025; }

/* Guirnalda bajo el menú */
.urb-xmas-garland { position: absolute; left: 0; right: 0; bottom: -14px; height: 24px; pointer-events: none; z-index: 2; }
.urb-xmas-garland svg { display: block; width: 100%; height: 24px; overflow: visible; }
.urb-xmas-bulb { animation: urbXmasBlink 2.4s infinite ease-in-out; }
@keyframes urbXmasBlink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

/* Aro dorado que se enciende por turnos en las bolitas de categorías */
.urb-xmas-guirnalda .urb-cat__img { animation: urbXmasRing 3s infinite ease-in-out; }
.urb-xmas-guirnalda .urb-cat:nth-child(2n) .urb-cat__img { animation-delay: -1s; }
.urb-xmas-guirnalda .urb-cat:nth-child(3n) .urb-cat__img { animation-delay: -2s; }
.urb-xmas-guirnalda .urb-cat:hover .urb-cat__img { animation: none; }
@keyframes urbXmasRing {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 199, 44, 0); border-color: transparent; }
  50%      { box-shadow: 0 0 16px 3px rgba(255, 199, 44, .55); border-color: var(--urb-gold, #FFC72C); }
}

/* Saltico del carrito */
.urb-xmas-pop { animation: urbXmasPop .55s cubic-bezier(.3, 1.8, .5, 1); }
@keyframes urbXmasPop { 30% { transform: scale(1.3) rotate(-8deg); } 60% { transform: scale(.95) rotate(4deg); } }

/* Regalito escondido */
.urb-xmas-gift {
  position: absolute; z-index: 1020; width: 52px; height: 52px; border-radius: 50%; border: 0; padding: 0;
  display: grid; place-items: center; cursor: pointer; color: #fff; font-size: 1.6rem;
  background: radial-gradient(circle at 35% 30%, #E8475B, #D02E44 60%, #A51F33);
  box-shadow: 0 8px 20px -6px rgba(208, 46, 68, .65);
  animation: urbXmasWobble 2.2s infinite ease-in-out;
}
.urb-xmas-gift:hover { animation-play-state: paused; }
.urb-xmas-gift:focus-visible { outline: 3px solid var(--urb-gold, #FFC72C); outline-offset: 3px; }
@keyframes urbXmasWobble { 0%, 100% { transform: translateY(0) rotate(0); } 25% { transform: translateY(-7px) rotate(-10deg); } 50% { transform: translateY(0) rotate(8deg); } }

.urb-xmas-modal { position: fixed; inset: 0; z-index: 1090; display: grid; place-items: center; padding: 16px; background: rgba(10, 20, 12, .55); }
.urb-xmas-card {
  position: relative; overflow: hidden;
  background: #fff; color: var(--urb-ink, #161616); border-radius: 18px; padding: 30px 22px 22px; width: 100%; max-width: 340px;
  text-align: center; display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .5);
  animation: urbXmasPop .55s cubic-bezier(.3, 1.8, .5, 1);
}
/* Cinta de bastón de caramelo arriba de la tarjeta */
.urb-xmas-card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 10px;
  background: repeating-linear-gradient(-45deg, #C8102E 0 10px, #fff 10px 20px, #1E7B34 20px 30px, #fff 30px 40px);
}
.urb-xmas-card__icon { font-size: 2.4rem; color: #C8102E; line-height: 1; }
.urb-xmas-card h2 { font-family: var(--font-display); font-weight: 800; font-size: 1.25rem; margin: 0; color: #1E7B34; }
.urb-xmas-card p { margin: 0; font-size: .92rem; color: var(--urb-ink-soft, #3A3A3A); }
/* El código cabe aunque sea largo: letra que se ajusta al ancho y, si aún no cabe, parte la línea */
.urb-xmas-code {
  font-family: var(--font-display); font-weight: 800; font-size: clamp(.95rem, 4.6vw, 1.2rem); letter-spacing: .04em; line-height: 1.25;
  color: #C8102E; overflow-wrap: anywhere; word-break: break-word;
  border: 2px dashed #D4A017; border-radius: 12px; padding: 10px 8px; background: #FFF8E6;
}
.urb-xmas-card .btn { border-radius: 999px; font-weight: 600; width: 100%; white-space: normal; }
.urb-xmas-card .urb-xmas-btn-copy { background: #1E7B34; border-color: #1E7B34; color: #fff; }
.urb-xmas-card .urb-xmas-btn-copy:hover { background: #17642A; border-color: #17642A; color: #fff; }
.urb-xmas-card .urb-xmas-btn-close { background: #C8102E; border-color: #C8102E; color: #fff; }
.urb-xmas-card .urb-xmas-btn-close:hover { background: #A50D26; border-color: #A50D26; color: #fff; }

/* Letrero en la franja de arriba: mensajes que pasan entre regalitos que brillan */
.urb-letrero {
  flex: 1; min-width: 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.urb-letrero__track { display: flex; width: max-content; animation: urbXmasMarquee 38s linear infinite; }
.urb-letrero:hover .urb-letrero__track { animation-play-state: paused; }
.urb-letrero__set { display: flex; align-items: center; flex: none; }
.urb-letrero__msg { white-space: nowrap; padding: 0 .9rem; font-weight: 500; }
.urb-letrero__gifts { display: inline-flex; align-items: center; gap: .3rem; padding: 0 .3rem; }
.urb-letrero__gift {
  display: inline-grid; place-items: center; font-size: 1.05rem;
  animation: urbXmasGiftBlink 1.6s infinite ease-in-out; animation-delay: calc(var(--n) * -.37s);
}
.urb-topbar .urb-letrero__gift i { color: var(--c); filter: drop-shadow(0 0 5px var(--c)) drop-shadow(0 0 2px var(--c)); }
@keyframes urbXmasMarquee { to { transform: translateX(-50%); } }
@keyframes urbXmasGiftBlink {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .5; transform: scale(.8) rotate(-10deg); }
}

/* En temporada, la franja del cupón deja el fucsia y pasa a rojo navidad */
.urb-coupon { background: linear-gradient(100deg, #D02E44 0%, #A51F33 100%); }
.urb-coupon__code { color: #D02E44; border-color: rgba(208, 46, 68, .4); }

/* Árbol de Navidad junto a la mascota de la portada: bombillos que parpadean por turnos y estrella que brilla */
.hero-art { display: flex; align-items: flex-end; flex-shrink: 0; }
.urb-xmas-tree { width: min(200px, 20vw); height: auto; margin-right: -1.2rem; filter: drop-shadow(0 14px 22px rgba(0,0,0,.45)); }
.urb-xmas-tree__bulb { animation: urbXmasTreeBulb 1.8s infinite ease-in-out; animation-delay: calc(var(--n) * -.31s); filter: drop-shadow(0 0 3px var(--c)); }
.urb-xmas-tree__star { transform-origin: 62px 20px; animation: urbXmasStar 2.4s infinite ease-in-out; filter: drop-shadow(0 0 6px #FFC72C); }
@keyframes urbXmasTreeBulb { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }
@keyframes urbXmasStar { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.12); opacity: .75; } }
@media (max-width: 768px) { .urb-xmas-tree { width: 90px; margin-right: -.6rem; } }
@media (min-width: 768px) and (max-width: 1199.98px) { .urb-hero-carousel .urb-xmas-tree { width: auto; max-height: calc((var(--hero-h) - 24px) * .7); } }
@media (max-width: 767.98px) { .urb-hero-carousel .urb-xmas-tree { width: 18vw; max-width: 80px; margin-right: -.4rem; } }

@media (prefers-reduced-motion: reduce) {
  .urb-xmas-bulb, .urb-xmas-guirnalda .urb-cat__img, .urb-xmas-gift, .urb-xmas-card, .urb-xmas-pop,
  .urb-letrero__track, .urb-letrero__gift, .urb-xmas-tree__bulb, .urb-xmas-tree__star { animation: none !important; }
  .urb-letrero__track { margin: 0 auto; }
}