/* Capa transversal de jerarquía: los módulos conservan sus estructuras y flujos. */
body.app-redesign {
  --font-family-ui: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --type-screen: clamp(1.5rem, 1.15rem + .45vw, 1.75rem);
  --type-section: clamp(1.125rem, 1rem + .2vw, 1.375rem);
  --type-body:  .9375rem;
  --type-small: .8125rem;
  --type-money: clamp(2rem, 1.55rem + 1vw, 2.5rem);
  --control-height: 2.75rem;
  --control-radius: .625rem;
  font-family: var(--font-family-ui);
  font-size: var(--type-body);
  line-height: 1.5;
  font-variant-numeric: lining-nums;
}

body.app-redesign :where(input, select, textarea, button) { font-family: inherit; }
body.app-redesign :where(input, select, textarea) { font-size: var(--type-body); }
body.app-redesign :where(input[type="number"], .amount, .money, [data-numeric]) { font-variant-numeric: tabular-nums; }
body.app-redesign :where(.app-header-title, .section-title, .page-title) {
  font-size: var(--type-screen);
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -.025em;
}
body.app-redesign #appHeaderTitle {
  color: var(--color-text-primary);
  font-size: clamp(1.25rem, 1.05rem + .75vw, 1.625rem) !important;
  font-weight: 650;
  line-height: 1.25;
}
body.app-redesign .brand-title { color: var(--color-text-primary); font-weight: 650; }
body.app-redesign #headerPrimaryAction { font-size: .875rem; font-weight: 650; }
body.app-redesign :where(.ui-card__title, .modal-title, [role="dialog"] h2) {
  font-size: var(--type-section);
  font-weight: 650;
  line-height: 1.3;
}
body.app-redesign :where(.ui-help, .form-hint, .field-hint, .helper-text) {
  color: var(--color-text-muted);
  font-size: var(--type-small);
  line-height: 1.45;
}

/* Un solo tratamiento de foco y deshabilitado para controles compartidos y legacy. */
body.app-redesign :where(.ui-button, .btn-primary, .btn-secondary, .btn-new-account, .btn-method-pill, .inventory-module-tab, .settings-tab-btn, .expenses-nav-list button, .history-section-link):focus-visible,
body.app-redesign :where(input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
body.app-redesign :where(button, input, select, textarea):disabled,
body.app-redesign :where([aria-disabled="true"]) { cursor: not-allowed; }
body.app-redesign :where(.ui-button, .btn-primary, .btn-secondary, .btn-new-account) { transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease; }
body.app-redesign :where(.ui-button, .btn-primary, .btn-secondary):active:not(:disabled) { transform: translateY(1px); }
body.app-redesign :where([aria-pressed="true"], [aria-selected="true"], .is-active, .active):focus-visible { outline-offset: 2px; }

/* Campos de los formularios legacy; no cambia su orden ni validación. */
body.app-redesign :where(.form-input, .form-select, .ui-input, .ui-select, .ui-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]), select, textarea) {
  border-radius: var(--control-radius);
}
body.app-redesign :where(.ui-field, .form-group) > label:not(.ui-button),
body.app-redesign :where(.form-label) {
  line-height: 1.35;
  font-size: .875rem;
  font-weight: 600;
}
body.app-redesign :where(.ui-input, .ui-select, .form-input, .form-select) { min-height: var(--control-height); }
body.app-redesign :where(.ui-input, .ui-select, .form-input, .form-select)[aria-invalid="true"] {
  border-color: var(--color-danger);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-danger) 25%, transparent);
}

