:root {
  --foundation-shell-gap: 16px;
  --foundation-page-inline: clamp(16px, 2.2vw, 28px);
  --foundation-card-min: 180px;
  --foundation-form-min: 220px;
  --foundation-table-min: 640px;
  --foundation-sidebar-width: minmax(0, var(--workspace-nav-width, 236px));
  --foundation-topbar-height: 58px;
}

/* 1. Theme tokens */
.workspace-picker b {
  display: inline-block;
  min-width: 0;
  max-width: 100%;
}

.foundation-shell-panel {
  min-height: 160px;
}

.foundation-shell-placeholder,
.foundation-shell-copy {
  color: #52627a;
}

.foundation-shell-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 88px;
  border: 1px dashed rgba(91, 112, 145, 0.28);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(246, 248, 252, 0.98), rgba(236, 241, 248, 0.98));
  text-align: center;
  font-weight: 600;
  padding: 18px;
}

.foundation-shell-copy {
  margin: 0;
  line-height: 1.6;
}

.foundation-shell-actions {
  align-items: center;
}

.foundation-shell-actions button[disabled] {
  opacity: 1;
  cursor: default;
}

.foundation-shell-suppressed .invoice-layout,
.foundation-shell-suppressed .sticky-actions,
.foundation-shell-suppressed .metric-grid,
.foundation-shell-suppressed .history-grid {
  display: none;
}

/* 2. Shell layout containment */
.workspace-view,
.workspace-view > .sidebar,
.main-shell,
.page-host,
.page,
.page > *,
.panel,
.metric,
.transaction-workspace,
.transaction-stack,
.transaction-side,
.transaction-main,
.report-workspace,
.analytics-workspace,
.report-detail-panel,
.analytics-detail-panel,
.manufacturing-shell,
.manufacturing-entry-shell,
.restaurant-workspace,
.restaurant-shell,
.restaurant-main,
.pos-workspace-root,
.pos-shell,
.pos-main,
.pos-cart-panel {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.workspace-view {
  width: 100%;
  max-width: 100%;
}

.main-shell {
  overflow: hidden;
}

.workspace-view,
.main-shell,
.page-host {
  isolation: isolate;
}

/* 3. Sidebar/top/mobile nav containment */
.sidebar,
.side-brand,
.side-brand-text,
.side-nav,
.side-nav button,
.logout,
.topbar,
.topbar-breadcrumb,
.top-actions,
.top-module-nav,
.top-module-nav > button,
.nav-dropdown-trigger,
.top-more-trigger,
.nav-dropdown-panel,
.workspace-picker,
.workspace-picker-label,
.profile,
.admin-topbar-context,
.admin-inline-nav,
.mobile-brand {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.workspace-view:not(.sidebar-collapsed) .side-nav button,
.workspace-view:not(.sidebar-collapsed) .logout {
  white-space: normal;
  overflow-wrap: anywhere;
}

.workspace-view:not(.sidebar-collapsed) .side-nav button::after,
.workspace-view:not(.sidebar-collapsed) .logout::after,
.workspace-view:not(.sidebar-collapsed) .side-nav button::before,
.workspace-view:not(.sidebar-collapsed) .logout::before {
  display: none;
}

.topbar {
  gap: 12px;
  padding-inline: var(--foundation-page-inline);
  z-index: 220;
}

.top-actions {
  flex-wrap: wrap;
  row-gap: 8px;
  position: relative;
  z-index: 230;
}

.workspace-picker {
  min-height: 40px;
  height: auto;
  align-self: stretch;
  max-width: min(100%, 420px);
}

.workspace-picker-label {
  flex-wrap: wrap;
  white-space: normal;
  overflow: visible;
}

.workspace-picker small,
.workspace-picker b {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}

.top-module-nav,
.nav-popover-root,
.workspace-picker-menu,
.profile-menu {
  overflow: visible;
}

.workspace-picker,
.profile {
  position: relative;
  z-index: 231;
}

.workspace-picker-menu,
.profile-menu {
  z-index: 340;
}

/* Keep portaled top-nav dropdowns measurable/clickable after legacy fixed-position overrides. */
.nav-popover-root {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  display: block;
  pointer-events: none;
  z-index: 320;
}

.nav-popover-root .nav-dropdown-panel,
.nav-popover-root .top-more-panel {
  position: fixed !important;
  display: grid !important;
  width: min(460px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px);
  max-height: min(420px, calc(100dvh - 24px));
  pointer-events: auto;
}

.nav-popover-root .nav-dropdown-panel[hidden],
.nav-popover-root .top-more-panel[hidden] {
  display: none !important;
}

.top-module-nav [data-nav-group="accounts"] .nav-dropdown-panel,
.top-module-nav [data-nav-group="transactions"] .nav-dropdown-panel {
  width: min(340px, calc(100vw - 24px)) !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

/* 4. Workspace/page container containment */
.top-module-nav {
  top: var(--foundation-topbar-height);
  z-index: 180;
}

.page-host {
  padding-inline: var(--foundation-page-inline);
  max-width: 100%;
  overflow-x: auto;
}

.page,
.page-head,
.page-heading,
.page-heading-card,
.page-heading-main,
.page-heading-actions,
.guard-actions,
.subscription-guard-card,
.support-dialog,
.command-dialog,
.onboarding-dialog,
.confirm-dialog,
.help-dialog,
.ops-modal,
.cash-register-modal,
.cash-close-confirm-modal,
.restaurant-action-dialog,
.restaurant-management-dialog,
.restaurant-delivery-dialog,
.pos-receipt-dialog,
.pos-reprint-dialog {
  width: min(100%, var(--foundation-shell-max, 100%));
  max-width: 100%;
  box-sizing: border-box;
}

.page-head,
.page-heading,
.page-heading-actions,
.panel-title,
.report-detail-head,
.transaction-panel-title,
.topbar-breadcrumb,
.admin-topbar-context {
  flex-wrap: wrap;
  overflow: visible;
}

.page-head p,
.page-heading-subtitle,
.report-detail-head p,
.transaction-page-title p,
.transaction-hero p {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* 5. Card/grid safety */
.metric-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--foundation-card-min)), 1fr));
}

