.panel-heading {
  align-items: center;
  display: flex;
  flex-flow: row wrap;
  gap: .75rem;
  justify-content: space-between;
  margin: 1.25rem 0 1rem;
}

/* Estructura visual compartida del panel administrativo */
.ui-page-header {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  margin: 1.5rem 0 1rem;
}

.ui-page-title {
  color: #202938;
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
}

.ui-page-description {
  color: #667085;
  margin: .35rem 0 0;
}

.ui-page-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.ui-content-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(16, 24, 40, .06);
  margin-bottom: 1.5rem;
  overflow: hidden;
}

.ui-content-card-header {
  border-bottom: 1px solid #eef2f7;
  padding: 14px 16px;
}

.ui-content-card-header h2,
.ui-filter-card-title {
  color: #202938;
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
}

.ui-content-card-body {
  padding: 1rem;
}

.ui-form-card {
  max-width: 960px;
}

/* Formularios heredados: elimina los anchos rígidos sin alterar sus campos. */
.container > .card {
  max-width: 960px !important;
  width: 100% !important;
}

.container > .card > .card-header {
  background: #ffffff;
  border-bottom: 1px solid #eef2f7;
  color: #202938;
  font-weight: 700;
}

.panel-heading h1,
.panel-heading h2,
.panel-heading h3,
.panel-heading h4,
.panel-heading h5 {
  margin: 0;
}

.links-section {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.emp-profile {
  background: #fff;
  border-radius: .5rem;
  margin-bottom: 3%;
  margin-top: 3%;
  padding: 3%;
}

.toggleable-content {
  display: none;
}

.toggleable-content.is-active {
  animation: fadeInDown;
  animation-duration: .5s;
  display: block;
  height: auto;
}

/* Tarjetas de filtros reutilizables */
.ui-filter-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(16, 24, 40, .06);
}

.ui-filter-card-header {
  align-items: center;
  border-bottom: 1px solid #eef2f7;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 14px 16px;
}

.ui-filter-card-header h5 {
  margin: 0;
}

.ui-filter-card-body {
  padding: 1rem;
}

.ui-filter-card .form-control {
  min-height: 40px;
}

.ui-filter-card .form-group:last-child {
  margin-bottom: 0;
}

/* Navegación y tarjetas compartidas por las páginas del módulo de Reportes. */
.reports-page-heading { margin: 1.5rem 0 1rem; }
.reports-page-heading h3 { margin-bottom: .25rem; }
.reports-page-heading p { margin: 0; color: #64748b; }
.reports-hub { background: #f6f8fb; border-radius: 14px; margin: 1.25rem 0 1.5rem; padding: 16px; }
.reports-hub .reports-categories { display: flex; gap: 8px; margin-bottom: 12px; overflow-x: auto; padding: 4px 0 12px; }
.reports-hub .reports-category-tab { background: #fff; border: 1px solid #dbe3ee; border-radius: 999px; color: #334155; font-size: 14px; font-weight: 700; padding: 8px 14px; text-decoration: none; white-space: nowrap; }
.reports-hub .reports-category-tab:hover, .reports-hub .reports-category-tab.is-active { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
.reports-hub .reports-catalog { background: #fff; border: 1px solid #e5e7eb; border-radius: 14px; box-shadow: 0 6px 20px rgba(16, 24, 40, .04); padding: 16px; }
.reports-hub .reports-catalog-heading h2 { color: #0f172a; font-size: 17px; margin: 0 0 4px; }
.reports-hub .reports-catalog-heading p { color: #64748b; font-size: 14px; margin: 0 0 14px; }
.reports-hub .reports-catalog-list { display: flex; flex-wrap: wrap; gap: 8px; }
.reports-hub .reports-catalog-item { align-items: center; background: #fff; border: 1px solid #e2e8f0; border-radius: 9px; color: #0f172a; display: inline-flex; font-size: 14px; gap: 10px; padding: 9px 12px; text-decoration: none; }
.reports-hub .reports-catalog-item:hover, .reports-hub .reports-catalog-item.is-active { background: #eff6ff; border-color: #cbd5e1; color: #1d4ed8; }
.reports-metric-card { border: 1px solid #e5e7eb; border-radius: 14px; box-shadow: 0 6px 20px rgba(16, 24, 40, .06); }

.ui-filter-card #advanced-search-section {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin-bottom: 0;
  padding: 1rem;
}

.ui-filter-card .row.justify-content-end {
  margin-left: 0;
  margin-right: 0;
}

@media (max-width: 575.98px) {
  .ui-filter-card-header {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Filtros */
#advanced-search-section {
  background: #f8fafc;
  border: 1px solid #d7dee8;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
  margin-bottom: 1rem;
}

#advanced-search-section label {
  color: #425065;
  font-weight: 600;
  margin-bottom: .35rem;
}

/* Tablas */
.table-responsive {
  background: #ffffff;
  border: 1px solid #d7dee8;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .06);
}

.table-responsive .table {
  margin-bottom: 0;
}

.table thead.thead-dark th {
  background-color: #2f3847;
  border-color: #2f3847;
  color: #ffffff;
  font-weight: 600;
  letter-spacing: .01em;
}

.table td,
.table th {
  vertical-align: middle;
}

.table tfoot th {
  background: #f8fafc;
  border-top: 1px solid #d7dee8;
}

.table-responsive .pagination {
  margin: 1rem;
}

.table-hover tbody tr:hover {
  background-color: #f7f9fc;
}

/* Acciones de formularios */
.ui-form-actions,
.text-right.my-2 {
  align-items: center;
  border-top: 1px solid #e6ebf2;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: flex-end;
  margin-top: 1rem !important;
  padding-top: 1rem;
}

.ui-form-actions .btn,
.text-right.my-2 .btn {
  min-width: 136px;
}

@media (max-width: 767.98px) {
  .panel-heading {
    align-items: stretch;
  }

  .ui-form-actions .btn,
  .text-right.my-2 .btn {
    width: 100%;
  }
}
.list-page-container > .table-responsive {
    width: calc(100vw - 30px);
    margin-left: calc(50% - 50vw + 15px);
    margin-right: calc(50% - 50vw + 15px);
}

@media (max-width: 767.98px) {
    .list-page-container > .table-responsive {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}