/* ============================================================
   Desplegable con búsqueda integrada (ver /comun/combo.js).
   Una sola hoja para Horarios, Inventarios y Administración.

   El <select> nativo se conserva en el DOM y se oculta SIN `display:none`
   (que lo sacaría de la validación nativa del formulario): se le deja 1px
   transparente y sin eventos de puntero.
   Los colores usan variables cuando el módulo las define, con un valor de
   respaldo para que la hoja funcione sola.
   ============================================================ */
.combo { position: relative; }

.combo-nativo {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 1px; height: 1px;
  margin: 0; padding: 0; border: 0;
}

.combo-inp {
  width: 100%;
  padding-right: 26px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px 7px;
  text-overflow: ellipsis;
}
.combo-inp:disabled { opacity: .6; cursor: not-allowed; }

.combo-lista {
  position: absolute;
  z-index: 60;
  left: 0; right: 0;
  top: calc(100% + 2px);
  max-height: 240px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;   /* desplazamiento fluido en móvil */
  overscroll-behavior: contain;        /* no arrastra la página al llegar al final */
  background: var(--card, #fff);
  border: 1px solid var(--gris, #dcdcdc);
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .14);
}
.combo-lista.oculto { display: none; }

.combo-item {
  padding: 9px 10px;
  font-size: 14px;
  line-height: 1.3;
  cursor: pointer;
  border-bottom: 1px solid var(--gris, #ececec);
}
.combo-item:last-child { border-bottom: none; }
.combo-item:hover,
.combo-item.activo { background: var(--gris, #eef2f7); }
.combo-item[aria-selected="true"] { font-weight: 600; }

.combo-vacio {
  padding: 9px 10px;
  font-size: 13px;
  color: var(--muted, #777);
}

/* En pantallas táctiles la fila necesita más área para el dedo. */
@media (pointer: coarse) {
  .combo-item { padding: 12px 10px; font-size: 15px; }
  .combo-lista { max-height: 50vh; }
}