/* ==========================================================================
   COLUMNAS QUE SE ENSANCHAN ARRASTRANDO
   Estilos del agarre que agrega js/modules/columnas-ajustables.js.
   Se carga siempre desde index.html porque lo comparten varios módulos
   (Arriendos, Gasto Común).
   ========================================================================== */

/* ---------- Columnas que se ensanchan arrastrando ----------
   El ancho lo manda el th, así que la tabla pasa a table-layout: fixed
   (lo activa el JS después de medir los anchos que el navegador calculó). */
table.col-ajustable { table-layout: fixed; }
table.col-ajustable th { position: relative; }

/* Zona de agarre sobre el borde derecho de cada encabezado */
.col-agarre {
  position: absolute;
  top: 0;
  right: -3px;
  width: 7px;
  height: 100%;
  cursor: col-resize;
  user-select: none;
  touch-action: none;
  z-index: 11;
}
.col-agarre::after {
  content: '';
  position: absolute;
  top: 18%;
  bottom: 18%;
  left: 3px;
  width: 1px;
  background: #cbd5e1;
  transition: background 0.15s, width 0.15s, top 0.15s, bottom 0.15s;
}
.col-agarre:hover::after,
.col-agarre.ajustando::after {
  background: #1e40af;
  width: 2px;
  top: 0;
  bottom: 0;
}
/* Mientras se arrastra: el cursor no cambia al pasar sobre el resto */
body.ajustando-columna,
body.ajustando-columna * { cursor: col-resize !important; user-select: none !important; }

/* Los títulos van en una línea; el contenido de las celdas se ajusta al ancho
   de su columna, igual que antes, para no esconder montos ni nombres. */
table.col-ajustable th {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
table.col-ajustable td {
  overflow-wrap: anywhere;
  word-break: break-word;
}
/* Los controles dentro de las celdas se adaptan a su columna */
table.col-ajustable td input[type="number"],
table.col-ajustable td input[type="text"],
table.col-ajustable td select { max-width: 100%; box-sizing: border-box; }

/* Botón para volver a los anchos originales */
.col-restablecer {
  background: none;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  color: #6b7280;
  cursor: pointer;
  font-size: 12px;
  padding: 6px 12px;
  white-space: nowrap;
}
.col-restablecer:hover { background: #f3f4f6; color: #374151; border-color: #9ca3af; }