.mobile-menu-btn,
.mobile-overlay {
    display: none;
}

@media (max-width: 900px) {

    body {
        overflow-x: hidden;
    }

    .layout {
        display: block !important;
    }

    .sidebar {

        position: fixed !important;

        top: 0;
        left: -280px;

        width: 260px;
        height: 100vh;

        background: #fff;

        z-index: 9999;

        transition: left .3s ease;

        display: flex !important;
    }

    .sidebar.open {
        left: 0;
    }

    .main-content {

        width: 100% !important;

        margin: 0 !important;

        padding: 80px 15px 15px 15px !important;
    }

    .dashboard-grid {
        width: 100%;
    }

    .mobile-menu-btn {

        display: flex;

        align-items: center;
        justify-content: center;

        position: fixed;

        top: 15px;
        left: 15px;

        width: 48px;
        height: 48px;

        border: none;

        border-radius: 12px;

        background: #111827;

        color: white;

        font-size: 22px;

        z-index: 10001;
    }

    .mobile-overlay {

        position: fixed;

        inset: 0;

        background: rgba(0, 0, 0, .5);

        z-index: 9998;

        display: none;
    }

    .mobile-overlay.show {
        display: block;
    }

}