/* Bridge between the Loan Office theme and the existing Bootstrap modules. */
.breadcrumb {
  margin: 0;
}
.menu-scroll {
  flex: 1;
  min-height: 0;
}
.app-sidebar nav {
  overflow: visible;
}
.profile-button {
  text-decoration: none;
}
.card-body {
  padding: 18px;
}
.card-title {
  font-size: 17px;
  color: var(--ink);
}
.btn-primary {
  --bs-btn-bg: var(--green);
  --bs-btn-border-color: var(--green);
  --bs-btn-hover-bg: var(--green-dark);
  --bs-btn-hover-border-color: var(--green-dark);
}
.btn-outline-primary {
  --bs-btn-color: var(--green);
  --bs-btn-border-color: var(--green);
  --bs-btn-hover-bg: var(--green);
  --bs-btn-hover-border-color: var(--green);
}
.text-primary {
  color: var(--green) !important;
}
.form-control,
.form-select {
  font-size: 13px;
  border-color: var(--line);
  border-radius: 8px;
}
.modal-content {
  border-radius: 16px;
}
.modal label {
  display: block;
}
.modal input[type="checkbox"],
.modal input[type="radio"] {
  width: auto;
}
.table > :not(caption) > * > * {
  padding: 2px 6px !important;
  vertical-align: middle;
  font-size: 12px;
}
.table {
  color: var(--ink);
}
.card {
  overflow: visible;
}
.table-responsive,
.dataTables_wrapper {
  overflow-x: auto;
}
.nav-tabs .nav-link.active {
  color: var(--green);
}
.text-right {
  text-align: right;
}
.status-label {
  font-size: 11px;
  white-space: nowrap;
  color: var(--green);
  background: var(--mint);
  border-radius: 5px;
  padding: 2px 6px;
}
.status-danger {
  color: var(--danger);
  background: #fbece9;
}
.status-warning {
  color: #946526;
  background: #fcf0df;
}
#divLoader {
  position: fixed;
  inset: 0 0 auto;
  height: 3px;
  background: var(--green);
  z-index: 2000;
  animation: pulse 1s infinite;
}
@keyframes pulse {
  50% {
    opacity: 0.3;
  }
}
.dashboard-links {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 18px;
}
.dashboard-links .metric {
  margin: 0;
  display: block;
  transition: transform 0.15s;
}
.dashboard-links .metric:hover {
  transform: translateY(-3px);
}
.dashboard-links h2 {
  font-size: 19px;
  margin: 16px 0 8px;
}
.dashboard-links p {
  font-size: 12px;
  color: var(--muted);
}
.dashboard-links i {
  font-size: 24px;
  color: var(--green);
}
.setup-note {
  padding: 16px 20px;
  background: #fcf0df;
  border: 1px solid #eddbbe;
  border-radius: 12px;
  margin-bottom: 22px;
}
.app-sidebar {
  z-index: 1030;
}
.sidebar-scrim {
  z-index: 1020 !important;
}
#w_alert {
  position: fixed;
  top: 18px;
  right: 18px;
  max-width: min(420px, calc(100vw - 36px));
  z-index: 2000;
}
.btn.rounded-pill {
  border-radius: 8px !important;
}
.app-sidebar a:hover {
  color: inherit;
}
/* Estado de revisión: pendiente en naranja; verificado en blanco. */
.app-sidebar nav a[data-page][data-review="pending"] {
  color: #ffb36b;
}
.app-sidebar nav a[data-page][data-review="ready"] {
  color: var(--sidebar-text);
}
.app-sidebar nav a[data-page][data-review].active {
  background: var(--theme-accent);
  color: var(--accent-text);
  box-shadow: inset 3px 0 currentColor;
}
.app-sidebar nav a[data-page][data-review]:hover {
  background: color-mix(in srgb,var(--sidebar-text) 12%,transparent);
}
/* Detalles: cabecera de identidad, secciones y pares etiqueta/valor reutilizables. */
.account-link {
  display: inline-flex;
  border-radius: 50%;
  flex-shrink: 0;
}
.account-link img,
.profile-button img {
  object-fit: cover;
  border-radius: 50%;
}
.account-link:focus-visible {
  outline: 3px solid #77bd9c;
}
.profile-layout {
  display: grid;
  grid-template-columns: minmax(230px, 1fr) minmax(0, 2fr);
  gap: 22px;
  align-items: start;
}
.profile-summary .card-body {
  padding: 28px 20px;
}
.profile-photo {
  object-fit: cover;
  border-radius: 50%;
  background: var(--mint);
  border: 4px solid var(--mint);
}
.field-help {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
}
.form-feedback {
  font-size: 12px;
}
.detail-summary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 20px;
}
.detail-avatar {
  border-radius: 50%;
  object-fit: cover;
  background: var(--mint);
  flex-shrink: 0;
}
.detail-identity {
  min-width: 0;
  flex: 1;
}
.detail-identity h3 {
  font-size: 18px;
  margin: 0 0 4px;
  overflow-wrap: anywhere;
}
.detail-identity > span {
  font-size: 12px;
  color: var(--muted);
}
.detail-summary > .btn {
  flex-shrink: 0;
}
.detail-section {
  border-top: 1px solid var(--line);
  padding: 18px 0 0;
  margin-top: 4px;
}
.detail-section > h3 {
  font-size: 12px;
  color: var(--green);
  font-weight: 600;
  margin: 0 0 14px;
}
.detail-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 20px;
  margin-bottom: 18px;
}
.detail-fields dt {
  font-size: 11px;
  color: var(--muted);
  font-weight: 400;
}
.detail-fields dd {
  margin: 3px 0 0;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.detail-field-full {
  grid-column: 1/-1;
}
#usersModule .dataTables_wrapper {
  overflow: visible;
}
#usersTable {
  width: 100% !important;
}
#usersTable .user-actions-desktop {
  display: flex;
  gap: 4px;
  justify-content: center;
}
#usersTable .user-actions-desktop .btn,
#usersTable .user-menu-toggle {
  padding: 2px 6px;
  font-size: 12px;
  line-height: 1.35;
  min-height: 22px;
}
#usersTable .user-actions-mobile {
  display: none;
}
#usersTable .dropdown-menu {
  min-width: 160px;
  z-index: 1050;
  border-color: var(--line);
  box-shadow: 0 8px 28px #103f3620;
}
#usersTable .dropdown-item {
  font-size: 13px;
  border-radius: 0 !important;
  padding: 9px 14px;
  width: 100%;
  text-align: left;
}
#usersTable .dropdown-item:active {
  background: var(--mint);
  color: var(--green);
}
#usersTable th:last-child {
  min-width: 125px;
}
@media (max-width: 767px) {
  .profile-layout {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .profile-summary .card-body {
    padding: 20px;
  }
  .detail-summary {
    gap: 10px;
  }
  .detail-avatar {
    width: 48px;
    height: 48px;
  }
  .detail-identity h3 {
    font-size: 16px;
  }
  #usersModule > .card-body {
    padding: 10px;
  }
  #usersTable {
    table-layout: fixed;
  }
  #usersTable .user-desktop {
    display: none !important;
  }
  #usersTable .user-actions-desktop {
    display: none;
  }
  #usersTable .user-actions-mobile {
    display: block;
  }
  #usersTable th:nth-child(2) {
    width: 24% !important;
  }
  #usersTable th:nth-child(3) {
    width: 34% !important;
  }
  #usersTable th:nth-child(4) {
    width: 28% !important;
  }
  #usersTable th:last-child {
    width: 14% !important;
    min-width: 0;
    font-size: 10px;
  }
  #usersTable td {
    overflow-wrap: anywhere;
    white-space: normal;
    font-size: 11px;
  }
  #usersTable td:last-child {
    overflow: visible;
  }
  #usersModule .dataTables_filter input {
    max-width: 150px;
  }
  #usersModule .dataTables_info {
    white-space: normal;
    font-size: 11px;
  }
  #usersModule .pagination {
    flex-wrap: wrap;
    font-size: 12px;
  }
}
/* Controles de DataTables: una fila y paginación compacta con el tema de la oficina. */
div.dataTables_wrapper > .row:first-child {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 10px;
}
div.dataTables_wrapper > .row:first-child > [class*="col-"] {
  width: auto;
  max-width: none;
  padding: 0;
  min-width: 0;
}
div.dataTables_wrapper div.dataTables_length {
  text-align: left;
}
div.dataTables_wrapper div.dataTables_filter {
  text-align: right;
  display: flex;
  justify-content: flex-end;
}
div.dataTables_wrapper div.dataTables_length label,
div.dataTables_wrapper div.dataTables_filter label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 12px;
  white-space: nowrap;
}
div.dataTables_wrapper div.dataTables_filter input {
  margin-left: 0;
  width: 180px;
  max-width: 100%;
  height: 29px;
  min-height: 29px;
  padding: 3px 8px;
  font-size: 12px;
}
div.dataTables_wrapper div.dataTables_length select {
  width: 62px;
  height: 29px;
  min-height: 29px;
  margin: 0;
  padding: 3px 20px 3px 8px;
  font-size: 12px;
}
div.dataTables_wrapper .pagination {
  --bs-pagination-color: var(--green);
  --bs-pagination-hover-color: var(--green-dark);
  --bs-pagination-hover-bg: var(--mint);
  --bs-pagination-focus-color: var(--green-dark);
  --bs-pagination-focus-bg: var(--mint);
  --bs-pagination-focus-box-shadow: 0 0 0 2px #16776426;
  --bs-pagination-active-bg: var(--green);
  --bs-pagination-active-border-color: var(--green);
  --bs-pagination-border-color: var(--line);
  gap: 3px;
}
div.dataTables_wrapper .pagination .page-link {
  padding: 3px 8px;
  min-width: 26px;
  min-height: 26px;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  border-radius: 6px;
  margin: 0;
  color: var(--green);
}
div.dataTables_wrapper .pagination .page-item.active .page-link {
  color: #fff;
  background: var(--green);
  border-color: var(--green);
}
div.dataTables_wrapper .pagination .page-item.disabled .page-link {
  color: var(--muted);
  background: var(--paper);
  border-color: var(--line);
}
@media (max-width: 767px) {
  div.dataTables_wrapper > .row:first-child {
    gap: 8px;
  }
  div.dataTables_wrapper div.dataTables_length label,
  div.dataTables_wrapper div.dataTables_filter label {
    font-size: 0;
    gap: 0;
  }
  div.dataTables_wrapper div.dataTables_filter label {
    width: min(100%, 180px);
  }
  div.dataTables_wrapper div.dataTables_filter input {
    width: 100%;
    max-width: none !important;
  }
  div.dataTables_wrapper .pagination .page-link {
    padding: 3px 7px;
    font-size: 11px;
  }
}
div.dataTables_wrapper div.dataTables_length label,
div.dataTables_wrapper div.dataTables_filter label {
  height: 29px;
  line-height: 1;
  margin: 0 !important;
}
div.dataTables_wrapper div.dataTables_length select,
div.dataTables_wrapper div.dataTables_filter input {
  margin: 0 !important;
}
/* Clientes reutiliza la disposición compacta y los detalles de Usuarios. */
.compact-client-list .dataTables_wrapper {
  overflow: visible;
}
#clientsTable {
  width: 100% !important;
}
#clientsTable .client-actions-desktop {
  display: flex;
  gap: 4px;
  justify-content: center;
}
#clientsTable .client-actions-mobile {
  display: none;
}
#clientsTable .client-actions .btn {
  padding: 2px 6px;
  font-size: 12px;
  line-height: 1.35;
  min-height: 22px;
}
#clientsTable .dropdown-menu {
  min-width: 160px;
  z-index: 1050;
  border-color: var(--line);
  box-shadow: 0 8px 28px #103f3620;
}
#clientsTable .dropdown-item {
  font-size: 13px;
  border-radius: 0 !important;
  padding: 9px 14px;
  width: 100%;
  text-align: left;
}
#clientsTable .dropdown-item:active {
  background: var(--mint);
  color: var(--green);
}
.detail-tabs .nav-link {
  font-size: 13px;
  color: var(--green);
}
.detail-related-table {
  min-width: 480px;
}
.related-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
  font-size: 11px;
  color: var(--muted);
}
.related-pagination .btn {
  padding: 3px 8px;
  font-size: 11px;
  min-height: 26px;
}
@media (max-width: 767px) {
  #clientsTable {
    table-layout: fixed;
  }
  #clientsTable .client-desktop,
  #clientsTable .client-actions-desktop {
    display: none !important;
  }
  #clientsTable .client-actions-mobile {
    display: block;
  }
  #clientsTable th:nth-child(3) {
    width: 24% !important;
  }
  #clientsTable th:nth-child(4) {
    width: 34% !important;
  }
  #clientsTable th:nth-child(5) {
    width: 28% !important;
  }
  #clientsTable th:last-child {
    width: 14% !important;
    font-size: 10px;
  }
  #clientsTable td {
    font-size: 11px;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  #clientsTable td:last-child {
    overflow: visible;
  }
  #modalClientDetails .modal-body {
    padding: 14px;
  }
  .related-pagination {
    flex-wrap: wrap;
  }
}
/* Modal amplio para detalles operativos; no modifica el detalle de Usuarios. */
.workspace-detail .modal-dialog {
  width: calc(100% - 40px);
  max-width: 1220px;
  margin: 20px auto;
  min-height: calc(100% - 40px);
}
.workspace-detail .modal-content {
  max-height: calc(100dvh - 40px);
  border: 1px solid var(--line);
  border-radius: 16px;
}
.workspace-detail .modal-header {
  padding: 18px 24px;
}
.workspace-detail .modal-title {
  font-size: 22px;
  font-weight: 650;
  color: var(--ink);
}
.workspace-detail .modal-body {
  padding: 22px 24px !important;
}
.workspace-detail .modal-footer {
  padding: 14px 24px;
}
.workspace-detail-top {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 32px;
  align-items: start;
  margin-bottom: 20px;
}
.workspace-detail-top h3 {
  font-size: 21px;
  font-weight: 650;
  margin: 0 0 18px;
  overflow-wrap: anywhere;
}
.workspace-facts {
  margin: 0;
}
.workspace-facts > div {
  display: grid;
  grid-template-columns: minmax(100px, 35%) minmax(0, 1fr);
  gap: 12px;
  padding: 4px 0;
}
.workspace-facts dt {
  font-size: 12px;
  font-weight: 400;
  color: var(--muted);
}
.workspace-facts dd {
  font-size: 13px;
  margin: 0;
  overflow-wrap: anywhere;
}
.workspace-summary {
  padding: 20px;
  background: #f5f8f5;
  border: 1px solid var(--line);
  border-radius: 13px;
}
.workspace-summary h3 {
  font-size: 10px;
  letter-spacing: 1.5px;
  color: var(--green);
  text-transform: uppercase;
}
.workspace-summary .workspace-facts > div {
  padding: 7px 0;
}
.workspace-summary .workspace-facts dd {
  text-align: right;
}
.workspace-tabs {
  display: flex;
  gap: 8px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 8px;
  margin-bottom: 10px;
}
.workspace-tabs .nav-link {
  padding: 8px 13px;
  border: 1px solid var(--line);
  border-radius: 9px !important;
  color: var(--ink);
  font-size: 12px;
  background: white;
}
.workspace-tabs .nav-link.active {
  background: var(--green);
  color: white;
  border-color: var(--green);
  font-weight: 600;
}
.workspace-table {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.workspace-table table {
  margin: 0;
  min-width: 570px;
}
.workspace-table thead th {
  font-size: 10px !important;
  font-weight: 500;
  color: var(--muted);
  background: #f7faf7;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.workspace-detail .form-feedback:empty {
  display: none;
}
.workspace-detail .related-view {
  padding: 2px 7px;
  font-size: 12px;
  line-height: 1.4;
}
.workspace-record-total {
  font-size: 19px !important;
  font-weight: 650;
  color: var(--green);
}
.workspace-record-items {
  margin-top: 20px;
}
.workspace-record-items h3 {
  font-size: 14px;
  margin-bottom: 12px;
}
.related-pagination .btn:disabled,
.related-pagination .btn.disabled,
.workspace-detail .btn:disabled {
  background: #f0f2f1 !important;
  border-color: #dce1de !important;
  color: #8a938e !important;
  opacity: 1;
  cursor: default;
}
@media (min-width: 701px) and (max-width: 1024px) {
  .workspace-detail-top {
    gap: 18px;
  }
  .workspace-facts > div {
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 8px;
  }
  .workspace-summary {
    padding: 14px;
  }
}
@media (max-width: 700px) {
  .workspace-detail .modal-dialog {
    width: calc(100% - 16px);
    margin: 8px auto;
    min-height: calc(100% - 16px);
  }
  .workspace-detail .modal-content {
    max-height: calc(100dvh - 16px);
  }
  .workspace-detail .modal-header,
  .workspace-detail .modal-footer {
    padding: 12px 14px;
  }
  .workspace-detail .modal-title {
    font-size: 18px;
  }
  .workspace-detail .modal-body {
    padding: 16px 14px !important;
  }
  .workspace-detail-top {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-bottom: 16px;
  }
  .workspace-detail-top h3 {
    font-size: 19px;
    margin-bottom: 12px;
  }
  .workspace-facts > div {
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 8px;
  }
  .workspace-summary {
    padding: 14px;
  }
  .workspace-summary h3 {
    font-size: 10px;
  }
  .workspace-tabs {
    gap: 6px;
  }
  .workspace-table table.detail-related-table {
    min-width: 0;
    table-layout: fixed;
  }
  .detail-related-table th:nth-child(2),
  .detail-related-table td:nth-child(2),
  .detail-related-table th:nth-child(3),
  .detail-related-table td:nth-child(3) {
    display: none;
  }
  .detail-related-table th:first-child {
    width: 35%;
  }
  .detail-related-table th:nth-child(4) {
    width: 25%;
  }
  .detail-related-table th:nth-child(5) {
    width: 23%;
  }
  .detail-related-table th:last-child {
    width: 17%;
  }
  .detail-related-table td {
    overflow-wrap: anywhere;
    font-size: 11px !important;
  }
  .detail-related-table .status-label {
    white-space: normal;
  }
  .workspace-detail .modal-footer .btn {
    font-size: 12px;
  }
}
#migrationModule[data-module="contracts"] .dataTables_wrapper {
  overflow: visible;
}
.contract-service-list > div + div {
  border-top: 1px solid var(--line);
  margin-top: 3px;
  padding-top: 3px;
}
.contract-actions-desktop {
  display: flex;
  gap: 3px;
}
.contract-actions-desktop .btn {
  padding: 2px 6px !important;
  margin: 0 !important;
}
.contract-actions-mobile {
  display: none;
}
.contract-actions-mobile .dropdown-item {
  border-radius: 0 !important;
  padding: 8px 12px;
  font-size: 12px;
}
.contract-actions-mobile > .btn {
  padding: 2px 6px;
}
@media (max-width: 767px) {
  #migrationModule[data-module="contracts"] .contract-desktop,
  .contract-actions-desktop {
    display: none !important;
  }
  .contract-actions-mobile {
    display: block;
  }
  #migrationModule[data-module="contracts"] #moduleTable {
    table-layout: fixed;
    width: 100% !important;
  }
  #migrationModule[data-module="contracts"] #moduleTable th:first-child {
    width: 32%;
  }
  #migrationModule[data-module="contracts"] #moduleTable th:nth-child(3) {
    width: 28%;
  }
  #migrationModule[data-module="contracts"] #moduleTable th:nth-child(4) {
    width: 27%;
  }
  #migrationModule[data-module="contracts"] #moduleTable th:last-child {
    width: 13%;
  }
  #migrationModule[data-module="contracts"] #moduleTable td {
    font-size: 11px;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}
