/* Tienda — toolbar, filtros y grilla de productos (reutiliza tokens y .btn de style.css) */
[hidden]{display:none!important}
.tienda-section{padding-top:var(--space-section)}
.tienda-inner{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}

/* ═══ Hero presentador ═══ */
.tienda-hero{background:var(--surface-dark);color:var(--on-dark)}
.tienda-hero-inner{max-width:var(--max);margin:0 auto;padding:var(--space-section) var(--gutter);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-xxl);align-items:center}
.tienda-hero-copy h1{font-size:clamp(32px,4.5vw,54px);font-weight:var(--font-weight-bold);line-height:var(--leading-tight);letter-spacing:-.02em;color:var(--on-dark);margin:0;max-width:14ch;text-wrap:balance}
.tienda-lede{font-size:var(--font-size-subtitle);color:var(--on-dark-muted);line-height:var(--leading-body);margin:var(--space-lg) 0 0;max-width:44ch}
.tienda-proof{font-size:var(--font-size-body-sm);color:var(--on-dark);margin:var(--space-xl) 0 0;padding-top:var(--space-lg);border-top:1px solid var(--line-dark-active);max-width:44ch}
.tienda-hero-search{margin-top:var(--space-xl);max-width:480px}
.tienda-hero .tienda-hero-search label{display:flex;align-items:center;gap:var(--space-6);font-size:var(--font-size-caption-sm);font-weight:var(--font-weight-regular);text-transform:uppercase;letter-spacing:.06em;color:var(--on-dark-muted);margin-bottom:var(--space-6)}
.hero-search-wrap{display:flex;align-items:stretch}
.hero-search-prefix{display:flex;align-items:center;padding:var(--space-10) var(--space-md);border:1px solid var(--line-dark-active);border-right:none;border-radius:var(--r-sm) 0 0 var(--r-sm);color:var(--on-dark-muted);background:rgba(255,255,255,.04);line-height:1.5}
.hero-search-wrap .agenda-input{width:100%;padding:var(--space-10) var(--space-md);border:1px solid var(--line-dark-active);border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:var(--font-size-body);font-family:inherit;color:var(--on-dark);background:var(--gray-850);outline:none;box-sizing:border-box;flex:1;min-width:0}
.hero-search-wrap .agenda-input::placeholder{color:var(--on-dark-muted)}
.hero-search-wrap .agenda-input:focus{border-color:var(--accent-cta);box-shadow:0 0 0 2px var(--accent-soft)}
.hero-search-wrap .agenda-input::-webkit-search-cancel-button{filter:invert(1)}

/* Media */
.hero-media{min-width:0;margin:0;border:1px solid var(--line-dark-active);border-radius:var(--r-sm);overflow:hidden;background:var(--gray-900);position:relative}
.hero-visual-full{aspect-ratio:4/3}
.hero-media-cap{padding:var(--space-lg) var(--space-xl);border-top:1px solid var(--line-dark-active);background:var(--gray-850);font-size:var(--font-size-body-sm);color:var(--on-dark-muted)}
.hero-visual{flex:1;display:flex;flex-direction:column;justify-content:center;gap:var(--space-sm);padding:var(--space-xxl);background:var(--gray-900);position:relative}
.hero-visual::after{content:"";position:absolute;top:-1px;left:-1px;width:var(--corner);height:var(--corner);background:var(--accent-cta)}

/* ═══ Listado con sidebar ═══ */
.tienda-section{background:var(--surface-soft)}
.tienda-field{display:flex;flex-direction:column;gap:var(--space-sm)}
.tienda-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:var(--space-xl);align-items:start}

/* Sidebar flotante espejo de .nv-inner */
.tienda-sidebar{background:var(--surface);border-radius:var(--r-sm);box-shadow:0 1px 2px oklch(6% 0 0 / 0.06);padding:var(--space-xl);position:sticky;top:calc(var(--header-h) + 24px);max-height:calc(100vh - var(--header-h) - 48px);overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-md)}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;position:sticky;top:calc(var(--space-xl) * -1);padding:var(--space-sm) 0;background:var(--surface);z-index:1}
.sidebar-title{font-size:var(--font-size-heading-sm);font-weight:var(--font-weight-semibold)}
.sidebar-clear{background:none;border:0;color:var(--accent-hover);font:inherit;font-size:var(--font-size-body-sm);cursor:pointer;padding:0}
.sidebar-clear:hover{text-decoration:underline}
.filter-group{border-top:1px solid var(--line);padding-top:var(--space-sm)}
.filter-group-head{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:0;padding:var(--space-sm) 0;font:inherit;font-size:var(--font-size-body-sm);font-weight:var(--font-weight-semibold);color:var(--fg);cursor:pointer}
.filter-group-head svg{transition:transform .15s ease;color:var(--fg-muted)}
.filter-group-head[aria-expanded="false"] svg{transform:rotate(-90deg)}
.filter-group-head[aria-expanded="false"] + .filter-group-body{display:none}
.filter-group-body{display:flex;flex-direction:column;gap:var(--space-sm);padding:var(--space-sm) 0}
.filter-opt{margin:0}
.filter-opt-text{flex:1;font-size:var(--font-size-body-sm)}
.filter-opt:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.filter-opt input[type="radio"] + .agenda-checkbox-marker{border-radius:var(--r-full)}
.agenda-checkbox-card.checked.filter-opt input[type="radio"] + .agenda-checkbox-marker::after{content:"";position:absolute;top:4px;left:4px;width:6px;height:6px;border:0;border-radius:var(--r-full);background:var(--on-accent);transform:none}
.sidebar-foot{display:none}
.sidebar-foot .btn{width:100%}

