/* Generated by Remnawave Customizer. Token-first compatibility layer. */
:root, [data-mantine-color-scheme="dark"] {
  --rwc-background: rgb(7 12 19);
  --rwc-surface: rgb(13 21 31);
  --rwc-surface-deep: rgb(10 17 26);
  --rwc-surface-hover: rgb(23 30 40);
  --rwc-border: rgb(35 42 51);
  --rwc-accent: rgb(0 169 255);
  --rwc-accent-rgb: 0, 169, 255;
  --rwc-text: rgb(238 241 245);
  --rwc-dimmed: rgb(157 166 179);
  --rwc-muted: rgb(112 122 137);
  --mantine-color-body: rgb(7 12 19) !important;
  --mantine-color-text: rgb(238 241 245) !important;
  --mantine-color-dimmed: rgb(157 166 179) !important;
  --mantine-color-bright: rgb(238 241 245) !important;
  --mantine-color-placeholder: rgb(112 122 137) !important;
  --mantine-color-default: var(--mantine-color-dark-6) !important;
  --mantine-color-default-hover: var(--rwc-surface-hover) !important;
  --mantine-color-default-color: var(--rwc-text) !important;
  --mantine-color-default-border: var(--mantine-color-dark-4) !important;
  --mantine-color-anchor: var(--rwc-accent) !important;
  --mantine-color-gray-outline-hover: var(--rwc-surface-hover) !important;
  --mantine-color-cyan-0: rgb(235 248 255) !important;
  --mantine-color-cyan-1: rgb(209 240 255) !important;
  --mantine-color-cyan-2: rgb(178 229 255) !important;
  --mantine-color-cyan-3: rgb(143 217 255) !important;
  --mantine-color-cyan-4: rgb(102 203 255) !important;
  --mantine-color-cyan-5: rgb(64 190 255) !important;
  --mantine-color-cyan-6: rgb(31 179 255) !important;
  --mantine-color-cyan-7: rgb(0 169 255) !important;
  --mantine-color-cyan-8: rgb(0 169 255) !important;
  --mantine-color-cyan-9: rgb(0 145 219) !important;
  --mantine-color-cyan-filled: rgb(0 169 255) !important;
  --mantine-color-cyan-filled-hover: rgb(0 145 219) !important;
  --mantine-color-cyan-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-color-cyan-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-color-cyan-light-color: rgb(102 203 255) !important;
  --mantine-color-cyan-outline: rgb(0 169 255) !important;
  --mantine-color-cyan-outline-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --mantine-color-blue-0: rgb(235 248 255) !important;
  --mantine-color-blue-1: rgb(209 240 255) !important;
  --mantine-color-blue-2: rgb(178 229 255) !important;
  --mantine-color-blue-3: rgb(143 217 255) !important;
  --mantine-color-blue-4: rgb(102 203 255) !important;
  --mantine-color-blue-5: rgb(64 190 255) !important;
  --mantine-color-blue-6: rgb(31 179 255) !important;
  --mantine-color-blue-7: rgb(0 169 255) !important;
  --mantine-color-blue-8: rgb(0 169 255) !important;
  --mantine-color-blue-9: rgb(0 145 219) !important;
  --mantine-color-blue-filled: rgb(0 169 255) !important;
  --mantine-color-blue-filled-hover: rgb(0 145 219) !important;
  --mantine-color-blue-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-color-blue-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-color-blue-light-color: rgb(102 203 255) !important;
  --mantine-color-blue-outline: rgb(0 169 255) !important;
  --mantine-color-blue-outline-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --mantine-color-indigo-0: rgb(235 248 255) !important;
  --mantine-color-indigo-1: rgb(209 240 255) !important;
  --mantine-color-indigo-2: rgb(178 229 255) !important;
  --mantine-color-indigo-3: rgb(143 217 255) !important;
  --mantine-color-indigo-4: rgb(102 203 255) !important;
  --mantine-color-indigo-5: rgb(64 190 255) !important;
  --mantine-color-indigo-6: rgb(31 179 255) !important;
  --mantine-color-indigo-7: rgb(0 169 255) !important;
  --mantine-color-indigo-8: rgb(0 169 255) !important;
  --mantine-color-indigo-9: rgb(0 145 219) !important;
  --mantine-color-indigo-filled: rgb(0 169 255) !important;
  --mantine-color-indigo-filled-hover: rgb(0 145 219) !important;
  --mantine-color-indigo-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-color-indigo-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-color-indigo-light-color: rgb(102 203 255) !important;
  --mantine-color-indigo-outline: rgb(0 169 255) !important;
  --mantine-color-indigo-outline-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --mantine-color-dark-0: rgb(232 236 242) !important;
  --mantine-color-dark-1: rgb(204 210 219) !important;
  --mantine-color-dark-2: rgb(168 176 188) !important;
  --mantine-color-dark-3: rgb(126 136 150) !important;
  --mantine-color-dark-4: rgb(35 42 51) !important;
  --mantine-color-dark-5: rgb(24 32 41) !important;
  --mantine-color-dark-6: rgb(13 21 31) !important;
  --mantine-color-dark-7: rgb(10 17 26) !important;
  --mantine-color-dark-8: rgb(7 12 19) !important;
  --mantine-color-dark-9: rgb(6 10 16) !important;
  --mantine-primary-color-filled: var(--mantine-color-cyan-8) !important;
  --mantine-primary-color-filled-hover: var(--mantine-color-cyan-9) !important;
  --mantine-primary-color-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-primary-color-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-primary-color-light-color: var(--mantine-color-cyan-4) !important;
  --mantine-radius-xs: 4px !important;
  --mantine-radius-sm: 7px !important;
  --mantine-radius-md: 10px !important;
  --mantine-radius-lg: 14px !important;
  --mantine-radius-xl: 18px !important;
  --mantine-radius-default: 10px !important;
}

