/* ==========================================================================
   modules/talento-humano.css - Modulo: Talento Humano (Fase 3.x)
   Ficha/estado trabajador, foto, crear-editar, flujo persona->contrato,
   tabla personal, hijos, ausentismos, evaluaciones, nuevo ingreso guiado.
   Fase 1: movido TAL CUAL (orden preservado => cascada identica).
   OJO Fase 3: contiene la seccion "3.9 tablas/scroll GLOBAL" (reglas no-TH)
   pendiente de reclasificar a components/tables.css. Ver colisiones globales.
   ========================================================================== */
/* ===== Ajustes Fase 3.1: estado completo y foto del trabajador ===== */
.status {
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
  flex-shrink: 0;
}
.profile-meta .status {
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}

.profile-header-with-photo {
  align-items: stretch;
}
.profile-main {
  flex: 1 1 auto;
  min-width: 0;
}
.profile-side {
  display: grid;
  grid-template-columns: 210px minmax(250px, 320px);
  gap: 16px;
  align-items: stretch;
}
.photo-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  padding: 14px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.photo-frame {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #eef5ff;
  border: 1px solid #dbe5f3;
}
.photo-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.photo-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #eef5ff 0%, #dbeafe 100%);
  color: var(--primary);
  font-weight: 900;
  font-size: 64px;
}
.photo-form {
  display: grid;
  gap: 8px;
}
.photo-form label {
  font-size: 12px;
  font-weight: 900;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.photo-form input[type="file"] {
  padding: 9px;
  font-size: 12px;
}
.photo-form button {
  width: 100%;
  padding: 10px 12px;
}
.photo-note {
  margin: 0;
  font-size: 12px;
  text-align: center;
}

@media (max-width: 1100px) {
  .profile-side {
    grid-template-columns: 190px minmax(230px, 1fr);
  }
}
@media (max-width: 900px) {
  .profile-side {
    width: 100%;
    grid-template-columns: 1fr;
  }
  .photo-card {
    max-width: 260px;
  }
}

/* ===== Ajuste Fase 3.2: foto integrada al contrato y sin carga en ficha ===== */
.profile-side {
  display: block;
  min-width: min(100%, 430px);
}
.current-contract.current-contract-with-photo {
  min-width: 410px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 16px;
  align-items: center;
  padding: 16px;
  background: linear-gradient(135deg, var(--primary) 0%, #071B3A 100%);
  overflow: hidden;
}
.current-contract-info {
  min-width: 0;
}
.current-contract-with-photo span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.current-contract-with-photo strong {
  font-size: 25px;
  line-height: 1.05;
  margin: 7px 0 6px;
  overflow-wrap: anywhere;
}
.current-contract-with-photo small {
  font-size: 12px;
  line-height: 1.3;
  opacity: .88;
}
.current-contract-with-photo .contract-state {
  display: inline-flex;
  width: fit-content;
  margin-top: 8px;
  padding: 5px 9px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, .14);
  color: #ffffff;
  font-weight: 900;
  letter-spacing: .03em;
  opacity: 1;
}
.current-contract-photo {
  width: 150px;
  height: 190px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: rgba(255, 255, 255, .14);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
}
.current-contract-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.photo-placeholder.compact {
  height: 100%;
  font-size: 62px;
  background: linear-gradient(135deg, rgba(255,255,255,.9) 0%, rgba(238,245,255,.92) 100%);
}

@media (max-width: 900px) {
  .profile-side { width: 100%; min-width: 0; }
  .current-contract.current-contract-with-photo {
    min-width: 0;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) 120px;
  }
  .current-contract-photo {
    width: 120px;
    height: 155px;
  }
}
@media (max-width: 520px) {
  .current-contract.current-contract-with-photo {
    grid-template-columns: 1fr;
  }
  .current-contract-photo {
    width: 100%;
    max-width: 210px;
    height: 230px;
    justify-self: center;
  }
}

/* ===== Fase 3.3: módulo crear / editar trabajador ===== */
.action-heading {
  align-items: center;
}
.personal-heading-side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}
.personal-counter {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.personal-counter span {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: #fff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.personal-counter strong {
  color: var(--primary);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}

.personal-workbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
}