.dashboard-grid > *,
.analytics-panels > *,
.import-guidance-grid > *,
.import-coverage-grid > *,
.import-sequence-grid > *,
.import-document-grid > *,
.restaurant-kitchen-grid > *,
.restaurant-waiter-grid > *,
.restaurant-delivery-grid > *,
.restaurant-reservation-list > * {
  min-width: 0;
  max-width: 100%;
}

.alert-row,
.product-row,
.restaurant-summary,
.restaurant-card-note,
.restaurant-kitchen-head,
.restaurant-ticket-meta span,
.restaurant-kitchen-line,
.restaurant-waiter-table,
.import-coverage-card,
.import-sequence-step,
.import-document-card {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* 6. Form/filter/search safety */
.filters,
.form-grid,
.detail-grid,
.info-grid,
.split-actions,
.action-cluster,
.transaction-totals,
.transaction-summary-strip,
.history-filters,
.bulk-template-bar,
.scan-grid,
.restaurant-toolbar,
.restaurant-view-actions,
.restaurant-dialog-split,
.restaurant-dialog-form,
.restaurant-dialog-side,
.onboarding-form,
.confirm-actions {
  min-width: 0;
  max-width: 100%;
}

.filters > *,
.form-grid > *,
.detail-grid > *,
.info-grid > *,
.split-actions > *,
.action-cluster > *,
.transaction-summary-strip > *,
.history-filters > *,
.bulk-template-bar > *,
.restaurant-toolbar > *,
.restaurant-view-actions > *,
.restaurant-dialog-split > * {
  min-width: 0;
  max-width: 100%;
}

.filters .input,
.form-grid .input,
.detail-grid .input,
.info-grid .input,
.filters select,
.form-grid select,
.detail-grid select,
.info-grid select,
.pos-search .input,
.restaurant-search input {
  min-width: 0;
  max-width: 100%;
}

.split-actions,
.action-cluster,
.restaurant-card-actions,
.restaurant-kitchen-actions,
.ops-modal-actions,
.confirm-actions {
  flex-wrap: wrap;
}

.split-actions button,
.action-cluster button,
.restaurant-card-actions button,
.restaurant-kitchen-actions button,
.ops-modal-actions button,
.confirm-actions button {
  max-width: 100%;
}

/* 7. Table overflow safety */
.table-wrap,
.fixed-grid-scroll,
.report-table-wrap,
.bulk-sheet-wrap,
.invoice-cart-table-wrap,
.import-row-preview-panel .table-wrap,
.transaction-search-panel .fixed-grid-scroll,
.transaction-line-panel .fixed-grid-scroll {
  max-width: 100%;
  overflow: auto;
  overscroll-behavior-x: contain;
}

.table-wrap > table,
.fixed-grid-scroll > table,
.report-table-wrap > table,
.transaction-workspace .table-wrap > table,
.transaction-side .table-wrap > table,
.report-detail-table,
.bulk-sheet {
  min-width: max(100%, var(--foundation-table-min));
}

.dashboard-grid .table-wrap table,
.analytics-card .table-wrap table {
  min-width: 100%;
}

.table-wrap th,
.table-wrap td,
.fixed-grid-scroll th,
.fixed-grid-scroll td,
.report-detail-table th,
.report-detail-table td,
.bulk-sheet th,
.bulk-sheet td {
  overflow-wrap: anywhere;
}

/* 8. Transaction/report safety wrappers */
.transaction-layout,
.transaction-workspace,
.transaction-body,
.transaction-main,
.transaction-stack,
.transaction-side,
.report-workspace,
.analytics-workspace,
.report-sidebar,
.analytics-sidebar,
.report-catalog-groups,
.analytics-menu {
  min-width: 0;
  max-width: 100%;
}

.transaction-side,
.report-sidebar,
.analytics-sidebar {
  align-self: start;
}

.transaction-line-product,
.report-menu-heading b,
.report-menu-item span,
.analytics-menu-item b,
.analytics-menu-item small {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}

/* 9. Vertical module safety wrappers */
.pos-shell,
.restaurant-shell,
.restaurant-summary-strip,
.restaurant-timeline-step,
.restaurant-ticket-meta,
#barcodePreviewGrid {
  min-width: 0;
  max-width: 100%;
}

