html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

.admin-main,
.app-shell,
.surface,
.task-panel,
.upload-panel,
.form-card,
.main-card,
.side-panel,
.subsection,
.repeater-item {
  min-width: 0;
}

.admin-layout {
  min-width: 0;
}

.app-shell {
  width: 100%;
}

.admin-main > main.container-fluid.app-shell {
  margin-inline: auto !important;
  max-width: none !important;
  padding-inline: var(--admin-content-x, .5rem) !important;
}

.admin-layout .admin-topbar,
.admin-main > main.container-fluid.app-shell,
.admin-main > main.container-fluid.app-shell > .page-header {
  margin-inline-start: 0 !important;
  margin-inline-end: 0 !important;
}

.admin-topbar,
.page-header,
.surface-header,
.toolbar {
  flex-wrap: wrap;
}

.admin-topbar > div:first-child,
.page-header > div:first-child,
.surface-header > div:first-child,
.toolbar > div:first-child {
  min-width: 0;
}

.breadcrumb-line,
.admin-topbar strong,
.page-header h1,
.surface-header h2,
.toolbar h2 {
  overflow-wrap: anywhere;
}

.page-header > div:first-child {
  flex: 1 1 18rem;
}

.page-header > .d-flex,
.page-header .d-flex.gap-2,
.no-print.d-flex.gap-2,
.d-flex.gap-2.no-print,
.card-footer .d-flex {
  flex-wrap: wrap;
}

.btn {
  white-space: normal;
}

.icon-btn {
  flex: 0 0 auto;
}

