/* FanatikBet220 charcoal canvas + surface remaps */
.snow-wrap,
#snowWrap,
.snowflake {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

:root {
    --bg-main: #1e2126;
    --bg-secondary: #2a2d33;
    --bg-deep: #16181c;
    --kz-navy: #1e2126 !important;
    --kz-navy-2: #16181c !important;
    --kz-navy-3: #22252b !important;
}

html,
body,
body.bg-black,
body.page-home,
body.page-payment,
body.page-auth,
body.has-mobile-bottom-nav,
body.theme-fanatik {
    background: #1e2126 !important;
    background-color: #1e2126 !important;
    background-image: none !important;
    color: #ffffff;
}

body {
    background:
        radial-gradient(1200px 520px at 50% -8%, rgba(255,0,58,.10), transparent 55%),
        linear-gradient(180deg, #1e2126 0%, #22252b 42%, #2a2d33 78%, #16181c 100%) !important;
}

body .flex.min-h-screen,
body .kz-marina-main-shift,
main,
.home-page {
    background: transparent !important;
}

.bg-black,
.bg-black\/60,
.bg-dark {
    background-color: #1e2126 !important;
}

body > div.fixed.inset-0.pointer-events-none:not(#mobileSidebarOverlay) {
    display: none !important;
}

body > div.flex.min-h-screen,
body > div.flex.min-h-screen.bg-black\/60,
body.bg-black > div.flex.min-h-screen.relative {
    background-color: #1e2126 !important;
    background-image: none !important;
}

nav.site-header-nav,
.site-header-nav,
#siteHeaderNav,
.navbar,
.topbar,
.header,
.header-area {
    background: #1e2126 !important;
    background-color: #1e2126 !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    isolation: isolate;
    user-select: none !important;
    -webkit-user-select: none !important;
}

.site-logo-link,
nav.site-header-nav .site-logo-link,
#siteHeaderNav .site-logo-link {
    flex: 0 0 auto !important;
    max-width: max-content !important;
    width: auto !important;
}

#desktopSidebar,
#mobileSidebar {
    background: #1e2126 !important;
    background-color: #1e2126 !important;
    background-image:
        radial-gradient(circle at top left, rgba(255, 0, 58, 0.1), transparent 34%),
        linear-gradient(180deg, #1e2126 0%, #2a2d33 38%, #22252b 100%) !important;
    isolation: isolate;
    opacity: 1 !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: 10px 0 36px rgba(0, 0, 0, 0.48) !important;
}

#desktopSidebar > .absolute.inset-0,
#mobileSidebar > .absolute.inset-0 {
    display: none !important;
}

#mobileSidebarOverlay {
    background: rgba(22, 24, 28, 0.78) !important;
    background-color: rgba(22, 24, 28, 0.78) !important;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    z-index: 10040 !important;
}

html.sidebar-open #mobileSidebar,
body.sidebar-open #mobileSidebar {
    z-index: 10050 !important;
}

footer,
.footer,
.site-footer,
.site-footer-license,
.site-footer-license__inner,
.site-footer-license__well {
    background: #1e2126 !important;
    background-color: #1e2126 !important;
    background-image: none !important;
}

.auth-minimal-body {
    background: #1e2126 !important;
    background-color: #1e2126 !important;
    background-image: none !important;
}

.auth-minimal-body::before {
    display: none !important;
}

.profile-panel,
.profile-panel__inner,
.profile-panel--3d,
#profilePanel {
    background: #1e2126 !important;
    background-color: #1e2126 !important;
}

.glass-effect,
.glass-enhanced {
    background: linear-gradient(180deg, rgba(42, 45, 51, 0.92), rgba(30, 33, 38, 0.94)) !important;
}

.custom-scrollbar {
    scrollbar-color: #ff003a #1e2126 !important;
}
.custom-scrollbar::-webkit-scrollbar {
    background: #1e2126 !important;
}

.mobile-bottom-nav,
#mobileBottomNav,
nav.mobile-bottom-nav {
    background: #1e2126 !important;
    background-color: #1e2126 !important;
}