.contract-workspace {
  border-top: 1px solid var(--line);
  padding-top: 18px;
  margin-top: 20px;
}
.contract-workspace > h3 {
  font-size: 15px;
  margin-bottom: 18px;
}
.contract-timeline {
  list-style: none;
  padding: 0 0 0 20px;
  margin: 0 0 20px;
  border-left: 2px solid var(--line);
}
.contract-timeline > li {
  position: relative;
  padding: 0 0 16px 2px;
}
.contract-timeline > li:before {
  content: "";
  position: absolute;
  left: -26px;
  top: 5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--green);
  border: 2px solid white;
}
.contract-event-title {
  font-size: 13px;
  font-weight: 600;
}
.contract-timeline .field-help {
  font-size: 11px;
  margin: 3px 0;
}
.contract-timeline .workspace-facts {
  margin-top: 8px;
}
#migrationModule[data-module="contracts"] .table-responsive {
  overflow: visible;
}
.contract-usage-chart {
  margin-top: 20px;
  display: grid;
  gap: 12px;
}
.contract-usage-row {
  display: grid;
  grid-template-columns: 100px 1fr 70px;
  align-items: center;
  gap: 12px;
  font-size: 13px;
}
.contract-usage-row strong {
  text-align: right;
}
.contract-usage-track {
  background: #eef3f0;
  height: 18px;
  border-radius: 4px;
  overflow: hidden;
}
.contract-usage-bar {
  background: #177b68;
  height: 100%;
}
.contract-workspace .form-label {
  font-size: 13px;
}
.contract-workspace input,
.contract-workspace select {
  max-width: 100%;
}
.sidebar-menu-group > summary {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  margin: 4px 0;
  font-size: 12px;
  border-radius: 8px;
  color: #f4ac67;
  cursor: pointer;
  list-style: none;
}
.sidebar-menu-group > summary::-webkit-details-marker {
  display: none;
}
.sidebar-menu-group > summary > i {
  font-size: 17px;
}
.sidebar-menu-group > summary .submenu-chevron {
  margin-left: auto;
  font-size: 11px;
  transition: transform 0.15s;
}
.sidebar-menu-group[open] > summary .submenu-chevron {
  transform: rotate(180deg);
}
.sidebar-menu-group > summary:hover,
.sidebar-menu-group.has-active-page > summary {
  background: #235147;
}
.sidebar-menu-group > summary:focus-visible {
  outline: 2px solid #f4ac67;
  outline-offset: 2px;
}
.sidebar-submenu {
  margin-left: 12px;
  padding-left: 4px;
  border-left: 1px solid #356155;
}
.app-sidebar nav .sidebar-submenu a[data-page] {
  gap: 8px;
  padding: 9px 8px;
  font-size: 11px;
}
.electronic-actions-desktop {
  display: flex;
  gap: 4px;
}
.electronic-actions-desktop .btn {
  padding: 3px 6px;
}
.electronic-actions-mobile {
  display: none;
}
.electronic-actions .dropdown-item {
  padding: 8px 12px !important;
  border-radius: 0 !important;
}
#electronicDocumentModal .workspace-facts dd {
  overflow-wrap: anywhere;
}
@media (max-width: 767px) {
  table[data-electronic-table] {
    table-layout: fixed;
    width: 100% !important;
  }
  table[data-electronic-table] .electronic-desktop,
  .electronic-actions-desktop {
    display: none !important;
  }
  .electronic-actions-mobile {
    display: block;
  }
  table[data-electronic-table] td {
    overflow-wrap: anywhere;
    white-space: normal;
    font-size: 11px;
  }
  table[data-electronic-table] th:last-child {
    width: 13%;
  }
  table[data-electronic-table] th:nth-child(2) {
    width: 21%;
  }
  .electronic-lines th,
  .electronic-lines td {
    font-size: 11px;
    overflow-wrap: anywhere;
  }
  .electronic-lines th:nth-child(3),
  .electronic-lines td:nth-child(3) {
    display: none;
  }
}
@media (max-width: 767px) {
  #electronicDocumentModal .workspace-table .electronic-lines {
    min-width: 0;
    width: 100%;
    table-layout: fixed;
  }
  #electronicDocumentModal .electronic-lines th:first-child {
    width: 49%;
  }
  #electronicDocumentModal .electronic-lines th:nth-child(2) {
    width: 18%;
  }
  #electronicDocumentModal .electronic-lines th:last-child {
    width: 33%;
  }
  #electronicDocumentModal .electronic-lines td:last-child {
    text-align: right;
  }
}
#electronicDocumentModal .electronic-content > section > h3 {
  font-size: 16px;
  margin-bottom: 12px;
}

