/**
 * Center dashboard tab content in the main column (portal, admin, driver).
 * Keeps boards and panels from hugging the left edge on wide viewports,
 * then opens the column on large / high-resolution desktops so the UI
 * does not sit in a laptop-sized strip.
 */

:root {
  --dashboard-content-max: 1120px;
}

@media (min-width: 1280px) {
  :root {
    --dashboard-content-max: 1200px;
  }
}

@media (min-width: 1440px) {
  :root {
    --dashboard-content-max: 1360px;
  }
}

@media (min-width: 1680px) {
  :root {
    --dashboard-content-max: 1520px;
  }
}

@media (min-width: 1920px) {
  :root {
    --dashboard-content-max: 1680px;
  }
}

@media (min-width: 2560px) {
  :root {
    --dashboard-content-max: 1920px;
  }
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-optical-sizing: auto;
}

body {
  font-optical-sizing: auto;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.main > .topbar,
.main > .view,
.main > .admin-access-banner,
.main > .test-mode-banner,
.main > .business-verification-status-banner {
  width: 100%;
  max-width: var(--dashboard-content-max);
  margin-inline: auto;
  box-sizing: border-box;
}

/* Business portal: keep every tab body centered in the content column */
body.business-account.portal-app .main > .view {
  display: flex;
  flex-direction: column;
  align-items: center;
}

body.business-account.portal-app .main > .view > * {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

body.business-account.portal-app .catalogue-manage,
body.business-account.portal-app .applications-shell,
body.business-account.portal-app .integrations-shell,
body.business-account.portal-app .integrations-locked,
body.business-account.portal-app .print-shell,
body.business-account.portal-app .settings-layout,
body.business-account.portal-app .wallet-shell,
body.business-account.portal-app .wallet-workspace,
body.business-account.portal-app .pos-workspace,
body.business-account.portal-app .sales-board-wrap,
body.business-account.portal-app .table-wrap,
body.business-account.portal-app .deliveries-new-wrap {
  width: 100%;
  margin-inline: auto;
}

/* Counter shell must keep its own max-width (view children default to 100%) */
body.business-account.portal-app .main > .view > .pos-workspace {
  max-width: min(100%, 56rem);
  margin-inline: auto;
}

/* Nested constrained panels sit in the middle of the column */
.main .settings-layout,
.main .account-layout,
.main .panel-form,
.main .info-box,
.main .integrations-layout,
.main .integrations-shell,
.main .integrations-locked,
.main .applications-shell,
.main .print-shell,
.main .wallet-shell,
.main .wallet-workspace,
.main .pos-workspace,
.main .trip-form,
.main #settings-panel-verification,
.main #settings-panel-verification .settings-card,
.main .verification-banner,
.main .verification-checklist,
.main .verification-progress-panel,
.main .verification-form,
.main .status-card,
.main .card-list,
.main .trip-panel,
.main .deliveries-new-wrap .trip-form {
  margin-inline: auto;
}

/* Mode / board tab strips with a fixed max-width */
.main .account-type-tabs {
  margin-inline: auto;
}

/* App catalogues: center incomplete final rows (admin picker grid) */
.app-access-picker-grid {
  justify-content: center;
}

/* Full-bleed live trip / navigation maps stay edge-to-edge */
.app.has-live-trip .main > .view,
.app.has-live-trip .main > .topbar,
body.driver-trip-active .main > .view,
body.driver-trip-active .main > .topbar {
  max-width: none;
}

body.business-account.portal-app.app.has-live-trip .main > .view {
  align-items: stretch;
}