:root {
    --primary-gradient: linear-gradient(135deg, #0062ff 0%, #003180 100%);
    --bg-light: #f4f7fa;
    --text-main: #2d3436;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    font-family: 'Inter', -apple-system, sans-serif;
    background-color: var(--bg-light);
    color: var(--text-main);
}

/* --- NAV NGANG PC --- */
.navbar {
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.8) !important;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    padding: 15px 0;
}

.nav-link {
    font-weight: 500;
    color: #636e72 !important;
    padding: 0.5rem 1.2rem !important;
    position: relative;
    transition: var(--transition);
}

.nav-link:hover { color: #0062ff !important; }

/* Hiệu ứng gạch chân hiện đại */
@media (min-width: 992px) {
    .nav-link::after {
        content: ''; position: absolute; bottom: 0; left: 50%;
        width: 0; height: 2px; background: #0062ff;
        transition: var(--transition); transform: translateX(-50%);
    }
    .nav-link:hover::after { width: 30px; }
}

/* --- SIDEBAR TRƯỢT (OFF-CANVAS) MOBILE --- */
/* --- SIDEBAR TRƯỢT (OFF-CANVAS) v1.9 --- */
@media (max-width: 991px) {
    .navbar-collapse {
        position: fixed;
        top: 0;
        left: -320px; /* Ẩn ngoài màn hình bên trái */
        width: 280px;
        height: 100vh;
        background: #ffffff;
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        display: flex !important;
        flex-direction: column;
        z-index: 2100; /* Cao hơn Overlay */
        box-shadow: none;
        border-radius: 0 25px 25px 0;
        visibility: hidden; /* Tránh cản trở khi đóng */
    }

    .navbar-collapse.show {
        transform: translateX(320px);
        visibility: visible;
        box-shadow: 15px 0 30px rgba(0,0,0,0.15);
    }

    /* Overlay - Màn mờ điều chỉnh lại */
    .menu-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.4);
        backdrop-filter: blur(3px);
        z-index: 2000; /* Thấp hơn Sidebar nhưng cao hơn Content */
        display: none; /* Mặc định ẩn hoàn toàn */
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* Chỉ hiển thị khi menu-overlay có class active */
    .menu-overlay.active {
        display: block;
        opacity: 1;
    }

    /* Ngăn cuộn trang khi đang mở menu */
    body.menu-open {
        overflow: hidden;
    }
}

/* User Profile Sidebar v1.9 */
.user-profile {
    background: var(--primary-gradient);
    padding: 25px 20px;
    margin: 10px;
    border-radius: 20px;
    color: white;
}

/* --- BUTTONS --- */
.btn-primary {
    background: var(--primary-gradient);
    border: none; border-radius: 10px;
    padding: 10px 25px; box-shadow: 0 4px 15px rgba(0,98,255,0.3);
}