/* ---------- Hero base (z-index ordenado) ---------- */
.video-overlay   { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.buscador        { position: relative; z-index: 3; } 

/* ---------- Layout filtros ---------- */
#filtros {
  display: grid;
  gap: .75rem;
  grid-template-columns: 1fr;
  align-items: start;
  width: 100%;
}
@media (min-width: 768px){
  .buscador { max-width: 1100px; margin: 0 auto; }
  #filtros  { grid-template-columns: repeat(4, 1fr); }
}

/* Mobile: ancho completo con 10px de margen lateral */
@media (max-width: 767px){
  .buscador { padding: 0 10px; }
  .ts-wrapper, .ts-control { width: 100%; box-sizing: border-box; }
}

/* ---------- Tom Select reset/base ---------- */
.ts-wrapper { width: 100%; position: relative; z-index: 1; }
.ts-wrapper.focus { z-index: 9999; }

.ts-control, .ts-dropdown { font-size: 16px; }
.ts-control{
  min-height: 44px;
  padding: 6px 10px;
  border: 1px solid #d9d9e3;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16,24,40,.06);
  flex-wrap: wrap; /* chips a varias líneas */
}
.ts-control:focus,
.ts-wrapper.focus .ts-control{
  border-color: #98b1ff;
  box-shadow: 0 0 0 3px rgba(0,60,255,.10);
}
.ts-control .item{
  background:#f3f6ff; color:#223; border-radius:9999px;
  padding:4px 8px; margin:4px 6px 0 0; border:1px solid #e4e8ff;
  max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ts-control .item .remove{ margin-left:6px; opacity:.6; }
.ts-control .item .remove:hover{ opacity:1; }

/* ---------- Dropdown SIEMPRE arriba de todo ---------- */
.ts-dropdown{
  position: absolute;
  z-index: 2147483647 !important; /* por encima de header, overlay y cualquier cosa */
  max-height: 50vh;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #d9d9e3;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(16,24,40,.18), 0 2px 6px rgba(16,24,40,.10);
}
.ts-dropdown .option{ font-size:15px; padding:10px 12px; line-height:1.2; }
.ts-dropdown .option:not(.selected):hover{ background:#f5f7fb; }
.ts-dropdown .option.selected{ background:#eef2ff; }

/* Bloquear scroll del body cuando un menú está abierto */
html.no-scroll, body.no-scroll{ height:100%; overflow:hidden; }