/* Tablas operativas: encabezados y separadores mantienen el mismo contraste. */
body.app-redesign :where(.ui-table, .custom-table) {
  border-color: var(--color-border);
  color: var(--color-text-primary);
  font-size: var(--type-body);
  font-variant-numeric: tabular-nums;
}
body.app-redesign :where(.ui-table, .custom-table) :where(th, td) {
  border-color: var(--color-border);
  line-height: 1.4;
}
body.app-redesign :where(.ui-table, .custom-table) th {
  color: var(--color-text-secondary);
  font-size: var(--type-small);
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none !important;
}
body.app-redesign :where(.ui-table, .custom-table) :where(td.is-numeric, th.is-numeric, [data-numeric]) { text-align: right; }
body.app-redesign #historySalesTable :where(.history-amount, .history-col-amount) { text-align: right; font-variant-numeric: tabular-nums; }
body.app-redesign .expenses-table :where(th:nth-child(5), td:nth-child(5)) { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
body.app-redesign .inventory-products-table :where(th:nth-child(3), td:nth-child(3)) { text-align: right; font-variant-numeric: tabular-nums; }

/* POS: legibilidad de contexto y estados de cuenta sin cambiar el flujo de pedidos. */
body.app-redesign[data-active-tab="pos"] #tab-pos :where(.account-chip-row-mode, .account-chip-row-details, .account-chip-order-clock, .account-chip-status, .account-chip-meta-pill, .account-chip-origin-pill, .account-chip-new-badge) {
  font-size: .75rem !important;
  line-height: 1.35;
}
body.app-redesign[data-active-tab="pos"] #tab-pos :where(.account-chip-total, .account-chip-row-footer .account-chip-total) {
  font-size: 1rem !important;
  font-variant-numeric: tabular-nums;
}
body.app-redesign:has(#tab-pos.active)[data-active-tab="pos"] #tab-pos .account-chip .account-chip-title { font-size: .875rem !important; }
body.app-redesign:has(#tab-pos.active)[data-active-tab="pos"] #tab-pos .account-chip :where(.account-chip-row-mode, .account-chip-row-details, .account-chip-order-clock, .account-chip-status, .account-chip-meta-pill, .account-chip-origin-pill, .account-chip-new-badge) {
  font-size: .75rem !important;
  line-height: 1.35;
}
body.app-redesign:has(#tab-pos.active)[data-active-tab="pos"] #tab-pos .account-chip :where(.account-chip-total, .account-chip-row-footer .account-chip-total) { font-size: 1rem !important; }
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #tab-pos .account-chip.active {
  border-color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));
  box-shadow: inset 3px 0 0 var(--color-primary);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #tab-pos :where(.account-chip-status, .account-chip-row-details, .account-chip-order-clock) {
  color: var(--color-text-secondary);
}
body.app-redesign #tab-inventory :where(.inventory-attention-link, .inventory-simple-list-heading span, .inventory-simple-chart-help, .inventory-simple-empty, .inventory-secondary-actions > summary) {
  font-size: var(--type-small);
  line-height: 1.45;
}
body.app-redesign #tab-inventory .inventory-simple-list-heading h4 {
  color: var(--color-text-primary);
  font-size: 1rem;
  font-weight: 650;
}
body.app-redesign #tab-inventory .inventory-simple-empty {
  color: var(--color-text-secondary);
  text-align: left;
}
body.app-redesign #tab-inventory .inventory-secondary-actions > summary {
  border-color: var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text-secondary);
}
body.app-redesign #tab-inventory .inventory-secondary-actions > div {
  border-color: var(--color-border-strong);
  background: var(--color-surface-raised);
}
body.app-redesign #tab-inventory .inventory-secondary-actions > div button {
  color: var(--color-text-primary);
  font-size: var(--type-body);
}
body.app-redesign #tab-inventory .inventory-display-option.is-active {
  border-color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));
  color: var(--color-primary-hover);
}
body:not(.dark-mode).app-redesign #tab-inventory .inventory-attention-link { color: #176b47; }
body:not(.dark-mode).app-redesign #tab-inventory .inventory-attention-link:hover,
body:not(.dark-mode).app-redesign #tab-inventory .inventory-attention-link.is-active { color: #145638; }
body:not(.dark-mode).app-redesign #tab-inventory .inventory-display-option.is-active { color: var(--color-primary-strong); }
body:not(.dark-mode).app-redesign #tab-audit :where(.audit-hero p, .audit-mode-card > span, .audit-summary-grid > div > span, .audit-card-head p, .audit-queue-item p, .audit-queue-item small, .audit-empty, .ui-state--empty) {
  color: var(--color-text-secondary);
  opacity: 1;
}
body:not(.dark-mode).app-redesign #tab-audit .audit-summary-grid strong { color: var(--color-primary-strong); }
body:not(.dark-mode).app-redesign #tab-audit :where(.audit-readonly-note, .audit-warning, .audit-kicker, .audit-card-head .service-eyebrow, .audit-hero .service-eyebrow) { color: #805300; }
body.app-redesign #tab-audit .ui-table th { font-size: var(--type-small) !important; font-weight: 650; letter-spacing: 0 !important; }

