
.catalog{
  margin-top:28px;
  margin-bottom:60px;
}

.catalog__layout{
  display:flex;
  align-items:flex-start;
  gap:32px;
}

.catalog__sidebar{
  flex:0 0 250px;
  width:250px;
}

.catalog__box{
  background:#fff;
  border:1px solid #ededed;
  border-radius:var(--radius-md);
  padding:18px 20px;
  margin-bottom:18px;
}

.catalog__box h3{
  font-size:14px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.3px;
  color:var(--text);
  margin-bottom:12px;
}

.catalog__categorias{
  display:flex;
  flex-direction:column;
}

.catalog__categorias a{
  padding:7px 0;
  font-size:13.5px;
  color:#4a4a4a;
  border-bottom:1px solid #f3f3f3;
  transition:color .15s;
}

.catalog__categorias a:last-child{ border-bottom:none; }

.catalog__categorias a:hover{ color:var(--red); }

.catalog__categorias a.active{
  color:var(--red);
  font-weight:700;
}

.catalog__chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:18px;
}

.catalog__chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--red);
  color:#fff;
  font-size:13px;
  font-weight:600;
  border-radius:20px;
  padding:7px 10px 7px 16px;
  text-decoration:none;
}

.catalog__chip svg{
  width:12px;
  height:12px;
}

.catalog__accordion-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
  margin-bottom:0;
}

.catalog__accordion-head svg{
  width:14px;
  height:14px;
  transition:transform .2s;
}

.catalog__accordion-head.open svg{ transform:rotate(180deg); }

.catalog__categorias-wrap{
  margin-top:12px;
  max-height:0;
  overflow:hidden;
  transition:max-height .2s ease;
}

.catalog__categorias-wrap.open{
  max-height:900px;
}

.catalog__filtro-grupo{
  margin-bottom:18px;
}

.catalog__filtro-grupo:last-child{ margin-bottom:0; }

.catalog__filtro-grupo h4{
  font-size:12.5px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.3px;
  color:#8a8a8a;
  margin-bottom:8px;
}

.catalog__filtro-opcion{
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px 0;
  font-size:13px;
  color:#4a4a4a;
  cursor:pointer;
}

.catalog__filtro-opcion input{
  width:15px;
  height:15px;
  accent-color:var(--red);
  cursor:pointer;
}

.catalog__filtro-opcion span.count{
  color:#b3b3b3;
  margin-left:auto;
  font-size:12px;
}

.catalog__filtro-nota{
  font-size:11.5px;
  color:#b3b3b3;
  line-height:1.4;
  margin-top:10px;
}

.catalog__content{
  flex:1;
  min-width:0;
}

.catalog__content-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  margin-bottom:18px;
}

.catalog__content-head h1{
  font-size:22px;
  font-weight:600;
  color:var(--text);
}

.catalog__count{
  font-size:13px;
  color:#9a9a9a;
}

.catalog__empty{
  background:#fff;
  border:1px solid #ededed;
  border-radius:var(--radius-md);
  padding:50px 20px;
  text-align:center;
  color:#9a9a9a;
  font-size:14.5px;
}

.catalog__grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
}

@media (max-width:1100px){
  .catalog__layout{ flex-direction:column; }
  .catalog__sidebar{ width:100%; flex:1; }
  .catalog__grid{ grid-template-columns:repeat(2, 1fr); }
}

@media (max-width:600px){
  .catalog__grid{ grid-template-columns:1fr; }
  .catalog__content-head{ flex-direction:column; align-items:flex-start; gap:4px; }
}

.catalog__filtros-head{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.catalog__filtros-head h3{ margin:0; display:flex; align-items:center; gap:8px; }
.catalog__badge{ background:var(--red); color:#fff; font-size:11px; font-weight:700; border-radius:10px; min-width:18px; padding:1px 6px; text-align:center; }
.catalog__badge:empty{ display:none; }
.catalog__filtros-limpiar{ margin-left:auto; background:none; border:none; color:var(--red); font-size:12.5px; font-weight:600; cursor:pointer; font-family:inherit; padding:2px 0; }
.catalog__filtros-limpiar:hover{ text-decoration:underline; }
.catalog__filtros-chev{ display:none; width:14px; height:14px; transition:transform .2s; }
.catalog__filtro-opcion.is-vacia{ opacity:.45; }
.catalog__filtro-opcion span:nth-child(2){ overflow-wrap:anywhere; }
.catalog__filtro-mas{ background:none; border:none; color:var(--red); font-size:12.5px; font-weight:600; cursor:pointer; padding:4px 0 0; font-family:inherit; display:block; }
.catalog__filtro-mas:hover{ text-decoration:underline; }
.catalog__precio{ display:flex; align-items:center; gap:6px; }
.catalog__precio input{ width:100%; min-width:0; height:34px; border:1px solid #d6d6d6; border-radius:6px; padding:0 8px; font-size:12.5px; font-family:inherit; outline:none; }
.catalog__precio input:focus{ border-color:var(--red); }
.catalog__precio input::-webkit-outer-spin-button, .catalog__precio input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.catalog__precio input[type=number]{ -moz-appearance:textfield; }
button.catalog__chip{ border:none; cursor:pointer; font-family:inherit; }
.catalog__chip--filtro{ background:#fff; color:var(--text); border:1px solid var(--red) !important; padding:6px 10px 6px 14px; font-weight:500; }
.catalog__chip--filtro svg{ color:var(--red); }

@media (max-width:1100px){
  .catalog__filtros-head{ cursor:pointer; margin-bottom:0; }
  .catalog__filtros-chev{ display:block; }
  .catalog__box.is-open .catalog__filtros-chev{ transform:rotate(180deg); }
  .catalog__filtros-body{ display:none; margin-top:14px; }
  .catalog__box.is-open .catalog__filtros-body{ display:block; }
}