.contract-state-stack,
.contract-debt-stack {
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: center;
  text-align: center;
}
.contract-whatsapp {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--muted);
  font-size: 11px;
}
.contract-whatsapp i {
  color: var(--green);
}
.contract-debt-stack small {
  font-size: 11px;
}
@media (max-width: 767px) {
  .settings-table {
    table-layout: fixed;
  }
  .settings-table th:nth-child(2),
  .settings-table td:nth-child(2) {
    display: none;
  }
  .settings-table th:first-child {
    width: 40%;
  }
  .settings-table th:nth-child(3) {
    width: 25%;
  }
  .settings-table td {
    font-size: 11px;
    overflow-wrap: anywhere;
  }
  .settings-table .dropdown-toggle {
    font-size: 11px;
    padding: 4px;
  }
  .settings-table .dropdown-item {
    padding: 8px 12px !important;
    border-radius: 0 !important;
  }
  #settingsTabs .btn {
    font-size: 11px;
    padding: 6px 8px;
  }
}
#settingsContent .table td {
  vertical-align: middle;
}

/* Shared table column presentation. */
table th.table-state,
table td.table-state {
  text-align: center !important;
}
table th.table-money,
table td.table-money {
  text-align: right !important;
}
table th.table-actions,
table td.table-actions {
  width: 1% !important;
  white-space: nowrap !important;
  text-align: center !important;
}
.settings-actions-desktop {
  display: flex;
  gap: 4px;
  justify-content: center;
  flex-wrap: nowrap;
}
.settings-actions-mobile {
  display: none;
}
.settings-actions-desktop .btn {
  padding: 2px 6px !important;
  margin: 0 !important;
}
@media (max-width: 767px) {
  .settings-actions-desktop {
    display: none;
  }
  .settings-actions-mobile {
    display: block;
  }
}
.summary-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}
.summary-chart {
  display: flex;
  gap: 10px;
  align-items: end;
  flex-wrap: wrap;
  margin: 20px 0;
}
.summary-chart-column {
  flex: 1;
  text-align: center;
  min-width: 25px;
}
.summary-bars {
  height: 135px;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 3px;
}
.summary-bar {
  width: 12px;
  background: #147d69;
  border-radius: 3px 3px 0 0;
}
.summary-bar.collected {
  background: #e68c2b;
}
.summary-chart-legend {
  width: 100%;
  font-size: 12px;
  color: #52665e;
}
.request-description {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.request-entry {
  border-left: 3px solid #147d69;
  background: #f4f8f6;
  padding: 12px 16px;
  margin: 12px 0;
}
.request-entry p {
  margin-bottom: 4px;
}
@media (max-width: 767px) {
  #migrationModule[data-module="serviceRequests"] #moduleTable th:nth-child(3),
  #migrationModule[data-module="serviceRequests"] #moduleTable td:nth-child(3),
  #migrationModule[data-module="invoices"] #moduleTable th:nth-child(3),
  #migrationModule[data-module="invoices"] #moduleTable td:nth-child(3),
  #migrationModule[data-module="invoices"] #moduleTable th:nth-child(6),
  #migrationModule[data-module="invoices"] #moduleTable td:nth-child(6) {
    display: none;
  }
  #migrationModule[data-module="serviceRequests"] #moduleTable td {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}
/* Electronic invoice filters and action columns stay within the available width. */
.electronic-date-filters {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: end;
}
.electronic-date-filters label {
  min-width: 0;
  margin: 0;
  font-size: 12px;
}
.electronic-date-filters input {
  min-width: 0;
  width: 100%;
  margin-top: 5px;
}
.electronic-date-filters .btn {
  height: 36px;
  margin: 0 !important;
  white-space: nowrap;
}
.electronic-list-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.electronic-list-heading h4 {
  flex: 1;
  min-width: 180px;
}
.electronic-list-heading .btn {
  white-space: nowrap;
}
#divTableElectronicInvoices .dataTables_wrapper {
  overflow: visible;
}
#tableElectronicInvoices {
  min-width: 0 !important;
  width: 100% !important;
}
#tableElectronicInvoices td:nth-child(5),
#tableElectronicInvoices th:nth-child(5) {
  text-align: center !important;
}
#tableElectronicInvoices td:nth-child(4) {
  font-weight: 700;
  text-align: right !important;
}
.electronic-actions-desktop {
  flex-wrap: nowrap;
}
.electronic-actions-desktop .btn {
  margin: 0 !important;
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .electronic-date-filters {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .electronic-date-filters .btn {
    width: 100%;
  }
  #tableElectronicInvoices {
    table-layout: fixed;
  }
  #tableElectronicInvoices th:nth-child(2) {
    width: 19% !important;
  }
  #tableElectronicInvoices th:nth-child(3) {
    width: auto !important;
  }
  #tableElectronicInvoices th:nth-child(4) {
    width: 28% !important;
  }
  table[data-electronic-table] th:last-child,
  table[data-electronic-table] td:last-child {
    width: 36px !important;
    min-width: 36px !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
  }
  table[data-electronic-table] .electronic-actions-mobile > .btn {
    width: 28px;
    min-width: 28px;
    padding: 2px 4px !important;
    margin: 0 !important;
  }
  #tableElectronicInvoices td {
    overflow-wrap: anywhere;
  }
  #tableElectronicInvoices th {
    font-size: 10px;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}