/* Page canvas. Remove top-level outlines/shadows that become visible on
   strongly tinted themes even though stock Remnawave hides them. */
html, body, #root, .mantine-AppShell-root, .mantine-AppShell-main {
  background-color: var(--rwc-background) !important;
  border: 0 !important;
  outline: 0 !important;
}
.mantine-AppShell-root { box-shadow: none !important; }
.mantine-AppShell-header { border-top: 0 !important; }

/* Sidebar ambient glow and icon glow follow the selected accent. */
.mantine-AppShell-navbar::before {
  background: radial-gradient(circle at 20% 20%, rgba(var(--rwc-accent-rgb), 0.065) 0%, transparent 52%) !important;
}
.mantine-AppShell-navbar a:hover svg, .mantine-AppShell-navbar [data-active="true"] svg {
  filter: drop-shadow(0 2px 4px rgba(var(--rwc-accent-rgb), 0.28)) !important;
}

/* Mantine NavigationProgress shares Progress track styles. With a custom
   dark palette its transparent top track can become visible as a 2-3px
   line. Force only the navigation progress track itself transparent. */
.mantine-Progress-root[style*="--nprogress-z-index"] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.mantine-Progress-root[style*="--nprogress-z-index"]:not([data-mounted]) {
  opacity: 0 !important;
}
.mantine-Progress-root[style*="--nprogress-z-index"] .mantine-Progress-section::before {
  box-shadow: 0 0 8px rgba(var(--rwc-accent-rgb), 0.42), 0 0 4px rgba(var(--rwc-accent-rgb), 0.24) !important;
}

/* Mantine React Table hard-codes #1b2027 as an inline CSS variable in
   Users, HWID/SRH inspectors and Torrent Blocker tables. Inline custom
   properties beat normal theme variables, so override that one variable
   with !important instead of filtering the JavaScript bundle. */
[style*="--mrt-base-background-color"] {
  --mrt-base-background-color: var(--rwc-surface) !important;
  background-color: var(--rwc-surface) !important;
}

/* Inline legacy surfaces from a handful of React components. */
[style*="#1b1f26" i], [style*="rgb(27, 31, 38)" i] {
  background-color: var(--rwc-surface) !important;
}
[style*="#161b23" i], [style*="rgb(22, 27, 35)" i] {
  background-color: var(--rwc-surface-deep) !important;
}

/* Some Remnawave components hard-code indigo/cyan/blue decoration in
   inline styles instead of theme variables. Normalize only background
   and border properties; semantic status colors stay untouched. */
