/* =========================================================
   DIVM RESPONSIVE
   ========================================================= */


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1200px) {

    .dashboard-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .module-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}


/* =========================================================
   MOBILE SIDEBAR
   ========================================================= */

@media (max-width: 991.98px) {

    .divm-sidebar {
        transform: translateX(-100%);
    }

        .divm-sidebar.show {
            transform: translateX(0);
            box-shadow: 8px 0 30px rgba(0,0,0,0.15);
        }

    .divm-main {
        width: 100%;
        margin-left: 0;
    }

    .mobile-menu-btn {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .topbar-user-info,
    .user-chevron {
        display: none;
    }

    .divm-topbar {
        padding: 0 18px;
    }

    .divm-content {
        padding: 20px;
    }
}


/* =========================================================
   MOBILE DASHBOARD
   ========================================================= */

@media (max-width: 768px) {

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-welcome {
        padding: 23px;
    }

        .dashboard-welcome h1 {
            font-size: 24px;
        }

    .welcome-icon {
        width: 65px;
        height: 65px;
        font-size: 28px;
    }

    .module-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 575.98px) {

    .divm-topbar {
        height: 68px;
    }

    .page-title-subtitle {
        display: none;
    }

    .page-title-main {
        font-size: 16px;
    }

    .topbar-icon-btn {
        width: 36px;
        height: 36px;
    }

    .topbar-avatar {
        width: 34px;
        height: 34px;
    }

    .divm-content {
        padding: 15px;
    }
}


@media (max-width: 500px) {

    .dashboard-stats {
        grid-template-columns: 1fr;
    }

    .dashboard-welcome {
        min-height: 150px;
    }

    .welcome-icon {
        display: none;
    }

    .module-grid {
        grid-template-columns: 1fr;
    }
}