.app-confirm-dialog {
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  width: min(440px, calc(100vw - 32px));
  max-height: 85vh;
  color: var(--ink);
  box-shadow: 0 15px 60px #0003;
}
.app-confirm-dialog::backdrop {
  background: #102d2866;
}
.app-confirm-dialog .modal-header,
.app-confirm-dialog .modal-body,
.app-confirm-dialog .modal-footer {
  padding: 16px;
}
.app-confirm-dialog .modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.app-confirm-dialog p {
  white-space: pre-wrap;
}

#migrationModule[data-module="invoices"] #moduleTable td:nth-child(6),
#migrationModule[data-module="invoices"] #moduleTable th:nth-child(6) {
  text-align: right !important;
  font-weight: 600;
}
@media (max-width: 767px) {
  #migrationModule[data-module="invoices"] #moduleTable th:nth-child(6),
  #migrationModule[data-module="invoices"] #moduleTable td:nth-child(6) {
    display: table-cell;
  }
  #migrationModule[data-module="invoices"] #moduleTable th:nth-child(4),
  #migrationModule[data-module="invoices"] #moduleTable td:nth-child(4) {
    display: none;
  }
}

#migrationModule[data-module="contracts"] #moduleTable th:nth-child(5),
#migrationModule[data-module="contracts"] #moduleTable td:nth-child(5) {
  text-align: center !important;
}

