/* Un único viewport útil: el footer reserva su altura real en todo el sistema. */
body.has-app-footer {
  --app-content-top: 0px;
  overflow: hidden;
}

body.has-app-footer .app-root {
  height: calc(100dvh - var(--app-footer-height));
  min-height: 0;
  overflow: visible;
}

body.has-app-footer .content-area {
  height: 100%;
  min-height: 0;
  min-width: 0;
  padding-bottom: 0 !important;
  overflow: auto;
  scroll-padding-block: 1rem;
}

body.has-app-footer .content-area > .container-fluid {
  flex: 0 0 auto;
  min-width: 0;
}

/* El chat de órdenes ocupa el alto disponible y deja sus controles al pie. */
body.has-app-footer.ema-ot-screen-page .content-area {
  padding: 0 !important;
  overflow: hidden !important;
}

body.has-app-footer.ema-ot-screen-page .content-area > .container-fluid {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  width: 100%;
  min-height: 0;
  padding: 0 !important;
}

body.has-app-footer .sidebar {
  min-height: 0;
  height: calc(100dvh - var(--app-footer-height));
  max-height: calc(100dvh - var(--app-footer-height));
}

.app-footer {
  min-height: 2.75rem;
  padding-left: 11.75rem;
  padding-right: 1rem;
}
.app-footer > * { min-width: 0; overflow-wrap: anywhere; }

body.has-app-footer :is(.ot-page, .clientes-page, .proveedores-page, .historial-shell, #calendar-layout, .caja-panel, .presupuestos-shell) {
  height: calc(100dvh - var(--app-footer-height) - var(--app-content-top)) !important;
}

/* Las columnas flex pueden encogerse sin empujar controles fuera de la pantalla. */
.visual-page, .visual-page .card, .visual-page .card-body { min-width: 0; }
.ot-page-header, .ot-filter-card, .ot-table-card > .card-body > .border-top { flex-shrink: 0; }

body.app-body .ot-table-scroll { overflow: auto; }
body.app-body .ot-orders-table { min-width: 1040px; table-layout: auto; }
body.app-body .visual-page .ot-orders-table :is(thead th, tbody td) { padding-inline: .5rem; }
.ot-orders-table .ot-order-cell { min-width: 10rem; }
.ot-orders-table .ot-client-cell { min-width: 10rem; max-width: 18rem; }
.ot-orders-table :is(th, td):nth-child(3) { min-width: 5.5rem; white-space: nowrap; }
.ot-orders-table :is(th, td):nth-child(4) { min-width: 8rem; }
.ot-orders-table .ot-amount-cell { min-width: 8rem; }
.ot-orders-table :is(th, td):last-child {
  position: sticky;
  right: 0;
  min-width: 5rem;
  background: var(--bs-body-bg);
  box-shadow: -4px 0 8px rgb(0 0 0 / 10%);
  z-index: 1;
}
.ot-orders-table thead th:last-child { z-index: 3; }
/* Popover lleva el menú a la capa superior sin elevar la celda sobre el encabezado. */
.ot-orders-table .dropdown-menu[popover],
#cajaMovimientosTable .dropdown-menu[popover] { margin: 0; }
@supports not selector(:popover-open) {
  .ot-orders-table tbody td:last-child:has(.dropdown-menu.show) { z-index: 1046; }
}
/* Fondos opacos para que el saldo no se vea detrás de las acciones al desplazar. */
body.app-body .visual-page .ot-orders-table tbody td:last-child {
  background: var(--app-card) !important;
}
body.app-body .visual-page .ot-orders-table tbody .table-success td:last-child {
  background: #12322d !important;
}
body.app-body .visual-page .ot-orders-table.table-hover > tbody > tr:hover > td:last-child {
  background: #1a2d4e !important;
}
body.app-body .visual-page .ot-orders-table.table-hover > tbody > tr.table-success:hover > td:last-child {
  background: #134231 !important;
}
.ot-orders-table .badge { max-width: 11rem; white-space: normal; }