[style*="background: rgba(99, 102, 241"], [style*="background-color: rgba(99, 102, 241"],
[style*="background: rgba(59, 130, 246"], [style*="background-color: rgba(59, 130, 246"],
[style*="background: rgba(6, 182, 212"], [style*="background-color: rgba(6, 182, 212"] {
  background-color: rgba(var(--rwc-accent-rgb), 0.08) !important;
}
[style*="border: 1px solid rgba(99, 102, 241"], [style*="border-color: rgba(99, 102, 241"],
[style*="border: 1px solid rgba(59, 130, 246"], [style*="border-color: rgba(59, 130, 246"],
[style*="border: 1px solid rgba(6, 182, 212"], [style*="border-color: rgba(6, 182, 212"] {
  border-color: rgba(var(--rwc-accent-rgb), 0.20) !important;
}

/* Scrollbars should not keep Remnawave cyan/teal when another accent is selected. */
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner {
  background: var(--rwc-background) !important;
}
::-webkit-scrollbar-thumb {
  background: var(--rwc-accent) !important;
  border-color: var(--rwc-background) !important;
}
* { scrollbar-color: var(--rwc-accent) var(--rwc-background); }
::selection {
  background: rgba(var(--rwc-accent-rgb), 0.24) !important;
  color: var(--rwc-text) !important;
}


/* Remnawave Customizer: decorative accent compatibility. */
.mantine-ActionIcon-root[style*="mantine-color-cyan"],
.mantine-ActionIcon-root[style*="mantine-color-blue"],
.mantine-ActionIcon-root[style*="mantine-color-indigo"] {
  --ai-color: var(--rwc-accent) !important;
  --ai-hover-color: var(--rwc-accent) !important;
  --ai-bd: 1px solid rgba(var(--rwc-accent-rgb), 0.42) !important;
}

.mantine-ActionIcon-root[data-variant="light"][style*="mantine-color-cyan"],
.mantine-ActionIcon-root[data-variant="light"][style*="mantine-color-blue"],
.mantine-ActionIcon-root[data-variant="light"][style*="mantine-color-indigo"],
.mantine-ActionIcon-root[data-variant="soft"][style*="mantine-color-cyan"],
.mantine-ActionIcon-root[data-variant="soft"][style*="mantine-color-blue"],
.mantine-ActionIcon-root[data-variant="soft"][style*="mantine-color-indigo"] {
  --ai-bg: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --ai-hover: rgba(var(--rwc-accent-rgb), 0.18) !important;
}

.mantine-ActionIcon-root[data-variant="outline"][style*="mantine-color-cyan"],
.mantine-ActionIcon-root[data-variant="outline"][style*="mantine-color-blue"],
.mantine-ActionIcon-root[data-variant="outline"][style*="mantine-color-indigo"] {
  --ai-bg: transparent !important;
  --ai-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
}

.mantine-ThemeIcon-root[style*="mantine-color-cyan"],
.mantine-ThemeIcon-root[style*="mantine-color-blue"],
.mantine-ThemeIcon-root[style*="mantine-color-indigo"] {
  --ti-color: var(--rwc-accent) !important;
  --ti-bg: rgba(var(--rwc-accent-rgb), 0.09) !important;
  --ti-bd: 1px solid rgba(var(--rwc-accent-rgb), 0.36) !important;
}

.mantine-AppShell-navbar a:hover svg,
.mantine-AppShell-navbar button:hover svg,
.mantine-AppShell-navbar [data-active="true"] svg {
  filter: drop-shadow(0 2px 4px rgba(var(--rwc-accent-rgb), 0.28)) !important;
}

.mantine-AppShell-navbar a:hover::before,
.mantine-AppShell-navbar button:hover::before,
.mantine-AppShell-navbar [data-active="true"]::before {
  background: linear-gradient(135deg, transparent 0%, rgba(var(--rwc-accent-rgb), 0.08) 50%, transparent 100%) !important;
}

.mantine-AppShell-navbar [data-active="true"] {
  border-color: var(--rwc-accent) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--rwc-accent-rgb), 0.05), 0 0 14px rgba(var(--rwc-accent-rgb), 0.04) !important;
}

.mantine-AppShell-navbar [data-active="true"]::after {
  background: var(--rwc-accent) !important;
  box-shadow: 0 0 8px rgba(var(--rwc-accent-rgb), 0.42) !important;
}