/* Contract billing indicators. */
#moduleTable tr.contract-billing-overdue > td { background-color: #fcf0df !important; box-shadow: none !important; }
.contract-period-monthly { color: #147d69; background: #e6f4ee; }
.contract-period-annual { color: #7553a5; background: #f0eafa; }

@media (max-width: 575.98px) {
  .summary-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .summary-metrics > .card { min-width: 0; padding: 10px !important; }
  .summary-metrics .fs-4 { font-size: clamp(14px, 4vw, 20px) !important; overflow-wrap: anywhere; }
  .summary-metrics .text-muted { font-size: 12px; }
  .summary-chart { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3px; }
  .summary-chart-column { min-width: 0; }
  .summary-chart-column small { font-size: 9px; }
  .summary-bars { gap: 1px; }
  .summary-bar { width: 45%; min-width: 0; }
  .summary-chart-legend { grid-column: 1 / -1; }
}

.contract-city-summary { min-width: 0; max-width: 100%; }
@media (max-width: 575.98px) {
  .contract-city-summary .table-responsive { overflow: visible; }
  .contract-city-summary table, .contract-city-summary tbody { display: block; width: 100%; }
  .contract-city-summary thead { display: none; }
  .contract-city-summary tbody tr { display: block; border: 1px solid #dce5e1; border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; }
  .contract-city-summary tbody td { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 5px 0; border: 0; white-space: normal; overflow-wrap: anywhere; text-align: right !important; }
  .contract-city-summary tbody td::before { content: attr(data-label); color: #52665e; font-size: 12px; text-align: left; }
  .contract-city-summary tbody td:first-child { display: block; font-weight: 600; text-align: left !important; padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid #e8eeeb; }
  .contract-city-summary tbody td:first-child::before { content: none; }
}

.contract-document-usage { min-width: 110px; max-width: 180px; font-size: 12px; }
.contract-document-bar { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: #e6ece9; margin-top: 3px; }
.contract-document-bar > span { display: block; height: 100%; }
.contract-document-bar .usage-success { background: #198754; }
.contract-document-bar .usage-warning { background: #e5b323; }
.contract-document-bar .usage-danger { background: #dc3545; }
.contract-document-bar .usage-excess { background: #7952b3; border-left: 2px solid white; box-sizing: border-box; }
.usage-excess-label { color: #7952b3; }

.contract-period-inline { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; white-space: nowrap; text-align: center; }
.contract-period-inline .contract-document-usage { display: flex; align-items: center; justify-content: center; gap: 6px; min-width: 0; max-width: none; white-space: nowrap; }
.contract-period-inline .contract-document-bar { width: 55px; flex: 0 0 55px; height: 6px; margin-top: 0; }

#moduleTable .contract-consumption-cell { text-align: center !important; vertical-align: middle; }
#moduleTable .contract-consumption-cell .contract-document-bar { width: 55px; height: 6px; margin: 0 auto; }

.contract-period-stack { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; }
.contract-period-stack .contract-document-quantity { white-space: nowrap; }

.contract-usage-bar-line { display: flex; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; }
.contract-usage-bar-line .contract-document-bar { flex: 0 0 55px; }

.server-monitor-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,420px),1fr)); gap: 16px; }
.server-monitor-card { min-width: 0; }
.server-monitor-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.server-monitor-metric { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.server-monitor-track { height: 7px; background: #e6ece9; border-radius: 4px; overflow: hidden; }
.server-monitor-track span { display: block; height: 100%; }
.server-monitor-track .success { background: #198754; }
.server-monitor-track .warning { background: #e5b323; }
.server-monitor-track .danger { background: #dc3545; }
.server-monitor-top { max-height: 360px; overflow: auto; background: #182d29; color: #e8f3ef; padding: 12px; border-radius: 8px; font-size: 11px; }

.server-monitor-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.server-monitor-card[hidden] { display: none !important; }
#serverMonitor .server-monitor-card { padding: 12px !important; font-size: 12px; }
#serverMonitor .server-monitor-card h5 { font-size: 15px; margin-bottom: 4px; }
#serverMonitor .server-monitor-card p { margin-bottom: 5px; }
#serverMonitor .server-monitor-card .mb-3 { margin-bottom: 8px !important; }
.server-monitor-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.server-monitor-metric small { font-size: 10px; }
.server-monitor-chart svg { display: block; width: 100%; height: 80px; background: repeating-linear-gradient(to bottom,#f3f6f5 0,#f3f6f5 1px,transparent 1px,transparent 20px); }
.server-monitor-chart { margin: 6px 0; }
.server-monitor-dialog { width: min(900px,95vw); max-height: 85vh; overflow: auto; border: 1px solid #dce5e1; border-radius: 12px; padding: 20px; }
.server-monitor-dialog::backdrop { background: #0007; }
@media(max-width:1199.98px){.server-monitor-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }}
@media(max-width:767.98px){.server-monitor-grid { grid-template-columns: minmax(0,1fr); }}

/* Associated electronic invoice numbers. */
.invoice-electronic-badge { background-color: #e7f1ff; color: #0b5ed7; }
/* WhatsApp conversation workspace */
.chat-workspace{--chat-accent:#167b68;--chat-soft:#e7f4ee;--chat-muted:#72858b;color:#244047}
.chat-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px}.chat-toolbar h4{margin:0}.chat-toolbar small{color:var(--chat-muted)}
.chat-layout{display:grid;grid-template-columns:320px minmax(0,1fr);height:calc(100dvh - 235px);min-height:480px;max-height:850px;background:white;border:1px solid #dee8e5;border-radius:18px;overflow:hidden;box-shadow:0 8px 28px #24404708}
.chat-sidebar{display:flex;flex-direction:column;min-height:0;border-right:1px solid #e4ece9}.chat-search{padding:18px;border-bottom:1px solid #e4ece9}.chat-search summary{font-size:12px;color:var(--chat-accent)}
#chatContacts{overflow:auto;flex:1}.chat-contact{border:0;border-bottom:1px solid #f0f4f2;border-left:4px solid transparent;background:white;padding:16px 14px;width:100%;display:flex;align-items:center;text-align:left;gap:12px;color:inherit}.chat-contact:hover{background:#f6faf8}.chat-contact.is-active{background:var(--chat-soft);border-left-color:var(--chat-accent)}.chat-contact.is-unread .chat-contact-name,.chat-contact.is-unread .chat-preview{font-weight:700;color:#183f37}.chat-contact-copy{flex:1;min-width:0}.chat-contact-name,.chat-preview{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-contact-name{font-size:14px;font-weight:500}.chat-preview{font-size:12px;margin-top:4px;color:var(--chat-muted)}.chat-contact-meta{text-align:right;align-self:flex-start;font-size:10px;color:var(--chat-muted);white-space:nowrap}.chat-unread{display:table;margin:7px 0 0 auto;background:var(--chat-accent);color:white;border-radius:20px;min-width:20px;text-align:center;padding:2px 5px;font-size:11px;font-weight:700}
.chat-avatar{width:42px;height:42px;flex-shrink:0;border-radius:50%;background:#e4eee9;color:var(--chat-accent);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;overflow:hidden}.chat-avatar img{width:100%;height:100%;object-fit:cover}
.chat-main{min-width:0;min-height:0}.chat-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--chat-muted)}.chat-empty i{font-size:64px;color:#86b9a8;margin-bottom:15px}.chat-empty p{font-size:13px}
#chatPanel:not([hidden]){height:100%;display:flex;flex-direction:column}.chat-header{display:flex;gap:12px;align-items:center;padding:16px 20px;border-bottom:1px solid #e4ece9}.chat-heading{flex:1;min-width:0}.chat-heading h5{font-size:17px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-heading small{font-size:12px;color:var(--chat-muted)}#chatBack{display:none}.chat-context{padding:8px 20px;font-size:12px;border-bottom:1px solid #e4ece9;max-height:140px;overflow:auto}.chat-context summary{color:var(--chat-accent)}.chat-history-tools{text-align:center;background:#f5f8f6}.chat-history-tools:has(button[hidden]){display:none}
#chatMessages{flex:1;min-height:0;overflow:auto;padding:24px;display:flex;flex-direction:column;gap:14px;background:#f5f8f6}.chat-message{max-width:80%;min-width:90px;align-self:flex-start}.chat-message.is-outgoing{align-self:flex-end}.chat-bubble{border-radius:14px 14px 14px 3px;background:white;padding:12px 15px;border:1px solid #e2eae6;box-shadow:0 2px 3px #24404703;font-size:14px}.is-outgoing .chat-bubble{background:#dff2e9;border-color:#cce7da;border-radius:14px 14px 3px 14px}.chat-message-meta{display:block;margin-top:5px;color:#71857c;font-size:10px;padding:0 4px}.is-outgoing .chat-message-meta{text-align:right}.chat-message-meta.is-read{color:#237dc5}.chat-bubble img{border-radius:8px}.chat-composer{display:flex;align-items:center;gap:12px;padding:15px 20px;background:white;border-top:1px solid #e4ece9}.chat-composer textarea{flex:1;min-width:0;resize:none;border:0;background:#f5f8f6;padding:12px;border-radius:12px;outline-color:var(--chat-accent);font-size:14px}.chat-composer button{display:flex;align-items:center;gap:8px}.chat-contact-editor{border:0;border-radius:16px;padding:24px;max-width:calc(100vw - 32px);width:420px;box-shadow:0 20px 80px #0003}.chat-contact-editor::backdrop{background:#203d4266}.chat-contact-editor label{display:block;margin-bottom:16px}.chat-contact-editor small{color:var(--chat-muted)}
@media(max-width:767px){.chat-layout{grid-template-columns:minmax(0,1fr);height:calc(100dvh - 205px);min-height:440px}.chat-main{display:none}.chat-workspace.has-conversation .chat-sidebar{display:none}.chat-workspace.has-conversation .chat-main{display:block}#chatBack{display:inline-block}.chat-header{padding:12px;gap:8px}.chat-header .chat-avatar{width:34px;height:34px}.chat-heading h5{font-size:15px}#chatMessages{padding:14px;gap:12px}.chat-message{max-width:91%}.chat-composer{padding:12px;gap:8px}.chat-composer button span{display:none}.chat-context{padding:7px 12px}.chat-toolbar{gap:8px}.chat-toolbar h4{font-size:20px}}

#whatsappChat [hidden]{display:none!important}


#whatsappChat .chat-contact{border-radius:0}


/* Compact navigation and chat without the redundant heading. */
.app-sidebar nav a[data-page],.app-sidebar .sidebar-menu-group > summary{padding-top:8px;padding-bottom:8px;margin-top:2px;margin-bottom:2px}
#whatsappChat #chatStatus:empty{display:none}
#whatsappChat .chat-layout{height:calc(100dvh - 175px)}
@media(max-width:767px){#whatsappChat .chat-layout{height:calc(100dvh - 145px)}}

.app-sidebar .chat-menu-unread{margin-left:auto;min-width:21px;padding:2px 6px;border-radius:12px;background:#dceeff;color:#175c97;font-size:11px;font-weight:700;text-align:center;line-height:17px}
.app-sidebar .chat-menu-unread[hidden]{display:none}