/* Elevate R37 UI09 — Responsive Guard Standard R1
   Additive guard layer only. It does NOT replace R37 breakpoints.
   Canonical new-work tiers: desktop >1024, compact <=1024, tablet/phone <=768, narrow phone <=430. */

/* Shared overflow safety for flex/grid descendants. */
.dashboard-page .elevate-product-area,
.dashboard-page .card,
.dashboard-page .card-header,
.dashboard-page .decision-cockpit,
.dashboard-page .portfolio-table-wrap,
.dashboard-page .wizard-table-wrap,
.dashboard-page .wealth-function-view,
.dashboard-page .wealth-product-header,
.dashboard-page .wealth-product-brand,
.dashboard-page .wealth-product-tools,
.dashboard-page .wealth-function-nav {
  min-width: 0;
  box-sizing: border-box;
}

@media (max-width: 1024px) {
  /* Compact tier: protect shells and action groups from accidental viewport overflow. */
  .dashboard-page .elevate-product-nav,
  .dashboard-page #option-app-header,
  .dashboard-page #wealth-product-header,
  .dashboard-page .elevate-product-area,
  .dashboard-page .wealth-function-nav {
    max-width: 100%;
    box-sizing: border-box;
  }
  .dashboard-page .card-header,
  .dashboard-page .wealth-product-actions,
  .dashboard-page .strangle-header-controls {
    min-width: 0;
  }
}

@media (max-width: 768px) {
  /* Tablet/phone tier: only containers that already support horizontal detail may scroll. */
  .dashboard-page .portfolio-table-wrap,
  .dashboard-page .wizard-table-wrap,
  .dashboard-page .portfolio-book-legs-table,
  .dashboard-page .oi-table-wrap,
  #wealth-builder-view .wb-table-wrap,
  .user-manual-page table,
  .wealth-user-manual-page .table,
  .admin-page table {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
  }

  /* Prevent long status/helper strings from widening the page. */
  .dashboard-page .hint,
  .dashboard-page .market-info,
  .dashboard-page .wealth-bank-message,
  .dashboard-page .wealth-source-status,
  .dashboard-page .wealth-connector-status,
  .dashboard-page .ui-feedback-state {
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 430px) {
  /* Narrow phone tier: never permit an application shell itself to create page-level x-scroll. */
  html, body,
  .dashboard-page,
  .dashboard-page .container,
  .dashboard-page .elevate-frozen-top,
  .dashboard-page .elevate-product-area,
  .dashboard-page #wealth-management-area {
    max-width: 100%;
  }

  .dashboard-page .card,
  .dashboard-page .decision-cockpit,
  .dashboard-page .wealth-function-view {
    min-width: 0;
  }
}
