/* Próximos desarrollos (PPT 2026-10-12): paso 2 con píldoras de categorías, barra del carrito,
   precio por cantidad, días de entrega y estilos por tipo de evento. */

/* Paso 2: el bloque de entrada queda en una columna: píldoras, barra del carrito y entrega. */
.store-entry-panel.has-category-pills{grid-template-columns:minmax(0,1fr);gap:16px;padding:22px}
.store-category-pills{display:flex;flex-wrap:wrap;gap:10px}
.store-category-pill{
  --pill:#B79BFF;
  display:inline-flex;align-items:center;gap:7px;min-height:46px;padding:10px 20px;
  border:0;border-radius:999px;background:var(--pill);color:#14112A;
  font-weight:900;font-size:.95rem;letter-spacing:-.01em;line-height:1.1;cursor:pointer;
  box-shadow:0 3px 0 rgba(20,17,42,.18);transition:transform .15s ease,box-shadow .15s ease;
}
.store-category-pill:hover,.store-category-pill:focus-visible{transform:translateY(-2px);box-shadow:0 6px 0 rgba(20,17,42,.18)}
.store-category-pill:active{transform:translateY(1px);box-shadow:0 1px 0 rgba(20,17,42,.18)}
.store-category-pill.is-event{background:linear-gradient(135deg,#7C3CFF,#FF3FA4);color:#fff;box-shadow:0 3px 0 rgba(76,25,140,.45)}
.store-category-pill.is-all{background:#14112A;color:#fff}
@media(max-width:600px){
  .store-entry-panel.has-category-pills{padding:16px}
  .store-category-pills{gap:8px}
  .store-category-pill{min-height:42px;padding:9px 15px;font-size:.88rem}
}

/* Barra del carrito: solo aparece cuando hay productos. */
.store-entry-cart-bar{
  display:flex;align-items:center;gap:12px;width:100%;padding:13px 18px;
  border:0;border-radius:14px;background:#14112A;color:#fff;font-size:.95rem;text-align:left;cursor:pointer;
}
.store-entry-cart-bar[hidden]{display:none}
.store-entry-cart-bar>i{font-size:1.25rem;color:#FF5FB0}
.store-entry-cart-bar>span{flex:1 1 auto;min-width:0}
.store-entry-cart-bar em{font-style:normal;font-weight:800;color:#FFC21A;white-space:nowrap}
/* 2026-10-25 (pedido del usuario): carrito, compra pagada, avisos de saldo y entrega seleccionada van arriba de las fichas. */
.store-entry-panel.has-category-pills:not(.is-browse)>.store-entry-cart-bar,
.store-entry-panel.has-category-pills:not(.is-browse)>.store-entry-copy{order:-1}

/* Precio de la tarjeta multiplicado por la cantidad. */
.store-product-bottom strong.is-line-total{display:flex;flex-direction:column;line-height:1.1}
.store-product-bottom strong.is-line-total small{margin-top:3px;color:var(--muted);font-size:.68rem;font-weight:700}

/* Días de entrega (informativo). */
.store-lead-time{display:inline-flex;align-items:center;gap:5px;margin-top:6px;color:#4E7A2E;font-size:.72rem;font-weight:750}
.product-detail-lead-time{display:flex;align-items:center;gap:8px;margin:10px 0 0;color:#4E7A2E;font-size:.86rem;font-weight:750}
.product-detail-lead-time[hidden]{display:none}

/* Tarjeta de estilo (ej. "Cumpleaños estilo mar") en "Para tu cumpleaños". */
.store-style-card .store-package-badge{background:#FFC21A;color:#14112A}

/* ---------- Drops "No siempre" ---------- */
.drops-page,.drop-detail{--drop:#C0512E;--drop-dark:#7E2D1C;--drop-cream:#FFF4EA;max-width:1180px;margin:0 auto;padding:8px 0 40px}
.drops-hero{position:relative;overflow:hidden;padding:clamp(20px,3vw,32px) clamp(20px,4vw,40px);border-radius:20px;background:linear-gradient(135deg,var(--drop),var(--drop-dark));color:#fff}
.drops-kicker{display:inline-block;margin-bottom:10px;font-size:.74rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#FFD9C2}
.drop-detail-info .drops-kicker{color:var(--drop)}
.drops-hero h1{margin:0 0 10px;font-size:clamp(1.9rem,4.2vw,3rem);font-weight:900;line-height:.95;letter-spacing:-.03em}
.drops-hero p{max-width:620px;margin:0;color:rgba(255,255,255,.9);font-size:1rem}
.drops-section-title{margin:30px 0 14px;font-size:1.4rem;font-weight:900}
.drops-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.drops-grid.is-past{opacity:.9}
.drops-empty{margin-top:24px;color:var(--muted)}

.drop-card{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:20px;background:#fff;color:#1d1530;text-decoration:none;box-shadow:0 14px 38px rgba(40,20,10,.12);transition:transform .2s ease}
.drop-card:hover{transform:translateY(-3px);color:#1d1530}
.drop-card-media{position:relative;aspect-ratio:4/3;background:linear-gradient(135deg,#C0512E,#7E2D1C)}
.drop-card-media img{width:100%;height:100%;object-fit:cover;display:block}
.drop-card.is-sold_out .drop-card-media img,.drop-card.is-closed .drop-card-media img{filter:grayscale(.85) brightness(.75)}
.drop-card-mystery{display:grid;place-items:center;width:100%;height:100%;color:rgba(255,255,255,.9);font-size:4rem;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.18),transparent 45%),linear-gradient(135deg,#C0512E,#4A1A10)}
.drop-card-phase{position:absolute;top:12px;left:12px;padding:6px 11px;border-radius:999px;background:#fff;color:#7E2D1C;font-size:.72rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase}
.is-open .drop-card-phase{background:#FFC21A;color:#1d1530}
.drop-card-stamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-12deg);white-space:nowrap;padding:8px 18px;border:4px solid #fff;border-radius:10px;color:#fff;font-size:1.7rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.drop-card-body{display:flex;flex-direction:column;gap:4px;padding:16px 18px 18px}
.drop-card-body small{color:#C0512E;font-weight:800;font-size:.76rem}
.drop-card-body strong{font-size:1.22rem;font-weight:900;line-height:1.15}
.drop-card-body p{margin:0;color:#6b6478;font-size:.88rem}
.drop-card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}
.drop-card-foot b{font-size:1rem}.drop-card-foot em{font-style:normal;font-weight:600;color:#6b6478;font-size:.74rem}
.drop-seats{display:inline-flex;align-items:center;gap:6px;color:#C0512E;font-weight:900;font-size:.82rem}
.drop-seats.is-soon{color:#7c3cff}.drop-seats.is-gone{color:#8a8296}
.drop-sample-tag{align-self:flex-start;margin-top:8px;padding:3px 8px;border-radius:6px;background:#F3EFFA;color:#6b6478;font-size:.66rem;font-weight:800}

.drops-waitlist{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:20px;margin:30px 0;padding:24px;border-radius:20px;background:#FFF4EA;border:1px solid #F2D3BF}
.drops-waitlist h2{margin:0 0 4px;font-size:1.3rem;font-weight:900}.drops-waitlist p{margin:0;color:#6b5a50}
.drops-waitlist form{display:grid;grid-template-columns:1fr 1.2fr auto;gap:8px}
.drops-waitlist input{min-height:46px;padding:10px 14px;border:1px solid #E8CBB8;border-radius:12px;background:#fff}
@media(max-width:1180px){.drops-waitlist{grid-template-columns:1fr}}@media(max-width:620px){.drops-waitlist form{grid-template-columns:1fr}}

.drop-back{display:inline-flex;align-items:center;gap:6px;margin-bottom:14px;color:#C0512E;font-weight:800}
.drop-detail-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:start}
@media(max-width:900px){.drop-detail-grid{grid-template-columns:1fr}}
.drop-detail-media{position:relative;overflow:hidden;aspect-ratio:4/3;border-radius:24px;background:linear-gradient(135deg,#C0512E,#7E2D1C)}
.drop-detail-media img{width:100%;height:100%;object-fit:cover;display:block}
.drop-detail.is-sold_out .drop-detail-media img,.drop-detail.is-closed .drop-detail-media img{filter:grayscale(.85) brightness(.75)}
.drop-detail-info h1{margin:0 0 8px;font-size:clamp(2rem,4vw,3rem);font-weight:900;line-height:1;letter-spacing:-.02em}
.drop-lead{margin:0 0 14px;color:#5d5568;font-size:1.05rem}
.drop-facts{display:grid;gap:6px;margin:0 0 18px;padding:0;list-style:none;font-weight:700}
.drop-facts li{display:flex;gap:8px;align-items:center;text-transform:none}.drop-facts i{color:#C0512E}
.drop-buy{display:grid;gap:12px;padding:18px;border-radius:18px;background:#fff;border:1px solid #F0E0D6;box-shadow:0 10px 30px rgba(60,30,10,.08)}
.drop-buy-price strong{font-size:1.9rem;font-weight:900}.drop-buy-price span{margin-left:6px;color:#6b6478;font-weight:700}
.drop-seat-meter>div{height:10px;border-radius:999px;background:#F3E6DD;overflow:hidden}
.drop-seat-meter>div i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#FF8A3D,#C0512E)}
.drop-seat-meter span{display:block;margin-top:6px;font-size:.86rem;font-weight:800;color:#7E2D1C}
.drop-reserve{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.drop-reserve label{display:grid;gap:4px;font-size:.75rem;font-weight:800;color:#6b6478}
.drop-reserve select{min-height:48px;padding:8px 12px;border:1px solid #E8CBB8;border-radius:12px;font-weight:800}
.drop-reserve .btn{min-height:48px;flex:1 1 auto;background:linear-gradient(135deg,#FF8A3D,#C0512E);border:0}
.drop-countdown{margin:0;color:#7c3cff;font-weight:800}
.drop-note,.drop-sample-note{margin:0;color:#6b6478;font-size:.82rem}
.drop-sample-note{margin-top:10px}
.drop-mine{margin:0;padding:10px 12px;border-radius:12px;background:#E9F8EF;color:#1F7A45;font-weight:800}
.drop-detail-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;margin-top:28px}
@media(max-width:900px){.drop-detail-body{grid-template-columns:1fr}}
.drop-description{font-size:1rem;line-height:1.6;color:#3b3447}
.drop-includes h2{margin:0 0 10px;font-size:1.15rem;font-weight:900}
.drop-includes ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.drop-includes i{color:#C0512E}

/* Producto "Próximamente" (se ve, no se compra). */
.store-stock-badge.is-soon{background:#7C3CFF;color:#fff}
.store-product-card[data-coming-soon] .quantity-control{opacity:.45;pointer-events:none}
.store-min-quantity{display:inline-flex;align-items:center;gap:5px;margin:6px 0 0 10px;color:#7C3CFF;font-size:.72rem;font-weight:800}

/* Pagos de la invitación: el detalle (rifa, números, cartones) va arriba a todo el ancho, luego monto y estado, y el botón abajo.
   Antes las 4 columnas apretaban el detalle hasta dejar una palabra por línea. */
.public-orders-card .public-order-list>div{grid-template-columns:auto auto minmax(0,1fr);row-gap:8px}
.public-orders-card .public-order-list>div>span{grid-column:1/-1}
.public-orders-card .public-order-list>div>em{grid-column:auto;justify-self:start}
.public-orders-card .public-order-list>div>.btn{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:6px;width:100%}

/* ---------- Experiencias (2026-10-14, pedido del usuario): misma página que drops, con su propio color (carbón y fuego). ---------- */
.experiences-page{--drop:#E8590C;--drop-dark:#1F1A17}
.experiences-hero{background:radial-gradient(circle at 85% 20%,rgba(255,138,61,.45),transparent 45%),linear-gradient(135deg,#2B1D14,#120D0A)}
.experiences-hero .drops-kicker{color:#FFB37A}
.experiences-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.experiences-how article{display:flex;align-items:flex-start;gap:12px;padding:16px;border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(20,12,6,.08);border-top:4px solid var(--how)}
.experiences-how i{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:14px;background:color-mix(in srgb,var(--how) 14%,#fff);color:var(--how);font-size:1.25rem}
.experiences-how b{display:block;font-size:.95rem;font-weight:900;color:#1d1530}
.experiences-how span{display:block;margin-top:2px;color:#6b6478;font-size:.84rem;line-height:1.4}
.experience-drop-card .drop-card-media{background:linear-gradient(135deg,#2B1D14,#120D0A)}
.experience-drop-card .drop-card-phase{background:#FF8A3D;color:#1d1530}
.experience-drop-card .drop-card-body small{color:#E8590C}
.experience-drop-card .drop-seats{color:#E8590C}
.experience-drop-card .drop-card-foot b small{font-size:.72rem;font-weight:700;color:#6b6478}
.experience-drop-card.is-soon{cursor:default}
.experience-drop-card.is-soon:hover{transform:none}
.experience-drop-card.is-soon .drop-card-media img{filter:saturate(.55)}
.experience-drop-card.is-soon .drop-card-phase{background:#fff;color:#6b6478}
.experience-drop-modes{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.experience-drop-modes span{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;background:#FFF1E6;color:#9C3B06;font-size:.74rem;font-weight:800}
@media(max-width:860px){.experiences-how{grid-template-columns:1fr}}
