:root {
    --jv-bg-deep: #0d0d12;
    --jv-bg-main: #12121a;
    --jv-bg-card: #1a1a2e;
    --jv-bg-card-soft: rgba(26, 26, 46, 0.88);
    --jv-accent: #8b5cf6;
    --jv-accent-strong: #a855f7;
    --jv-accent-soft: rgba(139, 92, 246, 0.16);
    --jv-text: #ffffff;
    --jv-text-muted: #a7b0c3;
    --jv-border: rgba(255, 255, 255, 0.12);
    --jv-border-strong: rgba(255, 255, 255, 0.2);
    --jv-radius: 18px;
    --jv-radius-lg: 24px;
    --jv-gradient: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%);
    --jv-shadow-soft: 0 10px 28px rgba(0, 0, 0, 0.26);
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    background-color: var(--jv-bg-deep) !important;
    background-image:
        radial-gradient(circle at 50% 0%, rgba(139, 92, 246, 0.16) 0%, transparent 46%),
        radial-gradient(circle at 100% 100%, rgba(99, 102, 241, 0.1) 0%, transparent 42%),
        linear-gradient(180deg, #0d0d12 0%, #101018 48%, #0d0d12 100%) !important;
    background-attachment: scroll !important;
    background-repeat: no-repeat !important;
    background-size: 100% 100%, 100% 100%, 100% 100% !important;
    color: var(--text, var(--jv-text));
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--jv-bg-deep);
}

::-webkit-scrollbar-thumb {
    background: #2a2a3a;
    border-radius: 10px;
    transition: 0.2s;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--jv-accent);
}

* {
    scrollbar-width: thin;
    scrollbar-color: #2a2a3a var(--jv-bg-deep);
}

.background-visuals {
    opacity: 0.28 !important;
}

a,
button,
input,
select,
textarea,
[tabindex] {
    -webkit-tap-highlight-color: rgba(139, 92, 246, 0.24);
}

:focus-visible {
    outline: 3px solid rgba(168, 85, 247, 0.85) !important;
    outline-offset: 3px !important;
}

::selection {
    background: rgba(139, 92, 246, 0.45);
    color: #fff;
}

.navbar,
.search-form-sticky {
    background: rgba(10, 10, 15, 0.96) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2) !important;
}

.hero,
.page-hero {
    background: transparent !important;
}

.search-form-sticky {
    background: rgba(10, 10, 15, 0.9) !important;
}

.nav-link,
.footer-link,
.btn,
.search-btn,
.filters-toggle-btn,
.quick-type-btn,
.quick-view-btn,
.genre-pill {
    min-height: 40px;
}

.nav-link,
.quick-type-btn,
.quick-view-btn,
.genre-pill,
.filter-select,
.search-input,
.form-control {
    border-color: var(--jv-border) !important;
}

.movie-card,
.vod-card,
.profile-card,
.stat-card,
.stat-box,
.genre-card,
.history-card,
.favorite-card,
.random-card {
    border-color: var(--jv-border) !important;
    box-shadow: none;
}

.movie-card,
.vod-card,
.genre-card,
.history-card,
.favorite-card {
    contain: layout paint style;
    content-visibility: auto;
    contain-intrinsic-size: 420px 620px;
}

.movie-card,
.movie-card .card-img-wrap img,
.vod-card,
.genre-card,
.history-card,
.favorite-card,
.profile-card,
.quick-type-btn,
.quick-view-btn,
.genre-pill,
.nav-link,
.btn {
    transition-duration: 0.2s !important;
}

.type-badge,
.rating-num,
.online-tag,
.modal-content,
.dropdown-menu,
.profile-avatar,
.player-wrapper,
.info-card,
.chat-container,
.comments-section {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.type-badge {
    background-color: rgba(20, 20, 30, 0.84);
}

.rating-num {
    background-color: rgba(0, 0, 0, 0.78) !important;
}

.spinner-border {
    animation: jv-spinner-border 0.75s linear infinite !important;
}

.fa-spin,
.spinner {
    animation-play-state: running !important;
}

@keyframes jv-spinner-border {
    to {
        transform: rotate(360deg);
    }
}

.card-img-wrap::before {
    animation: none !important;
}

.orb {
    filter: blur(54px) !important;
    animation-duration: 32s !important;
}

.hero-title,
.intro-title {
    filter: none !important;
}

img {
    max-width: 100%;
}

img[loading="lazy"] {
    content-visibility: auto;
}

.form-control::placeholder,
.search-input::placeholder {
    color: rgba(167, 176, 195, 0.72) !important;
}

.form-control:focus,
.search-input:focus,
.filter-select:focus {
    border-color: var(--jv-accent) !important;
    box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.18) !important;
}

@media (hover: hover) and (pointer: fine) {
    .movie-card:hover,
    .vod-card:hover,
    .genre-card:hover,
    .history-card:hover,
    .favorite-card:hover,
    .profile-card:hover,
    .stat-box:hover {
        transform: translateY(-4px) !important;
        box-shadow: var(--jv-shadow-soft) !important;
    }

    .movie-card:hover .card-img-wrap img,
    .vod-card:hover img {
        transform: scale(1.035) !important;
    }
}

@media (hover: none), (pointer: coarse) {
    .movie-card:hover,
    .vod-card:hover,
    .genre-card:hover,
    .history-card:hover,
    .favorite-card:hover,
    .profile-card:hover,
    .stat-box:hover,
    .movie-card:hover .card-img-wrap img,
    .vod-card:hover img {
        transform: none !important;
        box-shadow: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto !important;
    }

    .orb,
    .nav-link-newyear,
    .nav-link-newyear::before,
    .online-tag i,
    .card-img-wrap::before,
    .cc-payment-button-link::before {
        animation: none !important;
    }

    .movie-card,
    .vod-card,
    .genre-card,
    .history-card,
    .favorite-card,
    .profile-card,
    .stat-box,
    .type-card {
        transition-duration: 0.12s !important;
    }

    .spinner,
    .spinner-border,
    .fa-spin,
    .chat-loading-spinner,
    .chat-loading-overlay .chat-loading-spinner {
        animation-duration: 0.9s !important;
        animation-iteration-count: infinite !important;
        animation-timing-function: linear !important;
    }

    .chat-loading-overlay .chat-loading-dots span {
        animation-duration: 1.4s !important;
        animation-iteration-count: infinite !important;
    }

}

@media (max-width: 768px) {
    .navbar,
    .search-form-sticky {
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important;
    }

    .nav-link,
    .footer-link,
    .btn,
    .search-btn,
    .filters-toggle-btn,
    .quick-type-btn,
    .quick-view-btn,
    .genre-pill {
        min-height: 44px;
    }
}