/* ============================================================
   GESTOR DE DESTINOS (js/modules/destinos.js)
   Usa las variables de color del módulo; botones de 36/30 px y
   casillas de 16x16 como el resto del sistema.
   ============================================================ */

/* Lista */
.destinos-filtros { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:var(--sp-4); }
.destinos-filtros .form-control { width:auto; min-width:180px; }
.destinos-cuenta { margin-left:auto; font-size:12px; color:var(--text-muted); }
.destino-codigo { font-family:monospace; font-size:12px; color:var(--text-secondary); white-space:nowrap; }
.destino-sub { font-size:11px; color:var(--text-muted); max-width:220px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Índice de secciones, fijo arriba del formulario */
.destino-indice { position:sticky; top:calc(-1 * 24px); z-index:5; display:grid; grid-template-columns:repeat(5, 1fr); gap:6px;
  margin:calc(-1 * 24px) calc(-1 * 24px) var(--sp-4); padding:10px 24px;
  background:var(--bg-card); border-bottom:1px solid #e2e8f0; }
.destino-indice button { height:30px; padding:0 6px; border:1px solid #e2e8f0; border-radius:var(--radius-sm); background:var(--bg-card);
  color:var(--text-secondary); font-size:11px; font-weight:600; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.destino-indice button:hover:not(:disabled) { border-color:var(--blue-300); color:var(--blue-700); background:var(--bg-hover); }
.destino-indice button:disabled { opacity:.4; cursor:not-allowed; }

/* Secciones */
.destino-seccion { padding:0 0 var(--sp-4); margin-bottom:var(--sp-4); border-bottom:1px solid #e2e8f0; scroll-margin-top:60px; }
.destino-seccion:last-child { border-bottom:none; }
.destino-seccion[hidden], .destino-seccion [hidden] { display:none !important; }
.destino-seccion-titulo { display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:13px; text-transform:uppercase; letter-spacing:.5px; color:var(--blue-800); }
.destino-seccion-titulo span { display:inline-grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--blue-600); color:#fff; font-size:11px; }

/* Filas de campos en columnas parejas */
.destino-fila-2, .destino-fila-3 { display:grid; gap:12px; align-items:start; }
.destino-fila-2 { grid-template-columns:repeat(2, minmax(0, 1fr)); }
.destino-fila-3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
.destino-ayuda { font-size:11px; font-weight:400; color:var(--text-muted); }
.destino-nota { font-size:12px; color:var(--text-muted); margin:0 0 8px; }
.destino-cabecera-campo { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.destino-cabecera-campo .form-label { margin:0; }
.destino-botones { display:flex; align-items:center; gap:8px; }

/* Casillas: 16x16, centradas con su texto a la derecha */
.destino-check { display:inline-flex; align-items:center; gap:8px; min-height:36px; margin:0; font-size:13px; cursor:pointer; }
.destino-check input { width:16px; height:16px; margin:0; flex:0 0 16px; }
.destino-dias { display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:6px; }
.destino-dias .destino-check { justify-content:center; border:1px solid #e2e8f0; border-radius:var(--radius-sm); min-height:36px; }

/* Íconos: chips del mismo tamaño en columnas parejas */
.destino-iconos { display:grid; grid-template-columns:repeat(auto-fill, minmax(56px, 1fr)); gap:6px; padding:10px;
  border:1px solid #e2e8f0; border-radius:var(--radius-sm); background:var(--bg-card); }
.destino-icono { display:flex; align-items:center; justify-content:center; gap:6px; height:36px; border:1px solid #e2e8f0;
  border-radius:var(--radius-sm); cursor:pointer; font-size:16px; }
.destino-icono input { width:16px; height:16px; margin:0; flex:0 0 16px; }
.destino-icono:has(input:checked) { border-color:var(--blue-500); background:var(--blue-50); }

/* Tablas editables (precios, salidas, hoteles) */
.destino-tabla { overflow-x:auto; border:1px solid #e2e8f0; border-radius:var(--radius-sm); margin-bottom:8px; }
.destino-tabla .data-table { width:100%; margin:0; }
.destino-tabla-editable th { font-size:11px; white-space:nowrap; }
.destino-tabla-editable td { padding:4px; vertical-align:middle; }
.destino-tabla-editable .form-control { height:30px; padding:0 8px; font-size:12px; min-width:90px; }
.destino-tabla-editable select.form-control { padding-right:28px; }
.destino-col-num .form-control { min-width:70px; }
.destino-vacio { text-align:center; color:var(--text-muted); font-size:12px; padding:12px !important; }

/* Itinerario por días */
.destino-dias-lista { display:flex; flex-direction:column; gap:10px; margin-bottom:12px; }
.destino-dia { display:flex; flex-direction:column; gap:8px; padding:12px; border:1px solid #e2e8f0; border-left:3px solid var(--blue-500);
  border-radius:var(--radius-sm); background:var(--bg-card); }
.destino-dia-cabecera { display:flex; align-items:center; justify-content:space-between; }
.destino-dia-numero { font-weight:700; color:var(--blue-700); font-size:13px; }
.destino-dia textarea.form-control { min-height:70px; }

/* Imágenes y enlaces */
.destino-imagenes { display:flex; flex-wrap:wrap; gap:10px; }
.destino-imagenes:empty { display:none; }
.destino-enlaces { display:flex; flex-direction:column; gap:8px; }

@media (max-width:640px) {
  .destino-indice { grid-template-columns:repeat(2, 1fr); }
  .destino-fila-2, .destino-fila-3 { grid-template-columns:1fr; }
  .destino-dias { grid-template-columns:repeat(4, minmax(0, 1fr)); }
  .destinos-filtros .form-control { flex:1 1 100%; }
  .destinos-cuenta { margin-left:0; }
}
.destino-col-calc { text-align:center; font-size:12px; white-space:nowrap; }
.destino-agotada { color:#b45309; font-weight:700; }
