/*
========================================================
 DPBOSS RATAN ADMIN MOBILE FINAL
 Desktop preserved.
========================================================
*/

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

.admin-body,
.admin-main,
.admin-content{
    min-width:0;
}

.admin-mobile-backdrop{
    display:none;
}


/*
Wide data areas remain usable instead of crushing data.
*/

.table-wrapper,
.table-responsive,
.admin-table-wrapper,
.data-table-wrapper{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
}


/*
Action controls.
*/

.admin-actions,
.app-actions,
.form-actions,
.action-buttons,
.actions{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}


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

@media screen and (max-width:900px){

    html,
    body{
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        overflow-x:hidden !important;
    }


    body.admin-body{
        display:block !important;
        width:100% !important;
        min-width:0 !important;
        overflow-x:hidden !important;
    }


    /*
    ---------------- SIDEBAR DRAWER ----------------
    */

    .admin-sidebar{
        position:fixed !important;

        top:0 !important;
        left:0 !important;
        bottom:0 !important;

        width:min(82vw,280px) !important;
        max-width:280px !important;

        height:100vh !important;
        height:100dvh !important;

        margin:0 !important;

        transform:translateX(-105%) !important;

        transition:
            transform .22s ease !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;

        z-index:10002 !important;

        box-shadow:
            10px 0 30px
            rgba(0,0,0,.45) !important;
    }


    .admin-sidebar.mobile-open,
    .admin-sidebar.active,
    .admin-sidebar.open{
        transform:translateX(0) !important;
    }


    .admin-menu{
        width:100% !important;
        padding-bottom:30px !important;
    }


    .admin-menu-item{
        display:flex !important;

        width:100% !important;

        min-height:46px !important;

        align-items:center !important;

        padding:
            10px
            14px !important;

        white-space:normal !important;

        line-height:1.25 !important;
    }


    .admin-brand{
        width:100% !important;

        padding:
            18px
            14px !important;

        white-space:normal !important;
    }


    /*
    ---------------- BACKDROP ----------------
    */

    .admin-mobile-backdrop{
        position:fixed !important;

        inset:0 !important;

        display:block;

        background:
            rgba(0,0,0,.58) !important;

        opacity:0;

        visibility:hidden;

        pointer-events:none;

        transition:
            opacity .2s ease,
            visibility .2s ease;

        z-index:10001 !important;
    }


    body.admin-mobile-menu-open
    .admin-mobile-backdrop{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
    }


    /*
    ---------------- MAIN ----------------
    */

    .admin-main{
        width:100% !important;
        max-width:100% !important;

        min-width:0 !important;

        margin-left:0 !important;

        padding:0 !important;
    }


    /*
    ---------------- TOPBAR ----------------
    */

    .admin-topbar{
        position:relative !important;

        width:100% !important;
        max-width:100% !important;

        min-height:auto !important;

        display:flex !important;

        align-items:center !important;
        justify-content:space-between !important;

        flex-wrap:wrap !important;

        gap:10px !important;

        padding:
            10px
            12px !important;
    }


    .admin-topbar > div:first-child{
        display:flex !important;

        min-width:0 !important;

        flex:
            1
            1
            180px !important;

        align-items:center !important;

        gap:8px !important;
    }


    .hamburger-btn,
    #adminSidebarToggle{
        display:inline-flex !important;

        flex:
            0
            0
            44px !important;

        width:44px !important;
        height:44px !important;

        min-width:44px !important;
        min-height:44px !important;

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

        margin:0 !important;

        font-size:22px !important;

        cursor:pointer !important;
    }


    .admin-page-title{
        min-width:0 !important;

        margin:0 !important;

        font-size:
            clamp(
                1rem,
                5vw,
                1.45rem
            ) !important;

        line-height:1.2 !important;

        white-space:normal !important;

        overflow-wrap:anywhere !important;
    }


    .admin-user-profile{
        display:flex !important;

        flex:
            0
            1
            auto !important;

        align-items:center !important;
        justify-content:flex-end !important;

        gap:7px !important;

        flex-wrap:wrap !important;

        min-width:0 !important;
    }


    .admin-user-profile span{
        font-size:.74rem !important;
    }


    .admin-user-profile .btn,
    .admin-user-profile button{
        min-height:40px !important;

        padding:
            7px
            10px !important;

        white-space:normal !important;
    }


    /*
    ---------------- CONTENT ----------------
    */

    .admin-content{
        width:100% !important;
        max-width:100% !important;

        min-width:0 !important;

        margin:0 !important;

        padding:
            12px !important;

        overflow-x:hidden !important;
    }


    /*
    Dashboard / cards.
    */

    .stats-grid,
    .dashboard-grid,
    .dashboard-stats,
    .cards-grid,
    .card-grid,
    .market-grid,
    .admin-grid,
    .quick-actions-grid{
        width:100% !important;

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            ) !important;

        gap:12px !important;
    }


    .stat-card,
    .admin-card,
    .market-card,
    .dashboard-card{
        width:100% !important;
        max-width:100% !important;

        min-width:0 !important;

        margin-left:0 !important;
        margin-right:0 !important;
    }


    /*
    Forms.
    */

    .admin-content form{
        width:100% !important;
        max-width:100% !important;
    }


    .admin-content input:not([type="checkbox"]):not([type="radio"]),
    .admin-content select,
    .admin-content textarea{
        max-width:100% !important;
    }


    .form-grid,
    .settings-grid,
    .dc-grid,
    .dc-wrap{
        grid-template-columns:
            minmax(0,1fr) !important;
    }


    .dc-preview{
        position:static !important;
    }


    /*
    Buttons / controls.
    */

    .btn,
    button,
    .admin-actions > *,
    .app-actions > *,
    .form-actions > *{
        max-width:100%;
    }


    .admin-actions,
    .app-actions,
    .form-actions,
    .action-buttons,
    .actions{
        flex-wrap:wrap !important;
    }


    /*
    Tables remain readable with local horizontal scroll.
    */

    .table-wrapper,
    .table-responsive,
    .admin-table-wrapper,
    .data-table-wrapper{
        width:100% !important;
        max-width:100% !important;

        overflow-x:auto !important;

        -webkit-overflow-scrolling:touch !important;
    }


    .table-wrapper table,
    .table-responsive table,
    .admin-table-wrapper table,
    .data-table-wrapper table{
        min-width:
            min(
                700px,
                max-content
            );
    }


    /*
    Modal safety.
    */

    .modal-content,
    .admin-modal-content{
        width:
            calc(
                100vw - 24px
            ) !important;

        max-width:
            calc(
                100vw - 24px
            ) !important;

        max-height:
            calc(
                100dvh - 24px
            ) !important;

        overflow:auto !important;
    }
}