.table-wrap,
.table-responsive {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table {
  margin-bottom: 0;
}

.table th,
.table td {
  overflow-wrap: normal;
}

.table td {
  max-width: 20rem;
}

.form-control,
.form-select,
textarea,
input,
select {
  max-width: 100%;
}

.status,
.status-chip,
.category-tag,
.badge {
  max-width: 100%;
  white-space: normal;
}

.step-nav {
  max-height: calc(100vh - 2rem);
  overflow: auto;
}

.auth-shell {
  width: 100%;
}

.brand-lockup div,
.auth-card,
.aside-content,
.terms-layout,
.terms-body,
.terms-summary,
.settlement-band,
.terms-grid,
.quick-actions,
.feature-grid,
.meta-grid {
  min-width: 0;
}

@media (max-width: 1199.98px) {
  .quick-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 991.98px) {
  .admin-topbar {
    align-items: flex-start;
    padding: .75rem 1rem;
  }

  .page-header > .d-flex:last-child,
  .page-header > div:last-child.d-flex {
    width: 100%;
  }

  .page-header .btn,
  .no-print.d-flex.gap-2 .btn,
  .d-flex.gap-2.no-print .btn {
    flex: 1 1 9rem;
  }

  .page-header .icon-btn {
    flex: 0 0 2.35rem;
  }

  aside.col-lg-3.no-print,
  aside.col-lg-4 {
    width: 100%;
  }

  .step-nav.nav {
    position: static;
    display: flex;
    flex-direction: row !important;
    overflow-x: auto;
    max-height: none;
    white-space: nowrap;
  }

  .step-nav .nav-link {
    flex: 0 0 auto;
  }

  .auth-aside .display-6 {
    font-size: 1.85rem;
  }

  .terms-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767.98px) {
  .admin-topbar {
    gap: .65rem;
  }

  .admin-topbar .user-chip {
    max-width: 100%;
  }

  .page-header,
  .content-pad {
    padding-inline: var(--admin-content-x, .5rem);
  }

  .row {
    --bs-gutter-x: .75rem;
  }

  .metric {
    min-height: auto;
  }

  .toolbar,
  .filter-row,
  .surface-header,
  .surface-body {
    padding: .85rem;
  }

  .statements-table {
    min-width: 940px;
  }

  .transactions-table {
    min-width: 760px;
  }

  .offers-table {
    min-width: 960px;
  }

  .money-table {
    min-width: 620px;
  }

  .comparison-table {
    min-width: 620px;
  }

  .offer-detail-page .comparison-table {
    min-width: 0;
  }

  .financial-table {
    min-width: 760px;
  }

  .summary-table {
    min-width: 640px;
  }

  .review-table {
    min-width: 620px;
  }

  .table td {
    max-width: 14rem;
  }

  .table .btn-sm {
    padding: .22rem .45rem;
    font-size: .8rem;
  }

  .auth-panel,
  .auth-aside {
    padding: 1rem;
  }

  .auth-aside {
    align-items: flex-start;
  }

  .auth-aside .display-6 {
    font-size: 1.55rem;
  }

  .feature-card {
    min-height: auto;
  }

  .terms-summary > div,
  .term-item,
  .meta-item,
  .feature-card,
  .quick-action,
  .activity-item,
  .task-item {
    min-width: 0;
  }
}

@media (max-width: 575.98px) {
  .page-header .btn,
  .no-print.d-flex.gap-2 .btn,
  .d-flex.gap-2.no-print .btn {
    flex: 1 1 100%;
  }

  .page-header .icon-btn {
    flex: 0 0 2.35rem;
  }

  .admin-topbar {
    padding-block: .7rem;
    padding-inline: var(--admin-content-x, .5rem);
  }

  .brand-lockup {
    align-items: flex-start;
  }

  .brand-lockup span {
    overflow-wrap: anywhere;
  }

  .card-footer {
    gap: .75rem;
  }

  .card-footer > .btn,
  .card-footer .btn {
    flex: 1 1 100%;
  }

  .admin-nav {
    margin-inline: -.25rem;
  }

  .admin-link {
    min-height: 2.15rem;
    padding: .45rem .55rem;
    font-size: .88rem;
  }

  .terms-title,
  .page-header h1 {
    font-size: 1.55rem;
  }

  .surface-header {
    align-items: flex-start;
  }
}

/* Canonical mini-sidebar sizing. These selectors intentionally outrank older
   page-level sidebar rules while those screens are migrated to the shared layout. */
@media (min-width: 768px) {
  :root {
    --admin-sidebar-mini: 84px;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar {
    width: var(--admin-sidebar-mini) !important;
    min-width: var(--admin-sidebar-mini) !important;
    max-width: var(--admin-sidebar-mini) !important;
    flex: 0 0 var(--admin-sidebar-mini) !important;
    padding-inline: .55rem !important;
    overflow-x: hidden !important;
    scrollbar-gutter: stable;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .brand-lockup,
  body .admin-layout.sidebar-collapsed > .admin-sidebar .admin-nav,
  body .admin-layout.sidebar-collapsed > .admin-sidebar .admin-sidebar-footer {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .brand-lockup {
    align-items: center !important;
    justify-content: start !important;
    justify-items: center !important;
    padding-inline: 0 !important;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .brand-mark {
    width: 100% !important;
    max-width: 2.75rem !important;
    min-width: 0 !important;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .sidebar-toggle {
    min-width: 2rem !important;
    max-width: 2rem !important;
    flex: 0 0 2rem !important;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .admin-link {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: .2rem !important;
    padding: .42rem .2rem !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .admin-link::after {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: .5rem !important;
    line-height: 1 !important;
    letter-spacing: -.01em !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .admin-link .lucide {
    width: 1.05rem !important;
    height: 1.05rem !important;
    max-width: 1.05rem !important;
    flex: 0 0 1.05rem !important;
  }

  body .admin-layout > .admin-main {
    width: calc(100% - 260px) !important;
    min-width: 0 !important;
    max-width: calc(100% - 260px) !important;
    flex: 1 1 auto !important;
  }

  body .admin-layout.sidebar-collapsed > .admin-main {
    width: calc(100% - var(--admin-sidebar-mini)) !important;
    max-width: calc(100% - var(--admin-sidebar-mini)) !important;
  }

  body .admin-layout > .admin-main > main.app-shell,
  body .admin-layout > .admin-main > .admin-topbar {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

@media (max-width: 767.98px) {
  body .admin-layout,
  body .admin-layout.sidebar-collapsed {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  body .admin-layout > .admin-sidebar,
  body .admin-layout.sidebar-collapsed > .admin-sidebar,
  body .admin-layout > .admin-main,
  body .admin-layout.sidebar-collapsed > .admin-main {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body .admin-layout > .admin-sidebar {
    overflow-x: hidden !important;
  }

  body .admin-layout > .admin-sidebar .admin-nav {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  body .admin-layout.sidebar-collapsed > .admin-sidebar .admin-link,
  body .admin-layout > .admin-sidebar .admin-link {
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
    flex-direction: row !important;
    white-space: nowrap !important;
  }

  body .admin-layout > .admin-main > main.app-shell,
  body .admin-layout > .admin-main > .admin-topbar {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}