.pos-product-grid,
.pos-cart-lines,
.restaurant-floor-list,
.restaurant-table-grid,
.restaurant-kitchen-grid,
.restaurant-waiter-grid,
.restaurant-delivery-grid,
.restaurant-reservation-list {
  min-width: 0;
  max-width: 100%;
}

.restaurant-summary small,
.restaurant-timeline-step b,
.restaurant-timeline-step small {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}

/* 10. Legacy compatibility overrides */
.workspace-view .page-host .module-hero,
.workspace-view .page-host .hero,
.workspace-view .page-host .page-hero,
.workspace-view .page-host .transaction-workspace,
.workspace-view .page-host .report-workspace,
.workspace-view .page-host .analytics-workspace,
.workspace-view .page-host .restaurant-workspace,
.workspace-view .page-host .manufacturing-shell,
.workspace-view .page-host .import-guidance,
.workspace-view .page-host .system-settings-panel {
  max-width: 100% !important;
}

.workspace-view .page-host [class*="workspace"],
.workspace-view .page-host [class*="layout"],
.workspace-view .page-host [class*="grid"],
.workspace-view .page-host [class*="panel"],
.workspace-view .page-host [class*="card"] {
  min-width: 0;
}

@media (max-width: 1320px) {
  .transaction-layout,
  .analytics-workspace,
  .pos-shell,
  .restaurant-shell,
  .restaurant-dialog-split {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .transaction-side,
  .report-sidebar,
  .analytics-sidebar,
  .pos-cart-panel {
    position: static !important;
    top: auto !important;
    max-height: none !important;
  }

  .restaurant-summary-strip {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }
}

@media (max-width: 960px) {
  .topbar {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }

  .top-actions,
  .topbar-breadcrumb,
  .admin-topbar-context {
    justify-self: stretch;
  }

  .filters,
  .form-grid.wide,
  .detail-grid.wide-2,
  .detail-grid.wide-3,
  .info-grid,
  .restaurant-toolbar,
  .restaurant-ticket-meta,
  #barcodePreviewGrid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .dashboard-grid > .panel,
  .dashboard-grid > .sales-analytics,
  .dashboard-grid > .table-panel,
  .dashboard-grid > .stock-alerts,
  .dashboard-grid > .products-panel {
    grid-column: span 12;
  }
}

@media (max-width: 720px) {
  .page-host {
    padding-inline: 16px;
  }

  .metric-grid,
  .analytics-panels,
  .import-guidance-grid,
  .import-coverage-grid,
  .import-sequence-grid,
  .import-document-grid,
  .restaurant-kitchen-grid,
  .restaurant-waiter-grid,
  .restaurant-delivery-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .table-wrap > table,
  .fixed-grid-scroll > table,
  .report-table-wrap > table,
  .report-detail-table,
  .bulk-sheet {
    min-width: max(100%, 560px);
  }
}

/* ============================================================
Connect Phase 4 Core High-Use Pages
Setup / Products / Customers / POS / Sales / Import / Reports
============================================================ */

#page-setup,
#page-product-master,
#page-product,
#page-customers,
#page-pos,
#page-sale,
#page-import-invoice,
#page-import-drafts,
#page-reports {
  min-width: 0;
  max-width: 100%;
}

