/* ==========================================================================
   TT24 Finder – Tailwind fixes (limpio)
   Objetivo: neutralizar estilos del tema y asegurar usabilidad sin Bootstrap
   ========================================================================== */

/* -- Visibilidad: cualquier [hidden] dentro del finder DEBE ocultar -- */
.tt24vf [hidden] { display: none !important; }

/* -- Contenedores: contexto y prevención de overlays -- */
.tt24vf, .tt24vf-box { position: relative; }

/* ==========================================================================
   1) Tabs NUEVOS (.tt24vf)
   ========================================================================== */
.tt24vf .tt24vf-tab{
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  color: inherit !important;
  padding: .5rem 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: pointer;
}
.tt24vf .tt24vf-tab[data-active="true"]{
  font-weight: 600;
  border-bottom-color: currentColor !important;
}

/* Botones tipo de vehículo */
.tt24vf .tt24vf-type{
  all: unset;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem; height: 2.5rem;
  border: 1px solid #e2e8f0;
  border-radius: .5rem;
  background: #fff;
  color: inherit;
  cursor: pointer;
  line-height: 1;
}
.tt24vf .tt24vf-type[data-on="true"]{
  background: #2563eb; /* blue-600 */
  color: #fff;
  border-color: #2563eb;
}

/* Selects (nuevo markup): sin flecha del theme y con caret propio */
.tt24vf .tt24vf-select{
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  background-image: none !important;
  background-color: #fff;
  padding-right: 2rem;
}
.tt24vf .tt24vf-select option{
  color: inherit;
  background-color: #fff;
}

/* Botones de acción (buscar, limpiar, KBA, VIN) */
.tt24vf .tt24vf-search,
.tt24vf .tt24vf-clear,
.tt24vf .tt24vf-do-kba,
.tt24vf .tt24vf-do-vin{
  border-radius: .5rem !important;
  box-shadow: none !important;
}

/* Estado disabled consistente */
.tt24vf select:disabled,
.tt24vf input:disabled,
.tt24vf button:disabled{
  opacity: .6;
  cursor: not-allowed;
}

/* ==========================================================================
   2) Tabs LEGACY (.tt24vf-box con .nav-tabs) – sin Bootstrap
   ========================================================================== */
.tt24vf-box .nav.nav-tabs{
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: .5rem;
}
.tt24vf-box .nav.nav-tabs .nav-link{
  all: unset !important;
  display: inline-block !important;
  padding: .5rem 0 !important;
  margin-right: 1.25rem !important;
  border-bottom: 2px solid transparent !important;
  color: inherit !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  user-select: none !important;
}
.tt24vf-box .nav.nav-tabs .nav-link.active{
  font-weight: 600 !important;
  border-bottom-color: currentColor !important;
}

/* Mostrar solo el pane activo (por si el theme rompe .show) */
.tt24vf-box .tab-content .tab-pane{ display: none !important; }
.tt24vf-box .tab-content .tab-pane.active.show{ display: block !important; }

/* Selects legacy: quitar flecha del theme y asegurar clic */
.tt24vf-box select{
  background-image: none !important;
  pointer-events: auto !important;
}

/* Extra: cualquier select del finder debe ser clicable y visible */
.tt24vf select[id^="tt24vf-"],
.tt24vf-box select[id^="tt24vf-"]{
  background-image: none !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  filter: none !important;
}

/* solo dentro del finder */
.tt24vf-box select option {
  color: inherit !important;
  background: #fff !important;
  display: block !important;
  height: auto !important;
}

/* opciones visibles y con fondo/blanco dentro del finder */
.tt24vf-box select option,
.tt24vf select option{
  color: inherit !important;
  background: #fff !important;
  display: block !important;
  height: auto !important;
}
