:root {
  --ui-desktop-safe-min-width: 1120px;
  --ui-document-panel-width: 25%;
  --ui-work-panel-width: 75%;

  --ui-page-padding: 12px;
  --ui-gap: 10px;
  --ui-card-padding: 12px;
  --ui-radius-main: 18px;
  --ui-radius-soft: 14px;

  --ui-line-status-width: 72px;
  --ui-line-description-min: 320px;
  --ui-line-code-width: 88px;
  --ui-line-qty-width: 76px;
  --ui-line-price-width: 108px;
  --ui-line-total-width: 122px;
  --ui-line-actions-width: 118px;
}

@media (min-width: 761px) {
  html,
  body {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
  }

  #bigsys-app {
    width: 100%;
    max-width: none !important;
    min-width: var(--ui-desktop-safe-min-width);
    margin: 0 !important;
    padding: var(--ui-page-padding);
  }

  .app-shell {
    width: 100%;
    max-width: none !important;
    display: grid;
    grid-template-columns: minmax(280px, var(--ui-document-panel-width)) minmax(0, 1fr) !important;
    gap: var(--ui-gap);
    align-items: start;
  }

  .app-region-right {
    display: none !important;
  }

  .app-region-left,
  .app-region-center,
  .zone-lines,
  .zone-lines .panel-card {
    min-width: 0;
  }

  .zone-document-panel {
    position: sticky;
    top: 12px;
  }
}

.panel-card,
.header-card,
.filters-shell,
.filters-bar,
.debug-panel {
  border-radius: var(--ui-radius-main);
}

.panel-card {
  padding: var(--ui-card-padding);
}

.info-grid div,
.totals-grid div,
.supplier-card div,
.empty-box,
.line-status-pill,
.line-description,
.line-field {
  border-radius: var(--ui-radius-soft);
}

/* Filtros */
.filters-shell {
  display: grid;
  grid-template-columns: minmax(210px, 25%) 1fr minmax(210px, 25%);
  align-items: center;
  gap: 10px;
  width: 100%;
  background: linear-gradient(180deg, var(--panel), var(--panel-2));
  border: 1px solid var(--line);
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
  padding: 10px;
}

.filters-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.filters-center {
  justify-content: center;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.filters-right {
  min-height: 1px;
}

.btn-upload-server {
  min-height: 38px;
  border-color: rgba(56,189,248,.45);
  background: rgba(56,189,248,.14);
  font-weight: 600;
}

.hidden-upload-input {
  display: none !important;
}

/* Documento */
.document-panel {
  padding: 12px;
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 160px);
  overflow: hidden;
}

.doc-console-simple {
  display: grid;
  grid-template-rows: auto auto;
  gap: 8px;
}

.doc-tabs-main,
.doc-zoom-simple {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px;
  flex-wrap: nowrap !important;
}

.doc-tabs-main .doc-tab,
.doc-zoom-simple .doc-zoom-btn {
  width: 100%;
  min-width: 0;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.doc-zoom-btn {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 10px;
  background: rgba(255,255,255,.06);
  color: var(--text);
  font-weight: 500;
}

.doc-zoom-value {
  background: rgba(56,189,248,.12);
  border-color: rgba(56,189,248,.42);
}

.doc-body {
  min-height: 0;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.18);
}

.doc-preview-scroll {
  height: calc(100vh - 330px);
  min-height: 250px;
  overflow: auto;
  padding: 10px;
  cursor: grab;
  user-select: none;
  touch-action: none;
  overscroll-behavior: contain;
}

.doc-preview-scroll.is-panning {
  cursor: grabbing;
}

.doc-preview-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
  transition: transform .12s ease;
}

.doc-ocr-text,
.doc-invoice-list {
  height: calc(100vh - 330px);
  min-height: 250px;
  overflow: auto;
}

.doc-ocr-text {
  margin: 0;
  padding: 12px;
  white-space: pre-wrap;
  color: var(--text);
  font-family: var(--font-data);
  font-size: 12px;
  line-height: 1.48;
}

.doc-invoice-list {
  display: grid;
  gap: 7px;
  padding: 8px;
}

.doc-invoice-item {
  text-align: left;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: var(--text);
}

.doc-invoice-item.active {
  border-color: rgba(56,189,248,.75);
  background: rgba(56,189,248,.16);
}

.doc-invoice-item strong,
.doc-invoice-item span {
  display: block;
}

.doc-invoice-item span {
  color: var(--muted);
  font-size: 11px;
  margin-top: 3px;
}

/* Lineas */
.lines-stack {
  display: grid;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: thin;
}

.invoice-line-card {
  width: 100%;
  min-width: 880px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  padding: 10px;
  background: rgba(255,255,255,.04);
}

.invoice-line-card.status-soft-green {
  border-color: rgba(34,197,94,.35);
  background: var(--good-soft);
}

.invoice-line-card.status-yellow {
  border-color: rgba(245,158,11,.42);
  background: var(--warn-soft);
}

.invoice-line-card.status-red {
  border-color: rgba(239,68,68,.42);
  background: var(--danger-soft);
}

.line-main,
.line-ai-field-suggestions {
  display: grid;
  grid-template-columns:
    var(--ui-line-status-width)
    minmax(var(--ui-line-description-min), 1fr)
    var(--ui-line-code-width)
    var(--ui-line-qty-width)
    var(--ui-line-price-width)
    var(--ui-line-total-width)
    var(--ui-line-actions-width);
  gap: 7px;
  align-items: stretch;
}

.line-ai-field-suggestions {
  margin-top: 7px;
  align-items: center;
}

.line-status-pill,
.line-description,
.line-field {
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
  padding: 8px;
  min-width: 0;
}

.line-status-pill {
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  overflow: hidden;
}

.line-status-control {
  width: 100%;
  height: 100%;
  min-height: 40px;
  border: 1px solid rgba(56,189,248,.24);
  border-radius: 14px;
  background: rgba(0,0,0,.10);
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.line-status-control span {
  font-size: 17px;
  line-height: 1;
}

.line-status-dropdown span {
  font-size: 21px;
  color: rgba(245,158,11,.95);
}

.line-status-control:hover {
  background: rgba(56,189,248,.16);
  border-color: rgba(56,189,248,.55);
}

.line-label {
  color: var(--muted);
  font-size: var(--fs-line-label);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 500;
  opacity: .78;
}

.line-value {
  margin-top: 4px;
  font-size: var(--fs-line-value);
  font-weight: 500;
  line-height: 1.35;
}

.line-description .line-value {
  font-family: var(--font-base);
  letter-spacing: .002em;
}

.line-field .line-value {
  font-family: var(--font-data);
  font-weight: 400;
  font-variant-numeric: tabular-nums lining-nums;
  white-space: nowrap;
}

.line-actions {
  display: grid !important;
  grid-template-columns: 52px 30px;
  gap: 8px;
  align-items: center;
  justify-content: end;
}

.btn-line-ai {
  min-width: 52px !important;
  height: 34px;
  min-height: 34px !important;
  padding: 0 10px !important;
  border-radius: 999px;
  border-color: rgba(56,189,248,.45);
  background: rgba(56,189,248,.16);
  color: var(--text);
  font-weight: 600 !important;
}

.btn-line-ai:hover {
  border-color: rgba(56,189,248,.75);
  background: rgba(56,189,248,.24);
}

.btn-line-confirm {
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border-radius: 999px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(34,197,94,.22);
  border-color: rgba(34,197,94,.48);
  color: #dfffea;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.btn-line-confirm:hover {
  background: rgba(34,197,94,.34);
  border-color: rgba(34,197,94,.72);
}

/* Sugerencias IA */
.ai-field-status-spacer {
  visibility: hidden;
  pointer-events: none;
}

.ai-field-description,
.ai-field {
  min-width: 0;
  height: 30px;
  padding: 6px 9px;
  border-radius: 999px;
  border: 1px solid rgba(56,189,248,.24);
  background: rgba(56,189,248,.075);
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ai-field-description {
  font-family: var(--font-base);
  font-size: 11.8px;
  font-weight: 400;
  text-align: left;
  cursor: pointer;
}

.ai-field {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ai-field em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--text);
  font-style: normal;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1;
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
  text-align: center;
}

.ai-field-click {
  cursor: pointer;
}

.ai-field-click:hover,
.ai-field-description:hover {
  border-color: rgba(56,189,248,.72);
  background: rgba(56,189,248,.16);
}

.ai-field-diff {
  border-color: rgba(255,255,255,.10);
  background: rgba(0,0,0,.12);
}

/* Ocultar restos */
.line-bubbles,
.line-ai-suggestion,
.ai-suggestion-card,
.ai-full-apply-btn,
.line-actions [data-action="openProductSearch"] {
  display: none !important;
}

/* Footer/debug */
.footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.debug-panel {
  padding: 12px;
  color: var(--muted);
}

.debug-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* Grandes */
@media (min-width: 1441px) {
  :root {
    --ui-line-description-min: 380px;
    --ui-line-actions-width: 122px;
  }

  .invoice-line-card {
    min-width: 0;
  }

  .lines-stack {
    overflow-x: visible;
  }
}

/* 1366 / notebooks */
@media (min-width: 1101px) and (max-width: 1440px) {
  :root {
    --ui-line-status-width: 72px;
    --ui-line-description-min: 320px;
    --ui-line-code-width: 84px;
    --ui-line-qty-width: 72px;
    --ui-line-price-width: 102px;
    --ui-line-total-width: 116px;
    --ui-line-actions-width: 112px;
  }

  .invoice-line-card {
    min-width: 840px;
  }

  .line-actions {
    grid-template-columns: 50px 30px;
    gap: 7px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  html,
  body {
    width: 100%;
    min-width: 0;
    overflow-x: hidden;
  }

  #bigsys-app {
    width: 100%;
    max-width: none;
    min-width: 0;
    padding: 10px;
  }

  .app-shell {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 10px;
  }

  .filters-shell {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .filters-left,
  .filters-center {
    justify-content: flex-start;
  }

  .btn-upload-server {
    width: 100%;
    text-align: center;
  }

  .filters-right {
    display: none;
  }

  .zone-document-panel {
    position: static;
  }

  .document-panel {
    max-height: none;
    overflow: visible;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 420px;
    min-height: 320px;
  }

  .invoice-line-card {
    min-width: 0;
  }

  .line-main,
  .line-ai-field-suggestions {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .ai-field-status-spacer {
    display: none;
  }

  .line-actions {
    grid-template-columns: 64px 36px;
    justify-content: start;
  }

  .btn-line-ai {
    min-width: 64px !important;
  }

  .btn-line-confirm {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  .footer-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .footer-actions .btn {
    width: 100%;
  }
}


/*
  Iconos centralizados:
  - HTML/SVG en /assets/bigsys-icons.config.js
  - Estilos aca.
*/

.line-status-control {
  width: 100%;
  height: 100%;
  min-height: 40px;
  border: 1px solid rgba(56,189,248,.24);
  border-radius: 14px;
  background: rgba(0,0,0,.10);
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.line-status-icon {
  width: 21px;
  height: 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.line-status-icon svg {
  width: 21px;
  height: 21px;
  display: block;
  fill: currentColor;
}

.line-status-search {
  color: rgba(226,242,255,.96);
}

.line-status-dropdown {
  color: rgba(245,158,11,.96);
}

.line-status-dropdown .line-status-icon svg {
  width: 25px;
  height: 25px;
}

.line-status-control:hover {
  background: rgba(56,189,248,.16);
  border-color: rgba(56,189,248,.55);
}

/* Acciones derecha: IA + check separados */
.line-actions {
  display: grid !important;
  grid-template-columns: 52px 30px;
  gap: 8px;
  align-items: center;
  justify-content: end;
}

.btn-line-ai {
  min-width: 52px !important;
  height: 34px;
  min-height: 34px !important;
  padding: 0 10px !important;
  border-radius: 999px;
  border-color: rgba(56,189,248,.45);
  background: rgba(56,189,248,.16);
  color: var(--text);
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

.btn-line-confirm {
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border-radius: 999px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(34,197,94,.22);
  border-color: rgba(34,197,94,.48);
  color: #dfffea;
}

.btn-line-confirm svg {
  width: 17px;
  height: 17px;
  fill: currentColor;
}

.btn-line-ai:hover {
  border-color: rgba(56,189,248,.75);
  background: rgba(56,189,248,.24);
}

.btn-line-confirm:hover {
  background: rgba(34,197,94,.34);
  border-color: rgba(34,197,94,.72);
}


/*
  Ajuste:
  - Iconos de lupa/dropdown mas grandes.
  - Check de validacion mas visible.
  - Boton IA separado y mas hacia la izquierda.
  - Los iconos siguen definidos en bigsys-icons.config.js.
*/

:root {
  --ui-line-actions-width: 142px;
}

/* Icono izquierda: lupa/dropdown */
.line-status-control {
  min-height: 44px !important;
}

.line-status-icon {
  width: 28px !important;
  height: 28px !important;
}

.line-status-icon svg {
  width: 28px !important;
  height: 28px !important;
}

.line-status-dropdown .line-status-icon {
  width: 31px !important;
  height: 31px !important;
}

.line-status-dropdown .line-status-icon svg {
  width: 31px !important;
  height: 31px !important;
}

/* Acciones derecha: IA separado a la izquierda, check a la derecha */
.line-actions {
  display: grid !important;
  grid-template-columns: 58px 34px !important;
  gap: 22px !important;
  align-items: center;
  justify-content: end;
}

.btn-line-ai {
  justify-self: start;
  min-width: 58px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 12px !important;
}

.btn-line-confirm {
  justify-self: end;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
}

.btn-line-confirm svg {
  width: 20px !important;
  height: 20px !important;
}

/* 1366 / notebook */
@media (min-width: 1101px) and (max-width: 1440px) {
  :root {
    --ui-line-actions-width: 136px;
  }

  .line-actions {
    grid-template-columns: 56px 32px !important;
    gap: 20px !important;
  }

  .btn-line-ai {
    min-width: 56px !important;
    height: 35px !important;
    min-height: 35px !important;
  }

  .btn-line-confirm {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
  }

  .btn-line-confirm svg {
    width: 19px !important;
    height: 19px !important;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .line-actions {
    grid-template-columns: 70px 40px !important;
    gap: 16px !important;
    justify-content: start;
  }

  .btn-line-ai {
    min-width: 70px !important;
    height: 40px !important;
    min-height: 40px !important;
  }

  .btn-line-confirm {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
  }

  .btn-line-confirm svg {
    width: 22px !important;
    height: 22px !important;
  }
}


/*
  Sugerencias IA mas visibles:
  - Fondo un poco mas intenso.
  - Borde mas marcado.
  - Hover mas claro.
*/

.ai-field-description,
.ai-field {
  background: rgba(56,189,248,.13) !important;
  border-color: rgba(56,189,248,.42) !important;
}

.ai-field-description {
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.06);
}

.ai-field {
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.05);
}

.ai-field-click:hover,
.ai-field-description:hover {
  background: rgba(56,189,248,.22) !important;
  border-color: rgba(56,189,248,.72) !important;
}

.ai-field-diff {
  background: rgba(56,189,248,.10) !important;
  border-color: rgba(56,189,248,.30) !important;
}

/* Mantiene diferencia neutra sin parecer error */
.ai-field-diff em {
  color: rgba(235,248,255,.95);
}


/*
  Ajustes:
  - Acciones superiores sticky.
  - Mismo tamaño visual de botones.
  - Panel de preview/OCR/facturas con altura de pantalla y scroll interno.
  - Nunca debe ser mas alto que la pantalla.
*/

/* Botonera superior sticky */
.zone-footer-actions {
  position: sticky;
  top: 10px;
  z-index: 50;
}

.zone-footer-actions .footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  padding: 8px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.98), rgba(23,36,58,.98));
  box-shadow: 0 10px 28px rgba(0,0,0,.22);
  backdrop-filter: blur(8px);
}

.zone-footer-actions .footer-actions .btn {
  min-height: 34px;
  padding: 8px 12px;
  font-size: var(--fs-button);
  white-space: nowrap;
}

/* Panel izquierdo: altura fija de pantalla con scroll interno */
.zone-document-panel {
  position: sticky;
  top: 10px;
  align-self: start;
}

.document-panel {
  height: calc(100vh - 118px) !important;
  max-height: calc(100vh - 118px) !important;
  min-height: 420px;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr);
}

/* El cuerpo interno toma todo el espacio restante */
.doc-body {
  min-height: 0 !important;
  height: 100%;
  overflow: hidden !important;
}

/* Preview con scroll interno */
.doc-preview-scroll {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
}

/* OCR con scroll interno */
.doc-ocr-text {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
}

/* Lista facturas con scroll interno */
.doc-invoice-list {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
}

/* La imagen nunca fuerza la altura del panel */
.doc-preview-image {
  max-width: none;
  height: auto;
}

/* Mobile: no sticky, flujo normal */
@media (max-width: 760px) {
  .zone-footer-actions {
    position: static;
  }

  .zone-footer-actions .footer-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .document-panel {
    height: auto !important;
    max-height: none !important;
    min-height: 0;
    overflow: visible !important;
  }

  .doc-body {
    height: auto;
    overflow: visible !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 420px !important;
    min-height: 320px !important;
    overflow: auto !important;
  }
}


/*
  Reorganizacion real:
  - footerActions pasa a region top desde registry.
  - La botonera queda sticky arriba.
  - El cuerpo queda debajo.
  - El visor de factura nunca supera la pantalla.
*/

:root {
  --ui-top-actions-height: 48px;
  --ui-document-panel-max-height: calc(100vh - 190px);
}

/* La region top queda apilada y estable */
.app-region-top {
  display: grid;
  gap: 8px;
  position: relative;
  z-index: 80;
}

/* Botonera superior sticky real */
.zone-footer-actions {
  position: sticky !important;
  top: 0;
  z-index: 120;
}

.zone-footer-actions .footer-actions {
  min-height: var(--ui-top-actions-height);
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  padding: 7px 10px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.98), rgba(23,36,58,.98));
  box-shadow: 0 10px 28px rgba(0,0,0,.24);
  backdrop-filter: blur(8px);
}

/* Mantiene tamaño actual de botones */
.zone-footer-actions .footer-actions .btn {
  min-height: 34px;
  height: 34px;
  padding: 7px 12px;
  font-size: var(--fs-button);
  white-space: nowrap;
  border-radius: 999px;
}

/* El cuerpo queda claramente separado debajo de las acciones */
.app-shell {
  align-items: start;
}

/* Panel izquierdo: altura limitada a la pantalla */
.zone-document-panel {
  position: sticky !important;
  top: calc(var(--ui-top-actions-height) + 14px);
  align-self: start;
}

.document-panel {
  height: var(--ui-document-panel-max-height) !important;
  max-height: var(--ui-document-panel-max-height) !important;
  min-height: 420px;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr);
}