#page-setup .setup-content,
#page-setup .setup-tab,
#page-setup .setup-tab > .panel,
#page-product-master .product-master-panel,
#page-product .product-layout,
#page-product .product-form,
#page-product .product-triple-grid,
#page-product .product-detail-row,
#page-customers .party-layout,
#page-customers .party-form,
#page-customers .party-list,
#page-pos #posWorkspace,
#page-sale .transaction-workspace,
#page-sale .invoice-layout,
#page-sale .invoice-hub,
#page-sale .invoice-card,
#page-import-invoice .transaction-workspace,
#page-import-drafts .transaction-workspace,
#page-reports .reports-page,
#page-reports .report-workspace {
  min-width: 0;
  max-width: 100%;
}

#page-setup .setup-content {
  display: grid;
  gap: 16px;
}

#page-setup .setup-content > .setup-tabs,
#page-setup .setup-content > .setup-body,
#page-setup .setup-content .panel-title,
#page-setup .setup-content .action-row,
#page-setup .setup-content .action-cluster,
#page-setup .setup-content .inline-action-group {
  min-width: 0;
  max-width: 100%;
}

#page-setup .setup-content .panel-title,
#page-product .panel-title,
#page-customers .panel-title,
#page-reports .panel-title {
  flex-wrap: wrap;
  align-items: flex-start;
}

#page-setup .setup-form-row,
#page-setup .benchmark-row,
#page-setup .integration-switch-row,
#page-setup .setup-card-grid,
#page-setup .rule-explainer,
#page-setup .entitlement-note,
#page-setup .integration-stack,
#page-setup .integration-block,
#page-setup .legacy-import-shell,
#page-setup .import-guidance-grid,
#page-setup .import-coverage-grid,
#page-setup .import-sequence-grid {
  min-width: 0;
  max-width: 100%;
}

#page-setup .setup-form-row,
#page-setup .benchmark-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}

#page-setup .setup-form-row > *,
#page-setup .benchmark-row > *,
#page-setup .form-grid > *,
#page-setup .action-row > *,
#page-setup .action-cluster > *,
#page-setup .inline-action-group > * {
  min-width: 0;
  max-width: 100%;
}

#page-setup .setup-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

#page-setup .setup-tabs,
#page-reports .report-catalog-groups,
#page-reports .analytics-menu {
  scrollbar-gutter: stable;
}

#page-product-master .filters,
#page-customers .filters,
#page-reports .filters,
#page-sale .invoice-hub-products .scan-grid,
#page-sale .invoice-hub-actions,
#page-sale .invoice-hub-kpis,
#page-sale .invoice-hub-secondary-grid,
#page-import-invoice .action-cluster,
#page-import-drafts .action-cluster {
  min-width: 0;
  max-width: 100%;
}