/* Zinc → charcoal family */
.bg-zinc-900 {
    --tw-bg-opacity: 1 !important;
    background-color: #1e2126 !important;
}
.bg-zinc-900\/30 { background-color: rgba(30, 33, 38, 0.30) !important; }
.bg-zinc-900\/40 { background-color: rgba(42, 45, 51, 0.55) !important; }
.bg-zinc-900\/50 { background-color: rgba(42, 45, 51, 0.72) !important; }
.bg-zinc-900\/60 { background-color: rgba(42, 45, 51, 0.82) !important; }

.bg-zinc-800 {
    --tw-bg-opacity: 1 !important;
    background-color: #34383f !important;
}
.bg-zinc-800\/20 { background-color: rgba(52, 56, 63, 0.20) !important; }
.bg-zinc-800\/30 { background-color: rgba(52, 56, 63, 0.35) !important; }
.bg-zinc-800\/40 { background-color: rgba(52, 56, 63, 0.45) !important; }
.bg-zinc-800\/50 { background-color: rgba(52, 56, 63, 0.55) !important; }
.bg-zinc-800\/60 { background-color: rgba(52, 56, 63, 0.65) !important; }
.bg-zinc-800\/70 { background-color: rgba(52, 56, 63, 0.75) !important; }
.bg-zinc-800\/80 { background-color: rgba(52, 56, 63, 0.85) !important; }

.bg-zinc-700 {
    --tw-bg-opacity: 1 !important;
    background-color: #3a3f48 !important;
}
.bg-zinc-700\/50 { background-color: rgba(58, 63, 72, 0.55) !important; }
.bg-zinc-700\/70 { background-color: rgba(58, 63, 72, 0.70) !important; }

.bg-zinc-600 {
    --tw-bg-opacity: 1 !important;
    background-color: #4a505a !important;
}

