/* Contenedor general */
.filters-deluxe{
  border:1px solid #e8eef5; border-radius:14px;
  box-shadow:0 1px 10px rgba(0,0,0,.05);
}

/* Botón icon-only */
.btn-icon{
  width:44px; height:44px; padding:0; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
}

/* Grid & botón buscar */
.filters-grid > [class*="col-"]{ min-width:260px; }
.filters-grid .filter-btn-col{ min-width:auto; }

/* Floating inputs look
.form-label{ font-weight:600; font-size:.9rem; } */
.form-floating>.form-control{ border-radius:12px; }
.form-label{ font-weight: 600; }

/* Chips activos */
.chip{ background:#eaf6ff; color:#173E69; border-radius:999px; padding:.25rem .5rem; text-decoration:none; }
.chip:hover{ background:#d6efff; }

/* Indicador de “más opciones” activas */
.indicator-dot{
  position:absolute; top:6px; right:6px; width:9px; height:9px; border-radius:50%;
  background:#35b3ef;
}

/* Accesibilidad hover/focus */
.btn-primary:focus, .btn-outline-secondary:focus, .form-control:focus{
  box-shadow:0 0 0 .2rem rgba(53,179,239,.25);
  border-color:#35b3ef !important;
}

/* Brand hovers */
.btn-primary:hover{ background:#173E69; border-color:#173E69; }
.btn-outline-secondary:hover{ color:#000; border-color:#d6b15e; background:#fff7e0; }

/* ---------- PILLS GENERALES ---------- */
.btn-pill{
  border:1px solid #d6e2ef; background:#f7fbff; color:#173E69;
  padding:.45rem .7rem; border-radius:999px; margin-right:.4rem; margin-bottom:.4rem;
  transition: all .15s ease;
}
.btn-pill:hover{ transform: translateY(-1px); }
.btn-check:checked + .btn-pill{
  background:#35b3ef; color:#fff; border-color:#35b3ef;
  box-shadow:0 0 0 2px rgba(53,179,239,.2) inset;
}

/* ---------- OPERACIÓN & TIPO (COMPACTAS + CENTRADAS) ---------- */
.pills-op, .pills-tipo{
  display:flex; flex-wrap:wrap; justify-content:center; gap:.35rem;
  overflow:visible; white-space:normal;
}
.pills-compact .btn-pill{
  font-size:.78rem; padding:.26rem .48rem;
}

/* “Todos” con azul primario sólido (igual al botón Buscar) */
#op_todas + .btn-pill,
#tipo_todos + .btn-pill{
  background: var(--bs-primary); color:#fff; border-color: var(--bs-primary);
}

/* Hover dorado sólo para Operación/Tipo */
.pills-op .btn-pill:hover,
.pills-tipo .btn-pill:hover{
  border-color:#d6b15e;
  box-shadow:0 0 0 2px rgba(214,177,94,.25) inset;
}

/* Hover dorado también cuando están checked (manteniendo base celeste) */
.pills-op .btn-check:checked + .btn-pill:hover,
.pills-tipo .btn-check:checked + .btn-pill:hover{
  border-color:#d6b15e;
  box-shadow:0 0 0 2px rgba(214,177,94,.25) inset;
}

/* ---------- PRICE DUAL RANGE ---------- */
.price-range{ position:relative; height:28px; }
.price-range input[type=range]{
  position:absolute; left:0; right:0; top:8px; width:100%;
  pointer-events:none; background:transparent; -webkit-appearance:none; appearance:none;
}
.price-range input[type=range]::-webkit-slider-thumb{
  pointer-events:auto; -webkit-appearance:none; appearance:none;
  width:18px; height:18px; border-radius:50%;
  background:#35b3ef; border:2px solid #fff; box-shadow:0 0 0 2px rgba(53,179,239,.35);
}
.price-range input[type=range]::-moz-range-thumb{
  pointer-events:auto; width:18px; height:18px; border-radius:50%;
  background:#35b3ef; border:2px solid #fff;
}
.range-track{
  position:absolute; left:0; right:0; top:16px; height:4px; background:#e5eef6; border-radius:999px;
}
.range-highlight{ position:absolute; height:4px; background:#35b3ef; border-radius:999px; left:0; right:0; }

/* Responsive tweaks */
@media (max-width: 575.98px){
  .btn-icon{ width:42px; height:42px; }
}

/* Más opciones: coherencia visual */
.input-group-sm .form-control { border-radius: 10px; }

/* Segmentados compactos (orden/pp) */
.btn-seg{
  border:1px solid #d6e2ef; background:#f7fbff; color:#173E69;
  padding:.32rem .56rem; border-radius:10px; margin-right:.35rem; margin-bottom:.35rem;
  transition:all .15s ease;
}
.btn-seg:hover{ transform:translateY(-1px); border-color:#d6b15e; box-shadow:0 0 0 2px rgba(214,177,94,.22) inset; }
.btn-check:checked + .btn-seg{
  background:#35b3ef; color:#fff; border-color:#35b3ef;
  box-shadow:0 0 0 2px rgba(53,179,239,.2) inset;
}

/* ===== Sticky filters (desktop+) ===== */
@media (min-width: 768px){
  .filters-sticky{
    position: sticky;
    /* Altura del header fija por variable que setea el JS (fallback 64px) */
    top: calc(var(--fp-header-h, 64px) + 8px);
    z-index: 1030;
    background: #fff; /* asegura fondo sólido al quedar sticky */
    backdrop-filter: none;
  }
  /* Efecto visual cuando está pegado */
  .filters-sticky.is-stuck{
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
    border-color: #e2e8f0;
  }
}

/* Por si algún contenedor padre tiene overflow que rompe sticky */
.main-content, main, .container, .container-fluid {
  overflow: visible !important;
}