.personal-workbar .search-panel {
  flex: 1 1 auto;
  /* El buscador (1fr) absorbe el espacio libre; los botones se ajustan a su texto
     (max-content) para que Buscar/Limpiar no se estiren. */
  grid-template-columns: minmax(220px, 1fr) 138px max-content max-content;
  margin: 0;
}

.personal-workbar .search-panel button,
.personal-workbar .search-panel .secondary-action {
  width: auto;
  min-width: 0;
  padding: 9px 11px;
  font-size: 13px;
}

.personal-workbar .personal-heading-side {
  flex: 0 0 auto;
  flex-wrap: nowrap;
}

@media (max-width: 1180px) {
  .personal-workbar {
    flex-wrap: wrap;
  }

  .personal-workbar .search-panel {
    flex-basis: 100%;
  }

  .personal-workbar .personal-heading-side {
    flex-wrap: wrap;
  }
}

@media (max-width: 680px) {
  .personal-workbar .search-panel {
    grid-template-columns: 1fr;
  }

  .personal-workbar .personal-heading-side {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}
.hero-actions,
.profile-actions,
.action-cell {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.secondary-action.light {
  background: rgba(255,255,255,.92);
}
.row-action.secondary {
  background: #fff;
  border: 1px solid var(--line);
}
.person-form {
  display: grid;
  gap: 16px;
}
.form-layout {
  display: grid;
  grid-template-columns: minmax(230px, 300px) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
}
.form-section-grid {
  align-items: start;
}
.form-photo-card,
.form-card {
  min-width: 0;
}
.form-photo-preview {
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: #eef5ff;
  border: 1px solid var(--line);
  margin-bottom: 14px;
}
.form-photo-preview img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.th-form-compact.form-grid { align-items: start; gap: var(--space-3); }
.th-form-compact .form-field input:not([type="checkbox"]),
.th-form-compact .form-field select,
.th-form-compact .form-field textarea { font-size: var(--text-sm); padding: var(--space-2); }
.th-form-compact .checkbox-field { display: block; }
.th-form-compact .checkbox-label { min-height: 0; padding: var(--space-2); }
.th-form-compact .checkbox-label span { font-size: var(--text-xs); text-transform: none; letter-spacing: normal; }
.th-vacacion-grid [data-field="contrato"],
.th-vacacion-grid [data-field="observaciones"],
.th-vacacion-grid [data-field="soporte"],
.th-vacacion-grid [data-field="soporte_url"] { grid-column: 1 / -1; }
.th-vacacion-grid [data-field="periodo_inicial"],
.th-vacacion-grid [data-field="fecha_inicio_vacaciones"] { grid-column: 1; }

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.form-field {
  min-width: 0;
}
.form-field.full {
  grid-column: 1 / -1;
}
.form-field label,
.checkbox-label span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 900;
}
.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  padding: 11px 12px;
  border-radius: var(--radius-md);
  border: 1px solid #cfd7e6;
  background: white;
  font-size: 14px;
}
.form-field textarea {
  resize: vertical;
  min-height: 105px;
}
.form-field input[type="file"] {
  padding: 9px;
  font-size: 13px;
}
.form-field small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.checkbox-field {
  display: flex;
  align-items: flex-end;
}
.checkbox-label {
  display: flex !important;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #f8fafc;
  width: 100%;
  min-height: 46px;
  cursor: pointer;
}
.checkbox-label input[type="checkbox"] {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin: 0;
  padding: 0;
  accent-color: var(--primary);
}
.checkbox-label span {
  display: inline;
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  line-height: 1.2;
  white-space: normal;
}
.field-error,
.form-errors {
  margin-top: 7px;
  padding: 9px 10px;
  border-radius: var(--radius-sm);
  background: #fff1f0;
  color: var(--danger);
  font-size: 13px;
  font-weight: 700;
}
.form-actions-sticky {
  position: sticky;
  bottom: 0;
  z-index: 8;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px;
  background: rgba(244, 247, 251, .92);
  backdrop-filter: blur(8px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}
@media (max-width: 980px) {
  .form-layout,
  .grid-2.form-section-grid {
    grid-template-columns: 1fr;
  }
  .form-photo-card {
    max-width: 360px;
  }
}
@media (max-width: 620px) {
  .form-grid {
    grid-template-columns: 1fr;
  }
  .form-actions-sticky {
    flex-direction: column-reverse;
  }
  .form-actions-sticky button,
  .form-actions-sticky a {
    width: 100%;
    text-align: center;
  }
}


/* ===== Fase 3.5: flujo persona -> contrato y alineación de botones ===== */
.profile-actions,
.hero-actions,
.action-cell,
.form-actions-sticky-flow,
.section-title-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.profile-actions-single {
  margin-top: 16px;
  flex-wrap: nowrap;
}
.action-cell {
  flex-wrap: nowrap;
  min-width: max-content;
}
.action-cell .row-action,
.section-title-actions .row-action,
.profile-actions .secondary-action,
.profile-actions .primary-action {
  white-space: nowrap;
  flex: 0 0 auto;
}
.form-actions-sticky-flow {
  flex-wrap: wrap;
}
button.secondary-action,
.button-secondary {
  background: #ffffff;
  color: var(--primary);
  border: 1px solid var(--line);
}
button.secondary-action:hover,
.button-secondary:hover {
  text-decoration: none;
}
.section-title-actions {
  justify-content: space-between;
  flex-wrap: wrap;
}
@media (max-width: 620px) {
  .action-cell {
    flex-wrap: wrap;
    min-width: 0;
  }
}


/* ===== Fase 3.6: tabla personal y panel contratos próximos ===== */
.nowrap,
.doc-cell,
td.nowrap,
th.nowrap {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}
.personal-table {
  min-width: 980px;
}
.personal-table .doc-cell {
  min-width: 126px;
  font-weight: 800;
  color: #26364f;
}
.personal-table th:first-child,
.personal-table td:first-child {
  width: 140px;
}
.table-wrap {
  overflow-x: auto;
}
.card .compact table th,
.card .compact table td {
  vertical-align: middle;
}

/* ===== Fase 3.9: tablas sin salto de línea y scroll horizontal global ===== */
.table-wrap,
.table-responsive,
.table-container {
  width: 100%;
  max-width: 100%;
  overflow-x: auto !important;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.table-wrap > table,
.table-responsive > table,
.table-container > table {
  min-width: 100%;
  width: max-content;
  border-collapse: separate;
  border-spacing: 0;
}

.table-wrap table th,
.table-wrap table td,
.table-responsive table th,
.table-responsive table td,
.table-container table th,
.table-container table td {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  vertical-align: middle;
}

.table-wrap table td.empty,
.table-responsive table td.empty,
.table-container table td.empty {
  white-space: normal !important;
}

.badge,
.status-badge,
.pill,
.estado-badge,
.row-action,
.primary-action,
.secondary-action,
.button-secondary,
button {
  white-space: nowrap !important;
}

/* Seguridad social: columnas más cómodas para EPS, AFP, ARL, CCF y fechas */
.seguridad-social-table {
  min-width: 1180px !important;
}

.seguridad-social-table th:nth-child(1),
.seguridad-social-table td:nth-child(1) {
  min-width: 110px;
}

.seguridad-social-table th:nth-child(2),
.seguridad-social-table td:nth-child(2),
.seguridad-social-table th:nth-child(3),
.seguridad-social-table td:nth-child(3),
.seguridad-social-table th:nth-child(4),
.seguridad-social-table td:nth-child(4),
.seguridad-social-table th:nth-child(5),
.seguridad-social-table td:nth-child(5),
.seguridad-social-table th:nth-child(6),
.seguridad-social-table td:nth-child(6) {
  min-width: 150px;
}

.seguridad-social-table th:nth-child(7),
.seguridad-social-table td:nth-child(7),
.seguridad-social-table th:nth-child(8),
.seguridad-social-table td:nth-child(8) {
  min-width: 120px;
}

.seguridad-social-table th:last-child,
.seguridad-social-table td:last-child {
  min-width: 110px;
}

/* Tablas amplias de la ficha del trabajador */
.section-card .table-wrap table {
  min-width: max-content;
}

/* Evita cortes feos en documento, estado y nombres de entidades */
.doc-cell,
.nowrap,
td.nowrap,
th.nowrap,
td[class*="estado"],
th[class*="estado"] {
  white-space: nowrap !important;
  word-break: keep-all !important;
}

/* Scrollbar discreto para que sea evidente que la tabla se puede mover */
.table-wrap::-webkit-scrollbar,
.table-responsive::-webkit-scrollbar,
.table-container::-webkit-scrollbar {
  height: 8px;
}

.table-wrap::-webkit-scrollbar-thumb,
.table-responsive::-webkit-scrollbar-thumb,
.table-container::-webkit-scrollbar-thumb {
  background: rgba(15, 32, 64, 0.28);
  border-radius: var(--radius-pill);
}

.table-wrap::-webkit-scrollbar-track,
.table-responsive::-webkit-scrollbar-track,
.table-container::-webkit-scrollbar-track {
  background: rgba(15, 32, 64, 0.06);
  border-radius: var(--radius-pill);
}


/* ===== Ajuste flujo contrato -> seguridad social y checkbox alineado ===== */
.form-actions-flow {
  gap: 10px;
  flex-wrap: wrap;
}
.secondary-button {
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--primary);
  box-shadow: none;
}
.secondary-button:hover {
  background: #f8fafc;
}
.seguridad-social-form .checkbox-field {
  align-self: center;
}

/* ===== Fase 3.10: nuevo ingreso guiado ===== */
.heading-actions,
.hero-actions,
.wizard-inline-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.wizard-progress {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) 44px minmax(170px, 1fr) 44px minmax(170px, 1fr) 44px minmax(190px, 1fr);
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
}

