/* Piezas nuevas de la tienda real (detalle de producto, seguimiento, opiniones, música, temas) */
.sr{position:absolute;left:-9999px}
.card .img img{width:100%;height:100%;object-fit:cover;display:block}
.card .img .ph{width:100%;height:100%;display:grid;place-items:center;color:#8d949e}
.card .img .ph svg{width:46%;height:46%}
.card a.open{position:absolute;inset:0;z-index:1}
.card .fav,.card .tag{z-index:2}
.price .off{background:var(--red);color:#fff;font-size:11px;font-weight:800;padding:2px 7px;border-radius:99px}
.stock-low{color:#ffb454;font-size:12px;font-weight:700}
.empty-grid{grid-column:1/-1;color:var(--muted);padding:40px 0;text-align:center}
.skeleton{background:linear-gradient(90deg,#1b0d12 25%,#26141b 50%,#1b0d12 75%);background-size:200% 100%;animation:sk 1.4s infinite;border-radius:var(--r);aspect-ratio:3/4}
@keyframes sk{to{background-position:-200% 0}}

/* detalle de producto */
dialog.pd{width:min(880px,100vw);margin:auto;height:auto;max-height:100dvh;border:1px solid var(--line);border-radius:18px}
.pdw{display:grid;gap:18px;padding:16px}
.pdw .gal{position:relative}
.pdw .main{aspect-ratio:1;background:radial-gradient(80% 80% at 50% 35%,#f4f4f6,#c9ced6);border-radius:14px;overflow:hidden;display:grid;place-items:center}
.pdw .main img{width:100%;height:100%;object-fit:cover}
.pdw .thumbs{display:flex;gap:8px;margin-top:8px;overflow-x:auto}
.pdw .thumbs button{flex:none;width:64px;height:64px;border-radius:10px;overflow:hidden;border:2px solid var(--line);padding:0}
.pdw .thumbs button[aria-current=true]{border-color:#fff}
.pdw .thumbs img{width:100%;height:100%;object-fit:cover}
.pdw h2{font-size:24px;font-weight:900;line-height:1.2}
.pdw .desc{color:var(--muted);margin:8px 0 12px;white-space:pre-line}
.pdw .big{font-size:30px;font-weight:900;font-variant-numeric:tabular-nums}
.pdw .big s{font-size:16px;color:var(--muted);font-weight:600;margin-left:8px}
.tiers-t{width:100%;border-collapse:collapse;margin:12px 0;font-size:14px}
.tiers-t th,.tiers-t td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left}
.tiers-t th{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tiers-t tr.on td{color:#7be0a0;font-weight:800}
.pdw .qrow{display:flex;gap:10px;align-items:center;margin:14px 0}
.pdw .qrow .qty button{width:44px;height:44px}
.pdclose{position:absolute;right:8px;top:8px;z-index:3;background:rgba(15,0,5,.8)}
@media (min-width:760px){.pdw{grid-template-columns:1fr 1fr;padding:22px}}

/* seguimiento + opiniones + formularios */
.panel{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:18px;margin-bottom:12px}
.panel h3{font-size:18px;margin-bottom:6px}
.panel p.sub{color:var(--muted);font-size:14px;margin-bottom:12px}
.rowf{display:grid;gap:10px}
@media (min-width:640px){.rowf.two{grid-template-columns:1fr 1fr auto;align-items:end}}
.rowf label{display:grid;gap:6px;font-size:14px;font-weight:700}
.rowf input,.rowf textarea,.rowf select{background:var(--bg);border:1px solid var(--line);border-radius:10px;color:var(--text);font:inherit;font-size:16px;min-height:48px;padding:0 12px}
.rowf textarea{padding:10px 12px;min-height:84px}
.rowf input:focus,.rowf textarea:focus,.rowf select:focus{outline:0;border-color:#fff}
.steps{display:flex;gap:6px;margin:14px 0;flex-wrap:wrap}
.steps span{flex:1;min-width:84px;text-align:center;font-size:12px;font-weight:800;padding:8px 6px;border-radius:10px;background:var(--bg);border:1px solid var(--line);color:var(--muted)}
.steps span.on{background:var(--red);border-color:var(--red);color:#fff}
.steps span.cur{box-shadow:0 0 0 2px #fff inset}
.msg{margin-top:10px;font-size:14px;min-height:20px}
.msg.err{color:#ff8a90}.msg.ok{color:#7be0a0}
.rev-form{margin-top:16px}
.starpick{display:flex;gap:4px}
.starpick button{width:44px;height:44px;border-radius:10px;color:#6b5a62}
.starpick button[aria-pressed=true],.starpick button.on{color:#f5b301}
.starpick svg{width:26px;height:26px;fill:currentColor}
.coupon-row{display:flex;gap:8px;margin-top:12px}
.coupon-row input{flex:1;background:var(--bg);border:1px solid var(--line);border-radius:10px;color:var(--text);font:inherit;font-size:16px;min-height:48px;padding:0 12px;text-transform:uppercase}
.coupon-row button{min-height:48px;padding:0 16px;border-radius:10px;border:1.5px solid #fff;font-weight:800}
.bankbox{background:var(--bg);border:1px dashed #5b2a35;border-radius:12px;padding:14px;margin-top:10px;display:grid;gap:4px;font-size:15px}
.bankbox b{font-variant-numeric:tabular-nums;letter-spacing:.02em}

/* música */
.music{position:fixed;left:16px;bottom:16px;z-index:60;width:48px;height:48px;border-radius:50%;background:var(--bg2);border:1px solid var(--line);display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.music[aria-pressed=true]{background:var(--red);border-color:var(--red)}
.music[hidden]{display:none}

/* temas de temporada (el dueño elige uno en su panel) */
html[data-theme=buenfin]{--red:#f5b301;--red-d:#c78f00}
html[data-theme=buenfin] .btn.red,html[data-theme=buenfin] .chip[aria-pressed=true],html[data-theme=buenfin] .promo{color:#1a1200}
html[data-theme=buenfin] .hero{background:radial-gradient(90% 120% at 85% 20%,#3a2a00 0%,var(--bg) 60%)}
html[data-theme=navidad]{--red:#c8202a;--red-d:#9c141c;--bg:#06130d;--bg2:#0d2218;--card:#102a1d;--line:#1f4332}
html[data-theme=navidad] .hero{background:radial-gradient(90% 120% at 85% 20%,#14502f 0%,var(--bg) 60%)}
html[data-theme=halloween]{--red:#ff7a00;--red-d:#cc6200;--bg:#0b0710;--bg2:#150d20;--card:#1b1128;--line:#32204a}
html[data-theme=halloween] .btn.red,html[data-theme=halloween] .chip[aria-pressed=true],html[data-theme=halloween] .promo{color:#150a00}
html[data-theme=halloween] .hero{background:radial-gradient(90% 120% at 85% 20%,#3a1a5c 0%,var(--bg) 60%)}
.promo[hidden]{display:none}
.nota{display:none}

/* lo que lleva el atributo hidden nunca se ve (el botón de WhatsApp sin número, etc.) */
[hidden]{display:none!important}