#page-product-master .product-master-filters,
#page-customers .filters {
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

#page-product-master .product-master-filters > :last-child,
#page-customers .filters > :last-child {
  justify-self: stretch;
}

#page-product-master .table-wrap,
#page-product .table-wrap,
#page-customers .table-wrap,
#page-setup .table-wrap,
#page-reports .table-wrap,
#page-sale .invoice-hub-table-wrap,
#page-import-invoice .table-wrap,
#page-import-drafts .table-wrap {
  max-width: 100%;
  overflow: auto;
  overscroll-behavior-x: contain;
}

#page-product-master table,
#page-product .table-wrap table,
#page-customers .table-wrap table,
#page-setup .table-wrap table,
#page-reports .table-wrap table,
#page-import-invoice .table-wrap table,
#page-import-drafts .table-wrap table {
  min-width: max(100%, 720px);
}

#page-product .product-layout {
  display: grid;
  grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

#page-product .product-form,
#page-product .product-media-rail,
#page-product .product-stock-panel,
#page-product .product-image-panel,
#page-product .product-price-list-panel,
#page-product .variant-shelf,
#page-product .product-shelf-panel {
  min-width: 0;
  max-width: 100%;
}

#page-product .product-triple-grid,
#page-product .product-detail-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
}

#page-product .form-grid.wide,
#page-customers .form-grid.wide,
#page-setup .form-grid.wide {
  grid-template-columns: repeat(auto-fit, minmax(var(--foundation-form-min), 1fr));
}

#page-product .price-matrix,
#page-product #productPriceMatrix,
#page-product #productUomRows,
#page-customers #customerRows {
  min-width: 0;
}

#page-customers .party-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 16px;
  align-items: start;
}

#page-customers .party-form,
#page-customers .party-list {
  min-width: 0;
  max-width: 100%;
}

#page-customers .action-row {
  flex-wrap: wrap;
}

#page-pos .pos-shell {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
  gap: 16px;
}

#page-pos .pos-cart-panel {
  top: 0;
  max-height: calc(100dvh - 114px);
  padding: 12px;
  gap: 10px;
}

#page-pos .pos-cart-body {
  min-height: 0;
  overflow: hidden;
}

#page-pos .pos-cart-head {
  padding-bottom: 8px;
}

#page-pos .pos-cart-lines {
  min-height: 120px;
}

#page-pos .pos-checkout-box {
  position: sticky;
  bottom: 0;
  z-index: 1;
  max-height: min(100%, 440px);
  overflow: auto;
  overscroll-behavior: contain;
  gap: 8px;
  padding: 10px;
  box-shadow: 0 -8px 20px rgba(15, 23, 42, .06);
}

#page-pos .pos-toolbar,
#page-pos .pos-toolbar-metrics,
#page-pos .pos-search,
#page-pos .pos-grid-head,
#page-pos .pos-payment-box,
#page-pos .pos-total-box {
  min-width: 0;
  max-width: 100%;
}

#page-pos .pos-payment-box {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

#page-pos .pos-product-copy strong,
#page-pos .pos-product-copy small,
#page-pos .pos-cart-item-copy strong,
#page-pos .pos-cart-item-copy small {
  white-space: normal;
  overflow-wrap: anywhere;
}

#posReceiptModal .pos-receipt-dialog {
  width: min(470px, calc(100vw - 32px));
  max-width: 470px;
  max-height: min(720px, calc(100dvh - 32px));
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
}

#posReceiptModal .pos-receipt-paper {
  max-height: 100%;
  overflow: auto;
  overscroll-behavior: contain;
}

#posReceiptModal .pos-receipt-actions {
  margin-top: 0;
  padding-top: 12px;
  border-top: 1px solid rgba(148, 163, 184, .18);
  background: #f8fafc;
}