/* El cuerpo interno usa todo el espacio restante */
.doc-body {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

/* Factura con scroll interno */
.doc-preview-scroll {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
}

/* OCR con scroll interno */
.doc-ocr-text {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
}

/* Lista con scroll interno */
.doc-invoice-list {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
}

/* La imagen nunca agranda el panel */
.doc-preview-image {
  height: auto;
  max-height: none;
}

/* Para resoluciones bajas */
@media (max-height: 760px) and (min-width: 761px) {
  :root {
    --ui-document-panel-max-height: calc(100vh - 165px);
  }

  .document-panel {
    min-height: 360px;
  }

  .zone-document-panel {
    top: calc(var(--ui-top-actions-height) + 8px);
  }
}

/* Mobile: sin sticky forzado, flujo normal */
@media (max-width: 760px) {
  .zone-footer-actions {
    position: static !important;
  }

  .zone-footer-actions .footer-actions {
    display: grid !important;
    grid-template-columns: 1fr;
  }

  .zone-footer-actions .footer-actions .btn {
    width: 100%;
    height: 40px;
  }

  .zone-document-panel {
    position: static !important;
  }

  .document-panel {
    height: auto !important;
    max-height: none !important;
    min-height: 0;
    overflow: visible !important;
  }

  .doc-body {
    height: auto !important;
    overflow: visible !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 420px !important;
    min-height: 320px !important;
    overflow: auto !important;
  }
}


/*
  Sticky seguro:
  - No depende del registry.
  - No toca renderRegion.
  - Botonera superior independiente.
  - Oculta la botonera vieja de center para no duplicar.
  - Panel izquierdo con alto de pantalla y scroll interno.
*/

:root {
  --ui-safe-sticky-height: 48px;
  --ui-doc-panel-height: calc(100vh - 178px);
}

/* Botonera sticky independiente */
.app-sticky-actions {
  position: sticky;
  top: 0;
  z-index: 250;
  margin-bottom: 10px;
}

.sticky-actions-inner {
  min-height: var(--ui-safe-sticky-height);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  padding: 7px 10px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.98), rgba(23,36,58,.98));
  box-shadow: 0 12px 30px rgba(0,0,0,.26);
  backdrop-filter: blur(8px);
}

.sticky-action-btn {
  height: 34px;
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: var(--fs-button);
  white-space: nowrap;
}

/* Oculta botonera vieja dentro de center/bottom para no duplicar */
.app-region-center .zone-footer-actions,
.app-region-bottom .zone-footer-actions {
  display: none !important;
}

/* Panel izquierdo: alto controlado por pantalla */
@media (min-width: 761px) {
  .app-region-left {
    height: var(--ui-doc-panel-height) !important;
    max-height: var(--ui-doc-panel-height) !important;
    min-height: 430px;
    position: sticky !important;
    top: calc(var(--ui-safe-sticky-height) + 12px) !important;
    align-self: start !important;
    overflow: hidden !important;
  }

  .zone-document-panel {
    height: 100% !important;
    max-height: 100% !important;
    position: static !important;
    top: auto !important;
  }

  .document-panel {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .doc-body {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: auto !important;
  }

  .doc-preview-image {
    height: auto !important;
    max-height: none !important;
  }
}

@media (max-height: 760px) and (min-width: 761px) {
  :root {
    --ui-doc-panel-height: calc(100vh - 158px);
  }

  .app-region-left {
    min-height: 360px;
  }
}

@media (max-width: 760px) {
  .app-sticky-actions {
    position: static;
    margin-bottom: 10px;
  }

  .sticky-actions-inner {
    display: grid;
    grid-template-columns: 1fr;
  }

  .sticky-action-btn {
    width: 100%;
    height: 40px;
  }

  .app-region-left,
  .zone-document-panel,
  .document-panel {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    position: static !important;
    overflow: visible !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 420px !important;
    min-height: 320px !important;
    overflow: auto !important;
  }
}


/*
  Barra superior unificada:
  izquierda: descargar facturas
  centro: filtros
  derecha: deshacer/rehacer/descartar/finalizar

  Reemplaza:
  - sticky actions independiente
  - footerActions viejo
  - filters-shell anterior
*/

#app-sticky-actions,
.app-sticky-actions,
.zone-footer-actions,
.app-region-top .zone-footer-actions,
.app-region-center .zone-footer-actions,
.app-region-bottom .zone-footer-actions {
  display: none !important;
}

.unified-top-bar {
  width: 100%;
  min-height: 48px;
  display: grid;
  grid-template-columns: minmax(220px, 25%) minmax(360px, 1fr) minmax(420px, 35%);
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.98), rgba(23,36,58,.98));
  box-shadow: 0 10px 28px rgba(0,0,0,.22);
}

.unified-top-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  min-width: 0;
}

.unified-top-center {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.unified-top-right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.btn-upload-server,
.unified-action-btn,
.unified-top-center .filter-btn {
  height: 34px;
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 999px;
  white-space: nowrap;
  font-size: var(--fs-button);
}

.btn-upload-server {
  border-color: rgba(56,189,248,.45);
  background: rgba(56,189,248,.14);
  font-weight: 600;
}

.unified-action-btn {
  background: rgba(255,255,255,.06);
  border: 1px solid var(--line);
}

.unified-action-btn:hover,
.btn-upload-server:hover,
.unified-top-center .filter-btn:hover {
  border-color: rgba(56,189,248,.65);
  background: rgba(56,189,248,.16);
}

.hidden-upload-input {
  display: none !important;
}

/* Si quedaran estilos viejos de filters-shell, no aplican al nuevo componente */
.filters-shell {
  display: none !important;
}

/* Como ya no hay sticky independiente, el panel izquierdo vuelve a top normal */
@media (min-width: 761px) {
  .app-region-left {
    top: 12px !important;
  }
}

/* En pantallas chicas se mantiene en una sola zona, pero puede partir en filas ordenadas */
@media (max-width: 1200px) and (min-width: 761px) {
  .unified-top-bar {
    grid-template-columns: minmax(210px, 24%) minmax(320px, 1fr) minmax(360px, 34%);
  }

  .btn-upload-server,
  .unified-action-btn,
  .unified-top-center .filter-btn {
    padding-left: 9px;
    padding-right: 9px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .unified-top-bar {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .unified-top-left,
  .unified-top-center,
  .unified-top-right {
    justify-content: flex-start;
  }

  .btn-upload-server {
    width: 100%;
    text-align: center;
  }

  .unified-top-right {
    display: grid;
    grid-template-columns: 1fr;
    overflow: visible;
  }

  .unified-action-btn {
    width: 100%;
    height: 40px;
  }
}


/*
  Barra superior:
  izquierda: filtros
  centro: descargar facturas
  derecha: acciones
*/

.unified-top-bar-swapped {
  grid-template-columns: minmax(390px, 34%) minmax(240px, 22%) minmax(430px, 44%) !important;
}

.unified-top-filters {
  display: flex;
  justify-content: flex-start !important;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.unified-top-upload {
  display: flex;
  justify-content: center !important;
  align-items: center;
  min-width: 0;
}

.unified-top-upload .btn-upload-server {
  white-space: nowrap;
}

.unified-top-right {
  justify-content: flex-end !important;
}

/* anula centros anteriores si quedaron */
.unified-top-center:not(.unified-top-upload) {
  justify-content: center;
}

/* 1366 / notebook */
@media (max-width: 1366px) and (min-width: 761px) {
  .unified-top-bar-swapped {
    grid-template-columns: minmax(340px, 33%) minmax(220px, 22%) minmax(390px, 45%) !important;
  }

  .unified-top-filters {
    gap: 6px;
  }

  .unified-top-upload .btn-upload-server,
  .unified-action-btn,
  .unified-top-filters .filter-btn {
    padding-left: 9px;
    padding-right: 9px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .unified-top-bar-swapped {
    grid-template-columns: 1fr !important;
  }

  .unified-top-filters,
  .unified-top-upload,
  .unified-top-right {
    justify-content: flex-start !important;
  }

  .unified-top-upload .btn-upload-server {
    width: 100%;
    text-align: center;
  }
}


/*
  Dejar una sola barra sticky:
  - La barra valida es .unified-top-bar dentro de zone-filters.
  - Se oculta app-sticky-actions.
  - Se oculta footerActions viejo.
  - Header no queda sticky.
*/

#app-sticky-actions,
.app-sticky-actions,
.sticky-actions-inner,
.zone-footer-actions,
.app-region-top .zone-footer-actions,
.app-region-center .zone-footer-actions,
.app-region-bottom .zone-footer-actions,
.app-shell .zone-footer-actions {
  display: none !important;
}

/* La zona de filtros/barra unificada es la unica sticky */
.zone-filters {
  position: sticky !important;
  top: 0 !important;
  z-index: 300 !important;
}

/* Barra unificada sticky visual */
.unified-top-bar {
  position: relative;
  z-index: 301;
  box-shadow: 0 12px 30px rgba(0,0,0,.28);
  backdrop-filter: blur(8px);
}

/* Separacion despues de la barra sticky */
.app-shell {
  margin-top: 10px;
}

/* El panel izquierdo queda debajo de la barra sticky */
@media (min-width: 761px) {
  .app-region-left {
    top: 62px !important;
  }
}

/* En mobile no forzamos sticky pesado */
@media (max-width: 760px) {
  .zone-filters {
    position: static !important;
  }

  .app-shell {
    margin-top: 0;
  }
}


/*
  Sistema oficial:
  - Unica barra sticky: #app-sticky-actions > .unified-top-bar
  - Header normal.
  - Filtros y acciones viejas ocultas.
  - Visor izquierdo con alto de pantalla y scroll interno.
*/

:root {
  --ui-official-sticky-height: 50px;
  --ui-official-doc-height: calc(100vh - 148px);
}

/* Ocultar sistemas viejos */
.zone-filters,
.zone-footer-actions,
.app-region-top .zone-filters,
.app-region-top .zone-footer-actions,
.app-region-center .zone-footer-actions,
.app-region-bottom .zone-footer-actions,
.app-shell .zone-footer-actions {
  display: none !important;
}

/* Mostrar solamente barra oficial */
#app-sticky-actions,
.app-sticky-actions {
  display: block !important;
}

.app-sticky-actions {
  position: sticky !important;
  top: 0 !important;
  z-index: 500 !important;
  margin-bottom: 10px;
}

/* La barra unificada vive dentro del sticky oficial */
#app-sticky-actions .unified-top-bar {
  position: relative !important;
  z-index: 501 !important;
  width: 100%;
  min-height: var(--ui-official-sticky-height);
  display: grid !important;
  grid-template-columns: minmax(390px, 34%) minmax(240px, 22%) minmax(430px, 44%) !important;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.98), rgba(23,36,58,.98));
  box-shadow: 0 12px 30px rgba(0,0,0,.30);
  backdrop-filter: blur(8px);
}

#app-sticky-actions .unified-top-filters {
  display: flex;
  justify-content: flex-start !important;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

#app-sticky-actions .unified-top-upload {
  display: flex;
  justify-content: center !important;
  align-items: center;
  min-width: 0;
}

#app-sticky-actions .unified-top-right {
  display: flex;
  justify-content: flex-end !important;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

#app-sticky-actions .btn-upload-server,
#app-sticky-actions .unified-action-btn,
#app-sticky-actions .filter-btn {
  height: 34px;
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 999px;
  white-space: nowrap;
  font-size: var(--fs-button);
}

/* Separacion visual debajo de la barra */
.app-shell {
  margin-top: 10px !important;
}

/* Panel izquierdo con alto real de pantalla */
@media (min-width: 761px) {
  .app-region-left {
    height: var(--ui-official-doc-height) !important;
    max-height: var(--ui-official-doc-height) !important;
    min-height: 500px;
    position: sticky !important;
    top: calc(var(--ui-official-sticky-height) + 12px) !important;
    align-self: start !important;
    overflow: hidden !important;
  }

  .zone-document-panel {
    height: 100% !important;
    max-height: 100% !important;
    position: static !important;
    top: auto !important;
  }

  .document-panel {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .doc-body {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: auto !important;
  }

  .doc-preview-image {
    height: auto !important;
    max-height: none !important;
  }
}

/* 1366 */
@media (max-width: 1366px) and (min-width: 761px) {
  #app-sticky-actions .unified-top-bar {
    grid-template-columns: minmax(340px, 33%) minmax(220px, 22%) minmax(390px, 45%) !important;
  }

  #app-sticky-actions .btn-upload-server,
  #app-sticky-actions .unified-action-btn,
  #app-sticky-actions .filter-btn {
    padding-left: 9px;
    padding-right: 9px;
  }
}

/* Pantallas bajas */
@media (max-height: 760px) and (min-width: 761px) {
  :root {
    --ui-official-doc-height: calc(100vh - 132px);
  }

  .app-region-left {
    min-height: 420px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .app-sticky-actions {
    position: static !important;
    margin-bottom: 10px;
  }

  #app-sticky-actions .unified-top-bar {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }

  #app-sticky-actions .unified-top-filters,
  #app-sticky-actions .unified-top-upload,
  #app-sticky-actions .unified-top-right {
    justify-content: flex-start !important;
  }

  #app-sticky-actions .unified-top-upload .btn-upload-server {
    width: 100%;
    text-align: center;
  }

  #app-sticky-actions .unified-top-right {
    display: grid;
    grid-template-columns: 1fr;
    overflow: visible;
  }

  #app-sticky-actions .unified-action-btn {
    width: 100%;
    height: 40px;
  }

  .app-region-left,
  .zone-document-panel,
  .document-panel {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    position: static !important;
    overflow: visible !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 420px !important;
    min-height: 320px !important;
    overflow: auto !important;
  }
}


/*
  Solucion definitiva:
  - La barra unificada queda fija arriba con position: fixed.
  - No depende de sticky ni del overflow de padres.
  - Se ocultan sistemas viejos.
  - El contenido baja para no quedar tapado.
*/

:root {
  --ui-fixed-topbar-height: 58px;
  --ui-fixed-topbar-gap: 10px;
}

/* Ocultar barras viejas */
.zone-filters,
.zone-footer-actions,
.app-region-top .zone-filters,
.app-region-top .zone-footer-actions,
.app-region-center .zone-footer-actions,
.app-region-bottom .zone-footer-actions,
.app-shell .zone-footer-actions {
  display: none !important;
}

/* Contenedor fijo real */
#app-sticky-actions.app-sticky-actions {
  display: block !important;
  position: fixed !important;
  top: 0 !important;
  left: var(--ui-page-padding, 12px) !important;
  right: var(--ui-page-padding, 12px) !important;
  z-index: 9999 !important;
  margin: 0 !important;
  padding-top: 8px;
  pointer-events: auto;
}

/* Barra unificada dentro del fijo */
#app-sticky-actions .unified-top-bar {
  width: 100%;
  min-height: var(--ui-fixed-topbar-height);
  display: grid !important;
  grid-template-columns: minmax(390px, 34%) minmax(240px, 22%) minmax(430px, 44%) !important;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.99), rgba(23,36,58,.99));
  box-shadow: 0 12px 30px rgba(0,0,0,.34);
  backdrop-filter: blur(8px);
}

/* Bajar toda la app para que la barra fija no tape contenido */
#bigsys-app {
  padding-top: calc(var(--ui-fixed-topbar-height) + 22px) !important;
}

/* Header queda debajo, normal */
.app-region-top {
  margin-top: 0 !important;
}

/* Panel izquierdo se posiciona debajo de la barra fija */
@media (min-width: 761px) {
  .app-region-left {
    top: calc(var(--ui-fixed-topbar-height) + 22px) !important;
  }
}

/* 1366 */
@media (max-width: 1366px) and (min-width: 761px) {
  #app-sticky-actions .unified-top-bar {
    grid-template-columns: minmax(340px, 33%) minmax(220px, 22%) minmax(390px, 45%) !important;
  }

  #app-sticky-actions .btn-upload-server,
  #app-sticky-actions .unified-action-btn,
  #app-sticky-actions .filter-btn {
    padding-left: 9px;
    padding-right: 9px;
  }
}

/* Mobile: fija arriba tambien, pero en columnas */
@media (max-width: 760px) {
  :root {
    --ui-fixed-topbar-height: 178px;
  }

  #app-sticky-actions.app-sticky-actions {
    left: 8px !important;
    right: 8px !important;
    padding-top: 8px;
  }

  #app-sticky-actions .unified-top-bar {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }

  #app-sticky-actions .unified-top-filters,
  #app-sticky-actions .unified-top-upload,
  #app-sticky-actions .unified-top-right {
    justify-content: flex-start !important;
  }

  #app-sticky-actions .unified-top-right {
    display: grid;
    grid-template-columns: 1fr;
    overflow: visible;
  }

  #app-sticky-actions .unified-action-btn,
  #app-sticky-actions .btn-upload-server {
    width: 100%;
    height: 40px;
  }

  #bigsys-app {
    padding-top: calc(var(--ui-fixed-topbar-height) + 18px) !important;
  }
}


/*
  Barra fija debajo del header:
  - Header normal, no fijo.
  - Barra unificada fixed, pero su top lo calcula bigsys-sticky-actions.js.
  - Se elimina el padding superior que habia dejado la barra arriba del header.
  - Se reserva espacio entre header y cuerpo para que no tape la edición.
*/

:root {
  --ui-fixed-topbar-height: 58px;
  --ui-bar-below-header-gap: 12px;
}

/* Quitar empuje global anterior: el header vuelve arriba normal */
#bigsys-app {
  padding-top: var(--ui-page-padding, 12px) !important;
}

/* La barra sigue fixed, pero el top lo pone JS */
#app-sticky-actions.app-sticky-actions {
  display: block !important;
  position: fixed !important;
  left: var(--ui-page-padding, 12px) !important;
  right: var(--ui-page-padding, 12px) !important;
  z-index: 9999 !important;
  margin: 0 !important;
  padding-top: 0 !important;
  pointer-events: auto;
}

/* Espacio para que la barra no tape el cuerpo */
.app-shell {
  margin-top: calc(var(--ui-fixed-topbar-height) + var(--ui-bar-below-header-gap)) !important;
}

/* El panel izquierdo queda debajo de la barra cuando esta fija arriba */
@media (min-width: 761px) {
  .app-region-left {
    top: calc(var(--ui-fixed-topbar-height) + 14px) !important;
  }
}

/* Mobile: tambien debajo del header, pero con barra mas alta */
@media (max-width: 760px) {
  :root {
    --ui-fixed-topbar-height: 178px;
  }

  #app-sticky-actions.app-sticky-actions {
    left: 8px !important;
    right: 8px !important;
  }

  #bigsys-app {
    padding-top: 8px !important;
  }

  .app-shell {
    margin-top: calc(var(--ui-fixed-topbar-height) + 12px) !important;
  }
}


/*
  Panel factura/OCR/lista:
  - Nunca supera la pantalla.
  - Queda debajo de la barra unificada.
  - Usa scroll interno en la vista de factura/OCR/lista.
  - No modifica la barra superior.
*/

:root {
  --bigsys-document-panel-top: 92px;
  --bigsys-document-panel-bottom-gap: 12px;
}