.hover\:bg-zinc-600:hover { background-color: #4a505a !important; }
.hover\:bg-zinc-700:hover { background-color: #3a3f48 !important; }
.hover\:bg-zinc-700\/50:hover { background-color: rgba(58, 63, 72, 0.55) !important; }
.hover\:bg-zinc-700\/60:hover { background-color: rgba(58, 63, 72, 0.65) !important; }
.hover\:bg-zinc-800:hover { background-color: #34383f !important; }
.hover\:bg-zinc-800\/30:hover { background-color: rgba(52, 56, 63, 0.40) !important; }
.hover\:bg-zinc-800\/40:hover { background-color: rgba(52, 56, 63, 0.50) !important; }
.hover\:bg-zinc-800\/50:hover { background-color: rgba(52, 56, 63, 0.60) !important; }
.hover\:bg-zinc-900\/40:hover { background-color: rgba(42, 45, 51, 0.55) !important; }

.border-zinc-600 { border-color: #4a505a !important; }
.border-zinc-600\/30 { border-color: rgba(74, 80, 90, 0.35) !important; }
.border-zinc-600\/40 { border-color: rgba(74, 80, 90, 0.45) !important; }
.border-zinc-600\/50 { border-color: rgba(74, 80, 90, 0.55) !important; }
.border-zinc-700 { border-color: #4a505a !important; }
.border-zinc-700\/30 { border-color: rgba(74, 80, 90, 0.35) !important; }
.border-zinc-700\/50 { border-color: rgba(74, 80, 90, 0.55) !important; }
.border-zinc-700\/60 { border-color: rgba(74, 80, 90, 0.65) !important; }
.border-zinc-700\/70 { border-color: rgba(74, 80, 90, 0.75) !important; }
.border-zinc-800 { border-color: #34383f !important; }
.border-zinc-800\/50 { border-color: rgba(52, 56, 63, 0.55) !important; }
.border-zinc-800\/60 { border-color: rgba(52, 56, 63, 0.70) !important; }
.border-zinc-900 { border-color: #2a2d33 !important; }
.border-zinc-900\/80 { border-color: rgba(42, 45, 51, 0.85) !important; }

.divide-zinc-700 > :not([hidden]) ~ :not([hidden]) { border-color: #4a505a !important; }
.divide-zinc-700\/30 > :not([hidden]) ~ :not([hidden]) { border-color: rgba(74, 80, 90, 0.35) !important; }
.divide-zinc-800 > :not([hidden]) ~ :not([hidden]) { border-color: #34383f !important; }

.from-zinc-900 {
    --tw-gradient-from: #1e2126 var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(30, 33, 38, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-zinc-900\/40 {
    --tw-gradient-from: rgba(30, 33, 38, 0.40) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(30, 33, 38, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-zinc-900\/50 {
    --tw-gradient-from: rgba(42, 45, 51, 0.55) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(42, 45, 51, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-zinc-900\/95 {
    --tw-gradient-from: rgba(30, 33, 38, 0.95) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(30, 33, 38, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-zinc-800\/50 {
    --tw-gradient-from: rgba(52, 56, 63, 0.55) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(52, 56, 63, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-zinc-800\/80 {
    --tw-gradient-from: rgba(52, 56, 63, 0.85) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(52, 56, 63, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-zinc-700\/30 {
    --tw-gradient-from: rgba(58, 63, 72, 0.35) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(58, 63, 72, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.via-zinc-900\/60 {
    --tw-gradient-to: rgba(30, 33, 38, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), rgba(42, 45, 51, 0.70) var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
.via-zinc-900\/30 {
    --tw-gradient-to: rgba(30, 33, 38, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), rgba(42, 45, 51, 0.35) var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
.via-zinc-800\/30 {
    --tw-gradient-to: rgba(52, 56, 63, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), rgba(52, 56, 63, 0.35) var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}

.text-zinc-400 { color: #a8aeb8 !important; }
.text-zinc-300 { color: #c8cdd6 !important; }
.text-zinc-500 { color: #8a9099 !important; }
.text-zinc-200 { color: #e2e5ea !important; }

.account-page .account-head {
    background: linear-gradient(180deg, #34383f 0%, #2a2d33 55%, #1e2126 100%) !important;
    border-color: rgba(255, 0, 58, 0.18) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22) !important;
}
.account-page .account-panel {
    background: linear-gradient(180deg, rgba(52, 56, 63, 0.92), rgba(30, 33, 38, 0.96)) !important;
    border-color: rgba(255, 0, 58, 0.12) !important;
}
.account-page .account-list__item {
    background: rgba(52, 56, 63, 0.55) !important;
    border-color: rgba(74, 80, 90, 0.55) !important;
}
.account-page .account-avatar__status {
    border-color: #1e2126 !important;
}
.account-page .account-empty__icon {
    background: rgba(52, 56, 63, 0.65) !important;
}

#profilePanelOverlay,
.profile-panel-overlay {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Kill Tailwind marina5 navy utilities on public site */
.bg-\[\#06131c\],
.bg-\[\#0e2742\],
.bg-\[\#06131c\]\/70 {
  background-color: #1e2126 !important;
}
.from-\[\#06131c\],
.from-\[\#051024\],
.from-\[\#0e2742\] {
  --tw-gradient-from: #1e2126 var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgba(30, 33, 38, 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.via-\[\#0a1b27\],
.via-\[\#12324f\] {
  --tw-gradient-to: rgba(42, 45, 51, 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), #2a2d33 var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
.to-\[\#0b1f2a\],
.to-\[\#0a1633\],
.to-\[\#102c48\] {
  --tw-gradient-to: #16181c var(--tw-gradient-to-position) !important;
}
.text-\[\#2ec7ff\],
.text-\[\#2ec7ff\]\/80 {
  color: #ff003a !important;
}
.bg-\[\#2ec7ff\] {
  background-color: #ff003a !important;
}
.border-\[\#2ec7ff\]\/15,
.border-\[\#2ec7ff\]\/20,
.border-\[\#2ec7ff\]\/25,
.border-\[\#2ec7ff\]\/50 {
  border-color: rgba(255, 0, 58, 0.35) !important;
}