/*
========================================================
 SMALL PHONE
========================================================
*/

@media screen and (max-width:600px){

    .admin-content{
        padding:
            9px !important;
    }


    .stats-grid,
    .dashboard-grid,
    .dashboard-stats,
    .cards-grid,
    .card-grid,
    .market-grid,
    .admin-grid,
    .quick-actions-grid{
        grid-template-columns:
            minmax(0,1fr) !important;

        gap:10px !important;
    }


    .stat-card,
    .admin-card,
    .market-card,
    .dashboard-card{
        padding:
            14px !important;
    }


    .admin-topbar{
        padding:
            8px
            9px !important;
    }


    .admin-page-title{
        font-size:
            clamp(
                .95rem,
                5.4vw,
                1.25rem
            ) !important;
    }


    .admin-user-profile{
        width:100% !important;

        justify-content:flex-start !important;
    }


    .admin-user-profile .btn,
    .admin-user-profile button{
        flex:
            0
            1
            auto !important;
    }


    .dc-field{
        grid-template-columns:
            minmax(0,1fr)
            42px
            92px !important;
    }
}


/* DPR_ADMIN_MOBILE_V2_START */

@media screen and (max-width:900px){

    body.admin-mobile-menu-open{
        overflow:hidden !important;
    }

    .admin-main{
        margin-left:0 !important;
        width:100% !important;
        max-width:100% !important;
    }

    .admin-sidebar{
        transform:translateX(-105%) !important;
    }

    .admin-sidebar.mobile-open{
        transform:translateX(0) !important;
    }

    #adminSidebarToggle,
    .hamburger-btn{
        display:inline-flex !important;
        visibility:visible !important;
        opacity:1 !important;
    }

    .admin-content{
        width:100% !important;
        max-width:100% !important;
        box-sizing:border-box !important;
    }
}

/* DPR_ADMIN_MOBILE_V2_END */