@media (min-width: 761px) {
  .app-region-left {
    position: sticky !important;
    top: var(--bigsys-document-panel-top) !important;
    height: calc(100vh - var(--bigsys-document-panel-top) - var(--bigsys-document-panel-bottom-gap)) !important;
    max-height: calc(100vh - var(--bigsys-document-panel-top) - var(--bigsys-document-panel-bottom-gap)) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    align-self: start !important;
  }

  .zone-document-panel {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: static !important;
    top: auto !important;
  }

  .document-panel {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .doc-console {
    min-height: 0;
  }

  .doc-body {
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: auto !important;
  }

  .doc-preview-image {
    height: auto !important;
    max-height: none !important;
  }
}

/* En pantallas bajas, no forzar mínimos que agranden el panel */
@media (max-height: 760px) and (min-width: 761px) {
  .app-region-left {
    min-height: 0 !important;
  }
}

/* En móvil queda como bloque normal con scroll interno razonable */
@media (max-width: 760px) {
  .app-region-left,
  .zone-document-panel,
  .document-panel {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    position: static !important;
    overflow: visible !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 420px !important;
    min-height: 320px !important;
    overflow: auto !important;
  }
}


/*
  Compacta datos superiores:
  - Factura
  - Proveedor
  - Totales

  Objetivo:
  - Menos alto desperdiciado.
  - Labels mas chicos.
  - Valores legibles.
  - Paneles mas minimalistas.
*/

:root {
  --ui-data-card-padding-y: 7px;
  --ui-data-card-padding-x: 10px;
  --ui-data-card-min-height: 44px;
  --ui-data-zone-padding: 10px;
  --ui-data-gap: 8px;
}

/* Menos separacion entre zonas centrales */
.app-region-center {
  gap: 8px !important;
}

/* Paneles superiores compactos */
.zone-invoice-header .panel-card,
.zone-supplier .panel-card,
.zone-totals .panel-card {
  padding: var(--ui-data-zone-padding) !important;
  border-radius: 14px !important;
}

/* Titulos mas discretos */
.zone-invoice-header .zone-title,
.zone-supplier .zone-title,
.zone-totals .zone-title {
  margin-bottom: 7px !important;
  font-size: 11.5px !important;
  line-height: 1 !important;
  letter-spacing: .10em !important;
  opacity: .82;
}

/* Grillas compactas */
.zone-invoice-header .info-grid,
.zone-totals .totals-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: var(--ui-data-gap) !important;
}

.zone-supplier .supplier-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 170px 170px !important;
  gap: var(--ui-data-gap) !important;
}

/* Cajas internas compactas */
.zone-invoice-header .info-grid div,
.zone-supplier .supplier-card div,
.zone-totals .totals-grid div {
  min-height: var(--ui-data-card-min-height) !important;
  padding: var(--ui-data-card-padding-y) var(--ui-data-card-padding-x) !important;
  border-radius: 11px !important;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  background: rgba(255,255,255,.04) !important;
}

/* Labels */
.zone-invoice-header .info-grid span,
.zone-supplier .supplier-card span,
.zone-totals .totals-grid span {
  font-size: 10.5px !important;
  line-height: 1.1 !important;
  margin: 0 0 4px 0 !important;
  opacity: .72;
  letter-spacing: .035em !important;
}

/* Valores */
.zone-invoice-header .info-grid strong,
.zone-supplier .supplier-card strong,
.zone-totals .totals-grid strong {
  font-size: 12.5px !important;
  line-height: 1.18 !important;
  font-weight: 500 !important;
  margin: 0 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Datos numericos mas claros */
.zone-invoice-header .info-grid strong,
.zone-supplier .supplier-card strong,
.zone-totals .totals-grid strong {
  font-variant-numeric: tabular-nums lining-nums;
}

/* En pantallas medianas achicar un poco mas */
@media (max-width: 1366px) and (min-width: 761px) {
  :root {
    --ui-data-zone-padding: 8px;
    --ui-data-card-min-height: 40px;
    --ui-data-gap: 7px;
  }

  .zone-supplier .supplier-card {
    grid-template-columns: minmax(0, 1fr) 145px 145px !important;
  }

  .zone-invoice-header .info-grid strong,
  .zone-supplier .supplier-card strong,
  .zone-totals .totals-grid strong {
    font-size: 12px !important;
  }
}

/* Mobile: apilado pero compacto */
@media (max-width: 760px) {
  .zone-invoice-header .info-grid,
  .zone-supplier .supplier-card,
  .zone-totals .totals-grid {
    grid-template-columns: 1fr !important;
  }

  .zone-invoice-header .info-grid div,
  .zone-supplier .supplier-card div,
  .zone-totals .totals-grid div {
    min-height: 42px !important;
  }
}


/*
  Ajuste:
  - Quita espacio vacío arriba de Factura.
  - Mantiene la barra unificada debajo del header.
  - No toca JS ni registry.
*/

:root {
  --ui-bar-below-header-gap: 4px;
}

/* Reduce el espacio entre barra superior y zona de edición */
.app-shell {
  margin-top: 4px !important;
}

/* Si alguna regla anterior fuerza margen grande, queda anulada acá */
#app-shell {
  margin-top: 4px !important;
}

/* Mantiene el panel izquierdo alineado sin bajar de más */
@media (min-width: 761px) {
  .app-region-left {
    top: calc(var(--ui-fixed-topbar-height, 58px) + 8px) !important;
  }
}


/*
  Ajuste fino:
  - La barra superior queda debajo del header.
  - La zona Factura no queda tapada ni pegada.
  - Margen chico, sin desperdiciar espacio.
*/

:root {
  --ui-content-under-bar-gap: 14px;
}

/* Da aire justo debajo de la barra fija */
.app-shell {
  margin-top: calc(var(--ui-fixed-topbar-height, 58px) + var(--ui-content-under-bar-gap)) !important;
}

/* Si hay reglas anteriores sobre #app-shell, gana esta */
#app-shell {
  margin-top: calc(var(--ui-fixed-topbar-height, 58px) + var(--ui-content-under-bar-gap)) !important;
}

/* Panel izquierdo alineado con la zona de edición */
@media (min-width: 761px) {
  .app-region-left {
    top: calc(var(--ui-fixed-topbar-height, 58px) + var(--ui-content-under-bar-gap)) !important;
  }
}

/* En mobile mantenemos flujo normal */
@media (max-width: 760px) {
  .app-shell,
  #app-shell {
    margin-top: 10px !important;
  }
}


/*
  Correccion final del hueco:
  - La barra unificada ya no es fixed.
  - Queda en el flujo debajo del header.
  - Se pega arriba con sticky cuando se scrollea.
  - El contenido no necesita margen artificial grande.
*/

:root {
  --ui-real-sticky-height: 50px;
  --ui-real-sticky-gap: 10px;
}

/* Anula el modo fixed anterior */
#app-sticky-actions.app-sticky-actions {
  display: block !important;
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  right: auto !important;
  z-index: 9999 !important;
  margin: 0 0 var(--ui-real-sticky-gap) 0 !important;
  padding: 0 !important;
  pointer-events: auto;
}

/* La barra vive dentro del contenedor sticky */
#app-sticky-actions .unified-top-bar {
  width: 100%;
  min-height: var(--ui-real-sticky-height);
  display: grid !important;
  grid-template-columns: minmax(390px, 34%) minmax(240px, 22%) minmax(430px, 44%) !important;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.99), rgba(23,36,58,.99));
  box-shadow: 0 12px 30px rgba(0,0,0,.30);
  backdrop-filter: blur(8px);
}

/* El header vuelve a ocupar su lugar normal */
#bigsys-app {
  padding-top: var(--ui-page-padding, 12px) !important;
}

/* Quita el hueco artificial entre barra y contenido */
.app-shell,
#app-shell {
  margin-top: 0 !important;
}

/* Oculta barras duplicadas viejas */
.zone-filters,
.zone-footer-actions,
.app-region-top .zone-filters,
.app-region-top .zone-footer-actions,
.app-region-center .zone-footer-actions,
.app-region-bottom .zone-footer-actions,
.app-shell .zone-footer-actions {
  display: none !important;
}

/* Cuando el panel izquierdo sea sticky, queda debajo de la barra */
@media (min-width: 761px) {
  .app-region-left {
    top: calc(var(--ui-real-sticky-height) + 12px) !important;
  }
}

/* 1366 */
@media (max-width: 1366px) and (min-width: 761px) {
  #app-sticky-actions .unified-top-bar {
    grid-template-columns: minmax(340px, 33%) minmax(220px, 22%) minmax(390px, 45%) !important;
  }

  #app-sticky-actions .btn-upload-server,
  #app-sticky-actions .unified-action-btn,
  #app-sticky-actions .filter-btn {
    padding-left: 9px;
    padding-right: 9px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  #app-sticky-actions.app-sticky-actions {
    position: static !important;
    margin-bottom: 10px !important;
  }

  #app-sticky-actions .unified-top-bar {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }

  #app-sticky-actions .unified-top-right {
    display: grid;
    grid-template-columns: 1fr;
    overflow: visible;
  }

  #app-sticky-actions .unified-action-btn,
  #app-sticky-actions .btn-upload-server {
    width: 100%;
    height: 40px;
  }
}


/*
  Solucion oficial:
  - Barra en flujo normal debajo del header.
  - Cuando llega arriba por scroll, pasa a fixed.
  - Header no fijo.
  - Sin hueco gigante.
*/

#bigsys-app {
  padding-top: var(--ui-page-padding, 12px) !important;
}

#app-sticky-actions.app-sticky-actions {
  display: block !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: 500 !important;
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
}

#app-sticky-actions.app-sticky-actions.is-fixed {
  position: fixed !important;
  top: 0 !important;
  left: var(--ui-page-padding, 12px) !important;
  right: var(--ui-page-padding, 12px) !important;
  z-index: 9999 !important;
  margin: 0 !important;
  padding-top: 8px !important;
}

#app-sticky-actions-spacer {
  display: block;
  height: 0;
  transition: height .08s ease;
}

/* Barra unificada */
#app-sticky-actions .unified-top-bar {
  width: 100%;
  min-height: 50px;
  display: grid !important;
  grid-template-columns: minmax(390px, 34%) minmax(240px, 22%) minmax(430px, 44%) !important;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: var(--ui-radius-main);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,28,46,.99), rgba(23,36,58,.99));
  box-shadow: 0 12px 30px rgba(0,0,0,.30);
  backdrop-filter: blur(8px);
}

/* Quitar huecos artificiales anteriores */
.app-shell,
#app-shell {
  margin-top: 0 !important;
}

/* Ocultar barras viejas */
.zone-filters,
.zone-footer-actions,
.app-region-top .zone-filters,
.app-region-top .zone-footer-actions,
.app-region-center .zone-footer-actions,
.app-region-bottom .zone-footer-actions,
.app-shell .zone-footer-actions,
.sticky-actions-inner {
  display: none !important;
}

/* Pero NO ocultar la barra oficial */
#app-sticky-actions .unified-top-bar {
  display: grid !important;
}

/* Cuando la barra esta fixed, el visor izquierdo queda debajo */
@media (min-width: 761px) {
  #app-sticky-actions.app-sticky-actions.is-fixed ~ .app-shell .app-region-left {
    top: 68px !important;
  }
}

/* 1366 */
@media (max-width: 1366px) and (min-width: 761px) {
  #app-sticky-actions .unified-top-bar {
    grid-template-columns: minmax(340px, 33%) minmax(220px, 22%) minmax(390px, 45%) !important;
  }

  #app-sticky-actions .btn-upload-server,
  #app-sticky-actions .unified-action-btn,
  #app-sticky-actions .filter-btn {
    padding-left: 9px;
    padding-right: 9px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  #app-sticky-actions.app-sticky-actions,
  #app-sticky-actions.app-sticky-actions.is-fixed {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    padding-top: 0 !important;
  }

  #app-sticky-actions .unified-top-bar {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }

  #app-sticky-actions .unified-top-right {
    display: grid;
    grid-template-columns: 1fr;
    overflow: visible;
  }

  #app-sticky-actions .unified-action-btn,
  #app-sticky-actions .btn-upload-server {
    width: 100%;
    height: 40px;
  }

  #app-sticky-actions-spacer {
    display: none;
  }
}


/*
  Oculta debug inferior para medir scroll real.
*/
.zone-debug,
.debug-panel,
.app-region-bottom .zone-debug {
  display: none !important;
}

.app-region-bottom {
  display: none !important;
}


/*
  Proveedor con mismo metodo visual que lineas:
  lupa/dropdown | empresa | CUIT | codigo | IA | check
  debajo: sugerencias clickeables por campo.
*/

.supplier-correction-panel {
  padding: var(--ui-data-zone-padding, 8px) !important;
}

.supplier-correction-grid,
.supplier-suggestion-grid {
  display: grid;
  grid-template-columns: var(--ui-line-status-width) minmax(0, 1fr) 170px 170px 118px;
  gap: 7px;
  align-items: stretch;
}

.supplier-suggestion-grid {
  margin-top: 7px;
  align-items: center;
}

.supplier-status-box,
.supplier-field {
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
  border-radius: var(--ui-radius-soft);
  min-width: 0;
}

.supplier-status-box {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.supplier-status-control {
  width: 100%;
  height: 100%;
  min-height: 40px;
  border: 1px solid rgba(56,189,248,.24);
  border-radius: 14px;
  background: rgba(0,0,0,.10);
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.supplier-status-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.supplier-status-icon svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
}

.supplier-field {
  padding: 8px;
}

.supplier-actions {
  display: grid;
  grid-template-columns: 58px 34px;
  gap: 22px;
  align-items: center;
  justify-content: end;
}

.supplier-suggestion-spacer {
  visibility: hidden;
}

.supplier-suggestion {
  min-width: 0;
  height: 30px;
  padding: 6px 9px;
  border-radius: 999px;
  border: 1px solid rgba(56,189,248,.42);
  background: rgba(56,189,248,.13);
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 11.8px;
  font-weight: 400;
  text-align: left;
  cursor: pointer;
}

.supplier-suggestion:hover {
  border-color: rgba(56,189,248,.72);
  background: rgba(56,189,248,.22);
}

.supplier-suggestion-cuit,
.supplier-suggestion-code,
.supplier-suggestion-confidence {
  font-family: var(--font-data);
  text-align: center;
}

.supplier-suggestion-confidence {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: default;
  border-color: rgba(255,255,255,.10);
  background: rgba(0,0,0,.12);
}

.supplier-suggestion-confidence em {
  font-style: normal;
}

/* Compacto 1366 */
@media (max-width: 1366px) and (min-width: 761px) {
  .supplier-correction-grid,
  .supplier-suggestion-grid {
    grid-template-columns: var(--ui-line-status-width) minmax(0, 1fr) 145px 145px 112px;
  }

  .supplier-actions {
    grid-template-columns: 56px 32px;
    gap: 20px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .supplier-correction-grid,
  .supplier-suggestion-grid {
    grid-template-columns: 1fr;
  }

  .supplier-suggestion-spacer {
    display: none;
  }

  .supplier-actions {
    grid-template-columns: 70px 40px;
    justify-content: start;
  }

  .supplier-suggestion {
    border-radius: 12px;
  }
}


/*
  Factura en una sola linea:
  ID | Numero | Fecha | Estado
  Sin cajas altas ni datos apilados.
*/

.zone-invoice-header .panel-card {
  padding: 8px 10px !important;
}

.zone-invoice-header .zone-title {
  margin-bottom: 6px !important;
}

.zone-invoice-header .info-grid {
  display: grid !important;
  grid-template-columns: 90px minmax(220px, 1fr) 150px 130px !important;
  gap: 8px !important;
  align-items: center !important;
}

.zone-invoice-header .info-grid div {
  min-height: 32px !important;
  height: 32px !important;
  padding: 5px 9px !important;
  border-radius: 10px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  overflow: hidden !important;
}

.zone-invoice-header .info-grid span {
  margin: 0 !important;
  font-size: 10.5px !important;
  line-height: 1 !important;
  opacity: .72;
  white-space: nowrap;
}

.zone-invoice-header .info-grid span::after {
  content: ":";
}

.zone-invoice-header .info-grid strong {
  margin: 0 !important;
  font-size: 12.5px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 1366 / notebook */
@media (max-width: 1366px) and (min-width: 761px) {
  .zone-invoice-header .info-grid {
    grid-template-columns: 70px minmax(190px, 1fr) 130px 115px !important;
    gap: 7px !important;
  }

  .zone-invoice-header .info-grid div {
    height: 30px !important;
    min-height: 30px !important;
    padding: 4px 8px !important;
  }

  .zone-invoice-header .info-grid strong {
    font-size: 12px !important;
  }
}

/* Mobile: vuelve apilado compacto */
@media (max-width: 760px) {
  .zone-invoice-header .info-grid {
    grid-template-columns: 1fr !important;
  }

  .zone-invoice-header .info-grid div {
    height: 34px !important;
    min-height: 34px !important;
  }
}


/*
  Totales con mismo metodo visual que lineas:
  icono | subtotal | IVA | total | suma lineas | IA | check
  debajo: sugerencias clickeables por campo.
*/

.totals-correction-panel {
  padding: var(--ui-data-zone-padding, 8px) !important;
}

.totals-correction-grid,
.totals-suggestion-grid {
  display: grid;
  grid-template-columns:
    var(--ui-line-status-width)
    minmax(105px, 1fr)
    minmax(105px, 1fr)
    minmax(115px, 1fr)
    minmax(115px, 1fr)
    var(--ui-line-actions-width);
  gap: 7px;
  align-items: stretch;
}

.totals-suggestion-grid {
  margin-top: 7px;
  align-items: center;
}

.totals-status-box,
.totals-field {
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
  border-radius: var(--ui-radius-soft);
  min-width: 0;
}

.totals-status-box {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.totals-status-control {
  width: 100%;
  height: 100%;
  min-height: 40px;
  border: 1px solid rgba(56,189,248,.24);
  border-radius: 14px;
  background: rgba(0,0,0,.10);
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.totals-status-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.totals-status-icon svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
}

.totals-field {
  padding: 8px;
}

.totals-actions {
  display: grid;
  grid-template-columns: 58px 34px;
  gap: 22px;
  align-items: center;
  justify-content: end;
}

.totals-suggestion-spacer {
  visibility: hidden;
}

.totals-suggestion {
  min-width: 0;
  height: 30px;
  padding: 6px 9px;
  border-radius: 999px;
  border: 1px solid rgba(56,189,248,.42);
  background: rgba(56,189,248,.13);
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: var(--font-data);
  font-size: 11.8px;
  font-weight: 400;
  text-align: center;
  cursor: pointer;
  font-variant-numeric: tabular-nums lining-nums;
}

.totals-suggestion:hover {
  border-color: rgba(56,189,248,.72);
  background: rgba(56,189,248,.22);
}

.totals-diff {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: default;
  border-color: rgba(255,255,255,.10);
  background: rgba(0,0,0,.12);
}

/* Desactiva estilo viejo de totales para que no pelee */
.zone-totals .totals-grid {
  display: none !important;
}

/* 1366 */
@media (max-width: 1366px) and (min-width: 761px) {
  .totals-correction-grid,
  .totals-suggestion-grid {
    grid-template-columns:
      var(--ui-line-status-width)
      minmax(95px, 1fr)
      minmax(95px, 1fr)
      minmax(105px, 1fr)
      minmax(105px, 1fr)
      var(--ui-line-actions-width);
  }

  .totals-actions {
    grid-template-columns: 56px 32px;
    gap: 20px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .totals-correction-grid,
  .totals-suggestion-grid {
    grid-template-columns: 1fr;
  }

  .totals-suggestion-spacer {
    display: none;
  }

  .totals-actions {
    grid-template-columns: 70px 40px;
    justify-content: start;
  }

  .totals-suggestion {
    border-radius: 12px;
  }
}


/*
  Modo pantalla fija:
  - La pagina completa NO scrollea.
  - Header y barra superior quedan visibles.
  - Panel izquierdo de factura queda fijo dentro de la pantalla.
  - La zona central scrollea internamente:
    Factura / Proveedor / Totales / Lineas.
*/

@media (min-width: 761px) {
  html,
  body {
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
  }

  #bigsys-app {
    height: 100vh !important;
    max-height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
    padding-top: var(--ui-page-padding, 12px) !important;
    padding-bottom: var(--ui-page-padding, 12px) !important;
  }

  .app-region-top {
    min-height: 0 !important;
    margin-bottom: 8px !important;
  }

  #app-sticky-actions,
  .app-sticky-actions {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    z-index: 300 !important;
  }

  #app-sticky-actions.is-fixed,
  .app-sticky-actions.is-fixed {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
  }

  #app-sticky-actions-spacer {
    display: none !important;
    height: 0 !important;
  }

  .app-shell,
  #app-shell {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    margin-top: 0 !important;
    display: grid !important;
    align-items: stretch !important;
  }

  .app-region-left,
  .app-region-center,
  .app-region-right {
    min-height: 0 !important;
    max-height: 100% !important;
  }

  /* Panel izquierdo: fijo, con scroll interno solo en factura/OCR/lista */
  .app-region-left {
    position: static !important;
    top: auto !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
    align-self: stretch !important;
  }

  .zone-document-panel,
  .document-panel {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .document-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  .doc-body {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: auto !important;
  }

  /* Zona central: unico scroll principal de trabajo */
  .app-region-center {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 4px;
    scrollbar-width: thin;
  }

  .zone-invoice-header,
  .zone-supplier,
  .zone-totals,
  .zone-lines {
    min-height: 0 !important;
  }

  .zone-lines .panel-card {
    min-height: 0 !important;
  }

  /* Las lineas mantienen scroll horizontal interno si hace falta */
  .lines-stack {
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  /* Ocultar debug/bottom para no generar alto extra */
  .app-region-bottom {
    display: none !important;
  }
}

/* En mobile se mantiene scroll normal de pagina */
@media (max-width: 760px) {
  html,
  body {
    height: auto !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  #bigsys-app {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    display: block !important;
  }

  .app-shell,
  #app-shell,
  .app-region-center,
  .app-region-left {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}


/*
  Modo pantalla fija:
  - Header oculto.
  - Barra unificada arriba.
  - La pagina no scrollea.
  - Solo scrollea la zona central de trabajo.
  - Panel izquierdo con scroll interno propio.
*/

@media (min-width: 761px) {
  /* Oculta header completo */
  .app-region-top,
  .zone-header,
  .header-card {
    display: none !important;
  }

  html,
  body {
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
  }

  #bigsys-app {
    height: 100vh !important;
    max-height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    padding-top: var(--ui-page-padding, 12px) !important;
    padding-bottom: var(--ui-page-padding, 12px) !important;
  }

  /* Barra oficial arriba, sin depender del header */
  #app-sticky-actions.app-sticky-actions,
  #app-sticky-actions.app-sticky-actions.is-fixed {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    z-index: 500 !important;
  }

  #app-sticky-actions-spacer {
    display: none !important;
    height: 0 !important;
  }

  .app-shell,
  #app-shell {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    margin-top: 0 !important;
    display: grid !important;
    align-items: stretch !important;
  }

  /* Panel izquierdo fijo en pantalla */
  .app-region-left {
    position: static !important;
    top: auto !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    align-self: stretch !important;
  }

  .zone-document-panel,
  .document-panel {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .document-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  .doc-body {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  .doc-preview-scroll,
  .doc-ocr-text,
  .doc-invoice-list {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: auto !important;
  }

  /* Zona central: unico scroll vertical */
  .app-region-center {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 4px;
    scrollbar-width: thin;
  }

  .app-region-bottom {
    display: none !important;
  }
}

/* Mobile: mantener header y scroll normal */
@media (max-width: 760px) {
  .app-region-top,
  .zone-header,
  .header-card {
    display: initial;
  }
}


/*
  Header:
  - Visible al cargar.
  - Se oculta cuando scrollea la zona central.
  - La barra superior queda visible.
  - Anula el bloque anterior que ocultaba header siempre.
*/

@media (min-width: 761px) {
  #bigsys-app {
    grid-template-rows: auto auto minmax(0, 1fr) !important;
  }

  .app-region-top {
    display: grid !important;
    overflow: hidden !important;
    max-height: 96px;
    opacity: 1;
    margin-bottom: 8px !important;
    transition: max-height .18s ease, opacity .14s ease, margin-bottom .18s ease;
  }

  .zone-header {
    display: block !important;
  }

  .header-card {
    display: flex !important;
  }

  body.bigsys-header-hidden .app-region-top {
    max-height: 0 !important;
    opacity: 0 !important;
    margin-bottom: 0 !important;
    pointer-events: none !important;
  }

  body.bigsys-header-hidden .zone-header,
  body.bigsys-header-hidden .header-card {
    pointer-events: none !important;
  }

  /* La barra queda arriba cuando el header se oculta */
  body.bigsys-header-hidden #app-sticky-actions.app-sticky-actions {
    margin-top: 0 !important;
  }
}

/* En móvil dejamos header normal */
@media (max-width: 760px) {
  body.bigsys-header-hidden .app-region-top {
    max-height: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}


/*
  Visual para cambios locales de lineas.
*/

.invoice-line-card[data-local-pending="1"],
.invoice-line-card.local-pending {
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.35);
}

.invoice-line-card[data-local-confirmed="1"],
.invoice-line-card.local-confirmed {
  box-shadow: inset 0 0 0 1px rgba(34,197,94,.45);
}

/* Si el render no agrega clases todavia, marcamos por hover/acciones aplicadas despues */
.ai-field-click:active,
.btn-line-ai:active,
.btn-line-confirm:active {
  transform: translateY(1px);
}


/*
  Estados visuales locales:
  - Campo aplicado por IA: verde suave.
  - Línea confirmada con check: toda la línea en verde suave.
  - No bloquea edición, solo marca visual.
*/

.line-description.field-ai-applied,
.line-field.field-ai-applied {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.46) !important;
  box-shadow: inset 0 0 0 1px rgba(34,197,94,.08);
}

