/*!
 * QUIPU Design System — q-datatable-adapter
 * Version: 1.2.2  ·  Build: 2026-06-26
 * ----------------------------------------------------------------
 * ADAPTADOR de plugin (Principio de Adaptación Universal / Regla N.º 24):
 * tematiza DataTables (buscador, "mostrar N", info, paginación, orden,
 * hover, fila seleccionada, vacío) al contrato del DS consumiendo SOLO
 * tokens. NO edita el plugin. Scopeado a `.q-panel` → solo bandejas DS.
 * Carga DESPUÉS de components.css.
 *
 * Ritmo (Golden Master bandeja): controles ↕ tabla = --q-space-2 (8px).
 * ================================================================ */

/* ── Controles superiores (length + filter): identidad q-input ── */
.q-panel .dataTables_wrapper .dataTables_length,
.q-panel .dataTables_wrapper .dataTables_filter,
.q-panel .dataTables_wrapper .dataTables_info{
  color:var(--q-text-2); font-size:var(--q-font-size-sm);
}
.q-panel .dataTables_wrapper .dataTables_length select,
.q-panel .dataTables_wrapper .dataTables_filter input{
  height:var(--q-dt-control-h); box-sizing:border-box;
  padding:0 var(--q-space-2); margin:0 var(--q-space-1);
  border:var(--q-border-width) solid var(--q-input-border);
  border-radius:var(--q-input-radius);
  background:var(--q-surface); color:var(--q-text-1);
  font-family:var(--q-font-family); font-size:var(--q-font-size-md);
}
.q-panel .dataTables_wrapper .dataTables_filter input{ min-width:220px; }
/* "Mostrar [N] registros" en UNA línea (no apilado) */
.q-panel .dataTables_wrapper .dataTables_length label,
.q-panel .dataTables_wrapper .dataTables_filter label{
  display:inline-flex; align-items:center; gap:var(--q-space-1); white-space:nowrap; margin:0;
  font-weight:var(--q-font-weight-regular);
}
.q-panel .dataTables_wrapper .dataTables_length select{ width:auto; display:inline-block; }
/* Foco ÚNICO del DS (sin doble outline / sin halo nativo) */
.q-panel .dataTables_wrapper .dataTables_length select:focus,
.q-panel .dataTables_wrapper .dataTables_filter input:focus{
  outline:none; border-color:var(--q-input-focus); box-shadow:var(--q-focus-shadow);
}

/* ── Ritmo vertical compacto (referencia newsale): controles ↕ tabla ↕ pie ── */
.q-panel .dataTables_wrapper .dataTables_length,
.q-panel .dataTables_wrapper .dataTables_filter{ margin-bottom:var(--q-space-1); }
.q-panel .dataTables_wrapper .dataTables_info,
.q-panel .dataTables_wrapper .dataTables_paginate{ margin-top:var(--q-space-2); padding-top:0; }
/* El buscador se integra alineado a la derecha, mismo nivel que "Mostrar N" */
.q-panel .dataTables_wrapper .dataTables_filter{ text-align:right; }
.q-panel .dataTables_wrapper .dataTables_filter label{ font-weight:var(--q-font-weight-regular); margin:0; }

/* ── Orden: flechas heredan el color del texto de la cabecera ── */
.q-panel table.dataTable thead th{ position:relative; }
.q-panel table.dataTable thead .sorting:before,  .q-panel table.dataTable thead .sorting:after,
.q-panel table.dataTable thead .sorting_asc:before,  .q-panel table.dataTable thead .sorting_asc:after,
.q-panel table.dataTable thead .sorting_desc:before, .q-panel table.dataTable thead .sorting_desc:after{
  color:currentColor;
}

/* ── Hover SUTIL para seguir la fila + fila seleccionada ── */
.q-panel table.dataTable tbody tr:hover{ background:var(--q-table-hover); }
.q-panel table.dataTable tbody tr.selected,
.q-panel table.dataTable tbody tr.selected:hover{ background:var(--q-color-primary-light); }

/* ── Estado VACÍO (oficial del DS): no tablas vacías sin mensaje ── */
.q-panel table.dataTable td.dataTables_empty{
  padding:var(--q-space-8) var(--q-space-3);
  text-align:center; color:var(--q-text-2);
  font-size:var(--q-font-size-md); background:var(--q-surface);
}

/* ── Paginación: coherente con q-btn ── */
.q-panel .dataTables_wrapper .dataTables_paginate .paginate_button{
  box-sizing:border-box; min-width:var(--q-dt-control-h); height:var(--q-dt-control-h);
  padding:0 var(--q-space-2); margin-left:var(--q-space-1);
  border:var(--q-border-width) solid var(--q-border) !important;
  border-radius:var(--q-input-radius);
  background:var(--q-surface) !important; color:var(--q-text-1) !important;
  cursor:pointer;
}
.q-panel .dataTables_wrapper .dataTables_paginate .paginate_button:hover{
  background:var(--q-surface-2) !important; color:var(--q-text-1) !important; border-color:var(--q-border) !important;
}
.q-panel .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.q-panel .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
  background:var(--q-color-primary) !important; color:var(--q-color-on-primary) !important; border-color:var(--q-color-primary) !important;
}
.q-panel .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.q-panel .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover{
  opacity:var(--q-opacity-disabled); background:var(--q-surface) !important; color:var(--q-text-3) !important; cursor:default;
}
.q-panel .dataTables_wrapper .dataTables_paginate .paginate_button:focus{
  outline:none; box-shadow:var(--q-focus-shadow); border-color:var(--q-input-focus) !important;
}