/* catalogo.css */
/* =========================================================
   CATALOGO — Groundless (compact, list-first)
   Contract: respeta globals/style/mobile/overrides
   Scope: body[data-page="catalogo"]
   Objetivo: blindar colisiones (buttons/inputs/tabs)
   + Theme-aware (dark/light) sin pisarse
   ========================================================= */

body[data-page="catalogo"]{
  /* =========================
     TOKENS (default = DARK)
     ========================= */

  /* base */
  --c-bg: var(--m-b1, #061004);

  /* superficies */
  --c-surface: var(--m-card-bg, rgba(10,22,8,.55));
  --c-surface-2: var(--m-panel-bg, rgba(10,22,8,.40));
  --c-surface-soft: rgba(255,255,255,.02);
  --c-surface-soft-2: rgba(255,255,255,.01);

  /* texto */
  --c-text: rgba(232,221,204,.96);
  --c-muted: rgba(232,221,204,.70);
  --c-muted-2: rgba(232,221,204,.55);

  /* líneas */
  --c-line: rgba(147,168,95,.18);
  --c-line-2: rgba(147,168,95,.12);

  /* acento */
  --c-accent: var(--m-accent-strong, rgba(147,168,95,.92));
  --c-accent-soft: rgba(147,168,95,.22);

  /* dropdown */
  --c-drop-bg: rgba(10,22,8,.92);
  --c-drop-shadow: 0 20px 50px rgba(0,0,0,.35);

  /* radius/layout */
  --c-radius: 22px;
  --c-radius-sm: 16px;
  --c-wrap: min(1180px, calc(100% - 48px));
  --c-gap: 18px;

  background: var(--c-bg);
  color: var(--c-text);
}

/* =========================
   THEME — LIGHT OVERRIDES
   (mapea el catálogo a light)
   ========================= */
html[data-theme="light"] body[data-page="catalogo"]{
  /* base */
  --c-bg: var(--gl-bg, #f3f1e8);

  /* superficies (light necesita más “peso” que .02) */
  --c-surface: rgba(255,255,255,.86);
  --c-surface-2: rgba(255,255,255,.72);
  --c-surface-soft: rgba(10,18,10,.035);
  --c-surface-soft-2: rgba(10,18,10,.02);

  /* texto */
  --c-text: rgba(10,18,10,.92);
  --c-muted: rgba(10,18,10,.72);
  --c-muted-2: rgba(10,18,10,.55);

  /* líneas */
  --c-line: rgba(10,18,10,.12);
  --c-line-2: rgba(10,18,10,.08);

  /* acento */
  --c-accent: var(--gl-accent-strong, rgba(48,86,1,.96));
  --c-accent-soft: rgba(48,86,1,.14);

  /* dropdown */
  --c-drop-bg: rgba(255,255,255,.92);
  --c-drop-shadow: 0 20px 50px rgba(10,18,10,.14);
}

/* ---------------- Hardening / Resets (solo para esta página) ---------------- */
body[data-page="catalogo"] *,
body[data-page="catalogo"] *::before,
body[data-page="catalogo"] *::after{
  box-sizing: border-box;
}

body[data-page="catalogo"] a{ color: inherit; }

body[data-page="catalogo"] button,
body[data-page="catalogo"] input{
  font: inherit;
  color: inherit;
}

body[data-page="catalogo"] button{
  -webkit-appearance: none;
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  line-height: 1;
}

body[data-page="catalogo"] input{
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
}

/* ---------------- TOPBAR minimal ---------------- */
#gl-0-topbar.gl-topbar{
  position: sticky;
  top: 0;
  z-index: 9999;
  backdrop-filter: blur(10px);
  background: linear-gradient(180deg, rgba(6,16,4,.78), rgba(6,16,4,.52));
  border-bottom: 1px solid var(--c-line-2);
}
html[data-theme="light"] #gl-0-topbar.gl-topbar{
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.62));
}

#gl-0-topbar .gl-topbar-shell{
  width: var(--c-wrap);
  margin: 0 auto;
  padding: 10px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