.line-description.field-local-confirmed,
.line-field.field-local-confirmed {
  background: rgba(34,197,94,.22) !important;
  border-color: rgba(34,197,94,.55) !important;
  box-shadow: inset 0 0 0 1px rgba(34,197,94,.10);
}

.ai-field-description.ai-field-applied,
.ai-field.ai-field-applied {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

.ai-field-description.ai-field-confirmed,
.ai-field.ai-field-confirmed {
  background: rgba(34,197,94,.22) !important;
  border-color: rgba(34,197,94,.58) !important;
}

.invoice-line-card.line-local-pending {
  border-color: rgba(56,189,248,.45) !important;
}

.invoice-line-card.line-local-confirmed {
  border-color: rgba(34,197,94,.65) !important;
  box-shadow: inset 0 0 0 1px rgba(34,197,94,.18);
}

.invoice-line-card.line-local-confirmed .line-status-pill {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

.invoice-line-card.line-local-confirmed .btn-line-confirm {
  background: rgba(34,197,94,.45) !important;
  border-color: rgba(34,197,94,.85) !important;
}

/* Que el verde siga siendo suave y editable, no candado */
.field-ai-applied,
.field-local-confirmed,
.ai-field-applied,
.ai-field-confirmed {
  cursor: pointer;
}


/*
  Estilo leve para botones de undo/redo.
*/
#app-sticky-actions [data-action="undoEdit"],
#app-sticky-actions [data-action="redoEdit"] {
  border-color: rgba(148,163,184,.32);
}


/*
  Inputs editables directos en campos:
  Codigo / Cantidad / Precio / Total
*/

.line-edit-input {
  width: 100%;
  min-width: 0;
  margin-top: 4px;
  padding: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--text);
  font-size: var(--fs-line-value);
  font-weight: 400;
  line-height: 1.35;
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
}

.line-edit-input:focus {
  background: rgba(56,189,248,.12);
  box-shadow: 0 0 0 1px rgba(56,189,248,.45);
  border-radius: 6px;
  padding: 2px 4px;
  margin-left: -4px;
}

.line-field.field-manual-edited {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.46) !important;
  box-shadow: inset 0 0 0 1px rgba(34,197,94,.08);
}

/* Para que input verde no pierda legibilidad */
.line-field.field-manual-edited .line-edit-input,
.line-field.field-ai-applied .line-edit-input,
.line-field.field-local-confirmed .line-edit-input {
  color: var(--text);
}


/*
  Manual editado = azul suave.
  IA aplicada = verde suave.
  Confirmado final = verde suave.
*/

.line-description.field-manual-edited,
.line-field.field-manual-edited {
  background: rgba(56,189,248,.18) !important;
  border-color: rgba(56,189,248,.55) !important;
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.14) !important;
}

.line-field.field-manual-edited .line-edit-input,
.line-description.field-manual-edited .line-value {
  color: var(--text) !important;
}

/* La línea con cambios manuales pendientes queda con borde azul, no verde */
.invoice-line-card.line-local-pending:not(.line-local-confirmed) {
  border-color: rgba(56,189,248,.52) !important;
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.10);
}

/* La edición manual NO pinta la sugerencia inferior */
.ai-field.ai-field-applied,
.ai-field-description.ai-field-applied {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

/* Confirmación final gana siempre y deja todo verde */
.invoice-line-card.line-local-confirmed .line-description,
.invoice-line-card.line-local-confirmed .line-field,
.invoice-line-card.line-local-confirmed .ai-field,
.invoice-line-card.line-local-confirmed .ai-field-description {
  background: rgba(34,197,94,.22) !important;
  border-color: rgba(34,197,94,.58) !important;
}

/* Diferencia visual clara al editar */
.line-edit-input:focus {
  background: rgba(56,189,248,.18) !important;
  box-shadow: 0 0 0 1px rgba(56,189,248,.65) !important;
}


/*
  Manual gana sobre IA:
  - IA aplicada = verde.
  - Edición manual posterior = azul.
  - Confirmación final = verde general.
*/

.line-description.field-manual-edited,
.line-field.field-manual-edited {
  background: rgba(56,189,248,.20) !important;
  border-color: rgba(56,189,248,.65) !important;
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.16) !important;
}

.line-description.field-manual-edited .line-value,
.line-field.field-manual-edited .line-edit-input {
  color: var(--text) !important;
}

/* Si un campo es manual, nunca debe verse verde salvo que la línea completa esté confirmada */
.invoice-line-card:not(.line-local-confirmed) .line-description.field-manual-edited,
.invoice-line-card:not(.line-local-confirmed) .line-field.field-manual-edited {
  background: rgba(56,189,248,.20) !important;
  border-color: rgba(56,189,248,.65) !important;
}

/* Confirmación final gana sobre azul */
.invoice-line-card.line-local-confirmed .line-description,
.invoice-line-card.line-local-confirmed .line-field {
  background: rgba(34,197,94,.22) !important;
  border-color: rgba(34,197,94,.58) !important;
}

/* Las sugerencias inferiores manualmente reemplazadas no se pintan */
.invoice-line-card:not(.line-local-confirmed) .ai-field:not(.ai-field-applied):not(.ai-field-confirmed),
.invoice-line-card:not(.line-local-confirmed) .ai-field-description:not(.ai-field-applied):not(.ai-field-confirmed) {
  /* respeta color IA base normal */
}

/* Focus manual siempre azul */
.line-edit-input:focus {
  background: rgba(56,189,248,.18) !important;
  box-shadow: 0 0 0 1px rgba(56,189,248,.70) !important;
}


/*
  Refuerzo visual:
  - manual = azul
  - IA aplicada despues = verde
  - confirmado = verde total
*/

.invoice-line-card:not(.line-local-confirmed) .line-description.field-ai-applied,
.invoice-line-card:not(.line-local-confirmed) .line-field.field-ai-applied {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

.invoice-line-card:not(.line-local-confirmed) .line-description.field-manual-edited,
.invoice-line-card:not(.line-local-confirmed) .line-field.field-manual-edited {
  background: rgba(56,189,248,.20) !important;
  border-color: rgba(56,189,248,.65) !important;
}

.ai-field.ai-field-applied,
.ai-field-description.ai-field-applied {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}


/*
  Proveedor editable:
  - Edicion manual superior = azul.
  - Aplicar sugerencia inferior = verde.
  - Confirmar proveedor = verde total.
*/

.supplier-edit-input {
  width: 100%;
  min-width: 0;
  margin-top: 4px;
  padding: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--text);
  font-size: var(--fs-line-value);
  font-weight: 400;
  line-height: 1.35;
  font-family: var(--font-base);
}

.supplier-edit-input.mono,
.supplier-cuit .supplier-edit-input,
.supplier-code .supplier-edit-input {
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
}

.supplier-edit-input:focus {
  background: rgba(56,189,248,.18) !important;
  box-shadow: 0 0 0 1px rgba(56,189,248,.70) !important;
  border-radius: 6px;
  padding: 2px 4px;
  margin-left: -4px;
}

.supplier-field.supplier-field-manual {
  background: rgba(56,189,248,.20) !important;
  border-color: rgba(56,189,248,.65) !important;
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.16) !important;
}

.supplier-field.supplier-field-ai {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

.supplier-suggestion.supplier-suggestion-ai {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

.supplier-field.supplier-field-confirmed,
.supplier-suggestion.supplier-suggestion-confirmed,
.supplier-correction-panel:has(.supplier-field-confirmed) .supplier-field {
  background: rgba(34,197,94,.22) !important;
  border-color: rgba(34,197,94,.58) !important;
}

.supplier-correction-panel:has(.supplier-field-manual) {
  border-color: rgba(56,189,248,.35);
}

.supplier-correction-panel:has(.supplier-field-confirmed) {
  border-color: rgba(34,197,94,.55);
}


/*
  Totales editables:
  - Edición manual superior = azul.
  - Aplicar sugerencia inferior = verde.
  - Confirmar totales = verde total.
*/

.totals-edit-input {
  width: 100%;
  min-width: 0;
  margin-top: 4px;
  padding: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--text);
  font-size: var(--fs-line-value);
  font-weight: 400;
  line-height: 1.35;
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
}

.totals-edit-input:focus {
  background: rgba(56,189,248,.18) !important;
  box-shadow: 0 0 0 1px rgba(56,189,248,.70) !important;
  border-radius: 6px;
  padding: 2px 4px;
  margin-left: -4px;
}

.totals-field.totals-field-manual {
  background: rgba(56,189,248,.20) !important;
  border-color: rgba(56,189,248,.65) !important;
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.16) !important;
}

.totals-field.totals-field-ai {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

.totals-suggestion.totals-suggestion-ai {
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.48) !important;
}

.totals-field.totals-field-confirmed,
.totals-suggestion.totals-suggestion-confirmed,
.totals-correction-panel:has(.totals-field-confirmed) .totals-field {
  background: rgba(34,197,94,.22) !important;
  border-color: rgba(34,197,94,.58) !important;
}

.totals-correction-panel:has(.totals-field-manual) {
  border-color: rgba(56,189,248,.35);
}

.totals-correction-panel:has(.totals-field-confirmed) {
  border-color: rgba(34,197,94,.55);
}


#app-sticky-actions [data-action="preloadInvoice"] {
  border-color: rgba(34,197,94,.50);
  background: rgba(34,197,94,.16);
  font-weight: 600;
}

#app-sticky-actions [data-action="preloadInvoice"]:hover {
  background: rgba(34,197,94,.24);
  border-color: rgba(34,197,94,.75);
}


.bigsys-visible-alerts {
  position: fixed;
  top: 76px;
  right: 14px;
  z-index: 20000;
  width: min(560px, calc(100vw - 28px));
  display: grid;
  gap: 10px;
  pointer-events: none;
}

.bigsys-visible-alert {
  pointer-events: auto;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(15, 23, 42, .98);
  box-shadow: 0 16px 36px rgba(0,0,0,.38);
  color: var(--text);
}

.bigsys-visible-alert-error {
  border-color: rgba(239,68,68,.65);
  background: rgba(69, 10, 10, .98);
}

.bigsys-visible-alert-warning {
  border-color: rgba(245,158,11,.65);
  background: rgba(69, 39, 10, .98);
}

.bigsys-visible-alert-title {
  font-weight: 700;
  margin-bottom: 6px;
}

.bigsys-visible-alert-message {
  font-size: 12.5px;
  line-height: 1.4;
  color: rgba(255,255,255,.88);
}

.bigsys-visible-alert-close {
  margin-top: 10px;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.08);
  color: var(--text);
  border-radius: 999px;
  padding: 6px 10px;
  cursor: pointer;
}

#app-sticky-actions [data-action="preloadInvoice"].is-loading,
#app-sticky-actions [data-action="preloadInvoice"][disabled] {
  opacity: .65;
  cursor: wait;
}


.filter-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

.filter-count {
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  color: var(--text);
  font-family: var(--font-data);
  font-size: 10.5px;
  font-weight: 400;
  line-height: 1;
}

.filter-btn.active .filter-count {
  background: rgba(56,189,248,.22);
  border-color: rgba(56,189,248,.40);
}


/*
  Scroll propio para pestaña Facturas del panel izquierdo.
  La lista no debe agrandar la página ni el panel.
*/

@media (min-width: 761px) {
  .document-panel {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .doc-body {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .doc-invoice-list {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: thin;
    padding-right: 6px;
  }

  .doc-invoice-item {
    flex: 0 0 auto;
  }
}

/* Mobile mantiene scroll interno razonable */
@media (max-width: 760px) {
  .doc-invoice-list {
    height: 420px !important;
    max-height: 420px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }
}


/*
  Product picker:
  - Lupa green/red abre búsqueda manual.
  - Dropdown yellow abre sugerencias.
  - Selección manual = azul.
  - Sugerencia = verde.
*/

.product-picker-panel {
  margin-top: 9px;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid rgba(56,189,248,.38);
  background: rgba(15,23,42,.96);
  box-shadow: 0 12px 28px rgba(0,0,0,.22);
}

.product-picker-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.product-picker-head strong {
  font-weight: 600;
  color: var(--text);
}

.product-picker-close {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.06);
  color: var(--text);
  border-radius: 999px;
  padding: 5px 9px;
  cursor: pointer;
}

.product-picker-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-bottom: 8px;
}

.product-picker-input {
  min-width: 0;
  height: 34px;
  padding: 7px 10px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.20);
  color: var(--text);
  outline: none;
}

.product-picker-input:focus {
  border-color: rgba(56,189,248,.65);
  box-shadow: 0 0 0 1px rgba(56,189,248,.22);
}

.product-picker-search-btn {
  height: 34px;
  min-height: 34px;
  padding: 7px 12px;
}

.product-picker-results {
  display: grid;
  gap: 6px;
  max-height: 260px;
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
}

.product-picker-option {
  width: 100%;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  text-align: left;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.045);
  color: var(--text);
  cursor: pointer;
}

.product-picker-option:hover {
  border-color: rgba(56,189,248,.65);
  background: rgba(56,189,248,.13);
}

.product-picker-code {
  font-family: var(--font-data);
  font-size: 12px;
  color: var(--text);
}

.product-picker-desc {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-picker-meta {
  font-family: var(--font-data);
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}

.product-picker-empty {
  padding: 12px;
  color: var(--muted);
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
}

/* Mobile */
@media (max-width: 760px) {
  .product-picker-search-row {
    grid-template-columns: 1fr;
  }

  .product-picker-option {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .product-picker-results {
    max-height: 320px;
  }
}


.product-picker-bottom-actions {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,.10);
  display: flex;
  justify-content: stretch;
}

.product-picker-search-other-btn {
  width: 100%;
  min-height: 36px;
  border-color: rgba(56,189,248,.45);
  background: rgba(56,189,248,.14);
  font-weight: 600;
}

.product-picker-search-other-btn:hover {
  border-color: rgba(56,189,248,.75);
  background: rgba(56,189,248,.22);
}


/*
  Buscador de proveedores Bigsys.
*/

.supplier-picker-panel {
  margin-top: 9px;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid rgba(56,189,248,.38);
  background: rgba(15,23,42,.96);
  box-shadow: 0 12px 28px rgba(0,0,0,.22);
}

.supplier-picker-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.supplier-picker-head strong {
  font-weight: 600;
  color: var(--text);
}

.supplier-picker-close {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.06);
  color: var(--text);
  border-radius: 999px;
  padding: 5px 9px;
  cursor: pointer;
}