/* Diálogos tradicionales comparten marco y desplazamiento interno. Checkout define su propia composición. */
body.app-redesign .modal-overlay.active:not(#checkoutModal) {
  overscroll-behavior: contain;
}
body.app-redesign .modal-overlay.active:not(#checkoutModal) :where(.modal-card, .modal-container, [role="document"]) {
  max-height: min(92dvh, 56rem);
  overscroll-behavior: contain;
}
body.app-redesign .modal-open { overscroll-behavior: none; }

/* Checkout desktop usa tonos fijos para su modo oscuro histórico; en claro toma la paleta compartida. */
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace {
  background: rgb(23 32 42 / .48) !important;
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace .checkout-card {
  border-color: var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text-primary);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-order-heading, .checkout-footer) {
  border-color: var(--color-border);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-order-heading h2, .checkout-payment-amount strong, .checkout-methods-title, .pos-desktop-order-grand-total, .pos-desktop-order-copy b) {
  color: var(--color-text-primary) !important;
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-order-heading p, .checkout-payment-amount, .checkout-order-totals > div, .checkout-order-totals > div strong, .pos-desktop-order-copy small, .checkout-line-total, .checkout-details-chevron) {
  color: var(--color-text-secondary);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-back-button, .split-cash-change-row > label, .checkout-nequi-confirm, .checkout-more-options > summary) {
  color: var(--color-text-secondary);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-payment-card, .checkout-invoice-details, .checkout-more-options) {
  border-color: var(--color-border);
  background: var(--color-surface-raised);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-invoice-details > summary, .checkout-more-options > summary, .checkout-order-totals, .checkout-payment-amount, .checkout-invoice-details[open] > summary) {
  border-color: var(--color-border);
  color: var(--color-text-primary);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-cash-shortcut, .abono-methods-strip .btn-method-pill) {
  border-color: var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text-secondary);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(.checkout-cash-shortcut[aria-pressed="true"], .abono-methods-strip .btn-method-pill.active, .abono-methods-strip .btn-method-pill[aria-pressed="true"]) {
  border-color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface));
  color: var(--color-primary-strong);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace :where(#splitCashReceivedInput, .ui-input, .abono-input-number) {
  border-color: var(--color-border-strong);
  background: var(--color-input);
  color: var(--color-text-primary);
}
body:not(.dark-mode).app-redesign[data-active-tab="pos"] #checkoutModal.checkout-in-pos-workspace .checkout-charge-button:disabled {
  border-color: var(--color-border);
  background: var(--color-surface-hover);
  color: var(--color-text-muted);
}

/* Los artículos siguen deshabilitados hasta elegir una cuenta, pero su texto debe leerse. */
body.app-redesign[data-active-tab="pos"] #tab-pos .pos-desktop-catalog-grid.is-disabled .pos-sales-quick-product {
  opacity: .76;
}

@media (max-width: 700px) {
  body.app-redesign { --type-body: 1rem; }
  body.app-redesign :where(.ui-button, .btn-primary, .btn-secondary, .btn-new-account) { min-height: 2.75rem; }
  body.app-redesign :where(.ui-table, .custom-table) { font-size: .875rem; }
}

@media (prefers-reduced-motion: reduce) {
  body.app-redesign :where(*, *::before, *::after) { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}