.wizard-step {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.wizard-step > span {
  width: 38px;
  height: 38px;
  border-radius: var(--radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  color: var(--primary);
  background: #eef2f7;
  border: 1px solid var(--line);
  flex: 0 0 auto;
}

.wizard-step strong,
.wizard-step small {
  display: block;
  white-space: nowrap;
}

.wizard-step small {
  color: var(--muted);
  margin-top: 2px;
}

.wizard-step.active > span,
.wizard-step.done > span {
  background: #FFC000;
  border-color: #FFC000;
  color: #0f2040;
}

.wizard-step.done strong {
  color: #0f766e;
}

.wizard-step.locked {
  opacity: .58;
}

.wizard-line {
  height: 3px;
  border-radius: var(--radius-pill);
  background: linear-gradient(90deg, #e2e8f0, #cbd5e1);
}

.wizard-section {
  margin-bottom: 18px;
  border-left: 5px solid transparent;
}

.wizard-section.current {
  border-left-color: #FFC000;
}

.wizard-section.completed {
  border-left-color: #22c55e;
}

.locked-section {
  opacity: .74;
}

.wizard-summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(140px, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.wizard-summary-grid > div {
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 12px;
  min-width: 0;
}

.wizard-summary-grid small {
  display: block;
  color: var(--muted);
  font-weight: 700;
  margin-bottom: 4px;
}

.wizard-summary-grid strong {
  display: block;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.wizard-form {
  margin-top: 14px;
}

.wizard-person-layout {
  align-items: stretch;
  gap: 18px;
}

.wizard-photo-card,
.inner-form-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 16px;
  box-shadow: none;
}

.wizard-fields-stack {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.wizard-subgrid {
  margin-top: 16px;
}

.wizard-section .form-actions-sticky {
  position: sticky;
  bottom: 12px;
  margin-top: 16px;
  z-index: 3;
}

@media (max-width: 980px) {
  .wizard-progress {
    grid-template-columns: 1fr;
  }
  .wizard-line {
    display: none;
  }
  .wizard-summary-grid {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
}

@media (max-width: 640px) {
  .wizard-summary-grid {
    grid-template-columns: 1fr;
  }
  .wizard-step strong,
  .wizard-step small {
    white-space: normal;
  }
}


.wizard-progress-4 {
  grid-template-columns: minmax(170px, 1fr) 44px minmax(170px, 1fr) 44px minmax(170px, 1fr) 44px minmax(190px, 1fr);
}

.wizard-child-table {
  margin-top: 12px;
  margin-bottom: 16px;
}

.hijo-form .form-actions-flow {
  flex-wrap: wrap;
}

.hijo-form .form-actions-flow button {
  white-space: nowrap;
}

/* ===== Ajuste Fase 3: gestión individual de hijos y tablas más anchas ===== */
.container {
  max-width: 1500px;
}

.table-wrap {
  overflow-x: auto;
  overflow-y: hidden;
}

table {
  min-width: 980px;
}

.table-wrap table th,
.table-wrap table td {
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  vertical-align: middle;
}

.personal-table {
  min-width: 1250px;
}

.personal-table th:nth-child(1),
.personal-table td:nth-child(1) {
  min-width: 145px;
}

.personal-table th:nth-child(2),
.personal-table td:nth-child(2) {
  min-width: 290px;
}

.personal-table th:nth-child(3),
.personal-table td:nth-child(3) {
  min-width: 150px;
}

.personal-table th:nth-child(4),
.personal-table td:nth-child(4) {
  min-width: 290px;
}

.personal-table th:nth-child(5),
.personal-table td:nth-child(5) {
  min-width: 115px;
}

.personal-table th:nth-child(6),
.personal-table td:nth-child(6) {
  min-width: 175px;
}

.seguridad-social-table {
  min-width: 1220px;
}

.hijos-table {
  min-width: 860px;
}

/* Tablas compactas con scroll interno para listados grandes. */
.table-wrap,
.reg-table-wrap,
.report-table-wrap,
.persona-table-wrap,
.eco-table-wrap,
.nov-table-wrap,
.tabla-cargue-wrap {
  max-height: min(62vh, 620px);
  overflow: auto !important;
  scrollbar-gutter: stable;
}

.table-wrap table th,
.reg-table th,
.report-table th,
.persona-table th,
.eco-table th,
.nov-table-wrap th,
.tabla-cargue th {
  position: sticky;
  top: 0;
  z-index: 3;
}

.table-wrap table th,
.table-wrap table td,
.reg-table th,
.reg-table td,
.report-table th,
.report-table td,
.persona-table th,
.persona-table td,
.eco-table th,
.eco-table td,
.nov-table-wrap th,
.nov-table-wrap td,
.tabla-cargue th,
.tabla-cargue td {
  padding: .38rem .5rem;
  font-size: .78rem;
  line-height: 1.22;
}

.hijos-table th:nth-child(1),
.hijos-table td:nth-child(1) {
  min-width: 260px;
}

.hijos-table th:nth-child(6),
.hijos-table td:nth-child(6) {
  min-width: 150px;
}

.secondary-button {
  background: #ffffff;
  color: var(--primary);
  border: 1px solid var(--line);
}

.section-title-actions {
  flex-wrap: wrap;
}

/* Ajustes fase Beneficios */
.wizard-progress-5 {
  grid-template-columns: minmax(150px, 1fr) 34px minmax(140px, 1fr) 34px minmax(150px, 1fr) 34px minmax(170px, 1fr) 34px minmax(150px, 1fr);
}

.wizard-benefit-table {
  margin-top: 12px;
  margin-bottom: 16px;
}

.beneficio-form .form-actions-flow {
  flex-wrap: wrap;
}

.beneficio-form .form-actions-flow button,
.beneficio-form .form-actions-flow a {
  white-space: nowrap;
}

.beneficios-table th:nth-child(1),
.beneficios-table td:nth-child(1) {
  min-width: 110px;
}

.beneficios-table th:nth-child(2),
.beneficios-table td:nth-child(2) {
  min-width: 220px;
}

.beneficios-table th:nth-child(3),
.beneficios-table td:nth-child(3) {
  min-width: 120px;
}

.beneficios-table th:nth-child(4),
.beneficios-table td:nth-child(4) {
  min-width: 120px;
}

@media (max-width: 1100px) {
  .wizard-progress-5 {
    grid-template-columns: 1fr;
  }
}


.vacaciones-table th,
.vacaciones-table td {
  min-width: 120px;
}

.vacaciones-table th:nth-child(2),
.vacaciones-table td:nth-child(2) {
  min-width: 210px;
}


/* ===== Ajustes Fase 3: ausentismos y distribución de historial contractual ===== */
.contract-history-table {
  width: 100% !important;
  min-width: 1220px !important;
  table-layout: auto;
}

.contract-history-table th,
.contract-history-table td {
  white-space: nowrap !important;
}

.contract-history-table th:nth-child(1),
.contract-history-table td:nth-child(1) { min-width: 115px; }
.contract-history-table th:nth-child(2),
.contract-history-table td:nth-child(2) { min-width: 105px; }
.contract-history-table th:nth-child(3),
.contract-history-table td:nth-child(3) { min-width: 160px; }
.contract-history-table th:nth-child(4),
.contract-history-table td:nth-child(4) { min-width: 230px; }
.contract-history-table th:nth-child(5),
.contract-history-table td:nth-child(5) { min-width: 170px; }
.contract-history-table th:nth-child(6),
.contract-history-table td:nth-child(6) { min-width: 170px; }
.contract-history-table th:nth-child(7),
.contract-history-table td:nth-child(7),
.contract-history-table th:nth-child(8),
.contract-history-table td:nth-child(8) { min-width: 120px; }
.contract-history-table th:last-child,
.contract-history-table td:last-child { min-width: 105px; }

.ausentismos-table {
  min-width: 1420px !important;
}

.ausentismos-table th,
.ausentismos-table td {
  white-space: nowrap !important;
}

.ausentismos-table th:nth-child(1),
.ausentismos-table td:nth-child(1) { min-width: 115px; }
.ausentismos-table th:nth-child(2),
.ausentismos-table td:nth-child(2),
.ausentismos-table th:nth-child(3),
.ausentismos-table td:nth-child(3) { min-width: 110px; }
.ausentismos-table th:nth-child(6),
.ausentismos-table td:nth-child(6) { min-width: 220px; }
.ausentismos-table th:nth-child(7),
.ausentismos-table td:nth-child(7) { min-width: 180px; }
.ausentismos-table th:nth-child(8),
.ausentismos-table td:nth-child(8) { min-width: 130px; }
.ausentismos-table th:nth-child(9),
.ausentismos-table td:nth-child(9) { min-width: 160px; }

.ausentismo-form .form-actions-flow {
  flex-wrap: wrap;
}

.ausentismo-form .form-actions-flow button,
.ausentismo-form .form-actions-flow a {
  white-space: nowrap;
}

/* ===== Ajustes Fase 3: formulario de evaluaciones ===== */
.evaluacion-form .form-grid .form-field > label {
  min-height: 2.4rem;
  display: flex;
  align-items: flex-end;
  line-height: 1.15;
}

.evaluacion-form .form-grid .form-field select.form-control,
.evaluacion-form .form-grid .form-field input.form-control {
  min-height: 42px;
}

.evaluacion-form .form-field small {
  line-height: 1.25;
}


/* Control visual para soportes: archivo local + enlace externo */
.support-links, td .row-action + .row-action {
  margin-left: 0.35rem;
}
.form-card input[type="url"] {
  min-width: 0;
}

/* Reportes */
.report-header {
  align-items: flex-start;
}

.report-filter-card {
  margin-bottom: 18px;
}

.report-filters {
  grid-template-columns: minmax(190px, 1fr) minmax(260px, 1.6fr) repeat(2, minmax(160px, .8fr)) minmax(190px, .9fr) auto;
  align-items: end;
}

.report-filters label {
  min-width: 0;
}

.filter-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
}

.report-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.report-header-actions {
  width: 100%;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.report-summary-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
}

.report-summary-inline .compact-stat {
  min-width: 122px;
  min-height: 0;
  padding: 9px 13px;
}

.report-summary-inline .compact-stat span {
  margin-bottom: 3px;
  font-size: 11px;
}

.report-summary-inline .compact-stat strong {
  font-size: 22px;
}

.compact-stat {
  min-height: 92px;
}

.report-result-card {
  /* La tabla vive contenida dentro de la tarjeta (no se sale de los bordes). */
  overflow: hidden;
}

.report-table-scroll {
  width: 100%;
  /* La tabla se desplaza DENTRO de esta caja (no alarga la página infinito aunque
     tenga muchas filas). El scroll horizontal, si hace falta, también queda contenido
     aquí sin romper los bordes de la tarjeta. */
  max-height: 70vh;
  overflow: auto;
}

/* Celdas en una sola línea (bordes limpios, sin fusionarse). */
.report-table th,
.report-table td {
  white-space: nowrap;
}

/* Los TÍTULOS de columna sí pueden bajar a 2 líneas: así un nombre largo no
   estira la columna a lo ancho (ej. una fecha no ocupa el espacio de 4 columnas). */
.data-table.report-table thead th,
.data-table.report-table thead th .dt-label {
  white-space: normal;
}

.report-table {
  font-size: .82rem;
}

/* Encabezado de columnas (Documento, Trabajador, Cargo...) fijo mientras se hace
   scroll DENTRO de la tabla: siempre se ve de qué columna es cada dato.
   Se usa doble clase (.data-table.report-table) para GANARLE al
   `.data-table thead th { position: relative }` de components/tables.css, que
   carga después y si no, lo pisa. */
.data-table.report-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #e3e9f8;
}

.badge.neutral {
  background: #eef2f7;
  color: #263445;
  border: 1px solid #dbe3ec;
}

.empty-state {
  padding: 22px;
  border: 1px dashed #cbd5e1;
  border-radius: var(--radius-md);
  background: #f8fafc;
}

@media (max-width: 1100px) {
  .report-filters {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .filter-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .report-filters {
    grid-template-columns: 1fr;
  }
}

/* Componentes comunes usados por reportes */
.page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  background: linear-gradient(135deg, #ffffff 0%, #eef5ff 100%);
  border: 1px solid var(--line);
  border-radius: var(--radius-2xl);
  padding: 26px;
  box-shadow: var(--shadow);
  margin-bottom: 20px;
}

/* Encabezados operativos: mantienen el contexto sin desplazar el trabajo. */
.hero,
.page-heading,
.profile-header,
.page-header {
  min-height: 0;
  padding: 14px 18px;
  border-radius: var(--radius-lg);
  margin-bottom: 14px;
}

.hero h1,
.page-heading h1,
.profile-header h1,
.page-header h1 {
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.15;
}

.hero p,
.page-heading p,
.profile-header p,
.page-header p {
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.35;
}

.actions-row {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: var(--radius-md);
  padding: 11px 16px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
}

.btn:hover { text-decoration: none; }
.btn.primary { background: var(--primary); color: #ffffff; }
.btn.secondary { background: #ffffff; color: var(--primary); border: 1px solid var(--line); }

.muted { color: var(--muted); }

.section-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 14px;
}

.stat-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  padding: 18px;
  box-shadow: var(--shadow);
}

.stat-card span {
  display: block;
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 8px;
}

.stat-card strong {
  display: block;
  font-size: 28px;
  color: var(--primary);
}

.filters-grid {
  display: grid;
  gap: 12px;
}

.filters-grid label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.filters-grid input,
.filters-grid select {
  margin-top: 6px;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
}

@media (max-width: 900px) {
  .page-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .actions-row {
    justify-content: flex-start;
  }
}


/* Auditoría */
.audit-filters {
  grid-template-columns: minmax(260px, 1.5fr) minmax(180px, 1fr) minmax(160px, 1fr) minmax(150px, .8fr) minmax(150px, .8fr) auto;
  align-items: end;
}
.audit-table th,
.audit-table td {
  white-space: nowrap;
}
.audit-table .audit-description {
  min-width: 420px;
  max-width: 780px;
  white-space: normal;
  overflow-wrap: anywhere;
}
.status-pill.neutral {
  background: #eef2f7;
  color: #243447;
  border: 1px solid #d9e2ef;
}
@media (max-width: 1000px) {
  .audit-filters {
    grid-template-columns: 1fr;
  }
}


/* Usuarios y permisos */
.usuarios-table th,
.usuarios-table td {
  white-space: nowrap;
  vertical-align: middle;
}

.usuarios-actions-cell {
  width: 92px;
}

.usuarios-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.usuarios-actions form {
  display: inline-flex;
  margin: 0;
}

.usuario-icon-action {
  width: 34px;
  height: 34px;
  border-radius: var(--radius-sm);
  border: 1px solid #d8e2f0;
  background: #f3f7fd;
  color: var(--primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  text-decoration: none;
}

.usuario-icon-action svg {
  width: 17px;
  height: 17px;
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.usuario-icon-action:hover {
  background: #e8f0fb;
  border-color: #b9c9df;
}

.usuario-delete-action {
  color: #a11d33;
  background: #fff1f3;
  border-color: #ffd6dc;
}

.usuario-delete-action:hover {
  background: #ffe3e8;
  border-color: #f8a9b7;
}

.mini-tag {
  display: inline-flex;
  align-items: center;
  padding: 5px 9px;
  border-radius: var(--radius-pill);
  background: #eef5ff;
  border: 1px solid var(--line);
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
  margin: 2px 4px 2px 0;
}

.roles-permission-matrix,
.role-assignment-matrix {
  display: grid;
  grid-template-columns: minmax(150px, 1.1fr) repeat(5, minmax(86px, .7fr));
  align-items: stretch;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: #fff;
}

.role-matrix-head,
.role-assignment-head {
  padding: 9px 10px;
  background: #f2f6fb;
  border-bottom: 1px solid var(--line);
  color: var(--primary);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.15;
}

.role-process-row,
.role-assignment-process,
.role-level-cell,
.role-assignment-cell {
  min-height: 40px;
  border-bottom: 1px solid #edf1f7;
  padding: 7px 10px;
  display: flex;
  align-items: center;
}

.role-process-row,
.role-assignment-process {
  background: #fbfdff;
}

.role-process-row strong,
.role-assignment-process strong {
  font-size: 12px;
  line-height: 1.2;
}

.role-level-cell,
.role-assignment-cell {
  justify-content: center;
  border-left: 1px solid #edf1f7;
}

.role-level-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: var(--radius-pill);
  background: #eef5ff;
  color: var(--primary);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.role-level-chip.disabled {
  opacity: .35;
}

.role-assignment-cell {
  gap: 6px;
  cursor: pointer;
  font-size: 11px;
  font-weight: 850;
  color: var(--primary);
}

.role-assignment-cell input {
  width: 16px;
  height: 16px;
  margin: 0;
}

@media (max-width: 900px) {
  .roles-permission-matrix,
  .role-assignment-matrix {
    grid-template-columns: minmax(130px, 1fr) repeat(5, minmax(74px, .7fr));
    overflow-x: auto;
  }
}

@media (max-width: 620px) {
  .roles-permission-matrix,
  .role-assignment-matrix {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}

.usuario-form-card .form-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.permissions-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 18px 0;
  padding: 14px;
  border-radius: var(--radius-lg);
  background: #f7faff;
  border: 1px solid var(--line);
}

.nice-check-row {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  line-height: 1;
  font-weight: 800;
}

.nice-check-row input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.roles-selector {
  margin-top: 18px;
  border-top: 1px solid var(--line);
  padding-top: 18px;
}

.roles-category-stack {
  display: grid;
  gap: 16px;
  margin-top: 14px;
}

.roles-category {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 14px;
  background: #f8fbff;
}

.roles-category h3 {
  margin: 0;
  font-size: 15px;
  color: var(--primary);
}

.roles-checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.role-check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  background: #ffffff;
  font-weight: 800;
}

.role-check input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.error-card {
  border-left: 5px solid #c0392b;
}

.error-card ul {
  margin-bottom: 0;
}