#page-sale .page-head,
#page-sale .action-cluster,
#page-sale .invoice-hub-header,
#page-sale .invoice-hub-actions,
#page-sale .invoice-hub-card .panel-title,
#page-sale .transaction-total-row {
  min-width: 0;
  max-width: 100%;
}

#page-sale .invoice-hub,
#page-sale .invoice-layout {
  row-gap: 14px;
}

#page-sale .invoice-hub-products,
#page-sale .invoice-hub-cart,
#page-sale .invoice-hub-billing,
#page-sale .invoice-hub-totals,
#page-sale .match-side-panel,
#page-sale .transaction-lines-panel {
  min-width: 0;
  max-width: 100%;
}

#page-sale .invoice-hub-products .search-results-grid,
#page-sale .transaction-lines-table {
  min-width: max(100%, 980px);
}

#page-sale .transaction-line-product,
#page-sale .invoice-hub-cart .transaction-line-product,
#page-sale .invoice-hub-products .search-results-grid td:first-child strong,
#page-sale .invoice-hub-products .search-results-grid td:first-child small,
#page-sale .transaction-note {
  white-space: normal;
  overflow-wrap: anywhere;
}

#page-sale .invoice-hub-billing .detail-grid,
#page-sale .invoice-hub-billing label {
  min-width: 0;
  max-width: 100%;
}

#page-import-invoice .panel-title,
#page-import-drafts .panel-title,
#page-import-invoice .action-cluster,
#page-import-drafts .action-cluster,
#page-import-invoice .import-review-layout,
#page-import-drafts .import-draft-layout {
  min-width: 0;
  max-width: 100%;
}

#page-import-invoice #importInvoiceLineRows td,
#page-import-drafts table td {
  vertical-align: top;
}

#page-import-invoice #importInvoiceLineRows .input,
#page-import-drafts .input {
  min-width: 0;
  max-width: 100%;
}

#page-reports .reports-page,
#page-reports .report-workspace,
#page-reports .report-detail-panel,
#page-reports .report-table-wrap {
  min-width: 0;
  max-width: 100%;
}

#page-reports .metric-grid,
#page-reports .dashboard-grid,
#page-reports .analytics-panels {
  min-width: 0;
}

#page-reports .report-detail-head,
#page-reports .report-sidebar-title,
#page-reports .report-menu-heading {
  min-width: 0;
  max-width: 100%;
}

#page-reports .report-menu-heading b,
#page-reports .report-menu-item span {
  white-space: normal;
  overflow-wrap: anywhere;
}

#page-history,
#page-purchase,
#page-purchase-master,
#page-suppliers,
#page-employees {
  min-width: 0;
  max-width: 100%;
}

#page-history .page-head,
#page-history .action-cluster,
#page-purchase-master .page-head,
#page-purchase-master .action-cluster,
#page-suppliers .page-head,
#page-suppliers .action-cluster,
#page-employees .page-head,
#page-employees .action-cluster {
  min-width: 0;
  max-width: 100%;
}

#page-history .history-metrics-compact,
#page-purchase-master .history-metrics-compact,
#page-history .history-filters,
#page-purchase-master .history-filters,
#page-suppliers .filters,
#page-employees .filters,
#page-suppliers .action-row,
#page-employees .action-row {
  min-width: 0;
  max-width: 100%;
}

#page-history .history-filters,
#page-purchase-master .history-filters,
#page-suppliers .filters,
#page-employees .filters {
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

#page-history .history-filters > :last-child,
#page-purchase-master .history-filters > :last-child,
#page-suppliers .filters > :last-child,
#page-employees .filters > :last-child {
  justify-self: stretch;
}

#page-history .history-table,
#page-purchase-master .history-table,
#page-purchase .search-results-grid,
#page-purchase .transaction-lines-table {
  min-width: max(100%, 860px);
}

#page-history .table-wrap,
#page-purchase-master .table-wrap,
#page-suppliers .table-wrap,
#page-employees .table-wrap,
#page-purchase .invoice-hub-table-wrap {
  max-width: 100%;
  overflow: auto;
  overscroll-behavior-x: contain;
}

#page-suppliers .party-layout,
#page-employees .party-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 16px;
  align-items: start;
}