#gl-0-topbar .gl-brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color: inherit;
  min-width: 160px;
}
#gl-0-topbar .gl-brand-mark{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(147,168,95,.95), rgba(147,168,95,.25));
  box-shadow: 0 0 0 1px rgba(147,168,95,.25);
}
html[data-theme="light"] #gl-0-topbar .gl-brand-mark{
  background: radial-gradient(circle at 30% 30%, rgba(48,86,1,.95), rgba(48,86,1,.20));
  box-shadow: 0 0 0 1px rgba(10,18,10,.10);
}
#gl-0-topbar .gl-brand-text{
  font-weight: 800;
  letter-spacing: .2px;
}

#gl-0-topbar .gl-nav{
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
#gl-0-topbar .gl-nav-link{
  text-decoration:none;
  color: color-mix(in srgb, var(--c-text) 85%, transparent);
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid transparent;
  line-height: 1;
}
#gl-0-topbar .gl-nav-link:hover{
  border-color: var(--c-line);
  background: var(--c-surface-soft);
}
#gl-0-topbar .gl-nav-link.is-active{
  border-color: var(--c-line);
  background: color-mix(in srgb, var(--c-accent) 14%, transparent);
  color: var(--c-text);
}

#gl-0-topbar .gl-nav-cta{
  display:flex;
  align-items:center;
  gap:10px;
}

/* Buttons (page-local; blindados a colisiones) */
body[data-page="catalogo"] .gl-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  padding: 12px 16px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 800;
  letter-spacing: .2px;
  border: 1px solid var(--c-line);
  background: var(--c-surface-soft);
  color: color-mix(in srgb, var(--c-text) 96%, transparent);
  white-space: nowrap;
}
body[data-page="catalogo"] .gl-btn:hover{ background: color-mix(in srgb, var(--c-surface-soft) 60%, var(--c-accent-soft) 40%); }

body[data-page="catalogo"] .gl-btn-primary{
  background: color-mix(in srgb, var(--c-accent) 26%, transparent);
  border-color: color-mix(in srgb, var(--c-accent) 28%, transparent);
  color: var(--c-text);
}
body[data-page="catalogo"] .gl-btn-primary:hover{
  background: color-mix(in srgb, var(--c-accent) 34%, transparent);
}
body[data-page="catalogo"] .gl-btn-outline{
  background: transparent;
}

/* ---------------- Page layout ---------------- */
body[data-page="catalogo"] .gl-page{ padding: 26px 0 42px; }

body[data-page="catalogo"] .gl-wrap{
  width: var(--c-wrap);
  margin: 0 auto;
}

body[data-page="catalogo"] .gl-kicker{
  font-weight: 900;
  letter-spacing: .14em;
  font-size: 12px;
  opacity: .9;
  color: var(--c-accent);
}

body[data-page="catalogo"] .gl-title{
  margin: 10px 0 6px;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.03;
  letter-spacing: -0.02em;
  color: var(--c-text);
}

body[data-page="catalogo"] .gl-sub{
  margin: 0 0 16px;
  color: var(--c-muted);
  font-size: 16px;
  line-height: 1.55;
  max-width: 70ch;
}

/* HERO */
body[data-page="catalogo"] .gl-hero{ padding: 10px 0 22px; }
body[data-page="catalogo"] .gl-hero-top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 14px;
}
body[data-page="catalogo"] .gl-hero-meta{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
body[data-page="catalogo"] .gl-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--c-line);
  background: var(--c-surface-soft);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .12em;
  color: var(--c-accent);
}
body[data-page="catalogo"] .gl-muted{ color: var(--c-muted); }

/* Tools */
body[data-page="catalogo"] .gl-tools{
  margin-top: 14px;
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
}

/* Search bar (contiene dropdown absoluto) */
body[data-page="catalogo"] .gl-search{
  position: relative;
  flex: 1 1 520px;
  min-width: 260px;
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 999px;
  border: 1px solid var(--c-line);
  background: var(--c-surface-soft);
  overflow: visible; /* IMPORTANTE para dropdown */
}

