/* ==========================================================================
   AGRO-ERP Enterprise - Dedicated Mobile & Tablet Responsive CSS
   File: public/assets/css/responsive.css
   ========================================================================== */

/* // MULAI: 1. BACKDROP & MODAL OVERLAY ==================================== */
.sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(2px);
    z-index: 1045;
}
/* // AKHIR: 1. BACKDROP & MODAL OVERLAY ==================================== */


/* // MULAI: 2. BREAKPOINT TABLET & SMARTPHONE (< 992px) ==================== */
@media (max-width: 991.98px) {
    /* Sidebar meluncur keluar layar */
    .sidebar {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        width: 270px !important;
        height: 100vh !important;
        transform: translateX(-100%) !important;
        transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
        z-index: 1050 !important;
        box-shadow: var(--shadow-lg) !important;
    }

    /* Buka sidebar saat mobile-open */
    body.sidebar-mobile-open .sidebar {
        transform: translateX(0) !important;
    }

    body.sidebar-mobile-open .sidebar-backdrop {
        display: block !important;
    }

    /* Main wrapper 100% penuh */
    .main-wrapper {
        margin-left: 0 !important;
        width: 100% !important;
        min-width: 100% !important;
        transition: none !important;
    }

    /* Topbar padding & elemen disembunyikan */
    .topbar-header {
        padding: 0 12px !important;
    }

    .estate-pill,
    .navbar-search-wrapper,
    .db-status-badge {
        display: none !important;
    }

    /* Halaman & Judul */
    .page-content {
        padding: 16px 14px !important;
    }

    .page-title-wrap {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .filter-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .search-input-group {
        width: 100% !important;
    }
}
/* // AKHIR: 2. BREAKPOINT TABLET & SMARTPHONE (< 992px) ==================== */


/* // MULAI: 3. BREAKPOINT SMARTPHONE KECIL (< 576px) ======================= */
@media (max-width: 575.98px) {
    .btn-erp {
        width: 100% !important;
    }

    .table-bottom-bar {
        flex-direction: column !important;
        gap: 8px !important;
        text-align: center !important;
    }
}
/* // AKHIR: 3. BREAKPOINT SMARTPHONE KECIL (< 576px) ======================= */