/* ======================================================= */
/* 1. BASE SETUP & BACKGROUND                               */
/* ======================================================= */
body { 
    background-color: #050505; 
    background-image: url('/hinh/bg.jpg'); 
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    font-family: 'Segoe UI', sans-serif; 
    min-height: 100vh; 
    margin: 0; 
    position: relative; 
    display: block; 
    overflow-x: hidden; 
    color: #e2e8f0;
}

/* ======================================================= */
/* 2. CUSTOM SCROLLBAR                                      */
/* ======================================================= */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0a0a0a; }
::-webkit-scrollbar-thumb { background: #334155; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #60a5fa; }

/* ======================================================= */
/* 3. MOBILE FIX (Đã bỏ khóa chiều cao để hiện Footer)      */
/* ======================================================= */
@media (max-width: 1023px) {
    html, body {
        height: auto !important;
        overflow: visible !important;
    }
    body {
        background-image: none !important; 
        background-color: transparent !important;
    }
    body::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background-image: url('/hinh/bg.jpg');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        z-index: -1; 
        pointer-events: none; 
    }

    #section-home {
        background-image: url('/hinh/bg-mobile.jpg') !important;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
}