body[data-page="catalogo"] .gl-search input{
  width: 100%;
  border: 0 !important;
  outline: 0;
  background: transparent !important;
  color: var(--c-text) !important;
  font-size: 14px;
  min-width: 0;
}
body[data-page="catalogo"] .gl-search input::placeholder{
  color: var(--c-muted-2);
}

body[data-page="catalogo"] .gl-search-ico{ opacity: .7; }

body[data-page="catalogo"] .gl-clear{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--c-surface-soft) 75%, transparent);
  color: color-mix(in srgb, var(--c-text) 85%, transparent);
  font-size: 18px;
  cursor: pointer;
  opacity: .75;
  flex: 0 0 auto;
}
body[data-page="catalogo"] .gl-clear:hover{
  opacity: 1;
  border-color: var(--c-line);
  background: color-mix(in srgb, var(--c-surface-soft) 60%, var(--c-accent-soft) 40%);
}

body[data-page="catalogo"] .gl-actions{
  display:flex;
  align-items:center;
  gap: 10px;
  flex: 0 0 auto;
  flex-wrap: wrap;
}

/* Category chips (blindados contra “tabs blancos”) */
body[data-page="catalogo"] .gl-cat-chips{
  margin-top: 14px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

body[data-page="catalogo"] .gl-chip-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 12px;
  border-radius: 999px;

  border: 1px solid var(--c-line);
  background: var(--c-surface-soft);
  color: color-mix(in srgb, var(--c-text) 88%, transparent);

  font-weight: 850;
  letter-spacing: .01em;
  cursor: pointer;
  white-space: nowrap;

  box-shadow: none !important;
  text-transform: none !important;
}

body[data-page="catalogo"] .gl-chip-btn:hover{
  background: color-mix(in srgb, var(--c-accent) 10%, transparent);
  border-color: color-mix(in srgb, var(--c-accent) 20%, transparent);
}

body[data-page="catalogo"] .gl-chip-btn:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--c-accent) 35%, transparent);
  outline-offset: 2px;
}

/* Bridge */
body[data-page="catalogo"] .gl-bridge{
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 999px;
  border: 1px solid var(--c-line);
  background: color-mix(in srgb, var(--c-accent) 7%, transparent);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
}
body[data-page="catalogo"] .gl-pill{
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--c-accent) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--c-accent) 18%, transparent);
  font-weight: 900;
  letter-spacing: .12em;
  font-size: 12px;
  color: var(--c-accent);
  margin-right: 10px;
}
body[data-page="catalogo"] .gl-bridge-left{
  display:flex;
  align-items:center;
  gap: 10px;
  color: color-mix(in srgb, var(--c-text) 90%, transparent);
}
body[data-page="catalogo"] .gl-bridge-text{ color: var(--c-muted); }