body.app-body #cajaMovimientosTable { overflow-x: auto !important; }
@media (min-width: 992px) {
body.app-body #cajaMovimientosTable table { min-width: 960px; table-layout: fixed; }
body.app-body #cajaMovimientosTable :is(thead th, tbody td) { padding-inline: .5rem; }
body.app-body #cajaMovimientosTable th:nth-child(1) { width: 8rem; }
body.app-body #cajaMovimientosTable th:nth-child(2) { width: 4rem; }
body.app-body #cajaMovimientosTable th:nth-child(3) { width: auto; }
body.app-body #cajaMovimientosTable th:nth-child(4) { width: 10rem; }
body.app-body #cajaMovimientosTable th:nth-child(5) { width: 11rem; }
body.app-body #cajaMovimientosTable th:nth-child(6) { width: 9rem; }
body.app-body #cajaMovimientosTable th:nth-child(7) { width: 6rem; }
body.app-body #cajaMovimientosTable :is(th, td):last-child {
  position: sticky;
  right: 0;
  min-width: 6rem;
  background: var(--app-card);
  z-index: 1;
}
body.app-body #cajaMovimientosTable thead th:last-child { z-index: 3; }
@supports not selector(:popover-open) {
  #cajaMovimientosTable tbody td:last-child:has(.dropdown-menu.show) { z-index: 1046; }
}
}
body.app-body .caja-summary-row { overflow-x: auto; }

/* El detalle puede desplazarse completo cuando sus controles superan la altura útil. */
body.app-body .ot-items-page { height: auto; min-height: 0; }
body.app-body .ot-items-page-content { overflow: visible; flex: 0 0 auto; }
body.app-body .ot-items-col > .card { flex: 0 0 auto; }
body.app-body .ot-items-detail-table-wrap { max-height: clamp(12rem, 38dvh, 32rem); flex: 0 1 auto; }
body.app-body .ot-senias-card .ot-senias-table-wrap { max-height: 15rem; flex: 0 1 auto; overflow: auto; }
.ot-items-title-group { min-width: 0; flex: 1; flex-wrap: wrap; }
.ot-items-title-group > h1 { flex-shrink: 0; }
body.app-body .ot-items-heading-info { min-width: 0; flex-wrap: wrap; white-space: normal; gap: .25rem 1rem; }
body.app-body .ot-items-heading-info > span { white-space: normal; overflow-wrap: anywhere; }
body.app-body .ot-items-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; padding: .5rem; }
.ot-items-footer-actions { flex-wrap: wrap; }
.ot-items-footer-totals { min-width: 0; }
body.app-body .ot-senias-card .card-body { overflow: visible; margin: 0; }
body.app-body .ot-order-actions { padding: 1rem; }

@media (min-width: 768px) {
  body.app-body .ot-items-page {
    height: calc(100dvh - var(--app-footer-height) - var(--app-content-top, 0px));
    min-height: 0;
  }
  body.app-body .ot-items-page-content { flex: 1 1 0%; min-height: 0; }
  body.app-body .ot-items-col { flex: 1 1 auto; min-height: 0; }
  body.app-body .ot-items-col > .card:first-child { flex: 1 1 0%; min-height: 0; }
  body.app-body .ot-items-col > .ot-senias-card { flex: 0 0 auto; margin-top: auto !important; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  body.app-body .ot-senias-card .card-body > .col-12.col-lg-9 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  body.app-body .ot-senias-card .card-body > .ot-order-actions {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    border-left: 1px solid var(--bs-border-color);
    border-top: 0;
    padding-left: .75rem;
    padding-top: 0;
  }
}

@media (max-width: 991.98px) {
  /* El botón del menú está en la barra inferior; el contenido empieza arriba. */
  body.has-app-footer { --app-content-top: 0px; }
  body.has-app-footer .content-area { padding-top: 0; }
  body.has-app-footer.caja-screen-page .content-area { overflow: auto !important; }
  body.has-app-footer.caja-screen-page .content-area > .container-fluid { height: auto; overflow: visible; }
  body.has-app-footer .caja-panel { height: auto !important; }
  body.app-body #cajaMovimientosTable { max-height: 60dvh; }
  body.app-body #cajaMovimientosTable td[colspan] { display: block; white-space: normal; text-align: center !important; }
  body.app-body #cajaMovimientosTable td[colspan]::before { display: none; content: none; }

  body.has-app-footer .sidebar-toggle-btn {
    top: auto;
    bottom: .25rem;
    left: .375rem;
    width: 2.625rem;
    height: 2.25rem;
    justify-content: center;
    padding: .4rem;
    border-radius: .35rem;
  }
  body.has-app-footer .app-footer-actions { left: 4.5rem; }
}

@media (max-width: 767.98px) {
  body.has-app-footer :is(.ot-page, .clientes-page, .proveedores-page, .historial-shell, .caja-panel, .presupuestos-shell) { height: auto !important; }
}

@media (max-width: 767.98px) {
  .app-footer {
    justify-content: flex-end;
    padding-left: 7.25rem;
  }
  .app-footer-brand {
    display: block;
    flex: 1 1 100%;
    margin-left: auto;
    padding-right: 0;
    border-right: 0;
    text-align: center;
  }
  .app-footer > a { display: none; }
}