/* =========================================
   A. GLOBAL & VIEWPORT SCALING (ADMIN)
========================================= */
:root {
    --admin-bg: #f4f6f9; 
    --admin-card: #ffffff;
    --admin-text: #2c3e50;
    --admin-sidebar: #0f172a;
    --primary-blue: #0d6efd;
    --primary-gradient: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
}

[data-bs-theme="dark"] {
    --admin-bg: #0b1120;
    --admin-card: #1e293b;
    --admin-text: #f8fafc;
    --admin-sidebar: #0f172a;
    --primary-gradient: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
}

body {
    background-color: var(--admin-bg);
    color: var(--admin-text);
    font-family: system-ui, -apple-system, sans-serif;
    overflow-x: hidden;
}

/* =========================================
   B. DESKTOP LAYOUT & SIDEBAR ANIMATION
========================================= */
@media (min-width: 992px) {
    html { font-size: 14px; } 
    .admin-wrapper { display: flex; min-height: 100vh; }
    
    .admin-sidebar {
        width: 260px;
        background-color: var(--admin-sidebar);
        position: fixed;
        height: 100vh;
        overflow-y: auto;
        overflow-x: hidden; 
        white-space: nowrap; 
        z-index: 1050; /* UBAH KE SINI */
        box-shadow: 2px 0 10px rgba(0,0,0,0.05);
        transition: width 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    }
    
    .admin-main-content {
        flex-grow: 1;
        margin-left: 260px;
        padding: 2rem 2.5rem;
        width: calc(100% - 260px);
        transition: margin-left 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), width 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
        display: flex;
        flex-direction: column;
    }

    /* Setelan Dasar Ikon & Teks Sidebar */
    .sidebar-icon, .logo-icon {
        min-width: 24px;
        text-align: center;
        margin-right: 16px;
        transition: margin 0.3s ease;
    }
    .sidebar-text {
        opacity: 1;
        transition: opacity 0.2s ease;
    }

    /* --- KONDISI SAAT DIMINIMIZE --- */
    body.sidebar-minimized .admin-sidebar {
        width: 90px; /* Dilebarkan sedikit agar active box-nya proporsional */
    }
    body.sidebar-minimized .admin-main-content {
        margin-left: 90px;
        width: calc(100% - 90px);
    }

    /* Saat di Hover: Mekar dan Ngambang di atas konten */
    body.sidebar-minimized .admin-sidebar:hover {
        width: 260px;
        box-shadow: 5px 0 20px rgba(0,0,0,0.15);
    }

    /* Saat Tidak di Hover: HILANGKAN TEKS SEPENUHNYA DAN RATA TENGAH */
    body.sidebar-minimized .admin-sidebar:not(:hover) .sidebar-text {
        opacity: 0;
        width: 0;
        overflow: hidden;
        margin: 0 !important;
        padding: 0 !important;
    }
    body.sidebar-minimized .admin-sidebar:not(:hover) .sidebar-icon,
    body.sidebar-minimized .admin-sidebar:not(:hover) .logo-icon {
        margin-right: 0 !important; /* Hapus jarak kanan ikon */
    }
    body.sidebar-minimized .admin-sidebar:not(:hover) .nav-link,
    body.sidebar-minimized .admin-sidebar:not(:hover) .sidebar-brand {
        justify-content: center !important; /* Paksa ke tengah */
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* =========================================
   C. MOBILE FLOATING MENU
========================================= */
@media (max-width: 991.98px) {
    .admin-main-content { padding: 1.25rem; padding-bottom: 6rem; display: flex; flex-direction: column; min-height: 100vh;}
    .admin-sidebar { display: none; }
}

.mobile-fab {
    position: fixed;
    bottom: 2rem;
    right: 1.5rem;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--primary-gradient);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(13, 110, 253, 0.4);
    z-index: 1050;
    cursor: pointer;
    border: none;
    transition: transform 0.2s;
}
.mobile-fab:active { transform: scale(0.9); }
.mobile-fab i { font-size: 1.5rem; }

.offcanvas-admin { background-color: var(--admin-sidebar); color: white; }
.offcanvas-admin .nav-link { color: rgba(255,255,255,0.7); padding: 0.8rem 1rem; border-radius: 0.5rem; margin-bottom: 0.2rem; }
.offcanvas-admin .nav-link.active, .offcanvas-admin .nav-link:hover { color: white; background-color: rgba(255,255,255,0.1); }

