/* eptemas · base común a todos los temas: barra de campaña, capa de decoración y aviso de vista previa.
   Cada tema pone sus colores con estas variables, dentro de html.ept-<slug>:
     --ept-barra-fondo, --ept-barra-texto, --ept-barra-acento */

/* Barra de campaña (va dentro de #header > .header-banner). #header delante para ganar en peso
   al tema, que pinta a:link:not(.nav-link):not(.btn) en gris (trampa del 19/08). */
#header .ept-barra{background:var(--ept-barra-fondo,#0a2f87);color:var(--ept-barra-texto,#fff);font-size:14px;line-height:1.3;text-align:center;position:relative;z-index:2}
#header .ept-barra__in{max-width:1400px;margin:0 auto;padding:7px 12px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 14px}
#header .ept-barra .ept-barra__texto,#header .ept-barra a.ept-barra__texto{color:inherit;font-weight:700;text-decoration:none}
#header .ept-barra a.ept-barra__texto:hover{text-decoration:underline}
#header .ept-barra__cd{font-variant-numeric:tabular-nums;white-space:nowrap}
#header .ept-cd{display:inline-block;min-width:7.6em;text-align:left}
#header .ept-barra__cupon{background:var(--ept-barra-acento,#fbdc01);color:var(--ept-barra-fondo,#0a2f87);border:0;border-radius:999px;padding:3px 12px;font:inherit;font-weight:400;cursor:pointer;white-space:nowrap;line-height:1.4}
#header .ept-barra__cupon b{font-weight:700;letter-spacing:.04em}
#header .ept-barra__cupon.is-ok{background:#fff;color:#1a7f37}
#header .ept-barra__texto,#header .ept-envio__in{text-wrap:balance} /* sin palabras sueltas en la 2ª línea del móvil */
@media (max-width:767px){#header .ept-barra{font-size:12.5px}#header .ept-barra__in{padding:6px 10px;gap:3px 10px}}

/* Aviso de último día de envío (Navidad/Reyes), debajo de la barra. No depende del tema: usa sus dos colores
   AL REVÉS (mismo contraste que la barra, que ya está comprobado); sin tema, azul de la marca sobre blanco. */
#header .ept-envio{background:var(--ept-barra-texto,#fff);color:var(--ept-barra-fondo,#0a2f87);font-size:13px;font-weight:700;line-height:1.3;text-align:center;border-bottom:1px solid rgba(0,0,0,.08);position:relative;z-index:2}
#header .ept-envio__in{max-width:1400px;margin:0 auto;padding:5px 12px}
@media (max-width:767px){#header .ept-envio{font-size:12px}#header .ept-envio__in{padding:4px 10px}}

/* Capa para decoraciones (la crea EPT.capa() desde el JS del tema). Nunca roba clics,
   nunca empuja la página, y queda por debajo de menús, carrito lateral, avisos y ventanas. */
.ept-deco{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:90;contain:strict}
@media (max-width:767px){html.ept-sin-movil .ept-deco,html.ept-sin-movil .ept-solo-deco{display:none!important}}

/* Aviso «estás en vista previa» (solo lo ve quien abrió el enlace de vista previa). */
.ept-prev{position:fixed;left:12px;bottom:12px;z-index:2147483000;display:flex;align-items:center;gap:10px;background:#111;color:#fff;border-radius:999px;padding:8px 10px 8px 14px;font:600 13px/1.2 Montserrat,system-ui,sans-serif;box-shadow:0 4px 18px rgba(0,0,0,.35)}
@media (max-width:767px){.ept-prev{bottom:140px}} /* por encima de la barra fija de «Añadir al carrito» y del WhatsApp de la ficha */
.ept-prev a,.ept-prev a:link,.ept-prev a:visited{background:#fbdc01;color:#111!important;border-radius:999px;padding:5px 10px;text-decoration:none;font-weight:700}

/* Juego de la calabaza (calabaza.js): asoma por un lado de la pantalla; al pulsarla, ventana con el código. */
.ept-calabaza{position:fixed;z-index:95;width:56px;height:56px;padding:0;border:0;background:none;cursor:pointer;transition:transform .5s ease;filter:drop-shadow(0 3px 6px rgba(0,0,0,.35))}
.ept-calabaza svg{width:100%;height:100%;display:block}
.ept-calabaza--izq{left:0;transform:translateX(-58%) rotate(18deg)}
.ept-calabaza--der{right:0;transform:translateX(58%) rotate(-18deg)}
.ept-calabaza:hover,.ept-calabaza:focus-visible{transform:translateX(0) rotate(0)}
.ept-calabaza:focus-visible{outline:3px solid #fbdc01;outline-offset:2px}
html:not(.ept-sin-anim) .ept-calabaza--izq{animation:ept-asoma-izq 3.2s ease-in-out infinite}
html:not(.ept-sin-anim) .ept-calabaza--der{animation:ept-asoma-der 3.2s ease-in-out infinite}
html:not(.ept-sin-anim) .ept-calabaza:hover{animation:none}
@keyframes ept-asoma-izq{0%,70%,100%{transform:translateX(-58%) rotate(18deg)}80%{transform:translateX(-38%) rotate(8deg)}}
@keyframes ept-asoma-der{0%,70%,100%{transform:translateX(58%) rotate(-18deg)}80%{transform:translateX(38%) rotate(-8deg)}}
.ept-premio{border:0;padding:0;background:none;width:calc(100% - 32px);max-width:380px;overflow:visible} /* <dialog> con showModal(): atrapa el foco y Esc cierra */
.ept-premio::backdrop{background:rgba(10,5,20,.6)}
.ept-premio__nota{font-size:12px;color:#5b4a63}
.ept-premio__caja{background:#fff;color:#1a0b24;border-radius:14px;max-width:380px;width:100%;padding:24px 22px 20px;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.4);font-family:Montserrat,system-ui,sans-serif}
.ept-premio__caja h3{margin:6px 0 8px;font-size:21px;color:#1a0b24}
.ept-premio__caja p{margin:0 0 14px;font-size:14px;line-height:1.45}
.ept-premio__codigo{display:inline-block;border:2px dashed #ff7a00;border-radius:8px;padding:8px 16px;font-size:20px;font-weight:700;letter-spacing:.08em;margin-bottom:14px;background:#fff7ef}
.ept-premio__botones{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ept-premio__botones button{border:0;border-radius:999px;padding:9px 18px;font:700 14px Montserrat,system-ui,sans-serif;cursor:pointer}
.ept-premio__copiar{background:#ff7a00;color:#1a0b24}
.ept-premio__cerrar{background:#eee;color:#333}
