/* Historiales de inventario — views/historial-inventario.js.
   Libro de materiales en pantalla completa (filtros por columna estilo Excel)
   y modal de historial por herramienta/equipo. Solo variables del tema
   (:root de styles.css), así funciona con cualquiera de los temas. */

body.hist-abierto { overflow: hidden; }
/* Un modal abierto sobre estas pantallas (p. ej. confirmar la asignación) tiene que
   quedar encima: .modal-overlay vive en z-index 100. Debajo de los toasts (1000). */
body.hist-abierto .modal-overlay { z-index: 960; }

.hist-overlay {
  position: fixed; inset: 0; z-index: 900;
  display: flex; flex-direction: column;
  background: var(--bg); color: var(--text);
}

.hist-top {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 16px; background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.hist-titulo { display: flex; flex-direction: column; min-width: 0; }
.hist-titulo strong { font-size: 1.05rem; white-space: nowrap; }
.hist-contador { font-size: 0.8rem; color: var(--muted); }
.hist-buscar { flex: 1; min-width: 200px; max-width: 420px; }
.hist-acciones { display: flex; gap: 6px; margin-left: auto; flex-wrap: wrap; }

.hist-barra {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 8px 16px; border-bottom: 1px solid var(--border); background: var(--surface);
}
.hist-rapidos { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.hist-rapidos-label { font-size: 0.8rem; color: var(--muted); }
.hist-rapidos + .hist-rapidos { padding-left: 10px; border-left: 1px solid var(--border); }
.hist-rapido {
  border: 1px solid var(--border); background: var(--bg-2); color: var(--text);
  border-radius: 999px; padding: 3px 12px; font-size: 0.8rem; cursor: pointer; white-space: nowrap;
}
.hist-rapido:hover:not(:disabled) { border-color: var(--highlight); }
.hist-rapido.activo { background: var(--accent); border-color: var(--accent); color: #fff; }
.hist-rapido:disabled { opacity: 0.45; cursor: default; }

.hist-activos { display: flex; gap: 6px; flex-wrap: wrap; }
.hist-chip-filtro {
  display: inline-flex; align-items: center; gap: 4px;
  background: color-mix(in srgb, var(--highlight) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--highlight) 35%, transparent);
  border-radius: 999px; padding: 2px 4px 2px 10px; font-size: 0.78rem;
}
.hist-chip-filtro button {
  border: 0; background: transparent; color: var(--muted); cursor: pointer;
  font-size: 0.75rem; padding: 0 4px; line-height: 1;
}
.hist-chip-filtro button:hover { color: var(--danger); }

.hist-tabla-wrap { flex: 1; overflow: auto; min-height: 0; }
.hist-tabla { width: 100%; border-collapse: collapse; font-size: 0.87rem; }
.hist-tabla thead th {
  position: sticky; top: 0; z-index: 2; background: var(--bg-2);
  border-bottom: 1px solid var(--border); padding: 0; text-align: left;
}
.hist-tabla td {
  padding: 8px 12px; border-bottom: 1px solid var(--border);
  vertical-align: top; background: var(--card);
}
.hist-tabla tbody tr:hover td { background: var(--bg-2); }

.hist-th {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  width: 100%; padding: 10px 12px; border: 0; background: transparent; cursor: pointer;
  color: var(--muted); font: inherit; font-size: 0.72rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.4px; white-space: nowrap; text-align: left;
}
.hist-th:hover { color: var(--text); background: color-mix(in srgb, var(--highlight) 8%, transparent); }
.hist-th.filtrado, .hist-th.ordenado { color: var(--highlight); }
.hist-th.filtrado { background: color-mix(in srgb, var(--highlight) 10%, transparent); }
.hist-th-ind { font-size: 0.7rem; }

.hist-c-fecha { white-space: nowrap; color: var(--muted); font-variant-numeric: tabular-nums; }
.hist-c-material { min-width: 140px; font-weight: 500; }
.hist-id { color: var(--muted); font-size: 0.75rem; font-weight: 400; white-space: nowrap; }
.hist-c-cant { white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.hist-c-cant.salida { color: var(--danger); }
.hist-c-cant.entrada { color: var(--success); }
.hist-c-ref { white-space: nowrap; font-family: ui-monospace, monospace; font-size: 0.8rem; }
.hist-c-detalle { min-width: 220px; max-width: 420px; color: var(--muted); font-size: 0.82rem; }
.hist-vacio { text-align: center; padding: 28px 12px !important; color: var(--muted); }

/* Etiqueta de tipo de movimiento/evento: suave, no grita como .chip */
.hist-mov {
  display: inline-block; padding: 2px 9px; border-radius: 999px; white-space: nowrap;
  font-size: 0.76rem; font-weight: 600;
  background: var(--bg-2); color: var(--text); border: 1px solid var(--border);
}
.hist-mov.salida { background: color-mix(in srgb, var(--danger) 13%, transparent); border-color: color-mix(in srgb, var(--danger) 35%, transparent); }
.hist-mov.entrada { background: color-mix(in srgb, var(--success) 13%, transparent); border-color: color-mix(in srgb, var(--success) 35%, transparent); }
.hist-mov.pedido, .hist-mov.uso { background: color-mix(in srgb, var(--highlight) 12%, transparent); border-color: color-mix(in srgb, var(--highlight) 35%, transparent); }
.hist-mov.mantencion { background: color-mix(in srgb, var(--warning) 15%, transparent); border-color: color-mix(in srgb, var(--warning) 40%, transparent); }

.hist-pie {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 8px 16px; background: var(--surface); border-top: 1px solid var(--border); min-height: 44px;
}
.hist-resumen-pie { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 0.85rem; }
.hist-tot { font-variant-numeric: tabular-nums; }
.hist-tot.salida { color: var(--danger); font-weight: 600; }
.hist-tot.entrada { color: var(--success); font-weight: 600; }

/* Popover de columna (autofiltro) */
.hist-pop {
  position: fixed; z-index: 950; width: 280px; max-width: calc(100vw - 16px);
  background: var(--card); color: var(--text); border: 1px solid var(--border);
  border-radius: var(--radius-sm); box-shadow: var(--shadow-lg);
  padding: 10px; display: flex; flex-direction: column; gap: 8px;
}
.hist-pop-orden { display: flex; flex-direction: column; gap: 2px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.hist-pop-btn {
  border: 0; background: transparent; color: var(--text); text-align: left; cursor: pointer;
  padding: 6px 8px; border-radius: 6px; font: inherit; font-size: 0.85rem;
}
.hist-pop-btn:hover { background: var(--bg-2); }
.hist-pop-buscar { width: 100%; }
.hist-pop-lista {
  max-height: 240px; overflow-y: auto; border: 1px solid var(--border);
  border-radius: 6px; padding: 4px 0;
}
.hist-pop-item {
  display: flex; align-items: center; gap: 8px; padding: 4px 8px;
  font-size: 0.85rem; cursor: pointer; user-select: none;
}
.hist-pop-item:hover { background: var(--bg-2); }
.hist-pop-item input { margin: 0; flex-shrink: 0; }
.hist-pop-valor { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hist-pop-n { color: var(--muted); font-size: 0.75rem; font-variant-numeric: tabular-nums; }
.hist-pop-todos { font-weight: 600; }
.hist-pop-presets { display: flex; flex-wrap: wrap; gap: 4px; }
.hist-pop-rango { display: flex; gap: 8px; }
.hist-pop-rango label { display: flex; flex-direction: column; gap: 3px; flex: 1; font-size: 0.78rem; color: var(--muted); min-width: 0; }
.hist-pop-rango input { width: 100%; }
.hist-pop-ayuda { font-size: 0.78rem; color: var(--muted); margin: 0; }
.hist-pop-pie { display: flex; justify-content: flex-end; gap: 6px; padding-top: 8px; border-top: 1px solid var(--border); }

/* Modal de historial por herramienta/equipo */
.modal.modal-ancho { max-width: 960px; }
.hist-activo { display: flex; flex-direction: column; gap: 14px; }
.hist-datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
.hist-dato {
  display: flex; flex-direction: column; gap: 2px; padding: 10px 12px;
  background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius-sm);
}
.hist-dato span { font-size: 0.72rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.3px; }
.hist-dato strong { font-size: 0.92rem; }
.hist-tabla-activo td, .hist-tabla-activo th { padding: 9px 12px; }
.hist-en-curso {
  display: inline-block; margin-left: 6px; font-size: 0.7rem; font-weight: 600;
  color: var(--warning-dark, var(--warning)); text-transform: uppercase; letter-spacing: 0.3px;
}

@media (max-width: 640px) {
  .hist-top { padding: 10px 16px; }
  .hist-buscar { order: 3; flex-basis: 100%; max-width: none; }
  .hist-acciones { margin-left: 0; width: 100%; flex-wrap: nowrap; }
  .hist-acciones .btn { padding: 6px 10px; font-size: 0.8rem; white-space: nowrap; }
  .hist-rapidos + .hist-rapidos { padding-left: 0; border-left: 0; }
  .hist-barra, .hist-pie { padding-left: 16px; padding-right: 16px; }
  .hist-c-detalle { min-width: 180px; }
}

/* Selector de materiales para subcontratos (views/selector-subcontrato.js).
   Reusa la pantalla completa de arriba; esto es solo lo propio de la planilla. */
.sel-filtro { width: auto; min-height: 34px; font-size: 0.85rem; }
.sel-check { display: inline-flex; align-items: center; gap: 6px; font-size: 0.85rem; cursor: pointer; user-select: none; }
.sel-check input { width: auto; min-height: 0; margin: 0; }
.sel-th { padding: 10px 12px; font-size: 0.72rem; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.4px; white-space: nowrap; }
.sel-c-check { width: 36px; text-align: center; }
.sel-c-check input { width: 16px; height: 16px; min-height: 0; margin: 0; cursor: pointer; }
.sel-c-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sel-fila { cursor: pointer; }
.sel-fila.sin-stock { cursor: default; opacity: 0.5; }
.hist-tabla .sel-fila.elegida td { background: color-mix(in srgb, var(--highlight) 9%, var(--card)); }
.hist-tabla .sel-fila.excede td { background: color-mix(in srgb, var(--danger) 9%, var(--card)); }
/* `.hist-tabla input.sel-cant` y no `.sel-cant`: el input[type=number] global (width 100%) ganaba. */
.hist-tabla input.sel-cant { width: 96px; min-height: 34px; padding: 0 8px; font-size: 0.9rem; text-align: right; }
.sel-unidad { margin-left: 6px; color: var(--muted); font-size: 0.8rem; }
.sel-queda { color: var(--muted); }
.sel-aviso { font-size: 0.75rem; font-weight: 500; color: var(--danger); }
.sel-aviso:empty { display: none; }

/* ---------- Alias de un ítem (A1/A2) ---------- */
.alias-modal { display: flex; flex-direction: column; gap: 10px; min-width: min(520px, 86vw); }
.alias-ayuda, .alias-aviso, .alias-vacio { margin: 0; font-size: 0.85rem; color: var(--muted); }
.alias-aviso:empty { display: none; }
.alias-nuevo { display: flex; gap: 8px; }
.alias-nuevo .input { flex: 1; min-width: 0; }
.alias-titulo { margin: 8px 0 2px; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); }
.alias-lista { display: flex; flex-direction: column; gap: 6px; max-height: 50vh; overflow-y: auto; }
.alias-fila {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px;
}
.alias-fila-sugerido { border-style: dashed; }
.alias-texto { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.alias-acciones { display: flex; gap: 6px; }
.alias-estado { font-size: 0.78rem; color: var(--muted); }
.alias-chip { font-size: 0.72rem; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border); color: var(--muted); }
.alias-chip-manual { border-color: var(--highlight); color: var(--highlight); }
.alias-chip-ia { border-style: dashed; }
.alias-buscar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 4px; border-top: 1px solid var(--border); }
.alias-banner {
  position: fixed; right: 16px; bottom: 16px; z-index: 1200; max-width: min(420px, calc(100vw - 32px));
  display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  background: var(--panel, #182A42); color: var(--text, #fff);
  border: 1px solid var(--highlight); border-radius: 10px; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35); font-size: 0.9rem;
}
.alias-banner[hidden], .alias-banner button[hidden] { display: none; }
.alias-banner-x { background: transparent; border: 0; color: inherit; font-size: 1.2rem; cursor: pointer; line-height: 1; }