body[data-page="catalogo"] .gl-link{
  color: var(--c-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
body[data-page="catalogo"] .gl-link:hover{ opacity: .95; }

/* ---------------- Catalog (details/list-first) ---------------- */
body[data-page="catalogo"] .gl-catalog{ padding: 10px 0 0; }

body[data-page="catalogo"] .gl-cat{
  border: 1px solid var(--c-line);
  border-radius: var(--c-radius);
  background:
    radial-gradient(1400px 420px at 20% 10%, color-mix(in srgb, var(--c-accent) 10%, transparent), transparent 60%),
    linear-gradient(180deg, var(--c-surface-soft), var(--c-surface-soft-2));
  overflow: hidden;
  margin: 14px 0;
}

/* Summary as "row header" */
body[data-page="catalogo"] .gl-cat-sum{
  list-style: none;
  cursor: pointer;
  padding: 14px 16px;
  display:grid;
  grid-template-columns: 120px 260px 1fr 36px;
  align-items:center;
  gap: 10px;
  border-bottom: 1px solid var(--c-line-2);
}
body[data-page="catalogo"] .gl-cat-sum::-webkit-details-marker{ display:none; }

body[data-page="catalogo"] .gl-cat-k{
  font-weight: 900;
  letter-spacing: .14em;
  font-size: 12px;
  color: var(--c-accent);
}
body[data-page="catalogo"] .gl-cat-t{
  font-weight: 900;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: var(--c-text);
}
body[data-page="catalogo"] .gl-cat-d{
  color: var(--c-muted);
  font-size: 14px;
}

body[data-page="catalogo"] .gl-cat-ctl{
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid var(--c-line);
  background: var(--c-surface-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  position: relative;
  opacity: .92;
}
body[data-page="catalogo"] details > summary .gl-cat-ctl::before{
  content:"+";
  font-weight: 900;
  font-size: 18px;
  line-height: 1;
  color: color-mix(in srgb, var(--c-text) 86%, transparent);
}
body[data-page="catalogo"] details[open] > summary .gl-cat-ctl::before{ content:"–"; }

body[data-page="catalogo"] .gl-cat-body{
  padding: 14px 16px 16px;
}

body[data-page="catalogo"] .gl-subhead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 10px;
  padding: 6px 0 10px;
  border-bottom: 1px solid var(--c-line-2);
  margin-bottom: 10px;
}
body[data-page="catalogo"] .gl-subhead h3{
  margin: 0;
  font-size: 16px;
  letter-spacing: -0.01em;
  color: var(--c-text);
}
body[data-page="catalogo"] .gl-subhead-tight{ margin-top: 14px; }

/* Split blocks */
body[data-page="catalogo"] .gl-split{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--c-gap);
}
body[data-page="catalogo"] .gl-block{
  padding: 12px 12px 10px;
  border-radius: var(--c-radius-sm);
  border: 1px solid var(--c-line-2);
  background: var(--c-surface-soft);
}
body[data-page="catalogo"] .gl-block-wide{ grid-column: 1 / -1; }

body[data-page="catalogo"] .gl-cols2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--c-gap);
}

/* List rows */
body[data-page="catalogo"] .gl-list{
  margin: 0;
  padding: 0;
  list-style: none;
}
body[data-page="catalogo"] .gl-list-wide{ margin-top: 8px; }

body[data-page="catalogo"] .gl-row{
  display:grid;
  grid-template-columns: 1fr auto;
  align-items:center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--c-line-2);
}
body[data-page="catalogo"] .gl-row:last-child{ border-bottom: 0; }

body[data-page="catalogo"] .gl-item{
  font-weight: 700;
  color: color-mix(in srgb, var(--c-text) 94%, transparent);
  line-height: 1.25;
}
body[data-page="catalogo"] .gl-price{
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  letter-spacing: .2px;
  color: var(--c-text);
  padding-left: 10px;
  white-space: nowrap;
}

/* Footer inside category */
body[data-page="catalogo"] .gl-cat-foot{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--c-line-2);
  display:flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: space-between;
}

/* Search match helper */
body[data-page="catalogo"] .gl-cat.gl-has-match > summary{
  background: color-mix(in srgb, var(--c-accent) 7%, transparent);
}

/* OUT */
body[data-page="catalogo"] .gl-out{ padding: 18px 0 0; }
body[data-page="catalogo"] .gl-out-card{
  border: 1px solid var(--c-line);
  border-radius: var(--c-radius);
  background:
    radial-gradient(1200px 420px at 20% 0%, color-mix(in srgb, var(--c-accent) 12%, transparent), transparent 60%),
    var(--c-surface-soft);
  padding: 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  flex-wrap: wrap;
}
body[data-page="catalogo"] .gl-out-card h2{
  margin: 6px 0 4px;
  font-size: 22px;
  letter-spacing: -0.01em;
}
body[data-page="catalogo"] .gl-out-right{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}

