/*
 * BaoCar universal atmosphere
 * Used across service, driver, operator and admin pages.
 * Deliberately excluded from index.html, login.html and order-status.html.
 */

@import url("baocar-no-select.css");

body {
    background-color: #03131c !important;
    background-image:
        radial-gradient(ellipse at 12% 16%, rgba(20, 184, 166, 0.16) 0%, transparent 42%),
        radial-gradient(ellipse at 88% 78%, rgba(0, 168, 255, 0.14) 0%, transparent 44%),
        radial-gradient(ellipse at 70% 8%, rgba(255, 61, 172, 0.055) 0%, transparent 34%),
        repeating-linear-gradient(
            118deg,
            transparent 0,
            transparent 46px,
            rgba(96, 230, 220, 0.018) 47px,
            transparent 48px
        ),
        linear-gradient(145deg, #061d27 0%, #03121b 48%, #071927 100%) !important;
    background-size: 145% 145%, 150% 150%, 170% 170%, 180px 180px, 100% 100% !important;
    background-position: 0% 0%, 100% 100%, 70% 0%, 0 0, center;
    background-attachment: fixed !important;
    animation: baocar-atmosphere-drift 24s ease-in-out infinite alternate !important;
}

@keyframes baocar-atmosphere-drift {
    0% {
        background-position: 0% 0%, 100% 100%, 70% 0%, 0 0, center;
    }
    50% {
        background-position: 12% 8%, 88% 90%, 62% 14%, 24px -14px, center;
    }
    100% {
        background-position: 22% 14%, 78% 82%, 76% 22%, 48px -28px, center;
    }
}

@media (max-width: 700px) {
    body {
        background-size: 190% 150%, 185% 155%, 210% 170%, 160px 160px, 100% 100% !important;
        animation-duration: 30s !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body {
        animation: none !important;
        background-position: 8% 6%, 92% 94%, 70% 10%, 0 0, center !important;
    }
}