.supplier-picker-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-bottom: 8px;
}

.supplier-picker-input {
  min-width: 0;
  height: 34px;
  padding: 7px 10px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.20);
  color: var(--text);
  outline: none;
}

.supplier-picker-input:focus {
  border-color: rgba(56,189,248,.65);
  box-shadow: 0 0 0 1px rgba(56,189,248,.22);
}

.supplier-picker-search-btn {
  height: 34px;
  min-height: 34px;
  padding: 7px 12px;
}

.supplier-picker-results {
  display: grid;
  gap: 6px;
  max-height: 260px;
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
}

.supplier-picker-option {
  width: 100%;
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  text-align: left;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.045);
  color: var(--text);
  cursor: pointer;
}

.supplier-picker-option:hover {
  border-color: rgba(56,189,248,.65);
  background: rgba(56,189,248,.13);
}

.supplier-picker-code {
  font-family: var(--font-data);
  font-size: 12px;
  color: var(--text);
}

.supplier-picker-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.supplier-picker-meta {
  font-family: var(--font-data);
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}

.supplier-picker-empty {
  padding: 12px;
  color: var(--muted);
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
}

/* Mobile */
@media (max-width: 760px) {
  .supplier-picker-search-row {
    grid-template-columns: 1fr;
  }

  .supplier-picker-option {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .supplier-picker-results {
    max-height: 320px;
  }
}


/*
  Estados visuales desde bigsys-line-intelligence.js:
  - ai-price-green/yellow/red/neutral
  - ai-factor-green/yellow/red/neutral
  - ai-intel-green/yellow/red/neutral
*/

.ai-price-green,
.ai-factor-green,
.ai-intel-green {
  border-color: rgba(34,197,94,.48) !important;
}

.ai-price-yellow,
.ai-factor-yellow,
.ai-intel-yellow {
  border-color: rgba(245,158,11,.58) !important;
  background: rgba(245,158,11,.13) !important;
}

.ai-price-red,
.ai-factor-red,
.ai-intel-red {
  border-color: rgba(239,68,68,.60) !important;
  background: rgba(239,68,68,.13) !important;
}

.ai-price-neutral,
.ai-factor-neutral,
.ai-intel-neutral {
  border-color: rgba(148,163,184,.28) !important;
  background: rgba(148,163,184,.08) !important;
}

.ai-field-diff.ai-price-green {
  background: rgba(34,197,94,.13) !important;
}

.ai-field-diff.ai-price-yellow {
  background: rgba(245,158,11,.13) !important;
}

.ai-field-diff.ai-price-red {
  background: rgba(239,68,68,.13) !important;
}

.ai-field-diff.ai-price-neutral {
  background: rgba(148,163,184,.08) !important;
}

.ai-field[title],
.ai-field-description[title] {
  cursor: pointer;
}


/*
  Estados visuales de Proveedor y Totales:
  - rojo: faltan datos clave o total final no cierra
  - amarillo: requiere revisión / diferencias internas
  - verde: validado/coherente
  - azul: edición manual pendiente
*/

/* Panel proveedor */
.supplier-correction-panel.supplier-status-red {
  border-color: rgba(239,68,68,.65) !important;
}

.supplier-correction-panel.supplier-status-yellow {
  border-color: rgba(245,158,11,.65) !important;
}

.supplier-correction-panel.supplier-status-green {
  border-color: rgba(34,197,94,.55) !important;
}

.supplier-correction-panel.supplier-status-manual {
  border-color: rgba(56,189,248,.65) !important;
}

/* Campos proveedor faltantes */
.supplier-field.supplier-field-missing {
  background: rgba(239,68,68,.16) !important;
  border-color: rgba(239,68,68,.55) !important;
}

.supplier-status-red .supplier-status-box {
  border-color: rgba(239,68,68,.55) !important;
  background: rgba(239,68,68,.12) !important;
}

.supplier-status-yellow .supplier-status-box {
  border-color: rgba(245,158,11,.55) !important;
  background: rgba(245,158,11,.12) !important;
}

.supplier-status-green .supplier-status-box {
  border-color: rgba(34,197,94,.45) !important;
  background: rgba(34,197,94,.10) !important;
}

.supplier-status-manual .supplier-status-box {
  border-color: rgba(56,189,248,.55) !important;
  background: rgba(56,189,248,.12) !important;
}

/* Panel totales */
.totals-correction-panel.totals-status-red {
  border-color: rgba(239,68,68,.65) !important;
}

.totals-correction-panel.totals-status-yellow {
  border-color: rgba(245,158,11,.65) !important;
}

.totals-correction-panel.totals-status-green {
  border-color: rgba(34,197,94,.55) !important;
}

.totals-correction-panel.totals-status-manual {
  border-color: rgba(56,189,248,.65) !important;
}

/* Campos totales faltantes */
.totals-field.totals-field-missing {
  background: rgba(239,68,68,.16) !important;
  border-color: rgba(239,68,68,.55) !important;
}

.totals-status-red .totals-status-box {
  border-color: rgba(239,68,68,.55) !important;
  background: rgba(239,68,68,.12) !important;
}

.totals-status-yellow .totals-status-box {
  border-color: rgba(245,158,11,.55) !important;
  background: rgba(245,158,11,.12) !important;
}

.totals-status-green .totals-status-box {
  border-color: rgba(34,197,94,.45) !important;
  background: rgba(34,197,94,.10) !important;
}

.totals-status-manual .totals-status-box {
  border-color: rgba(56,189,248,.55) !important;
  background: rgba(56,189,248,.12) !important;
}

/* El icono dentro del estado toma un tono más claro */
.supplier-status-box .supplier-status-control,
.totals-status-box .totals-status-control {
  background: transparent !important;
}


/*
  Facturas procesadas/preloaded:
  - Solo lectura.
  - No permite edición directa.
  - No permite aplicar IA, buscar producto/proveedor, confirmar ni finalizar.
*/

.invoice-readonly-banner {
  margin-bottom: 8px;
  padding: 9px 12px;
  border-radius: 14px;
  border: 1px solid rgba(245,158,11,.52);
  background: rgba(245,158,11,.13);
  color: var(--text);
  font-size: 12.5px;
  line-height: 1.35;
}

body.bigsys-invoice-readonly .invoice-line-card,
body.bigsys-invoice-readonly .supplier-correction-panel,
body.bigsys-invoice-readonly .totals-correction-panel {
  opacity: .92;
}

body.bigsys-invoice-readonly .line-edit-input,
body.bigsys-invoice-readonly .supplier-edit-input,
body.bigsys-invoice-readonly .totals-edit-input,
.readonly-input {
  cursor: default !important;
  opacity: .9;
}

body.bigsys-invoice-readonly .readonly-disabled-action {
  opacity: .42 !important;
  cursor: not-allowed !important;
  filter: grayscale(.25);
}

body.bigsys-invoice-readonly .ai-field-click,
body.bigsys-invoice-readonly .ai-field-description,
body.bigsys-invoice-readonly .supplier-suggestion,
body.bigsys-invoice-readonly .totals-suggestion {
  cursor: not-allowed !important;
}

body.bigsys-invoice-readonly .line-status-control,
body.bigsys-invoice-readonly .supplier-status-control,
body.bigsys-invoice-readonly .totals-status-control {
  cursor: not-allowed !important;
}

/* Mantiene filtros, navegación y visualización activos */
body.bigsys-invoice-readonly .filter-btn,
body.bigsys-invoice-readonly .doc-tab,
body.bigsys-invoice-readonly .doc-zoom-btn,
body.bigsys-invoice-readonly .doc-invoice-item {
  opacity: 1 !important;
  cursor: pointer !important;
}


.supplier-actions-wide {
  display: grid !important;
  grid-template-columns: 86px 44px 32px !important;
  gap: 8px !important;
  justify-content: end !important;
  align-items: center !important;
}

.btn-rebuild-suggestions {
  height: 32px;
  min-height: 32px;
  padding: 0 9px;
  border-radius: 999px;
  border-color: rgba(56,189,248,.45);
  background: rgba(56,189,248,.14);
  color: var(--text);
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

.btn-rebuild-suggestions:hover {
  border-color: rgba(56,189,248,.75);
  background: rgba(56,189,248,.22);
}

/* Da un poco más de ancho a acciones proveedor cuando tiene recalcular */
.supplier-correction-grid,
.supplier-suggestion-grid {
  grid-template-columns: var(--ui-line-status-width) minmax(0, 1fr) 170px 170px 180px !important;
}

@media (max-width: 1366px) and (min-width: 761px) {
  .supplier-correction-grid,
  .supplier-suggestion-grid {
    grid-template-columns: var(--ui-line-status-width) minmax(0, 1fr) 145px 145px 170px !important;
  }

  .supplier-actions-wide {
    grid-template-columns: 82px 42px 32px !important;
    gap: 7px !important;
  }
}

@media (max-width: 760px) {
  .supplier-actions-wide {
    grid-template-columns: 1fr 70px 40px !important;
    justify-content: start !important;
  }
}


.supplier-actions-with-rebuild {
  display: grid !important;
  grid-template-columns: 88px 54px 34px !important;
  gap: 8px !important;
  justify-content: end !important;
  align-items: center !important;
}

.btn-rebuild-suggestions {
  height: 32px;
  min-height: 32px;
  padding: 0 9px;
  border-radius: 999px;
  border-color: rgba(56,189,248,.45);
  background: rgba(56,189,248,.14);
  color: var(--text);
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

.btn-rebuild-suggestions:hover {
  border-color: rgba(56,189,248,.75);
  background: rgba(56,189,248,.22);
}

.btn-rebuild-suggestions:disabled {
  opacity: .65;
  cursor: wait;
}

/* Da más aire a la columna de acciones del proveedor */
.supplier-correction-grid,
.supplier-suggestion-grid {
  grid-template-columns: var(--ui-line-status-width) minmax(0, 1fr) 170px 170px 190px !important;
}

@media (max-width: 1366px) and (min-width: 761px) {
  .supplier-correction-grid,
  .supplier-suggestion-grid {
    grid-template-columns: var(--ui-line-status-width) minmax(0, 1fr) 145px 145px 180px !important;
  }

  .supplier-actions-with-rebuild {
    grid-template-columns: 84px 52px 32px !important;
    gap: 7px !important;
  }
}

@media (max-width: 760px) {
  .supplier-actions-with-rebuild {
    grid-template-columns: 1fr 70px 40px !important;
    justify-content: start !important;
  }
}


.supplier-picker-option-with-motivo {
  grid-template-columns: 82px minmax(0, 1fr) auto !important;
  align-items: center;
}

.supplier-picker-main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.supplier-picker-main .supplier-picker-name {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
}

.supplier-picker-motivo {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(148,163,184,.95);
  font-size: 10.8px;
  line-height: 1.2;
}

/* Destacar aprendizaje/CUIT sin exagerar */
.supplier-picker-motivo {
  border-left: 2px solid rgba(56,189,248,.38);
  padding-left: 6px;
}

.supplier-picker-option:hover .supplier-picker-motivo {
  color: rgba(226,242,255,.95);
  border-left-color: rgba(56,189,248,.75);
}

@media (max-width: 760px) {
  .supplier-picker-option-with-motivo {
    grid-template-columns: 1fr !important;
    gap: 5px;
  }

  .supplier-picker-motivo {
    white-space: normal;
  }
}


.invoice-readonly-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.btn-reopen-invoice {
  flex: 0 0 auto;
  height: 32px;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border-color: rgba(56,189,248,.50);
  background: rgba(56,189,248,.16);
  color: var(--text);
  font-size: 11.5px !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

.btn-reopen-invoice:hover {
  border-color: rgba(56,189,248,.78);
  background: rgba(56,189,248,.24);
}

@media (max-width: 760px) {
  .invoice-readonly-banner {
    display: grid;
    grid-template-columns: 1fr;
  }

  .btn-reopen-invoice {
    width: 100%;
  }
}


/*
  Botón girar imagen junto al zoom.
*/

.doc-zoom-simple.doc-zoom-with-rotate {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 1fr !important;
  gap: 6px;
}

.doc-rotate-btn {
  font-size: 17px !important;
  font-weight: 600 !important;
  border-color: rgba(56,189,248,.42) !important;
  background: rgba(56,189,248,.12) !important;
}

.doc-rotate-btn:hover {
  border-color: rgba(56,189,248,.72) !important;
  background: rgba(56,189,248,.22) !important;
}

.doc-preview-image {
  transition: transform .14s ease !important;
}

.doc-preview-scroll.preview-rotated {
  overflow: auto !important;
}

/* Mobile */
@media (max-width: 760px) {
  .doc-zoom-simple.doc-zoom-with-rotate {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }

  .doc-rotate-btn {
    min-height: 42px;
  }
}


/*
  Rotacion preview estable:
  - Fila zoom en 4 columnas.
  - Icono SVG real.
  - Evita desplazamiento visual raro.
*/

.doc-zoom-simple.doc-zoom-with-rotate {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 1fr !important;
  gap: 6px !important;
  align-items: center !important;
}

.doc-zoom-simple.doc-zoom-with-rotate .doc-zoom-btn {
  width: 100% !important;
  min-width: 0 !important;
}

.doc-rotate-btn {
  height: 38px !important;
  min-height: 38px !important;
  border-color: rgba(56,189,248,.50) !important;
  background: rgba(56,189,248,.14) !important;
  color: var(--text) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

.doc-rotate-btn:hover {
  border-color: rgba(56,189,248,.78) !important;
  background: rgba(56,189,248,.24) !important;
}

.preview-rotate-svg {
  width: 21px !important;
  height: 21px !important;
  display: block !important;
  fill: currentColor !important;
  pointer-events: none !important;
}

.doc-preview-scroll {
  position: relative;
}

.doc-preview-image {
  display: block !important;
  transition: transform .14s ease !important;
  will-change: transform;
}

.doc-preview-scroll.preview-rotated {
  overflow: auto !important;
}

/*
  Al rotar 90/270 la caja visual cambia, por eso damos aire interno
  para que no se corte ni se vaya contra la izquierda.
*/
.doc-preview-scroll[data-rotation="90"],
.doc-preview-scroll[data-rotation="270"] {
  padding: 14px 14px 80px 14px !important;
}

.doc-preview-scroll[data-rotation="180"] {
  padding: 14px 14px 40px 14px !important;
}

/* Mobile */
@media (max-width: 760px) {
  .doc-zoom-simple.doc-zoom-with-rotate {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }

  .doc-rotate-btn {
    height: 42px !important;
    min-height: 42px !important;
  }

  .preview-rotate-svg {
    width: 23px !important;
    height: 23px !important;
  }
}

.product-picker-option-rich,
.supplier-picker-option-rich {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
  text-align: left;
  padding: 10px 12px;
}

.product-picker-main-row,
.supplier-picker-main-row {
  display: grid;
  grid-template-columns: minmax(64px, auto) 1fr;
  gap: 10px;
  align-items: start;
  width: 100%;
}

.product-picker-code,
.supplier-picker-code {
  font-weight: 800;
  white-space: nowrap;
}

.product-picker-desc,
.supplier-picker-name {
  min-width: 0;
  overflow-wrap: anywhere;
}

.picker-rank-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  opacity: .84;
  font-size: 11px;
  line-height: 1.25;
}

.picker-rank-meta span {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(148, 163, 184, .13);
  border: 1px solid rgba(148, 163, 184, .16);
}

.picker-rank-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 1px;
}

.picker-chip {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .01em;
  border: 1px solid rgba(148, 163, 184, .22);
  background: rgba(148, 163, 184, .12);
  color: rgba(226, 232, 240, .88);
}

.picker-chip-good,
.picker-chip-price-good {
  background: rgba(34, 197, 94, .14);
  border-color: rgba(34, 197, 94, .30);
  color: rgba(187, 247, 208, .96);
}

.picker-chip-learn-soft {
  background: rgba(59, 130, 246, .12);
  border-color: rgba(59, 130, 246, .28);
  color: rgba(191, 219, 254, .96);
}

.picker-chip-learn-mid {
  background: rgba(168, 85, 247, .13);
  border-color: rgba(168, 85, 247, .30);
  color: rgba(233, 213, 255, .96);
}

.picker-chip-learn-strong {
  background: rgba(234, 179, 8, .14);
  border-color: rgba(234, 179, 8, .34);
  color: rgba(254, 240, 138, .96);
}

.picker-chip-price-mid {
  background: rgba(245, 158, 11, .13);
  border-color: rgba(245, 158, 11, .30);
  color: rgba(253, 230, 138, .96);
}

.picker-chip-price-bad {
  background: rgba(239, 68, 68, .13);
  border-color: rgba(239, 68, 68, .30);
  color: rgba(254, 202, 202, .96);
}

.picker-chip-muted {
  background: rgba(100, 116, 139, .12);
  border-color: rgba(100, 116, 139, .24);
  color: rgba(203, 213, 225, .82);
}

.picker-rank-reason {
  display: block;
  margin-top: 1px;
  color: rgba(203, 213, 225, .72);
  font-size: 11px;
  line-height: 1.28;
}

.product-picker-option:hover .picker-rank-reason,
.supplier-picker-option:hover .picker-rank-reason {
  color: rgba(241, 245, 249, .88);
}

@media (max-width: 900px) {
  .product-picker-main-row,
  .supplier-picker-main-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .picker-rank-meta,
  .picker-rank-chips {
    gap: 4px;
  }
}

/*
  Regla:
  Amarillo/rojo/verde son estados de revision, no candados.
  Solo body.bigsys-invoice-readonly puede bloquear edición.
*/
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-yellow,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-red,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-soft-green,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-green {
  pointer-events: auto !important;
}

body:not(.bigsys-invoice-readonly) .invoice-line-card.status-yellow .line-main,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-yellow .line-field,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-yellow .line-edit-input,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-red .line-edit-input,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-soft-green .line-edit-input,
body:not(.bigsys-invoice-readonly) .invoice-line-card.status-green .line-edit-input {
  pointer-events: auto !important;
  user-select: text !important;
}

body:not(.bigsys-invoice-readonly) .line-edit-input {
  cursor: text !important;
  opacity: 1 !important;
  position: relative;
  z-index: 5;
}

body:not(.bigsys-invoice-readonly) .line-field {
  position: relative;
  z-index: 4;
}

.btn-rebuild-suggestions-pending {
  background: rgba(245, 158, 11, .18) !important;
  border-color: rgba(245, 158, 11, .42) !important;
  color: rgba(255, 237, 213, .98) !important;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, .12), 0 10px 24px rgba(245, 158, 11, .08);
}

.supplier-rebuild-hint {
  flex-basis: 100%;
  margin-top: 6px;
  padding: 7px 9px;
  border-radius: 12px;
  background: rgba(245, 158, 11, .10);
  border: 1px solid rgba(245, 158, 11, .25);
  color: rgba(255, 237, 213, .92);
  font-size: 11.5px;
  line-height: 1.25;
}

body.bigsys-invoice-readonly .supplier-rebuild-hint {
  display: none;
}

/*
  El dropdown de productos vive dentro de la tarjeta de línea.
  La línea abierta debe quedar por encima de las líneas siguientes.
*/
.invoice-line-card {
  position: relative;
}

.invoice-line-card.product-picker-open,
.invoice-line-card:has(.product-picker-panel) {
  position: relative;
  z-index: 9000 !important;
  overflow: visible !important;
}

.invoice-line-card.product-picker-open .line-main,
.invoice-line-card.product-picker-open .line-ai-field-suggestions,
.invoice-line-card.product-picker-open .product-picker-panel,
.invoice-line-card:has(.product-picker-panel) .line-main,
.invoice-line-card:has(.product-picker-panel) .line-ai-field-suggestions,
.invoice-line-card:has(.product-picker-panel) .product-picker-panel {
  position: relative;
  z-index: 9010 !important;
}

.product-picker-panel {
  position: relative;
  z-index: 9020 !important;
  overflow: visible !important;
  isolation: isolate;
}

.product-picker-results {
  position: relative;
  z-index: 9030 !important;
  max-height: 340px;
  overflow-y: auto;
}

.product-picker-option {
  position: relative;
  z-index: 9040;
}

.invoice-line-card.product-picker-open ~ .invoice-line-card {
  z-index: 1;
}


/*
  Portal global del dropdown de productos.
  Queda fuera de las líneas para evitar conflictos de z-index/overflow.
*/
#bigsys-product-picker-portal.product-picker-portal {
  position: fixed !important;
  z-index: 2147483000 !important;
  display: none;
  pointer-events: auto !important;
  isolation: isolate;
}

#bigsys-product-picker-portal .product-picker-portal-panel,
#bigsys-product-picker-portal .product-picker-panel {
  width: 100%;
  max-height: inherit;
  overflow: hidden;
  border-radius: 18px;
  box-shadow:
    0 24px 80px rgba(0, 0, 0, .46),
    0 0 0 1px rgba(148, 163, 184, .24);
}