/* FOOTER */
body[data-page="catalogo"] .gl-footer{ padding: 26px 0 36px; }
body[data-page="catalogo"] .gl-footer-card{
  border: 1px solid var(--c-line);
  border-radius: var(--c-radius);
  background: var(--c-surface-soft);
  padding: 16px;
}
body[data-page="catalogo"] .gl-footer-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-line-2);
}
body[data-page="catalogo"] .gl-footer-brand{ font-weight: 900; }
body[data-page="catalogo"] .gl-footer-links{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
}
body[data-page="catalogo"] .gl-footer-links a{
  color: var(--c-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
body[data-page="catalogo"] .gl-footer-bottom{
  padding-top: 10px;
  color: var(--c-muted);
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}
body[data-page="catalogo"] .gl-footer-sep{ opacity: .5; }

/* ===== SAFETY NET (evita "desapareció") ===== */
body[data-page="catalogo"] #glCatalogMount{ display:block; }
body[data-page="catalogo"] .gl-cat{ display:block; }
body[data-page="catalogo"] details{ display:block; }
body[data-page="catalogo"] summary{ display:block; }

/* Estado de carga/errores mínimo */
body[data-page="catalogo"] .gl-fallback{ padding: 14px 2px; }

/* =========================================================
   SMART SEARCH — Dropdown (UNIFICADO) + Theme aware
   Requiere que el JS cree .gl-search-results dentro de .gl-search
   ========================================================= */

body[data-page="catalogo"] .gl-search-results{
  position: absolute;
  left: 10px;
  right: 10px;
  top: calc(100% + 10px);
  z-index: 50;

  border-radius: 18px;
  border: 1px solid var(--c-line);
  background: var(--c-drop-bg);
  backdrop-filter: blur(10px);
  overflow: hidden;
  box-shadow: var(--c-drop-shadow);
}

body[data-page="catalogo"] .gl-sr-head{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--c-line-2);
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .06em;
  color: color-mix(in srgb, var(--c-text) 88%, transparent);
}

body[data-page="catalogo"] .gl-sr-list{
  display:flex;
  flex-direction:column;
}

body[data-page="catalogo"] .gl-sr-item{
  width:100%;
  border:0;
  background: transparent;
  color: inherit;
  padding: 10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  cursor:pointer;
  text-align:left;
}

body[data-page="catalogo"] .gl-sr-item:hover,
body[data-page="catalogo"] .gl-sr-item.is-active{
  background: color-mix(in srgb, var(--c-accent) 12%, transparent);
}

body[data-page="catalogo"] .gl-sr-main{
  display:flex;
  flex-direction:column;
  gap: 2px;
  min-width: 0;
}

body[data-page="catalogo"] .gl-sr-name{
  font-weight: 850;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--c-text);
}