#page-suppliers .party-form,
#page-suppliers .party-list,
#page-employees .party-form,
#page-employees .party-list,
#page-employees .employee-service-flag {
  min-width: 0;
  max-width: 100%;
}

#page-suppliers .form-grid.wide,
#page-employees .form-grid.wide,
#page-setup #setup-enterprise .form-grid.wide,
#page-setup #setup-license .form-grid.wide,
#page-setup #setup-users .form-grid.wide,
#page-setup #setup-roles .form-grid.wide,
#page-setup #setup-localization .form-grid.wide {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

#page-suppliers .action-row,
#page-employees .action-row,
#page-setup #setup-users .action-row,
#page-setup #setup-roles .action-row,
#page-setup #setup-localization .action-row {
  flex-wrap: wrap;
  align-items: center;
}

#page-suppliers .table-wrap table,
#page-employees .table-wrap table,
#page-history .history-table,
#page-purchase-master .history-table,
#page-setup #setup-security table,
#page-setup #setup-readiness table,
#page-setup #setup-roles table,
#page-setup #setup-users table,
#page-setup #setup-menu-access table,
#page-setup #setup-localization table {
  min-width: max(100%, 720px);
}

#page-setup #setup-enterprise .setup-form-row,
#page-setup #setup-import .setup-form-row,
#page-setup #setup-localization .setup-form-row,
#page-setup #setup-security .setup-card-grid,
#page-setup #setup-license .form-grid.wide,
#page-setup #setup-roles #securityPermissionGroups,
#page-setup #setup-users #securityUserBranchRoles {
  min-width: 0;
  max-width: 100%;
}

#page-setup #setup-enterprise .setup-form-row,
#page-setup #setup-import .setup-form-row,
#page-setup #setup-localization .setup-form-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}

#page-setup #setup-enterprise .panel-title,
#page-setup #setup-import .panel-title,
#page-setup #setup-localization .panel-title,
#page-setup #setup-license .panel-title,
#page-setup #setup-security .panel-title,
#page-setup #setup-roles .panel-title,
#page-setup #setup-users .panel-title {
  align-items: flex-start;
  flex-wrap: wrap;
}

.invoice-search-results-wrap {
  height: 260px;
  max-height: 260px;
  overflow-y: auto;
}

.invoice-print-product-meta {
  display: grid;
  gap: 4px;
}

.invoice-print-product-barcode {
  color: #64748b;
}

.print-popup-body {
  font-family: Inter, "Segoe UI", sans-serif;
  color: #0f172a;
  background: #fff;
  margin: 0;
  padding: 24px;
}

.print-popup-loading-body {
  display: grid;
  place-items: start;
}

.print-popup-toolbar {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.print-popup-button-primary,
.print-popup-button-secondary,
.print-popup-button-mode {
  border-radius: 999px;
  padding: 10px 16px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.print-popup-button-primary,
.print-popup-button-secondary {
  border: 0;
}

.print-popup-button-primary {
  background: #4f46e5;
  color: #fff;
}

.print-popup-button-secondary {
  background: #e2e8f0;
  color: #0f172a;
}

.print-popup-button-mode {
  border: 1px solid #d8d0c2;
  background: #fff;
  color: #1b232c;
}

.print-popup-error-body {
  background: #fff6f6;
  color: #991b1b;
}

.print-popup-error-shell {
  max-width: 760px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #fecaca;
  border-radius: 18px;
  padding: 24px;
}

.print-popup-error-shell h1 {
  margin: 0 0 10px;
  font-size: 22px;
}

.print-popup-actions {
  margin-top: 18px;
}

.print-popup-error-shell .print-popup-button-secondary {
  background: #fee2e2;
  color: #991b1b;
}

.print-popup-muted {
  color: #64748b;
}

.print-popup-brand-copy {
  display: grid;
  gap: 4px;
}

.print-popup-table {
  width: 100%;
  border-collapse: collapse;
}

@media print {
  .print-popup-toolbar {
    display: none;
  }
}

@media (max-width: 1200px) {
  #page-product .product-layout,
  #page-customers .party-layout,
  #page-suppliers .party-layout,
  #page-employees .party-layout,
  #page-pos .pos-shell {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 960px) {
  #page-sale .invoice-hub,
  #page-sale .invoice-layout,
  #page-purchase .invoice-layout,
  #page-product .product-triple-grid,
  #page-product .product-detail-row,
  #page-setup .setup-card-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #page-sale .invoice-hub-products .search-results-grid,
  #page-sale .transaction-lines-table,
  #page-purchase .search-results-grid,
  #page-purchase .transaction-lines-table {
    min-width: max(100%, 860px);
  }
}

@media (max-width: 720px) {
  #page-sale .invoice-hub-products .search-results-grid,
  #page-sale .transaction-lines-table,
  #page-purchase .search-results-grid,
  #page-purchase .transaction-lines-table,
  #page-product-master table,
  #page-product .table-wrap table,
  #page-customers .table-wrap table,
  #page-suppliers .table-wrap table,
  #page-employees .table-wrap table,
  #page-setup .table-wrap table,
  #page-reports .table-wrap table,
  #page-history .history-table,
  #page-purchase-master .history-table,
  #page-import-invoice .table-wrap table,
  #page-import-drafts .table-wrap table {
    min-width: max(100%, 640px);
  }
}

