/* Keep the shared navigation usable on laptop-height and zoomed viewports. */
.app-shell { width: 100%; max-width: 100%; }
.main-column, .page-content, .page-content > * { min-width: 0; }
.page-content { max-width: 100%; }
.topbar-page-title, .dashboard-topbar-copy, .profile-button > span { min-width: 0; }
.topbar-page-title h1, .topbar-page-title p { overflow-wrap: anywhere; }
.audit-table-wrap, .table-wrap { min-width: 0; max-width: 100%; overflow-x: auto; }

@media (min-width: 821px) {
    .sidebar { height: 100dvh; scrollbar-width: thin; scrollbar-color: #4b6574 transparent; }
    .sidebar::-webkit-scrollbar { display: block; width: 5px; }
    .sidebar::-webkit-scrollbar-thumb { background: #4b6574; border-radius: 5px; }
    .primary-nav { flex: 0 0 auto; }
    .sidebar-logo-link { flex-shrink: 0; }
    /* Reserve space in the conversation rail so Feedback cannot cover Send. */
    body:has(.messages-page) .beta-feedback-button { left: 108px; right: auto; bottom: 16px; }
    .messages-list-panel { padding-bottom: 68px; }
}
@media (min-width: 821px) and (max-height: 850px) {
    .sidebar { padding-top: 12px; padding-bottom: 12px; }
    .primary-nav { gap: 4px; }
    .nav-item { min-height: 42px; padding: 9px; }
    .sidebar-logo-link { width: 46px; height: 46px; min-height: 46px; }
    .sidebar-logo { width: 44px; height: 44px; }
    .topbar { min-height: 68px; padding-top: 10px; padding-bottom: 10px; }
}
@media (min-width: 821px) and (max-height: 650px) {
    .sidebar { padding-top: 8px; padding-bottom: 8px; }
    .primary-nav { gap: 2px; }
    .nav-item { min-height: 36px; padding: 6px; }
    .nav-item svg, .nav-item i { width: 21px; height: 21px; }
    .sidebar-logo-link { width: 40px; height: 40px; min-height: 40px; }
    .sidebar-logo { width: 38px; height: 38px; }
}
@media (min-width: 821px) and (max-width: 1440px) {
    .page-content { padding-left: 20px; padding-right: 20px; }
    .topbar { padding-left: 20px; padding-right: 20px; gap: 12px; }
}