#bigsys-product-picker-portal .product-picker-results {
  max-height: min(360px, calc(100vh - 220px));
  overflow-y: auto;
  overscroll-behavior: contain;
}

#bigsys-product-picker-portal .product-picker-input {
  position: relative;
  z-index: 2;
}

#bigsys-product-picker-portal .product-picker-option {
  position: relative;
  z-index: 2;
}

body.product-picker-portal-open .product-picker-panel:not(#bigsys-product-picker-portal .product-picker-panel) {
  display: none !important;
}

@media (max-width: 980px) {
  #bigsys-product-picker-portal .product-picker-results {
    max-height: min(360px, calc(100vh - 190px));
  }
}


/*
  Portal global del buscador de proveedor.
  Evita que Totales/Líneas lo tapen.
*/
#bigsys-supplier-picker-portal.supplier-picker-portal {
  position: fixed !important;
  z-index: 2147483100 !important;
  display: none;
  pointer-events: auto !important;
  isolation: isolate;
}

#bigsys-supplier-picker-portal .supplier-picker-portal-panel,
#bigsys-supplier-picker-portal .supplier-picker-panel {
  width: 100%;
  max-height: inherit;
  overflow: hidden;
  border-radius: 18px;
  box-shadow:
    0 24px 80px rgba(0, 0, 0, .48),
    0 0 0 1px rgba(148, 163, 184, .24);
}

#bigsys-supplier-picker-portal .supplier-picker-results {
  max-height: min(340px, calc(100vh - 220px));
  overflow-y: auto;
  overscroll-behavior: contain;
}

#bigsys-supplier-picker-portal .supplier-picker-option {
  position: relative;
  z-index: 2;
}

#bigsys-supplier-picker-portal .supplier-picker-input {
  position: relative;
  z-index: 2;
}

body.supplier-picker-portal-open .supplier-picker-panel:not(#bigsys-supplier-picker-portal .supplier-picker-panel) {
  display: none !important;
}

@media (max-width: 980px) {
  #bigsys-supplier-picker-portal .supplier-picker-results {
    max-height: min(340px, calc(100vh - 190px));
  }
}


/*
  El aviso de recalcular NO debe ocupar espacio dentro del proveedor.
  Solo dejamos el botón resaltado y compacto.
*/
.supplier-rebuild-hint {
  display: none !important;
}

.supplier-actions,
.supplier-actions-wide,
.supplier-actions-with-rebuild {
  align-items: center !important;
}

.btn-rebuild-suggestions,
.btn-rebuild-suggestions-pending {
  white-space: nowrap !important;
  min-width: 82px !important;
  max-width: 120px !important;
  height: 34px !important;
  padding: 0 12px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.btn-rebuild-suggestions-pending {
  background: rgba(245, 158, 11, .16) !important;
  border-color: rgba(245, 158, 11, .48) !important;
  color: rgba(255, 237, 213, .98) !important;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, .16) !important;
}

.supplier-correction-panel {
  overflow: visible !important;
}

.supplier-correction-panel .supplier-actions {
  flex-wrap: nowrap !important;
}


.hidden-upload-input,
input[data-role="invoice-upload-input"] {
  position: fixed !important;
  left: -99999px !important;
  top: -99999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.btn-upload-server {
  white-space: nowrap !important;
}


.btn-process-ocr {
  white-space: nowrap !important;
  background: rgba(249, 115, 22, .18) !important;
  border-color: rgba(249, 115, 22, .50) !important;
  color: rgba(255, 237, 213, .98) !important;
  box-shadow: 0 0 0 1px rgba(249, 115, 22, .12), 0 10px 24px rgba(249, 115, 22, .08);
}

.btn-process-ocr:hover {
  background: rgba(249, 115, 22, .26) !important;
  border-color: rgba(249, 115, 22, .68) !important;
}

.btn-process-ocr:disabled {
  opacity: .65 !important;
  cursor: wait !important;
}


.btn-upload-multipage {
  white-space: nowrap !important;
  background: rgba(59, 130, 246, .16) !important;
  border-color: rgba(59, 130, 246, .48) !important;
  color: rgba(219, 234, 254, .98) !important;
  box-shadow: 0 0 0 1px rgba(59, 130, 246, .12), 0 10px 24px rgba(59, 130, 246, .08);
}

.btn-upload-multipage:hover {
  background: rgba(59, 130, 246, .24) !important;
  border-color: rgba(59, 130, 246, .68) !important;
}

.btn-upload-multipage:disabled {
  opacity: .65 !important;
  cursor: wait !important;
}


.doc-page-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 6px 0 2px;
}

.doc-page-btn {
  min-height: 28px;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, .26);
  background: rgba(15, 23, 42, .42);
  color: rgba(226, 232, 240, .84);
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
}

.doc-page-btn:hover {
  background: rgba(59, 130, 246, .16);
  border-color: rgba(59, 130, 246, .38);
  color: rgba(219, 234, 254, .98);
}

.doc-page-btn.active {
  background: rgba(59, 130, 246, .26);
  border-color: rgba(59, 130, 246, .62);
  color: rgba(219, 234, 254, 1);
  box-shadow: 0 0 0 1px rgba(59, 130, 246, .12);
}

.doc-page-meta {
  margin-top: 6px;
  padding: 5px 8px;
  border-radius: 10px;
  color: rgba(203, 213, 225, .78);
  background: rgba(15, 23, 42, .28);
  border: 1px solid rgba(148, 163, 184, .16);
  font-size: 11px;
}

.preview-page-row {
  margin-bottom: 8px;
}


.line-no-product-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(239, 68, 68, .13);
  border: 1px solid rgba(239, 68, 68, .32);
  color: rgba(254, 202, 202, .96);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  vertical-align: middle;
  white-space: nowrap;
}


.ai-field-qty {
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums;
}


/*
  Ajuste visual:
  - Descripción apenas más corta.
  - CANT / factor más ancho para que entre "1x12=120".
*/
.line-main {
  grid-template-columns:
    minmax(46px, 58px)
    minmax(300px, 1fr)
    minmax(82px, 92px)
    minmax(92px, 108px)
    minmax(104px, 118px)
    minmax(108px, 128px)
    minmax(118px, 150px) !important;
}

.line-ai-field-suggestions {
  grid-template-columns:
    minmax(46px, 58px)
    minmax(300px, 1fr)
    minmax(82px, 92px)
    minmax(92px, 108px)
    minmax(104px, 118px)
    minmax(108px, 128px)
    minmax(118px, 150px) !important;
}

.line-qty,
.ai-field-qty {
  min-width: 92px !important;
}

.ai-field-qty {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  font-size: 11.5px !important;
  letter-spacing: -0.02em;
}

.line-description,
.ai-field-description {
  min-width: 0 !important;
}

@media (max-width: 1200px) {
  .line-main,
  .line-ai-field-suggestions {
    grid-template-columns:
      minmax(42px, 52px)
      minmax(240px, 1fr)
      minmax(74px, 86px)
      minmax(88px, 102px)
      minmax(96px, 112px)
      minmax(100px, 120px)
      minmax(108px, 138px) !important;
  }
}


/*
  Mejora lectura de factor:
  1x12=120 / 2x6=12 / 1x30=30
*/
.ai-field-qty,
.line-qty .line-edit-input {
  letter-spacing: 0.025em !important;
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1 !important;
}

.ai-field-qty {
  padding-left: 8px !important;
  padding-right: 8px !important;
  text-align: center !important;
}


/* BIGSYS_SOFT_BUTTONS_V1_START */
/* Botones superiores y pestañas del visor: más claros, sin peso visual excesivo */

/* Tabs: Facturas / Ver factura / OCR */
.doc-tabs-main {
  display: flex;
  gap: 6px;
  padding: 5px;
  border-radius: 16px;
  background: rgba(15, 23, 42, .34);
  border: 1px solid rgba(148, 163, 184, .13);
}

.doc-tab {
  min-height: 31px;
  padding: 6px 11px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(148, 163, 184, .16) !important;
  background: rgba(255, 255, 255, .035) !important;
  color: rgba(226, 232, 240, .72) !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  letter-spacing: .01em;
  box-shadow: none !important;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .12s ease;
}

.doc-tab:hover {
  background: rgba(59, 130, 246, .11) !important;
  border-color: rgba(96, 165, 250, .28) !important;
  color: rgba(219, 234, 254, .96) !important;
  transform: translateY(-1px);
}

.doc-tab.active {
  background: linear-gradient(180deg, rgba(59, 130, 246, .24), rgba(37, 99, 235, .15)) !important;
  border-color: rgba(96, 165, 250, .42) !important;
  color: rgba(239, 246, 255, 1) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03), 0 8px 18px rgba(37,99,235,.08) !important;
}

/* Botones centrales: Subir facturas / Factura multipágina / Procesar OCR */
.unified-top-upload {
  gap: 7px !important;
}

.unified-top-upload .btn,
.btn-upload-server,
.btn-upload-multipage,
.btn-process-ocr {
  min-height: 32px !important;
  padding: 7px 12px !important;
  border-radius: 13px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .005em;
  box-shadow: none !important;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .12s ease, box-shadow .16s ease;
}

.btn-upload-server {
  background: rgba(15, 23, 42, .34) !important;
  border-color: rgba(148, 163, 184, .24) !important;
  color: rgba(226, 232, 240, .88) !important;
}

.btn-upload-server:hover {
  background: rgba(30, 41, 59, .46) !important;
  border-color: rgba(203, 213, 225, .32) !important;
  color: rgba(248, 250, 252, .98) !important;
  transform: translateY(-1px);
}

.btn-upload-multipage {
  background: rgba(37, 99, 235, .13) !important;
  border-color: rgba(96, 165, 250, .32) !important;
  color: rgba(219, 234, 254, .94) !important;
}

.btn-upload-multipage:hover {
  background: rgba(37, 99, 235, .20) !important;
  border-color: rgba(96, 165, 250, .46) !important;
  color: rgba(239, 246, 255, 1) !important;
  transform: translateY(-1px);
}

.btn-process-ocr {
  background: rgba(249, 115, 22, .16) !important;
  border-color: rgba(251, 146, 60, .42) !important;
  color: rgba(255, 237, 213, .98) !important;
  box-shadow: 0 8px 18px rgba(249, 115, 22, .06) !important;
}

.btn-process-ocr:hover {
  background: rgba(249, 115, 22, .24) !important;
  border-color: rgba(251, 146, 60, .58) !important;
  color: rgba(255, 247, 237, 1) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(249, 115, 22, .09) !important;
}

.btn-process-ocr:disabled,
.btn-upload-server:disabled,
.btn-upload-multipage:disabled {
  opacity: .62 !important;
  cursor: wait !important;
  transform: none !important;
}

/* Mantiene compacto en pantallas chicas */
@media (max-width: 1100px) {
  .doc-tab,
  .unified-top-upload .btn,
  .btn-upload-server,
  .btn-upload-multipage,
  .btn-process-ocr {
    padding-left: 9px !important;
    padding-right: 9px !important;
    font-size: 11.5px !important;
  }
}
/* BIGSYS_SOFT_BUTTONS_V1_END */


/* BIGSYS_UPLOAD_GROUP_SOFT_BG_V1_START */
/* Fondo suave para agrupar Subir / Multipágina / OCR sin hacerlo pesado */
.unified-top-upload {
  padding: 5px 6px !important;
  border-radius: 17px !important;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, .46), rgba(15, 23, 42, .28)),
    radial-gradient(circle at 85% 50%, rgba(249, 115, 22, .08), transparent 55%),
    radial-gradient(circle at 10% 50%, rgba(59, 130, 246, .08), transparent 55%) !important;
  border: 1px solid rgba(148, 163, 184, .16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 8px 22px rgba(0,0,0,.10) !important;
}

.unified-top-upload:hover {
  border-color: rgba(148, 163, 184, .23) !important;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, .52), rgba(15, 23, 42, .32)),
    radial-gradient(circle at 85% 50%, rgba(249, 115, 22, .10), transparent 55%),
    radial-gradient(circle at 10% 50%, rgba(59, 130, 246, .10), transparent 55%) !important;
}

/* OCR mantiene protagonismo leve dentro del grupo */
.unified-top-upload .btn-process-ocr {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 8px 18px rgba(249, 115, 22, .075) !important;
}

/* Multipágina queda diferenciado pero más sobrio */
.unified-top-upload .btn-upload-multipage {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 8px 18px rgba(59, 130, 246, .055) !important;
}

@media (max-width: 1100px) {
  .unified-top-upload {
    padding: 4px 5px !important;
    border-radius: 15px !important;
  }
}
/* BIGSYS_UPLOAD_GROUP_SOFT_BG_V1_END */


/* BIGSYS_BULK_OCR_SELECTION_CSS_V1_START */
.doc-bulk-ocr-toolbar {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
  padding: 9px;
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, .48), rgba(15, 23, 42, .28)),
    radial-gradient(circle at 90% 50%, rgba(249, 115, 22, .10), transparent 55%);
  border: 1px solid rgba(148, 163, 184, .16);
}

.doc-bulk-ocr-title {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  color: rgba(226, 232, 240, .90);
  font-size: 12px;
}

.doc-bulk-ocr-title span {
  color: rgba(148, 163, 184, .95);
  font-size: 11px;
}

.doc-bulk-ocr-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

.doc-bulk-ocr-mini,
.doc-bulk-ocr-run {
  min-height: 29px;
  border-radius: 11px;
  border: 1px solid rgba(148, 163, 184, .22);
  background: rgba(15, 23, 42, .38);
  color: rgba(226, 232, 240, .84);
  font-size: 11.5px;
  font-weight: 800;
  padding: 5px 9px;
  cursor: pointer;
}

.doc-bulk-ocr-run {
  margin-left: auto;
  background: rgba(249, 115, 22, .17);
  border-color: rgba(251, 146, 60, .42);
  color: rgba(255, 237, 213, .98);
}

.doc-bulk-ocr-mini:hover,
.doc-bulk-ocr-run:hover {
  transform: translateY(-1px);
}

.doc-bulk-ocr-mini:disabled,
.doc-bulk-ocr-run:disabled,
.doc-invoice-check:disabled {
  opacity: .55;
  cursor: not-allowed;
  transform: none;
}

.doc-invoice-list-with-checks {
  display: grid;
  gap: 7px;
}

.doc-invoice-row {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 7px;
  align-items: stretch;
}

.doc-invoice-check {
  border-radius: 11px;
  border: 1px solid rgba(148, 163, 184, .22);
  background: rgba(15, 23, 42, .36);
  color: rgba(219, 234, 254, .98);
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
}

.doc-invoice-row.checked .doc-invoice-check {
  background: rgba(249, 115, 22, .18);
  border-color: rgba(251, 146, 60, .52);
  color: rgba(255, 237, 213, 1);
}

.doc-invoice-row.active .doc-invoice-check {
  border-color: rgba(96, 165, 250, .48);
}

.doc-invoice-row.locked {
  opacity: .72;
}

.doc-invoice-item-row {
  width: 100%;
  text-align: left;
}
/* BIGSYS_BULK_OCR_SELECTION_CSS_V1_END */


/* BIGSYS_BULK_CHECK_SQUARE_V3_START */
/* Check de OCR por lote: chico, claro, no tipo burbuja */
.bulk-ocr-row {
  grid-template-columns: 22px 1fr !important;
  gap: 7px !important;
  align-items: stretch !important;
}