/* 10. Super Admin shell */
.admin-app-root .page-head.platform-admin-head {
  align-items: flex-start;
}

.admin-app-root .admin-dashboard,
.admin-app-root .admin-health-page {
  display: grid;
  gap: 18px;
}

.admin-app-root .admin-dashboard-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.admin-app-root .admin-dashboard-secondary {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.admin-app-root .admin-status-card,
.admin-app-root .admin-summary-panel,
.admin-app-root .admin-health-panel,
.admin-app-root .admin-shortcut-panel {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 248, 253, 0.98)),
    radial-gradient(circle at top right, rgba(53, 132, 255, 0.08), transparent 38%);
  border: 1px solid rgba(160, 178, 205, 0.22);
}

.admin-app-root .admin-status-head,
.admin-app-root .admin-health-panel .panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.admin-app-root .admin-status-head {
  margin-bottom: 10px;
}

.admin-app-root .admin-status-head .icon {
  color: #1659c0;
}

.admin-app-root .admin-status-card h2,
.admin-app-root .admin-summary-panel h2,
.admin-app-root .admin-health-panel h2,
.admin-app-root .admin-shortcut-panel h2 {
  margin: 0 0 8px;
}

.admin-app-root .admin-status-card p,
.admin-app-root .admin-summary-panel p,
.admin-app-root .admin-health-panel p,
.admin-app-root .admin-shortcut-panel p {
  margin: 0;
  color: #52627a;
  line-height: 1.6;
}

.admin-app-root .admin-summary-list,
.admin-app-root .admin-health-list {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.admin-app-root .admin-summary-list article,
.admin-app-root .admin-health-list article {
  border: 1px solid rgba(180, 194, 216, 0.28);
  border-radius: 14px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.82);
}

.admin-app-root .admin-summary-list small,
.admin-app-root .admin-health-list small {
  display: block;
  color: #6a7890;
  margin-bottom: 8px;
}

.admin-app-root .admin-summary-list b,
.admin-app-root .admin-health-list b {
  display: block;
  font-size: 18px;
  line-height: 1.3;
  margin-bottom: 6px;
}

.admin-app-root .admin-summary-list span {
  color: #52627a;
  line-height: 1.5;
}

.admin-app-root .admin-shortcut-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 16px;
}

.admin-app-root .admin-shortcut-grid button {
  justify-content: flex-start;
  min-height: 48px;
}

.admin-app-root .admin-health-note {
  margin-top: 14px;
  border-radius: 12px;
  padding: 12px 14px;
  background: #fff8ea;
  color: #7a4a09;
}

@media (max-width: 720px) {
  .admin-app-root .admin-dashboard-grid,
  .admin-app-root .admin-summary-list,
  .admin-app-root .admin-health-list,
  .admin-app-root .admin-shortcut-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}