/* ─── OVERRIDE & SUPPLEMENTS ─── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'DM Sans','Outfit',system-ui,sans-serif;background:#f8fafc;color:#1e293b}
.sx-container{max-width:1280px;margin:0 auto;padding:0 24px}

/* ─── TOPBAR ─── */
.cat-topbar{background:#0B1E3F;padding:8px 0;font-size:12.5px;color:rgba(255,255,255,.7)}
.cat-topbar .sx-container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px}
.cat-topbar a{color:inherit;text-decoration:none;transition:color .2s}.cat-topbar a:hover{color:#fff}

/* ─── NAV ─── */
.cat-nav{background:#fff;border-bottom:1px solid #e2e8f0;position:sticky;top:0;z-index:200;box-shadow:0 1px 8px rgba(0,0,0,.06)}
.cat-nav .sx-container{display:flex;align-items:center;height:60px;gap:20px}
.cat-nav-logo img{height:44px;width:auto;display:block}
.cat-nav-links{display:flex;gap:2px;list-style:none;margin:0;padding:0;flex:1}
.cat-nav-links a{font-size:15px;font-weight:500;color:#374151;text-decoration:none;padding:6px 11px;border-radius:6px;transition:all .2s;white-space:nowrap}
.cat-nav-links a:hover,.cat-nav-links a.active{background:#E8EEF7;color:#1F4F8B}
.cat-nav-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.cat-nav-btn{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:7px 14px;border-radius:8px;border:none;cursor:pointer;font-family:inherit;transition:all .2s;position:relative}
.cat-nav-btn-cot{background:#1F4F8B;color:#fff}
.cat-nav-btn-cot:hover{background:#1B3D6E}
.cat-nav-btn-sec{background:#f1f5f9;color:#374151}
.cat-nav-btn-sec:hover{background:#e2e8f0}
.cat-badge{position:absolute;top:-5px;right:-5px;background:#e53e3e;color:#fff;font-size:10px;font-weight:800;border-radius:99px;min-width:17px;height:17px;display:none;align-items:center;justify-content:center;padding:0 4px}

/* ─── HERO STRIP ─── */
.cat-hero{background:linear-gradient(135deg,#0B1E3F 0%,#1a3a6b 55%,#1F4F8B 100%);padding:40px 24px 36px;text-align:center}
.cat-hero-eyebrow{font-size:11.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#85B7EB;margin-bottom:12px}
.cat-hero h1{font-size:clamp(22px,4vw,36px);font-weight:800;color:#fff;margin-bottom:10px;line-height:1.2}
.cat-hero p{font-size:14.5px;color:rgba(255,255,255,.72);max-width:540px;margin:0 auto 24px}
.cat-hero-search{max-width:560px;margin:0 auto;position:relative}
.cat-hero-search-input{width:100%;height:48px;padding:0 50px 0 18px;border:none;border-radius:12px;font-size:15px;font-family:inherit;background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.2);outline:none;box-sizing:border-box}
.cat-hero-search-icon{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#9ca3af;pointer-events:none}
.cat-hero-stats{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.cat-hero-stat{color:rgba(255,255,255,.9);font-size:13px;font-weight:500;display:flex;align-items:center;gap:6px}
.cat-hero-stat strong{font-size:18px;font-weight:800;color:#fff}

/* ─── LAYOUT ─── */
.cat-layout{display:grid;grid-template-columns:260px 1fr;gap:0;max-width:1280px;margin:0 auto;padding:32px 24px;align-items:start}

/* ─── SIDEBAR ─── */
.cat-sidebar{position:sticky;top:72px;background:#fff;border:1px solid #e2e8f0;border-radius:14px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.04)}
.cat-sidebar-header{padding:16px 18px 12px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;justify-content:space-between}
.cat-sidebar-title{font-size:13px;font-weight:700;color:#0B1E3F;text-transform:uppercase;letter-spacing:.5px}
.cat-limpiar{font-size:12px;font-weight:600;color:#e53e3e;background:none;border:none;cursor:pointer;padding:0;font-family:inherit;transition:opacity .2s;display:none}
.cat-limpiar:hover{opacity:.75}
.cat-sidebar-body{padding:8px 0 16px;max-height:calc(100vh - 160px);overflow-y:auto}

/* Sidebar filter sections */
.cat-fs{border-bottom:1px solid #f1f5f9}
.cat-fs:last-child{border-bottom:none}
.cat-fs-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:none;border:none;cursor:pointer;font-family:inherit;font-size:13px;font-weight:700;color:#374151;text-align:left;transition:background .15s}
.cat-fs-toggle:hover{background:#f8fafc}
.cat-fs-chevron{transition:transform .2s;flex-shrink:0}
.cat-fs.closed .cat-fs-chevron{transform:rotate(-90deg)}
.cat-fs-body{padding:4px 10px 10px}
.cat-fs.closed .cat-fs-body{display:none}

/* Filter buttons */
.cat-fb{display:flex;align-items:center;justify-content:space-between;width:100%;padding:7px 10px;border:none;background:none;border-radius:8px;cursor:pointer;font-family:inherit;font-size:13px;color:#374151;text-align:left;transition:all .15s}
.cat-fb:hover{background:#F7F9FC;color:#1F4F8B}
.cat-fb.active{background:#E8EEF7;color:#1F4F8B;font-weight:600}
.cat-fb-count{font-size:11.5px;color:#9ca3af;font-weight:600;margin-left:6px;flex-shrink:0}
.cat-fb.active .cat-fb-count{color:#1F4F8B}
.cat-fb.oculto{display:none}
.cat-grupo{margin-top:6px}
.cat-grupo-label{font-size:11px;font-weight:700;color:#9ca3af;text-transform:uppercase;letter-spacing:.6px;padding:4px 10px 2px}

/* Brand search */
.cat-marca-search{width:100%;padding:7px 10px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;font-family:inherit;margin:6px 0 4px;box-sizing:border-box;outline:none}
.cat-marca-search:focus{border-color:#1F4F8B}

/* ─── MAIN CONTENT ─── */
.cat-main{margin-left:24px}

/* Sort bar */
.cat-sort-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:12px 16px}
.cat-count{font-size:13.5px;color:#6b7280;flex:1;min-width:200px}
.cat-count strong{color:#0B1E3F}
.cat-sort-select{font-size:13px;font-family:inherit;border:1px solid #e2e8f0;border-radius:8px;padding:6px 12px;color:#374151;background:#fff;cursor:pointer;outline:none}
.cat-sort-select:focus{border-color:#1F4F8B}
.cat-view-toggle{display:flex;gap:4px}
.cat-view-btn{width:32px;height:32px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#6b7280;transition:all .2s}
.cat-view-btn.active,.cat-view-btn:hover{background:#E8EEF7;color:#1F4F8B;border-color:#C4D8EE}

/* Chips activos */
.cat-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.cat-chip{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;color:#0B1E3F;background:#E8EEF7;border:1px solid #C4D8EE;border-radius:99px;padding:4px 10px;cursor:pointer;transition:all .2s}
.cat-chip:hover{background:#ffecec;color:#e53e3e;border-color:#fca5a5}
.cat-chip svg{width:10px;height:10px}

/* Grid */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.cat-grid.vista-lista{grid-template-columns:1fr}
.cat-grid.vista-lista .lab-prod-card{flex-direction:row;align-items:center;gap:16px}
.cat-grid.vista-lista .lab-prod-img-wrap{width:100px;min-width:100px;aspect-ratio:1/1;border-bottom:none;border-right:1px solid #f1f5f9}
.cat-empty{text-align:center;padding:64px 20px;color:#6b7280;grid-column:1/-1}
.cat-empty h3{font-size:18px;color:#0B1E3F;margin-bottom:8px}

/* Load more */
.cat-load-more-wrap{text-align:center;margin-top:32px}
.cat-load-more{background:#fff;border:2px solid #1F4F8B;color:#1F4F8B;font-size:14px;font-weight:700;padding:12px 36px;border-radius:10px;cursor:pointer;transition:all .2s;font-family:inherit}
.cat-load-more:hover{background:#1F4F8B;color:#fff}
.cat-load-more:disabled{opacity:.5;cursor:default}

/* ─── MODAL (reused from laboratorio.css classes, supplement) ─── */
/* laboratorio.css has all .lab-modal-* classes */

/* ─── TOAST ─── */
/* laboratorio.css has .lab-toast */

/* ─── CART & FAV DRAWER (reused) ─── */
/* laboratorio.css has .lab-carrito-* and .lab-favs-* */

/* ─── MOBILE ─── */
.cat-mobile-filter-toggle{display:none;align-items:center;gap:8px;font-size:14px;font-weight:700;padding:10px 18px;background:#1F4F8B;color:#fff;border:none;border-radius:10px;cursor:pointer;font-family:inherit;margin-bottom:16px}
.cat-sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:300}
.cat-sidebar-overlay.open{display:block}
.cat-sidebar-mobile{display:none}

@media(max-width:900px){
  .cat-layout{grid-template-columns:1fr;padding:20px 16px}
  .cat-main{margin-left:0}
  .cat-sidebar{position:fixed;top:0;left:-280px;width:280px;height:100vh;border-radius:0;z-index:400;transition:left .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;max-height:100vh}
  .cat-sidebar.open{left:0}
  .cat-sidebar-body{max-height:none}
  .cat-mobile-filter-toggle{display:flex}
  .cat-hero-stats{gap:16px}
}
@media(max-width:560px){
  .cat-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .cat-hero{padding:32px 16px 28px}
  .cat-sort-bar{flex-direction:column;align-items:flex-start;gap:8px}
}


/* MÓVIL: quitar el toggle de vista (cuadrícula/lista) — no aporta y estorba */
@media (max-width: 768px) {
  .cat-view-toggle { display: none !important; }
}

/* --- Línea representada sin catálogo publicado ----------------------------
   Aparece dentro del "sin resultados". Convierte una búsqueda fallida en una
   consulta: Solinex representa 44 marcas y solo 25 tienen productos cargados,
   así que un cero resultados muchas veces significa "sí lo vendemos, todavía
   no está publicado", no "no lo vendemos".                                  */
.cat-empty-linea {
  display: block;
  margin: 18px auto 0;
  max-width: 460px;
  padding: 14px 18px;
  border-radius: 10px;
  text-decoration: none;
  text-align: left;
  background: linear-gradient(135deg, rgba(27,61,110,0.06) 0%, rgba(42,157,123,0.10) 100%);
  border: 1px solid rgba(42,157,123,0.25);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.cat-empty-linea:hover { border-color: #2A9D7B; box-shadow: 0 4px 14px rgba(11,30,63,0.10); }
.cat-empty-linea strong { display: block; font-size: 14px; color: #0B1E3F; }
.cat-empty-linea span   { display: block; font-size: 12.5px; color: #4A5468; margin-top: 3px; }