.bulk-ocr-check-visible {
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  min-height: 22px !important;
  height: 22px !important;
  align-self: center !important;
  border-radius: 6px !important;
  border: 1px solid rgba(148, 163, 184, .34) !important;
  background: rgba(15, 23, 42, .42) !important;
  color: rgba(255, 237, 213, .98) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  font-weight: 900 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.bulk-ocr-row.checked .bulk-ocr-check-visible {
  background: rgba(249, 115, 22, .20) !important;
  border-color: rgba(251, 146, 60, .58) !important;
}

.bulk-ocr-check-visible:hover {
  border-color: rgba(251, 146, 60, .55) !important;
  background: rgba(249, 115, 22, .12) !important;
}

.bulk-ocr-row.locked .bulk-ocr-check-visible {
  background: rgba(15, 23, 42, .25) !important;
  color: rgba(148, 163, 184, .45) !important;
}
/* BIGSYS_BULK_CHECK_SQUARE_V3_END */


/* Check icon visible */
.btn-line-confirm svg,
.line-status-check svg,
.supplier-status-control svg,
.totals-status-control svg,
.btn-line-confirm .confirm-icon svg {
  width: 15px !important;
  height: 15px !important;
  display: block !important;
  fill: currentColor !important;
}

.btn-line-confirm,
.line-status-check,
.supplier-status-control,
.totals-status-control {
  color: rgba(187, 247, 208, .98) !important;
}

/* Check icon visible */
.btn-line-confirm svg,
.line-status-check svg,
.supplier-status-control svg,
.totals-status-control svg,
.btn-line-confirm .confirm-icon svg {
  width: 15px !important;
  height: 15px !important;
  display: block !important;
  fill: currentColor !important;
}

.btn-line-confirm,
.line-status-check,
.supplier-status-control,
.totals-status-control {
  color: rgba(187, 247, 208, .98) !important;
}


/* BIGSYS_LINE_READINESS_V3 */
.line-ready-warning{
  margin-top: 6px;
  font-size: 11px;
  line-height: 1.25;
  color: #facc15;
  opacity: .95;
}
.line-card.yellow .line-ready-warning,
.invoice-line-card.status-soft-yellow .line-ready-warning{
  color: #facc15;
}
.line-card.red .line-ready-warning,
.invoice-line-card.status-soft-red .line-ready-warning{
  color: #f87171;
}


/* BIGSYS_STOCK_FIELD_COMPACT_V4 */
.line-qty-compact{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
}
.line-qty-compact .qty-mini-row{
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
}
.line-qty-compact .qty-mini-label{
  font-size:9px;
  line-height:1;
  opacity:.65;
  min-width:28px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.line-qty-compact .qty-mini-input{
  height:19px !important;
  min-height:19px !important;
  padding:1px 5px !important;
  font-size:11px !important;
  line-height:1.1 !important;
}
.line-qty-compact .qty-stock-row .qty-mini-label{
  opacity:.9;
}




/* BIGSYS_WARNING_INLINE_LABEL_V1_CSS */
.line-label-with-warning{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.line-ready-warning-inline{
  color:#facc15;
  font-size:10px;
  line-height:1;
  font-weight:700;
  opacity:.95;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:78%;
}
.ai-desc-spacer{
  min-height:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.ai-stock-ia em{
  display:flex;
  flex-direction:column;
  gap:1px;
  align-items:center;
  justify-content:center;
  line-height:1.05;
}
.ai-stock-ia .stock-ia-line{
  display:block;
  font-size:11px;
  line-height:1.05;
  white-space:nowrap;
}


/* BIGSYS_STOCK_APPLIED_VISIBLE_V1_CSS */
.ai-stock-ia em{
  display:flex;
  flex-direction:column;
  gap:1px;
  align-items:center;
  justify-content:center;
  line-height:1.05;
}
.ai-stock-ia .stock-ia-line{
  display:block;
  font-size:11px;
  line-height:1.05;
  white-space:nowrap;
}
.ai-stock-applied{
  background: rgba(34,197,94,.20) !important;
  border-color: rgba(34,197,94,.55) !important;
  box-shadow: 0 0 0 1px rgba(34,197,94,.18) inset;
}
.ai-stock-applied .stock-ia-ok{
  color:#bbf7d0;
  font-weight:800;
}

/* BIGSYS_FINAL_STOCK_OVERRIDE_V1_CSS */
.ai-desc-spacer{
  min-height:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.ai-stock-ia em{
  display:flex;
  flex-direction:column;
  gap:1px;
  align-items:center;
  justify-content:center;
  line-height:1.05;
}
.ai-stock-ia .stock-ia-line{
  display:block;
  font-size:11px;
  line-height:1.05;
  white-space:nowrap;
}
.ai-stock-applied{
  background: rgba(34,197,94,.20) !important;
  border-color: rgba(34,197,94,.55) !important;
  box-shadow: 0 0 0 1px rgba(34,197,94,.18) inset;
}
.ai-stock-applied .stock-ia-ok{
  color:#bbf7d0;
  font-weight:800;
}


/* BIGSYS_STOCK_NOTICE_ON_QTY_V1_CSS */
.stock-applied-main-notice{
  margin-top:3px;
  font-size:9.5px;
  line-height:1.05;
  color:#bbf7d0;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  opacity:.95;
}
.line-field.line-qty.field-ai-applied .stock-applied-main-notice,
.line-field.line-qty.field-local-confirmed .stock-applied-main-notice{
  color:#bbf7d0;
}


/* BIGSYS_STOCK_NOTICE_COMPACT_V2_CSS */
.stock-applied-main-notice{
  display:none !important;
}

.line-field.line-qty .line-label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
}

.qty-label-left{
  min-width:0;
}

.qty-label-right{
  font-size:9px;
  line-height:1;
  color:#86efac;
  opacity:.95;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.qty-stock-compact-v2{
  display:grid;
  grid-template-columns: 1fr auto auto;
  align-items:center;
  gap:6px;
  width:100%;
  min-width:0;
}

.qty-stock-compact-v2 .line-edit-input{
  min-width:0 !important;
  width:100% !important;
}

.qty-stock-separator{
  display:block;
  width:1px;
  height:18px;
  background:rgba(148,163,184,.35);
}

.qty-stock-value{
  min-width:24px;
  text-align:right;
  color:#bbf7d0;
  font-size:12px;
  line-height:1;
  font-weight:800;
  white-space:nowrap;
}


/* BIGSYS_QTY_STOCK_INLINE_V3_CSS */

/* Anula avisos anteriores abajo del campo */
.stock-applied-main-notice{
  display:none !important;
}

/* Evita que el compact V2 siga agrandando el campo */
.qty-stock-compact-v2{
  display:contents !important;
}
.qty-stock-compact-v2 .qty-stock-separator,
.qty-stock-compact-v2 .qty-stock-value{
  display:none !important;
}

.line-field.line-qty .qty-stock-label-v3{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  width:100%;
}

.line-field.line-qty .qty-stock-label-v3 span:last-child{
  color:#86efac;
  font-size:9px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.qty-stock-inline-v3{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 1px auto;
  align-items:center;
  gap:6px;
  width:100%;
  min-width:0;
}

.qty-stock-inline-v3 .line-edit-input{
  width:100% !important;
  min-width:0 !important;
  height:22px !important;
  min-height:22px !important;
  padding-top:2px !important;
  padding-bottom:2px !important;
}

.qty-stock-sep-v3{
  display:block;
  width:1px;
  height:18px;
  background:rgba(148,163,184,.38);
}

.qty-stock-value-v3{
  color:#bbf7d0;
  font-size:12px;
  font-weight:800;
  line-height:1;
  min-width:22px;
  text-align:right;
  white-space:nowrap;
}


/* BIGSYS_SELECTED_INVOICE_LEFT_V1_CSS */
#app-region-left .invoice-selected-left{
  position: relative;
  background: rgba(15, 23, 42, .74) !important;
  border-color: rgba(56, 189, 248, .55) !important;
  box-shadow:
    inset 0 0 0 1px rgba(56, 189, 248, .18),
    0 0 0 1px rgba(56, 189, 248, .10) !important;
}

#app-region-left .invoice-selected-left::before{
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: rgba(56, 189, 248, .95);
  box-shadow: 0 0 10px rgba(56, 189, 248, .35);
}

#app-region-left .invoice-selected-left:hover{
  background: rgba(15, 23, 42, .82) !important;
}


/* BIGSYS_QTY_STOCK_NUMBERS_BIGGER_V1 */
/* Agranda solo los números de Cant. y Stock aplicado */
.line-field.line-qty .line-edit-input,
.qty-stock-inline-v3 .line-edit-input{
  font-size: 14px !important;
  font-weight: 700 !important;
}

.qty-stock-value-v3{
  font-size: 14px !important;
  font-weight: 800 !important;
  min-width: 26px !important;
}

/* Mantiene los labels chicos */
.line-field.line-qty .line-label,
.qty-stock-label-v3{
  font-size: 10px !important;
}


/* BIGSYS_QTY_STOCK_WEIGHT_V1 */
/* Mantiene el tamaño, pero baja el peso visual de Cant. y Stock */
.line-field.line-qty .line-edit-input,
.qty-stock-inline-v3 .line-edit-input{
  font-weight: 500 !important;
}

.qty-stock-value-v3{
  font-weight: 600 !important;
}

.qty-stock-label-v3 span:last-child,
.qty-label-right{
  font-weight: 600 !important;
}


/* BIGSYS_QTY_STOCK_NUMBERS_UP_V2 */
/* Agranda visiblemente los dos números del bloque Cant./Stock */
.line-field.line-qty .line-edit-input,
.qty-stock-inline-v3 .line-edit-input{
  font-size: 16px !important;
  line-height: 1 !important;
}

.qty-stock-value-v3{
  font-size: 16px !important;
  line-height: 1 !important;
  min-width: 30px !important;
}

/* Mantener etiquetas discretas */
.line-field.line-qty .line-label,
.qty-stock-label-v3{
  font-size: 10px !important;
}


/* BIGSYS_BOTTOM_SCROLL_LINES_V1 */
/* Aire inferior para poder editar cómodamente las últimas líneas */
#app-region-center,
.app-region-center{
  scroll-padding-bottom: 170px !important;
}

#app-region-center .invoice-line-card:last-child,
.app-region-center .invoice-line-card:last-child{
  margin-bottom: 150px !important;
  scroll-margin-bottom: 170px !important;
}

/* Si el contenedor de líneas es el que scrollea, también le damos aire */
#app-region-center .zone-lines,
#app-region-center .lines-zone,
#app-region-center .invoice-lines,
#app-region-center .invoice-lines-list,
#app-region-center [data-zone="lines"],
.app-region-center .zone-lines,
.app-region-center .lines-zone,
.app-region-center .invoice-lines,
.app-region-center .invoice-lines-list,
.app-region-center [data-zone="lines"]{
  padding-bottom: 150px !important;
  scroll-padding-bottom: 170px !important;
}

/* Evita saltos bruscos al hacer foco en inputs de las últimas líneas */
.invoice-line-card{
  scroll-margin-top: 95px !important;
  scroll-margin-bottom: 150px !important;
}

.invoice-line-card:last-child .line-edit-input,
.invoice-line-card:nth-last-child(2) .line-edit-input,
.invoice-line-card:nth-last-child(3) .line-edit-input{
  scroll-margin-bottom: 170px !important;
}


/* BIGSYS_BULK_OCR_ONLY_NO_OCR_V1_CSS */

/* Mantiene alineación cuando una factura ya tiene OCR y no muestra check */
.doc-invoice-check-spacer{
  width: 28px;
  min-width: 28px;
  height: 28px;
  display: inline-block;
  opacity: 0;
}

/* Selección OCR por lote: naranja, diferente del seleccionado azul */
.doc-invoice-row.bulk-ocr-checked .doc-invoice-item,
.doc-invoice-row.checked .doc-invoice-item{
  background: rgba(251, 146, 60, .16) !important;
  border-color: rgba(251, 146, 60, .55) !important;
  box-shadow:
    inset 0 0 0 1px rgba(251, 146, 60, .18),
    0 0 0 1px rgba(251, 146, 60, .08) !important;
}

.doc-invoice-row.bulk-ocr-checked .doc-invoice-check,
.doc-invoice-row.checked .doc-invoice-check{
  border-color: rgba(251, 146, 60, .75) !important;
  background: rgba(251, 146, 60, .22) !important;
}

/* Facturas que ya tienen OCR: sin check visible, solo carga normal */
.doc-invoice-row.bulk-ocr-not-eligible .doc-invoice-item{
  opacity: .96;
}

/* Si una fila está abierta/activa y además marcada para OCR, gana el naranja solo en la cápsula interna */
.doc-invoice-row.active.bulk-ocr-checked .doc-invoice-item{
  border-color: rgba(251, 146, 60, .70) !important;
}


/* BIGSYS_BULK_OCR_CHECK_ICON_V1 */
/* Check visible dentro de la burbuja de OCR por lote */
.doc-invoice-row.bulk-ocr-checked .doc-invoice-check,
.doc-invoice-row.checked .doc-invoice-check{
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  color: #fed7aa !important;
}

.doc-invoice-row.bulk-ocr-checked .doc-invoice-check::after,
.doc-invoice-row.checked .doc-invoice-check::after{
  content: "";
  font-size: 14px;
  line-height: 1;
  font-weight: 900;
  color: #fed7aa;
  text-shadow: 0 0 8px rgba(251,146,60,.35);
}

/* Sin marcar: burbuja vacía */
.doc-invoice-row.bulk-ocr-eligible:not(.bulk-ocr-checked):not(.checked) .doc-invoice-check::after{
  content: "";
}


/* BIGSYS_BULK_OCR_REAL_CHECK_V2 */
/* Check real dentro de la burbuja OCR por lote */
.doc-invoice-check{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:14px !important;
  font-weight:900 !important;
  line-height:1 !important;
}

.doc-invoice-row.bulk-ocr-checked .doc-invoice-check,
.doc-invoice-row.checked .doc-invoice-check{
  color:#fed7aa !important;
  border-color:rgba(251,146,60,.80) !important;
  background:rgba(251,146,60,.26) !important;
  text-shadow:0 0 8px rgba(251,146,60,.45);
}

/* Si había pseudo-check anterior, lo anulamos para no duplicar */
.doc-invoice-row.bulk-ocr-checked .doc-invoice-check::after,
.doc-invoice-row.checked .doc-invoice-check::after{
  content:"" !important;
}


/* BIGSYS_BULK_OCR_CHECK_VISIBLE_V3 */
.doc-invoice-check{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:28px !important;
  min-width:28px !important;
  height:28px !important;
  min-height:28px !important;
  font-size:16px !important;
  font-weight:900 !important;
  line-height:1 !important;
}

.doc-invoice-row.checked .doc-invoice-check,
.doc-invoice-row.bulk-ocr-checked .doc-invoice-check{
  color:#fed7aa !important;
  border-color:rgba(251,146,60,.85) !important;
  background:rgba(251,146,60,.28) !important;
  text-shadow:0 0 8px rgba(251,146,60,.45);
}

.doc-invoice-row.checked .doc-invoice-check::after,
.doc-invoice-row.bulk-ocr-checked .doc-invoice-check::after{
  content:"" !important;
}



/* Oculta los botones originales del centro para no duplicarlos */
#app-region-center [data-action="triggerUploadInvoices"],
#app-region-center [data-action="triggerUploadMultipageInvoice"],
#app-region-center [data-action="processCurrentInvoiceOcr"],
.app-region-center [data-action="triggerUploadInvoices"],
.app-region-center [data-action="triggerUploadMultipageInvoice"],
.app-region-center [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
}

/* Si estaban en zona filtros también los ocultamos, pero no tocamos los del header */
#app-region-left [data-action="triggerUploadInvoices"],
#app-region-left [data-action="triggerUploadMultipageInvoice"],
#app-region-left [data-action="processCurrentInvoiceOcr"],
#app-region-bottom [data-action="triggerUploadInvoices"],
#app-region-bottom [data-action="triggerUploadMultipageInvoice"],
#app-region-bottom [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
}

.bigsys-header-quick-actions [data-action="triggerUploadInvoices"],
.bigsys-header-quick-actions [data-action="triggerUploadMultipageInvoice"],
.bigsys-header-quick-actions [data-action="processCurrentInvoiceOcr"]{
  display:inline-flex !important;
}



/* Ocultar duplicados fuera del panel izquierdo */
#app-region-top .bigsys-header-quick-actions,
.app-region-top .bigsys-header-quick-actions{
  display:none !important;
}

#app-region-center [data-action="triggerUploadInvoices"],
#app-region-center [data-action="triggerUploadMultipageInvoice"],
#app-region-center [data-action="processCurrentInvoiceOcr"],
.app-region-center [data-action="triggerUploadInvoices"],
.app-region-center [data-action="triggerUploadMultipageInvoice"],
.app-region-center [data-action="processCurrentInvoiceOcr"],
#app-region-bottom [data-action="triggerUploadInvoices"],
#app-region-bottom [data-action="triggerUploadMultipageInvoice"],
#app-region-bottom [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
}

/* Pero mantener visibles los nuevos del panel izquierdo */
.bigsys-left-quick-actions [data-action="triggerUploadInvoices"],
.bigsys-left-quick-actions [data-action="triggerUploadMultipageInvoice"],
.bigsys-left-quick-actions [data-action="processCurrentInvoiceOcr"]{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
}



/* Misma barra de Factura / Ver factura / OCR, sin segunda burbuja */
.bigsys-doc-tabs-with-actions{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  flex-wrap:nowrap !important;
  overflow:hidden !important;
}

.bigsys-doc-tabs-with-actions > button,
.bigsys-doc-tabs-with-actions [data-action="setDocumentView"]{
  flex:0 0 auto !important;
  white-space:nowrap !important;
}

.bigsys-doc-tabs-extra-actions{
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
  margin-left:auto !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
}

.bigsys-tabs-mini-action{
  height:24px !important;
  min-height:24px !important;
  padding:4px 7px !important;
  border-radius:999px !important;
  border:1px solid rgba(148,163,184,.24) !important;
  background:rgba(30,41,59,.62) !important;
  color:#e5e7eb !important;
  font-size:10px !important;
  font-weight:700 !important;
  line-height:1 !important;
  cursor:pointer !important;
  white-space:nowrap !important;
}

.bigsys-tabs-mini-action:hover{
  background:rgba(51,65,85,.78) !important;
  border-color:rgba(148,163,184,.42) !important;
}

.bigsys-tabs-upload{
  color:#bfdbfe !important;
}

.bigsys-tabs-multi{
  color:#ddd6fe !important;
}

.bigsys-tabs-ocr{
  color:#bbf7d0 !important;
  border-color:rgba(34,197,94,.34) !important;
  background:rgba(22,101,52,.20) !important;
}

/* Ocultar duplicados del centro/bottom/header, pero NO los de la barra izquierda */
#app-region-top .bigsys-header-quick-actions,
.app-region-top .bigsys-header-quick-actions,
.bigsys-left-quick-actions{
  display:none !important;
}

#app-region-center [data-action="triggerUploadInvoices"],
#app-region-center [data-action="triggerUploadMultipageInvoice"],
#app-region-center [data-action="processCurrentInvoiceOcr"],
.app-region-center [data-action="triggerUploadInvoices"],
.app-region-center [data-action="triggerUploadMultipageInvoice"],
.app-region-center [data-action="processCurrentInvoiceOcr"],
#app-region-bottom [data-action="triggerUploadInvoices"],
#app-region-bottom [data-action="triggerUploadMultipageInvoice"],
#app-region-bottom [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
}

.bigsys-doc-tabs-extra-actions [data-action="triggerUploadInvoices"],
.bigsys-doc-tabs-extra-actions [data-action="triggerUploadMultipageInvoice"],
.bigsys-doc-tabs-extra-actions [data-action="processCurrentInvoiceOcr"]{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}


/* BIGSYS_DOC_PANEL_TWO_BUTTON_ROWS_V1_CSS */
.document-panel .doc-tabs-shell{
  display:flex;
  flex-direction:column;
  gap:6px;
  width:100%;
}

.document-panel .doc-tabs-main,
.document-panel .doc-tabs-actions{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:6px !important;
  width:100%;
}

.document-panel .doc-tabs-main .doc-tab,
.document-panel .doc-tabs-actions .doc-tab{
  min-width:0 !important;
  width:100% !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.document-panel .doc-tabs-actions .doc-tab-action{
  min-height:28px !important;
  padding:6px 7px !important;
  font-size:11px !important;
  font-weight:700 !important;
  border-radius:10px !important;
  background:rgba(30,41,59,.52) !important;
  border:1px solid rgba(148,163,184,.22) !important;
  color:#dbeafe !important;
}

.document-panel .doc-tabs-actions .doc-tab-action:hover{
  background:rgba(51,65,85,.72) !important;
  border-color:rgba(148,163,184,.40) !important;
}

.document-panel .doc-tabs-actions .doc-tab-ocr-action{
  color:#bbf7d0 !important;
  border-color:rgba(34,197,94,.30) !important;
  background:rgba(22,101,52,.18) !important;
}

/* Ocultar los botones originales de la barra superior para no duplicar */
#app-region-top [data-action="triggerUploadInvoices"],
#app-region-top [data-action="triggerUploadMultipageInvoice"],
#app-region-top [data-action="processCurrentInvoiceOcr"],
.app-region-top [data-action="triggerUploadInvoices"],
.app-region-top [data-action="triggerUploadMultipageInvoice"],
.app-region-top [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
}

/* Mantener visibles los nuevos dentro del panel de documento */
.document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
.document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
.document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"]{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}


/* BIGSYS_DOC_PANEL_BUTTONS_VISIBLE_V1 */
/* Fuerza dos filas visibles dentro del panel Facturas / Ver factura / OCR */
.document-panel .doc-tabs-shell{
  display:flex !important;
  flex-direction:column !important;
  gap:6px !important;
  width:100% !important;
}

.document-panel .doc-tabs-main,
.document-panel .doc-tabs-actions{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
}

.document-panel .doc-tabs-actions{
  visibility:visible !important;
  opacity:1 !important;
  height:auto !important;
  min-height:28px !important;
  pointer-events:auto !important;
}

.document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
.document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
.document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"]{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  width:100% !important;
  height:28px !important;
  min-height:28px !important;
  padding:5px 6px !important;
  border-radius:10px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  background:rgba(30,41,59,.64) !important;
  border:1px solid rgba(148,163,184,.25) !important;
  color:#dbeafe !important;
}

