/* Parkava cabinet overlay — same Material 3 tokens as vpn.parkava.fans subscription page */

:root {
  --color-dark-50: 254, 247, 255 !important;
  --color-dark-100: 243, 237, 247 !important;
  --color-dark-200: 230, 224, 233 !important;
  --color-dark-300: 202, 196, 208 !important;
  --color-dark-400: 147, 143, 153 !important;
  --color-dark-500: 121, 116, 126 !important;
  --color-dark-600: 73, 69, 79 !important;
  --color-dark-700: 54, 52, 59 !important;
  --color-dark-800: 43, 41, 48 !important;
  --color-dark-850: 33, 31, 38 !important;
  --color-dark-900: 29, 27, 32 !important;
  --color-dark-950: 20, 18, 24 !important;
  --color-dark-bg: #141218 !important;
  --color-dark-surface: #1d1b20 !important;
  --color-dark-text: #e6e0e9 !important;
  --color-dark-text-secondary: #cac4d0 !important;

  --color-champagne-50: 255, 251, 255 !important;
  --color-champagne-100: 247, 242, 250 !important;
  --color-champagne-200: 254, 247, 255 !important;
  --color-champagne-300: 243, 237, 247 !important;
  --color-champagne-400: 236, 230, 240 !important;
  --color-champagne-500: 202, 196, 208 !important;
  --color-champagne-600: 121, 116, 126 !important;
  --color-champagne-700: 73, 69, 79 !important;
  --color-champagne-800: 49, 45, 55 !important;
  --color-champagne-900: 29, 27, 32 !important;
  --color-champagne-950: 20, 18, 24 !important;

  --color-light-bg: #fef7ff !important;
  --color-light-surface: #f7f2fa !important;
  --color-light-text: #1d1b20 !important;
  --color-light-text-secondary: #49454f !important;

  --color-accent-50: 246, 237, 255 !important;
  --color-accent-100: 234, 221, 255 !important;
  --color-accent-200: 208, 188, 255 !important;
  --color-accent-300: 182, 157, 248 !important;
  --color-accent-400: 208, 188, 255 !important;
  --color-accent-500: 103, 80, 164 !important;
  --color-accent-600: 90, 61, 158 !important;
  --color-accent-700: 79, 55, 139 !important;
  --color-accent-800: 103, 80, 164 !important;
  --color-accent-900: 56, 30, 114 !important;
  --color-accent-950: 33, 0, 93 !important;

  --color-on-accent: 255, 255, 255 !important;
  --color-success-500: 56, 106, 32 !important;
  --color-error-500: 179, 38, 30 !important;
}

html.light {
  --color-on-accent: 255, 255, 255 !important;
  --color-accent-400: 103, 80, 164 !important;
  --color-dark-50: 20, 18, 24 !important;
  --color-dark-100: 29, 27, 32 !important;
  --color-dark-200: 49, 45, 55 !important;
  --color-dark-300: 73, 69, 79 !important;
  --color-dark-400: 121, 116, 126 !important;
  --color-dark-500: 202, 196, 208 !important;
  --color-dark-600: 236, 230, 240 !important;
  --color-dark-700: 243, 237, 247 !important;
  --color-dark-800: 255, 251, 255 !important;
  --color-dark-850: 247, 242, 250 !important;
  --color-dark-900: 247, 242, 250 !important;
  --color-dark-950: 254, 247, 255 !important;
}

html.dark {
  --color-on-accent: 56, 30, 114 !important;
}

html,
body,
button,
input,
select,
textarea,
.font-sans,
.font-display {
  font-family: "Twemoji Country Flags", Roboto, system-ui, sans-serif !important;
  letter-spacing: 0.15px;
}

body {
  background-color: #141218;
  color: #e6e0e9;
}

:where(html.light) body {
  background-color: #fef7ff;
  color: #1d1b20;
}

.rounded-2xl {
  border-radius: 28px !important;
}

.rounded-xl,
[class*="rounded-[14px]"] {
  border-radius: 16px !important;
}

.rounded-lg {
  border-radius: 12px !important;
}

.rounded-2xl,
.rounded-xl {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.08);
}

html.dark .rounded-2xl,
html.dark .rounded-xl {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

.rounded-full {
  box-shadow: none;
}

/* Login / CTA buttons closer to subscription filled chips */
button.bg-accent-500,
a.bg-accent-500,
button.bg-accent-400,
a.bg-accent-400 {
  border-radius: 20px !important;
  font-weight: 500;
  box-shadow: none;
}

/* Referral program is off: hide cabinet tab, dashboard tile, and related user routes. */
a[href="/referral"],
a[href="/referral/"],
a[href^="/referral/partner"],
a[href^="/referral/withdrawal"] {
  display: none !important;
}