/* Desktop sidebar fit override loaded after social.min.css.
   Goal: keep full left rail visible with no internal scroll. */

@media (min-width: 1101px) {
    .sidebar {
        overflow-y: hidden !important;
        overflow-x: hidden !important;
        padding-top: 0 !important;
        padding-bottom: clamp(4px, 0.8vh, 10px) !important;
        gap: clamp(0px, 0.35vh, 4px);
    }

    .sidebar-brand {
        width: clamp(40px, 5vh, 52px) !important;
        height: clamp(40px, 5vh, 52px) !important;
        margin: 0 0 clamp(1px, 0.2vh, 4px) 2px !important;
        padding: clamp(8px, 1.05vh, 12px) !important;
    }

    .sidebar-nav {
        gap: clamp(0px, 0.2vh, 2px) !important;
        min-height: 0;
    }

    .sidebar-item,
    .btn-post {
        gap: clamp(10px, 1.2vh, 20px) !important;
        padding: clamp(7px, 0.95vh, 12px) clamp(10px, calc(0.95vw + 6px), 16px) !important;
        font-size: clamp(15px, 2.25vh, 20px) !important;
        line-height: 1.15;
    }

    .sidebar-item .icon,
    .btn-post .icon,
    .sidebar-item .icon svg,
    .btn-post .icon svg {
        width: clamp(20px, 2.8vh, 26px) !important;
        height: clamp(20px, 2.8vh, 26px) !important;
    }

    .sidebar-below-nav {
        gap: clamp(0px, 0.2vh, 2px) !important;
        margin-top: clamp(0px, 0.25vh, 4px) !important;
    }

    .portal-sidebar-divider {
        margin: clamp(6px, 0.9vh, 10px) 12px clamp(4px, 0.7vh, 8px) !important;
    }

    .sidebar-bottom {
        padding: clamp(5px, 0.75vh, 12px) 0 clamp(6px, 0.9vh, 16px) !important;
        gap: clamp(4px, 0.6vh, 8px) !important;
    }

    .sidebar-account {
        padding: clamp(7px, 0.9vh, 12px) !important;
        gap: clamp(8px, 0.8vh, 12px) !important;
    }

    .sidebar-account-avatar {
        width: clamp(30px, 3.8vh, 40px) !important;
        height: clamp(30px, 3.8vh, 40px) !important;
    }

    .sidebar-account-name,
    .sidebar-account-handle {
        font-size: clamp(12px, 1.55vh, 15px) !important;
        line-height: 1.15;
    }
}

@media (min-width: 1101px) and (max-height: 760px) {
    .sidebar-brand {
        width: 38px !important;
        height: 38px !important;
        padding: 7px !important;
    }

    .sidebar-item,
    .btn-post {
        font-size: 14px !important;
        gap: 10px !important;
        padding: 6px 9px !important;
    }

    .sidebar-item .icon,
    .btn-post .icon,
    .sidebar-item .icon svg,
    .btn-post .icon svg {
        width: 20px !important;
        height: 20px !important;
    }

    .portal-sidebar-divider {
        margin: 5px 10px 4px !important;
    }

    .sidebar-account {
        padding: 6px !important;
        gap: 8px !important;
    }

    .sidebar-account-avatar {
        width: 28px !important;
        height: 28px !important;
    }

    .sidebar-account-name,
    .sidebar-account-handle {
        font-size: 11px !important;
    }
}

/* Mobile/PWA hard guard: prevent any child overflow from shrinking the visual scale. */
@media (max-width: 1100px) {
    html,
    body,
    body.social-page,
    body.social-portal-page {
        width: 100% !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    body.social-page .page,
    body.social-page .layout-grid,
    body.social-page .main-content,
    body.social-page .right-panel,
    body.social-portal-page .page,
    body.social-portal-page .layout-grid,
    body.social-portal-page .portal-main-content,
    body.social-portal-page .layout-grid.layout-portal {
        width: 100% !important;
        max-width: 100vw !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
        box-sizing: border-box;
    }
}