.document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"]{
  color:#bbf7d0 !important;
  border-color:rgba(34,197,94,.36) !important;
  background:rgba(22,101,52,.20) !important;
}

.document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"]{
  color:#ddd6fe !important;
}


/* BIGSYS_DOC_PANEL_BUTTONS_ABOVE_TABS_V1 */
.document-panel .doc-tabs-shell{
  display:flex !important;
  flex-direction:column !important;
  gap:6px !important;
  width:100% !important;
}

/* Fila superior: acciones */
.document-panel .doc-tabs-actions{
  order:1 !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
}

/* Fila inferior: vistas */
.document-panel .doc-tabs-main{
  order:2 !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
}

.document-panel .doc-tabs-actions .doc-tab-action{
  min-height:28px !important;
  height:28px !important;
  padding:5px 6px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  line-height:1 !important;
  border-radius:10px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.document-panel .doc-tabs-actions .doc-tab-ocr-action{
  color:#bbf7d0 !important;
  border-color:rgba(34,197,94,.36) !important;
  background:rgba(22,101,52,.20) !important;
}


/* BIGSYS_LEFT_DOC_BUTTONS_VISIBLE_V2 */
/* Forzar visibles los 3 botones de acciones dentro del panel izquierdo */
#app-region-left .document-panel .doc-tabs-shell,
.app-region-left .document-panel .doc-tabs-shell{
  display:flex !important;
  flex-direction:column !important;
  gap:6px !important;
  width:100% !important;
}

#app-region-left .document-panel .doc-tabs-actions,
.app-region-left .document-panel .doc-tabs-actions{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
  height:auto !important;
  min-height:28px !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  order:1 !important;
}

#app-region-left .document-panel .doc-tabs-main,
.app-region-left .document-panel .doc-tabs-main{
  order:2 !important;
}

#app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
#app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
#app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"],
.app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
.app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
.app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"]{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  width:100% !important;
  height:28px !important;
  min-height:28px !important;
  padding:5px 6px !important;
  border-radius:10px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  background:rgba(30,41,59,.64) !important;
  border:1px solid rgba(148,163,184,.28) !important;
  color:#dbeafe !important;
}

#app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
.app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"]{
  color:#ddd6fe !important;
}

#app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"],
.app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"]{
  color:#bbf7d0 !important;
  border-color:rgba(34,197,94,.36) !important;
  background:rgba(22,101,52,.20) !important;
}


/* BIGSYS_DOC_PANEL_TOP_BUTTONS_BLUE_V1 */
/* Botones superiores del panel izquierdo: Subir / Multipágina / OCR */
.document-panel .doc-tabs-actions .doc-tab-action{
  background: linear-gradient(180deg, rgba(30,64,175,.42), rgba(15,23,42,.62)) !important;
  border-color: rgba(96,165,250,.48) !important;
  color: #dbeafe !important;
  box-shadow:
    inset 0 0 0 1px rgba(147,197,253,.08),
    0 0 12px rgba(37,99,235,.10) !important;
}

.document-panel .doc-tabs-actions .doc-tab-action:hover{
  background: linear-gradient(180deg, rgba(37,99,235,.52), rgba(30,41,59,.74)) !important;
  border-color: rgba(147,197,253,.65) !important;
}

.document-panel .doc-tabs-actions .doc-tab-ocr-action{
  background: linear-gradient(180deg, rgba(14,116,144,.42), rgba(15,23,42,.62)) !important;
  border-color: rgba(34,211,238,.45) !important;
  color: #ccfbf1 !important;
}

.document-panel .doc-tabs-actions .doc-tab-ocr-action:hover{
  background: linear-gradient(180deg, rgba(8,145,178,.52), rgba(30,41,59,.74)) !important;
  border-color: rgba(103,232,249,.62) !important;
}


/* BIGSYS_LEFT_DOC_BUTTONS_BLUE_HIDE_TOP_V2 */

/* Ocultar botones originales del centro/barra superior */
#app-region-top [data-action="triggerUploadInvoices"],
#app-region-top [data-action="triggerUploadMultipageInvoice"],
#app-region-top [data-action="processCurrentInvoiceOcr"],
.app-region-top [data-action="triggerUploadInvoices"],
.app-region-top [data-action="triggerUploadMultipageInvoice"],
.app-region-top [data-action="processCurrentInvoiceOcr"],
#app-sticky-actions [data-action="triggerUploadInvoices"],
#app-sticky-actions [data-action="triggerUploadMultipageInvoice"],
#app-sticky-actions [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* Mantener visibles SOLO los botones nuevos del panel izquierdo */
#app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
#app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
#app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"],
.app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
.app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
.app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"]{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

/* Fondo azul más visible para la fila superior del panel izquierdo */
#app-region-left .document-panel .doc-tabs-actions .doc-tab-action,
.app-region-left .document-panel .doc-tabs-actions .doc-tab-action{
  background: linear-gradient(180deg, rgba(37,99,235,.58), rgba(30,64,175,.34)) !important;
  border-color: rgba(96,165,250,.75) !important;
  color: #e0f2fe !important;
  box-shadow:
    inset 0 0 0 1px rgba(191,219,254,.12),
    0 0 12px rgba(37,99,235,.18) !important;
}

/* Hover azul */
#app-region-left .document-panel .doc-tabs-actions .doc-tab-action:hover,
.app-region-left .document-panel .doc-tabs-actions .doc-tab-action:hover{
  background: linear-gradient(180deg, rgba(59,130,246,.70), rgba(30,64,175,.45)) !important;
  border-color: rgba(147,197,253,.90) !important;
}

/* OCR un poco más cian/verde para distinguirlo */
#app-region-left .document-panel .doc-tabs-actions .doc-tab-ocr-action,
.app-region-left .document-panel .doc-tabs-actions .doc-tab-ocr-action{
  background: linear-gradient(180deg, rgba(8,145,178,.62), rgba(22,101,52,.30)) !important;
  border-color: rgba(103,232,249,.72) !important;
  color: #ccfbf1 !important;
}


/* BIGSYS_REMOVE_CENTER_UPLOAD_BUBBLE_V1_CSS */
.bigsys-center-upload-bubble-hidden{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}

/* Seguridad: ocultar botones originales fuera del panel izquierdo */
body :not(.document-panel) [data-action="triggerUploadInvoices"],
body :not(.document-panel) [data-action="triggerUploadMultipageInvoice"],
body :not(.document-panel) [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
}


/* BIGSYS_REMOVE_CENTER_UPLOAD_BUBBLE_V2_CSS */
.bigsys-center-upload-bubble-hidden-v2{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
}

/* Ocultar cualquier botón viejo fuera del panel izquierdo nuevo */
body :not(.doc-tabs-actions) > [data-action="triggerUploadInvoices"],
body :not(.doc-tabs-actions) > [data-action="triggerUploadMultipageInvoice"],
body :not(.doc-tabs-actions) > [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
}


/* BIGSYS_FIX_LEFT_BUTTONS_POSITION_V1 */

/* Panel izquierdo: acciones arriba, tabs abajo */
#app-region-left .document-panel .doc-console,
.app-region-left .document-panel .doc-console{
  display:block !important;
}

#app-region-left .document-panel .doc-tabs-shell,
.app-region-left .document-panel .doc-tabs-shell{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:6px !important;
  width:100% !important;
  margin:0 0 8px 0 !important;
}

/* Fila superior */
#app-region-left .document-panel .doc-tabs-actions,
.app-region-left .document-panel .doc-tabs-actions{
  order:1 !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  align-items:stretch !important;
  justify-items:stretch !important;
  height:auto !important;
  min-height:28px !important;
}

/* Fila inferior */
#app-region-left .document-panel .doc-tabs-main,
.app-region-left .document-panel .doc-tabs-main{
  order:2 !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}

/* Botones superiores bien anclados en su fila */
#app-region-left .document-panel .doc-tabs-actions .doc-tab-action,
.app-region-left .document-panel .doc-tabs-actions .doc-tab-action{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  height:28px !important;
  min-height:28px !important;
  margin:0 !important;
  padding:5px 6px !important;
  border-radius:10px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  background:linear-gradient(180deg, rgba(37,99,235,.58), rgba(30,64,175,.34)) !important;
  border:1px solid rgba(96,165,250,.75) !important;
  color:#e0f2fe !important;
}

/* OCR superior diferenciado */
#app-region-left .document-panel .doc-tabs-actions .doc-tab-ocr-action,
.app-region-left .document-panel .doc-tabs-actions .doc-tab-ocr-action{
  background:linear-gradient(180deg, rgba(8,145,178,.62), rgba(22,101,52,.30)) !important;
  border-color:rgba(103,232,249,.72) !important;
  color:#ccfbf1 !important;
}

/* Ocultar duplicados fuera del panel izquierdo, sin tocar los del document panel */
#app-region-top [data-action="triggerUploadInvoices"],
#app-region-top [data-action="triggerUploadMultipageInvoice"],
#app-region-top [data-action="processCurrentInvoiceOcr"],
#app-sticky-actions [data-action="triggerUploadInvoices"],
#app-sticky-actions [data-action="triggerUploadMultipageInvoice"],
#app-sticky-actions [data-action="processCurrentInvoiceOcr"],
#app-region-center [data-action="triggerUploadInvoices"],
#app-region-center [data-action="triggerUploadMultipageInvoice"],
#app-region-center [data-action="processCurrentInvoiceOcr"],
#app-region-bottom [data-action="triggerUploadInvoices"],
#app-region-bottom [data-action="triggerUploadMultipageInvoice"],
#app-region-bottom [data-action="processCurrentInvoiceOcr"]{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* Rehabilitar explícitamente los del panel izquierdo */
#app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
#app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
#app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"],
.app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadInvoices"],
.app-region-left .document-panel .doc-tabs-actions [data-action="triggerUploadMultipageInvoice"],
.app-region-left .document-panel .doc-tabs-actions [data-action="processCurrentInvoiceOcr"]{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}


/* BIGSYS_HIDE_UPLOAD_HOST_V1 */
.hidden-upload-host{
  display:block !important;
  width:0 !important;
  height:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.hidden-upload-host .hidden-upload-input{
  display:none !important;
}


/* BIGSYS_HIDE_CENTER_UPLOAD_BUBBLE_FINAL_V1 */
/* Oculta la burbuja central original de Subir facturas / Multipágina / OCR */
.unified-top-bar .unified-top-center.unified-top-upload,
.unified-top-center.unified-top-upload,
#app-sticky-actions .unified-top-center.unified-top-upload,
#app-region-top .unified-top-center.unified-top-upload,
.app-region-top .unified-top-center.unified-top-upload{
  display:none !important;
  visibility:hidden !important;
  width:0 !important;
  height:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Que la barra superior se acomode sin la burbuja central */
.unified-top-bar,
.unified-top-bar-swapped{
  grid-template-columns: minmax(0, 1fr) auto !important;
}

.unified-top-left,
.unified-top-filters{
  min-width:0 !important;
}


/* BIGSYS_FIX_TOPBAR_GROUPS_FLEX_V1 */

/* La barra superior deja de usar grilla rígida y pasa a flex */
.unified-top-bar,
.unified-top-bar-swapped{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px 14px !important;
  grid-template-columns:none !important;
}

/* Hijos directos: que no desborden raro */
.unified-top-bar > *,
.unified-top-bar-swapped > *{
  min-width:0 !important;
}

/* Grupo izquierdo */
.unified-top-left,
.unified-top-filters,
.unified-top-start{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:10px !important;
  flex:1 1 560px !important;
  min-width:280px !important;
}

/* Grupo derecho */
.unified-top-right,
.unified-top-actions,
.unified-top-end{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  flex:0 1 auto !important;
  margin-left:auto !important;
}

/* Fallback por si el wrapper derecho no tiene clase clara */
.unified-top-bar > :last-child,
.unified-top-bar-swapped > :last-child{
  margin-left:auto !important;
}

/* Fallback por si el wrapper izquierdo no tiene clase clara */
.unified-top-bar > :first-child,
.unified-top-bar-swapped > :first-child{
  flex:1 1 560px !important;
  min-width:280px !important;
}

/* La vieja burbuja central sigue oculta */
.unified-top-bar .unified-top-center.unified-top-upload,
.unified-top-bar-swapped .unified-top-center.unified-top-upload,
.unified-top-center.unified-top-upload{
  display:none !important;
  visibility:hidden !important;
  width:0 !important;
  height:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}


/* BIGSYS_FORCE_TOPBAR_ACTIONS_RIGHT_V3 */
/* Barra superior: filtros a la izquierda, acciones a la derecha */

#app-sticky-actions .unified-top-bar,
#app-sticky-actions .unified-top-bar-swapped,
.app-sticky-actions .unified-top-bar,
.app-sticky-actions .unified-top-bar-swapped{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  width:100% !important;
}

/* Filtros izquierda */
#app-sticky-actions .unified-top-left,
#app-sticky-actions .unified-top-filters,
.app-sticky-actions .unified-top-left,
.app-sticky-actions .unified-top-filters{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  flex:1 1 auto !important;
  min-width:280px !important;
}

/* Acciones derecha */
#app-sticky-actions .unified-top-right,
.app-sticky-actions .unified-top-right{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  margin-left:auto !important;
  flex:0 0 auto !important;
}

/* Centro de upload viejo oculto */
#app-sticky-actions .unified-top-center,
#app-sticky-actions .unified-top-upload,
.app-sticky-actions .unified-top-center,
.app-sticky-actions .unified-top-upload{
  display:none !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Si algún CSS anterior centró acciones, lo anulamos */
.unified-top-right{
  margin-left:auto !important;
  justify-self:end !important;
  text-align:right !important;
}

/* Los botones de acción no se expanden al centro */
.unified-top-right .unified-action-btn,
.unified-top-right .btn{
  flex:0 0 auto !important;
}
















/* BIGSYS_WEB_TOTALS_SPLIT_SUGGESTION_V1C_CSS_START */

/*
  V1C:
  Estructura moderna, pero visual correcto:
  - campo arriba
  - sugerencia separada abajo
*/

.totals-separated-grid {
  display: grid !important;
  grid-template-columns:

    var(--ui-line-status-width)
    minmax(138px, 1.02fr)
    minmax(108px, 0.74fr)
    minmax(96px, 0.52fr)
    minmax(138px, 1.02fr)
    minmax(118px, 0.82fr)
    var(--ui-line-actions-width)
  !important;
  gap: 7px !important;
  align-items: stretch !important;
}

.totals-status-col,
.totals-separated-col,
.totals-actions-col {
  min-width: 0 !important;
  display: grid !important;
  grid-template-rows: 54px 26px !important;
  gap: 7px !important;
}

.totals-separated-col .totals-field {
  min-width: 0 !important;
  height: 54px !important;
  padding: 7px !important;
}

.totals-separated-col .totals-field .line-label {
  text-transform: uppercase !important;
}

.totals-separated-col .totals-field input.totals-edit-input {
  width: 100% !important;
  min-width: 0 !important;
}

.totals-separated-col .totals-exempt-non-taxed {
  min-width: 0 !important;
}

.totals-suggestion-separated,
.totals-suggestion-empty-separated,
.totals-diff-separated {
  min-width: 0 !important;
  height: 26px !important;
  padding: 4px 6px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 11.6px !important;
  text-align: center !important;
}

.totals-suggestion-empty-separated {
  cursor: default !important;
  opacity: 0.55 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(0,0,0,.08) !important;
  color: var(--muted) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.totals-diff-separated {
  cursor: default !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(0,0,0,.12) !important;
  color: var(--text) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.totals-actions-col .totals-actions {
  height: 54px !important;
  display: grid !important;
  grid-template-columns: 50px 36px !important;
  gap: 7px !important;
  align-items: center !important;
  justify-content: end !important;
}

.totals-actions-col .totals-actions .btn-line-ai,
.totals-actions-col .totals-actions .btn-line-confirm {
  align-self: center !important;
}

/* Ocultar estructuras anteriores si quedaron por caché/render viejo */
.totals-unified-grid,
.totals-suggestion-grid {
  display: none !important;
}

@media (max-width: 1250px) {
  .totals-separated-grid {
    grid-template-columns:

      var(--ui-line-status-width)
      minmax(126px, 0.98fr)
      minmax(96px, 0.70fr)
      minmax(88px, 0.48fr)
      minmax(126px, 0.98fr)
      minmax(108px, 0.78fr)
      var(--ui-line-actions-width)
  !important;
    gap: 6px !important;
  }

  .totals-status-col,
  .totals-separated-col,
  .totals-actions-col {
    gap: 6px !important;
  }

  .totals-actions-col .totals-actions {
    grid-template-columns: 46px 34px !important;
    gap: 5px !important;
  }

  .totals-suggestion-separated,
  .totals-suggestion-empty-separated,
  .totals-diff-separated {
    padding-left: 5px !important;
    padding-right: 5px !important;
    font-size: 11.2px !important;
  }
}

/* BIGSYS_WEB_TOTALS_SPLIT_SUGGESTION_V1C_CSS_END */


/* BIGSYS_WEB_TOTALS_ACTIONS_LEFT_V1C_START */
.totals-actions-col .totals-actions {
  justify-content: start !important;
  transform: translateX(-10px) !important;
}

@media (max-width: 1250px) {
  .totals-actions-col .totals-actions {
    transform: translateX(-6px) !important;
  }
}
/* BIGSYS_WEB_TOTALS_ACTIONS_LEFT_V1C_END */


/* BIGSYS_WEB_TOTALS_ACTIONS_DIFF_LABEL_V1B_START */

/* Mantiene separado IA/OK sin bajar la línea inferior */
.totals-separated-grid .totals-actions-col {
  margin-left: 10px !important;
  overflow: visible !important;
}

/* Combina izquierda + subida leve, sin pisar un transform con otro */
.totals-separated-grid .totals-actions-col .totals-actions {
  justify-content: start !important;
  transform: translate(-10px, -6px) !important;
}

/* La burbuja de diferencia vuelve a la misma altura que las demás sugerencias */
.totals-separated-grid .totals-actions-col .totals-diff-separated {
  position: relative !important;
  margin-top: 0 !important;
  align-self: stretch !important;
  overflow: visible !important;
  z-index: 4 !important;
}

/* Rótulo chico sin empujar ni desalinear la burbuja */
.totals-separated-grid .totals-actions-col .totals-diff-separated::before {
  content: "DIF. TOTAL/LÍNEAS";
  position: absolute;
  left: 50%;
  top: -13px;
  transform: translateX(-50%);
  font-size: 8.5px;
  line-height: 1;
  letter-spacing: .035em;
  font-weight: 800;
  text-transform: uppercase;
  color: rgba(219, 234, 254, .95);
  text-shadow: 0 1px 2px rgba(0,0,0,.65);
  white-space: nowrap;
  pointer-events: none;
  z-index: 5;
}

@media (max-width: 1250px) {
  .totals-separated-grid .totals-actions-col {
    margin-left: 6px !important;
  }

  .totals-separated-grid .totals-actions-col .totals-actions {
    transform: translate(-6px, -4px) !important;
  }

  .totals-separated-grid .totals-actions-col .totals-diff-separated::before {
    top: -12px;
    font-size: 8px;
  }
}

/* BIGSYS_WEB_TOTALS_ACTIONS_DIFF_LABEL_V1B_END */