/* Temporadas (v2) — estilos comunes. Los colores y las fechas salen de temporada.js;
   aquí solo está la forma de los adornos. Sin imágenes externas. */

/* Guirnalda (papel picado o foquitos) colgando de la parte alta del hero */
.tema-guirnalda{position:absolute;left:0;right:0;top:var(--tema-top,0);z-index:3;height:56px;pointer-events:none;overflow:hidden;transform-origin:50% 0;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.35));animation:tema-mecer 7s ease-in-out infinite alternate}
.tema-guirnalda svg{display:block;width:100%;height:56px}
@keyframes tema-mecer{from{transform:skewX(-.7deg)}to{transform:skewX(.7deg)}}

/* Saludo con botón para quitar la decoración */
.tema-chip{position:absolute;left:50%;top:calc(var(--tema-top,0px) + 62px);transform:translateX(-50%);z-index:4;display:inline-flex;align-items:center;gap:8px;
  padding:7px 8px 7px 14px;border-radius:999px;font:600 13px/1.2 var(--font,system-ui,sans-serif);color:#fff;white-space:nowrap;
  background:rgba(10,8,14,.74);border:1px solid var(--gold,#fff);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.tema-chip button{font:600 12px/1 var(--font,system-ui,sans-serif);color:#fff;background:rgba(255,255,255,.14);border:none;border-radius:999px;padding:7px 11px;min-height:28px;cursor:pointer}
.tema-chip button:hover{background:rgba(255,255,255,.24)}
.tema-chip button:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* Partículas que caen despacio (solo con movimiento permitido: lo decide el motor) */
.tema-particulas{position:fixed;top:0;left:0;right:0;bottom:0;z-index:60;pointer-events:none;overflow:hidden}
.tema-p{position:absolute;top:0;left:var(--x);opacity:.92;animation:tema-caer var(--d) linear var(--r) infinite;will-change:transform}
.tema-p-petalo{width:var(--sz);height:calc(var(--sz)*1.35);background:radial-gradient(ellipse at 30% 25%,#FFE3A0 0,var(--pc) 50%,#E8590C 100%);border-radius:100% 0 100% 0}
.tema-p-emoji{font-size:calc(var(--sz)*1.6);line-height:1}
.tema-p-nieve{width:calc(var(--sz)*.55);height:calc(var(--sz)*.55);background:#fff;border-radius:50%;box-shadow:0 0 6px rgba(255,255,255,.7)}
.tema-p-confeti{width:calc(var(--sz)*.5);height:calc(var(--sz)*.9);background:var(--pc);border-radius:1px}
@keyframes tema-caer{
  0%{transform:translate3d(0,-8vh,0) rotate(0deg)}
  50%{transform:translate3d(calc(var(--sw)*1px),52vh,0) rotate(200deg)}
  100%{transform:translate3d(0,108vh,0) rotate(380deg)}}

@media (max-width:640px){.tema-guirnalda,.tema-guirnalda svg{height:44px}.tema-chip{top:calc(var(--tema-top,0px) + 50px);font-size:12px}}
@media (prefers-reduced-motion:reduce){.tema-guirnalda{animation:none}.tema-particulas{display:none}}

/* Modo pagina: guirnalda y saludo fijos arriba de la pantalla (login y páginas sin hero) */
.tema-guirnalda.tema-fija{position:fixed;top:0;z-index:1000}
.tema-chip.tema-fija{position:fixed;top:62px;z-index:1001}
@media (max-width:640px){.tema-chip.tema-fija{top:50px}}

/* Modo app (sistemas de trabajo): franja de papel picado propia arriba. El sistema baja ese espacio
   (no tapa nada) y la franja no recibe clics. */
html[data-tema-modo="app"]{--tema-h:26px}
@media (min-width:881px){html[data-tema-modo="app"]{--tema-h:30px}}
html[data-tema-modo="app"] body{padding-top:var(--tema-h);box-sizing:border-box}
/* Barras que se quedan pegadas arriba al desplazar: se pegan DEBAJO del papel picado, no detrás */
html[data-tema-modo="app"] header.top{top:var(--tema-h)}
html[data-tema-modo="app"] .side{top:var(--tema-h);height:calc(100vh - var(--tema-h));height:calc(100dvh - var(--tema-h))}
.tema-franja-papel{position:fixed;top:0;left:0;right:0;height:var(--tema-h);z-index:45;pointer-events:none;overflow:hidden;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.28));transform-origin:50% 0;animation:tema-mecer 9s ease-in-out infinite alternate}
.tema-franja-papel svg{display:block;width:100%;height:100%}
.tema-suave .tema-p{opacity:.72}
.tema-chip.tema-efimero{top:auto;bottom:96px;animation:tema-aparece .35s ease both,tema-desvanece .5s ease 6s forwards;z-index:46}
@media (min-width:881px){.tema-chip.tema-efimero{bottom:24px}}
@keyframes tema-aparece{from{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes tema-desvanece{to{opacity:0}}

/* Flores de cempasúchil en las esquinas de las pantallas sencillas (login) */
.tema-esquinas{position:fixed;left:0;right:0;bottom:0;height:0;z-index:2;pointer-events:none}
.tema-esq{position:absolute;bottom:0;width:min(34vw,200px);height:auto;filter:drop-shadow(0 3px 5px rgba(0,0,0,.35))}
.tema-esq-i{left:0}.tema-esq-d{right:0}
@media (prefers-reduced-motion:reduce){.tema-franja-papel{animation:none}.tema-chip.tema-efimero{animation:tema-aparece .01s both}}

/* Nunca en impresiones (tickets, cortes, reportes) */
@media print{.tema-guirnalda,.tema-chip,.tema-particulas,.tema-franja-papel,.tema-esquinas{display:none!important}html[data-tema-modo="app"] body{padding-top:0!important}}

/* ===== Ajustes de la landing de VNL POS (vnl-pos.vercel.app/landing.html) ===== */
html[data-tema]{--tema-top:0px}
html[data-tema-modo="completo"] .hero{position:relative}
html.tema-guirnalda-on .hero{padding-top:calc(88px + 56px)}
html[data-tema-modo="completo"] .hero{background:radial-gradient(900px 480px at 12% -8%,var(--gold-soft),transparent 60%),radial-gradient(700px 460px at 96% 12%,var(--gold-soft),transparent 55%),linear-gradient(180deg,var(--ink) 0%,#1b1811 100%)}
@media (max-width:640px){html.tema-guirnalda-on .hero{padding-top:calc(88px + 44px)}}