body[data-page="catalogo"] .gl-sr-cat{
  font-size: 12px;
  color: var(--c-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body[data-page="catalogo"] .gl-sr-price{
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  white-space: nowrap;
  color: var(--c-text);
}

body[data-page="catalogo"] .gl-sr-empty{
  padding: 12px;
  border-top: 1px solid var(--c-line-2);
  color: var(--c-muted);
}

body[data-page="catalogo"] .gl-sr-q{
  margin-left: 6px;
  font-weight: 900;
}

/* Hit highlight when jumping */
body[data-page="catalogo"] .gl-row.gl-hit{
  background: color-mix(in srgb, var(--c-accent) 14%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c-accent) 22%, transparent);
  border-radius: 12px;
  animation: glHit 900ms ease-out 1;
}

@keyframes glHit{
  0%   { transform: translateY(-2px); background: color-mix(in srgb, var(--c-accent) 22%, transparent); }
  100% { transform: translateY(0);   background: color-mix(in srgb, var(--c-accent) 14%, transparent); }
}

/* ---------------- Responsive ---------------- */
@media (max-width: 980px){
  #gl-0-topbar .gl-topbar-shell{ padding: 10px 14px; width: 100%; }
  body[data-page="catalogo"] .gl-wrap{ width: min(1180px, calc(100% - 28px)); }

  body[data-page="catalogo"] .gl-cat-sum{
    grid-template-columns: 1fr 36px;
    grid-template-areas:
      "k ctl"
      "t ctl"
      "d ctl";
  }
  body[data-page="catalogo"] .gl-cat-k{ grid-area: k; }
  body[data-page="catalogo"] .gl-cat-t{ grid-area: t; }
  body[data-page="catalogo"] .gl-cat-d{ grid-area: d; }
  body[data-page="catalogo"] .gl-cat-ctl{ justify-self: end; }

  body[data-page="catalogo"] .gl-split{ grid-template-columns: 1fr; }
  body[data-page="catalogo"] .gl-cols2{ grid-template-columns: 1fr; }
  body[data-page="catalogo"] .gl-tools{ flex-direction: column; align-items: stretch; }
  body[data-page="catalogo"] .gl-actions{ justify-content: flex-start; }
}

@media (max-width: 520px){
  body[data-page="catalogo"] .gl-title{ font-size: 34px; }
  body[data-page="catalogo"] .gl-row{ grid-template-columns: 1fr; gap: 6px; }
  body[data-page="catalogo"] .gl-price{ padding-left: 0; }

  /* dropdown más “mobile-friendly” */
  body[data-page="catalogo"] .gl-search-results{
    left: 6px;
    right: 6px;
    top: calc(100% + 8px);
  }
}
/* =========================================================
   FIX — Smart search dropdown (alias para clases legacy)
   Pegalo al final de catalogo.css
   ========================================================= */

/* Si el dropdown no está dentro de .gl-search, lo igualamos */
body[data-page="catalogo"] .gl-search,
body[data-page="catalogo"] .gl-search-wrap{
  position: relative;
  overflow: visible;
}

/* Contenedor dropdown: soporta .gl-search-results (nuevo) y .gl-results (legacy) */
body[data-page="catalogo"] .gl-search-results,
body[data-page="catalogo"] .gl-results{
  position: absolute;
  left: 10px;
  right: 10px;
  top: calc(100% + 10px);
  z-index: 9999;

  border-radius: 18px;
  border: 1px solid var(--c-line);
  background: var(--c-drop-bg);
  backdrop-filter: blur(10px);
  overflow: hidden;
  box-shadow: var(--c-drop-shadow);
}

/* Header (si existe) */
body[data-page="catalogo"] .gl-sr-head,
body[data-page="catalogo"] .gl-results-head{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--c-line-2);
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .06em;
  color: color-mix(in srgb, var(--c-text) 88%, transparent);
}

/* Lista wrapper (si existe) */
body[data-page="catalogo"] .gl-sr-list,
body[data-page="catalogo"] .gl-results-list{
  display:flex;
  flex-direction:column;
}

/* Item: soporta .gl-sr-item (nuevo) y .gl-result / .gl-results-item (legacy) */
body[data-page="catalogo"] .gl-sr-item,
body[data-page="catalogo"] .gl-result,
body[data-page="catalogo"] .gl-results-item{
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;

  padding: 10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;

  cursor: pointer;
  text-align: left;
}

body[data-page="catalogo"] .gl-sr-item:hover,
body[data-page="catalogo"] .gl-sr-item.is-active,
body[data-page="catalogo"] .gl-result:hover,
body[data-page="catalogo"] .gl-results-item:hover{
  background: color-mix(in srgb, var(--c-accent) 12%, transparent);
}

/* Sub-bloques típicos (si existen) */
body[data-page="catalogo"] .gl-sr-name,
body[data-page="catalogo"] .gl-result-name{
  font-weight: 850;
  line-height: 1.1;
  color: var(--c-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body[data-page="catalogo"] .gl-sr-cat,
body[data-page="catalogo"] .gl-result-cat{
  font-size: 12px;
  color: var(--c-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body[data-page="catalogo"] .gl-sr-price,
body[data-page="catalogo"] .gl-result-price{
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  white-space: nowrap;
  color: var(--c-text);
}
/* =========================================================
   FIX — Buscador full width (evita barra “corta centrada”)
   Scope: catálogo
   ========================================================= */
body[data-page="catalogo"] .gl-tools{
  justify-content: stretch !important; /* si estaba center/space-between raro */
  width: 100% !important;
}

/* Si tu HTML usa wrapper */
body[data-page="catalogo"] .gl-search-wrap{
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: none !important;
}

/* Buscador en sí */
body[data-page="catalogo"] .gl-search{
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;          /* mata “centrado” por margin auto */
  justify-self: stretch !important;
}