/* Resultados */
.tienda-results{min-width:0}
.results-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-md);margin-bottom:var(--space-lg)}
.results-bar .tienda-count{margin:0}
.active-pills{display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.pill{display:inline-flex;align-items:center;gap:var(--space-6);font:inherit;font-size:var(--font-size-body-sm);color:var(--fg);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:var(--space-xs) var(--space-sm);cursor:pointer}
.pill:hover{border-color:var(--accent-cta)}
.pill svg{color:var(--fg-muted)}
.pill-clear{background:none;border:0;color:var(--accent-hover);font:inherit;font-size:var(--font-size-body-sm);cursor:pointer;padding:var(--space-xs) 0}
.pill-clear:hover{text-decoration:underline}

/* Drawer + fab solo móvil */
.filters-fab,.drawer-overlay{display:none}
.fab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;margin-left:var(--space-sm);border-radius:var(--r-full);background:var(--accent-cta);color:var(--on-accent);font-size:var(--font-size-caption-sm);font-weight:var(--font-weight-semibold)}

.tienda-count{font-size:var(--font-size-body-sm);color:var(--fg-muted);margin:0 0 var(--space-lg)}

/* ── Grilla ── */
.products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg)}
.product-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--space-xl);display:flex;flex-direction:column;gap:var(--space-sm);position:relative}
.product-card::after{content:"";position:absolute;top:-1px;left:-1px;width:var(--corner);height:var(--corner);background:var(--accent-cta)}
.p-badges{display:flex;flex-wrap:wrap;gap:var(--space-xs)}
.p-badge{font-size:var(--font-size-caption-xs);font-weight:var(--font-weight-semibold);letter-spacing:.04em;text-transform:uppercase;color:var(--fg-muted);background:var(--surface-soft);border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--space-xxs) var(--space-sm)}
.p-badge-cal{color:var(--accent-hover);border-color:var(--accent-cta);background:var(--accent-soft)}
.p-badge-offer{color:#fff;background:#b45309;border-color:#b45309}
.p-badge-quote{color:#92400e;border-color:#d97706;background:#fef3c7}
.p-title{font-size:var(--font-size-card-title);font-weight:var(--font-weight-semibold);margin:0;line-height:var(--leading-tight)}
.p-meta{font-size:var(--font-size-body-sm);color:var(--fg-muted);margin:0}
.p-price{margin:auto 0 0;padding-top:var(--space-sm);font-size:var(--font-size-heading-md)}
.p-price s{color:var(--fg-disabled);font-weight:var(--font-weight-regular);font-size:var(--font-size-body-sm);margin-right:var(--space-sm)}
.p-price strong{font-weight:var(--font-weight-bold)}
.p-price-quote strong{color:var(--accent-hover)}
.p-actions{display:flex;flex-direction:column;gap:var(--space-sm);margin-top:var(--space-sm)}
.p-cta{text-align:center}
.p-wa{font-size:var(--font-size-body-sm);color:var(--accent-hover);text-align:center}
.p-wa:hover{text-decoration:underline}

/* Skeleton + estados */
.product-skeleton{min-height:220px;border:1px solid var(--line);border-radius:var(--r-sm);background:linear-gradient(100deg,var(--surface-soft) 40%,var(--bg) 50%,var(--surface-soft) 60%);background-size:200% 100%;animation:tienda-shimmer 1.2s linear infinite}
@keyframes tienda-shimmer{to{background-position:-200% 0}}
.tienda-more{display:flex;justify-content:center;margin:var(--space-xxl) 0}
.tienda-state{text-align:center;padding:var(--space-xxl);border:1px dashed var(--line-strong);border-radius:var(--r-sm);margin-bottom:var(--space-section)}
.tienda-state p{margin:0 0 var(--space-lg);color:var(--fg-muted)}

@media (prefers-reduced-motion:reduce){
  .product-skeleton{animation:none}
  .tienda-sidebar,.filter-group-head svg{transition:none}
}
@media (max-width:1024px){
  .products-grid{grid-template-columns:repeat(2,1fr)}
  .tienda-hero-inner{grid-template-columns:1fr;gap:var(--space-xl)}
  .tienda-layout{grid-template-columns:1fr}
  .filters-fab{display:inline-flex;align-items:center;justify-content:center;margin-bottom:var(--space-lg)}
  .tienda-sidebar{position:fixed;top:0;left:0;bottom:0;width:min(340px,88vw);z-index:300;border-radius:0;transform:translateX(-102%);transition:transform .25s var(--ease-ibm);overflow-y:auto}
  body.drawer-open .tienda-sidebar{transform:none}
  body.drawer-open{overflow:hidden}
  .drawer-overlay{display:block;position:fixed;inset:0;background:oklch(6% 0 0 / .5);z-index:290}
  .drawer-overlay[hidden]{display:none}
  .sidebar-foot{display:block}
}
@media (max-width:640px){
  .products-grid{grid-template-columns:1fr}
  .tienda-hero-inner{padding:var(--space-xxl) var(--gutter)}
  .hero-visual-full{aspect-ratio:1/1}
  .hero-visual{padding:var(--space-xl)}
}