/* =========================================
   D. WIDGET, KARTU, DAN TABEL PREMIUM
========================================= */
.admin-card {
    background-color: var(--admin-card);
    border: 1px solid rgba(128, 128, 128, 0.08);
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.admin-card:hover { box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06); }

.bg-gradient-primary { background: var(--primary-gradient); color: white; border: none; }
.bg-gradient-primary .text-muted { color: rgba(255,255,255,0.8) !important; }
.bg-gradient-primary .badge.text-primary { color: var(--primary-blue) !important; }

.widget-icon {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    font-size: 1.5rem;
}

.table-admin { margin-bottom: 0; }
.table-admin th {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    border-bottom: 2px solid rgba(128,128,128,0.1);
    background-color: transparent;
    padding: 1rem;
}
.table-admin td {
    padding: 1rem;
    vertical-align: middle;
    border-bottom: 1px solid rgba(128,128,128,0.05);
    background-color: transparent;
    color: var(--admin-text);
}
.table-admin tbody tr:hover { background-color: rgba(128,128,128,0.02); }

.badge-status { padding: 0.4rem 0.8rem; border-radius: 50rem; font-weight: 600; font-size: 0.75rem; }
.status-sukses { background-color: rgba(25, 135, 84, 0.1); color: #198754; }
.status-proses { background-color: rgba(255, 193, 7, 0.15); color: #b08100; }
.status-gagal { background-color: rgba(220, 53, 69, 0.1); color: #dc3545; }
[data-bs-theme="dark"] .status-proses { color: #ffc107; }

.order-list-item { border-left: 3px solid transparent; transition: all 0.2s; }
.order-list-item:hover { background-color: rgba(128,128,128,0.02); border-left-color: var(--primary-blue); }

/* =========================================
   E. CUSTOM UI COMPONENTS (ALERTS & PILLS)
========================================= */

/* Nav Pills Custom Styling */
.admin-pills .nav-link { color: var(--admin-text); }
.admin-pills .nav-link.active { background: var(--primary-gradient); color: white; box-shadow: 0 4px 10px rgba(13, 110, 253, 0.3); border: none; }
[data-bs-theme="dark"] .admin-pills .bg-white { background-color: var(--admin-card) !important; border-color: rgba(255,255,255,0.1) !important;}

/* Alert Overlay (Background gelap di PC) */
.nusa-alert-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 2050;
    display: flex; align-items: center; justify-content: center;
    opacity: 0; visibility: hidden; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.nusa-alert-overlay.show { opacity: 1; visibility: visible; backdrop-filter: blur(3px); }

/* Alert Box Utama (Popup Desktop) */
.nusa-alert-box {
    background-color: var(--admin-card);
    border: 1px solid rgba(128,128,128,0.1);
    border-radius: 1.2rem;
    padding: 2rem;
    width: 90%; max-width: 400px;
    text-align: center;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
    transform: scale(0.8) translateY(20px);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    color: var(--admin-text);
}
.nusa-alert-overlay.show .nusa-alert-box { transform: scale(1) translateY(0); }

/* Styling Ikon Alert */
.nusa-alert-icon { font-size: 3.5rem; margin-bottom: 1rem; line-height: 1; }
.nusa-icon-success { color: #198754; }
.nusa-icon-error { color: #dc3545; }
.nusa-icon-warning { color: #ffc107; }

/* Judul dan Teks */
.nusa-alert-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 0.5rem; }
.nusa-alert-text { font-size: 0.9rem; color: #6c757d; margin-bottom: 1.5rem; }
[data-bs-theme="dark"] .nusa-alert-text { color: #adb5bd; }

/* Responsive Mobile (Merubah jadi Toast Ngambang di bawah) */
@media (max-width: 767px) {
    .nusa-alert-overlay {
        background: transparent !important; backdrop-filter: none;
        align-items: flex-end; /* Nempel ke bawah */
        padding-bottom: 2rem; /* Jarak dari bawah */
        pointer-events: none; /* Agar area luar toast tetap bisa di-klik jika alert muncul */
    }
    .nusa-alert-box {
        pointer-events: auto; /* Toast tetap bisa diklik */
        max-width: 100%;
        width: calc(100% - 2rem);
        margin: 0 auto;
        padding: 1.5rem;
        display: flex; flex-direction: column; align-items: center;
        border-radius: 1rem;
        box-shadow: 0 -5px 25px rgba(0,0,0,0.1);
        transform: translateY(50px);
    }
}