/*
 * SnowAPI monochrome theme
 * Served by Nginx and injected after the bundled New API stylesheet.
 * Brand surfaces are neutral; semantic success/warning/error colors stay intact.
 */

:root,
:root [data-theme-preset] {
  color-scheme: light;
  --radius: 0.85rem;
  --background: oklch(0.975 0 0);
  --foreground: oklch(0.13 0 0);
  --card: oklch(0.995 0 0 / 92%);
  --card-foreground: oklch(0.13 0 0);
  --popover: oklch(0.995 0 0 / 98%);
  --popover-foreground: oklch(0.13 0 0);
  --primary: oklch(0.19 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.925 0 0);
  --secondary-foreground: oklch(0.2 0 0);
  --muted: oklch(0.94 0 0);
  --muted-foreground: oklch(0.43 0 0);
  --accent: oklch(0.9 0 0);
  --accent-foreground: oklch(0.16 0 0);
  --border: oklch(0.82 0 0);
  --input: oklch(0.8 0 0);
  --ring: oklch(0.29 0 0);
  --neutral: oklch(0.58 0 0);
  --neutral-foreground: oklch(0.985 0 0);
  --chart-1: oklch(0.22 0 0);
  --chart-2: oklch(0.38 0 0);
  --chart-3: oklch(0.52 0 0);
  --chart-4: oklch(0.66 0 0);
  --chart-5: oklch(0.8 0 0);
  --overview-accent-1: oklch(0.3 0 0);
  --overview-accent-2: oklch(0.52 0 0);
  --overview-accent-3: oklch(0.72 0 0);
  --sidebar: oklch(0.955 0 0);
  --sidebar-foreground: oklch(0.16 0 0);
  --sidebar-primary: oklch(0.19 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.885 0 0);
  --sidebar-accent-foreground: oklch(0.14 0 0);
  --sidebar-border: oklch(0.81 0 0);
  --sidebar-ring: oklch(0.3 0 0);
  --skeleton-base: oklch(0.91 0 0);
  --skeleton-highlight: oklch(0.98 0 0);
}

.dark,
.dark [data-theme-preset] {
  color-scheme: dark;
  --background: oklch(0.13 0 0);
  --foreground: oklch(0.955 0 0);
  --card: oklch(0.18 0 0 / 92%);
  --card-foreground: oklch(0.955 0 0);
  --popover: oklch(0.2 0 0 / 98%);
  --popover-foreground: oklch(0.955 0 0);
  --primary: oklch(0.91 0 0);
  --primary-foreground: oklch(0.12 0 0);
  --secondary: oklch(0.24 0 0);
  --secondary-foreground: oklch(0.92 0 0);
  --muted: oklch(0.22 0 0);
  --muted-foreground: oklch(0.72 0 0);
  --accent: oklch(0.28 0 0);
  --accent-foreground: oklch(0.96 0 0);
  --border: oklch(1 0 0 / 17%);
  --input: oklch(1 0 0 / 23%);
  --ring: oklch(0.78 0 0);
  --neutral: oklch(0.69 0 0);
  --neutral-foreground: oklch(0.12 0 0);
  --chart-1: oklch(0.9 0 0);
  --chart-2: oklch(0.74 0 0);
  --chart-3: oklch(0.6 0 0);
  --chart-4: oklch(0.46 0 0);
  --chart-5: oklch(0.32 0 0);
  --overview-accent-1: oklch(0.82 0 0);
  --overview-accent-2: oklch(0.6 0 0);
  --overview-accent-3: oklch(0.42 0 0);
  --sidebar: oklch(0.105 0 0);
  --sidebar-foreground: oklch(0.93 0 0);
  --sidebar-primary: oklch(0.9 0 0);
  --sidebar-primary-foreground: oklch(0.11 0 0);
  --sidebar-accent: oklch(0.25 0 0);
  --sidebar-accent-foreground: oklch(0.96 0 0);
  --sidebar-border: oklch(1 0 0 / 14%);
  --sidebar-ring: oklch(0.72 0 0);
  --skeleton-base: oklch(0.24 0 0);
  --skeleton-highlight: oklch(0.36 0 0);
}

body {
  background:
    radial-gradient(circle at 82% -8%, oklch(1 0 0 / 95%) 0 15%, transparent 48%),
    radial-gradient(circle at 4% 92%, oklch(0.73 0 0 / 24%) 0 8%, transparent 40%),
    linear-gradient(135deg, oklch(0.91 0 0), oklch(0.99 0 0) 48%, oklch(0.84 0 0));
  background-attachment: fixed;
}

.dark body,
body.dark {
  background:
    radial-gradient(circle at 80% -10%, oklch(0.34 0 0 / 70%) 0 10%, transparent 44%),
    radial-gradient(circle at 5% 95%, oklch(0.34 0 0 / 36%) 0 8%, transparent 42%),
    linear-gradient(135deg, oklch(0.08 0 0), oklch(0.18 0 0) 52%, oklch(0.055 0 0));
}

/* Public pages and the authenticated workspace share the graphite gradient. */
.relative.min-h-svh.overflow-x-clip,
[data-slot='sidebar-inset'] {
  background:
    radial-gradient(circle at 78% 0%, oklch(1 0 0 / 80%), transparent 36%),
    linear-gradient(135deg, oklch(0.93 0 0), oklch(0.99 0 0) 48%, oklch(0.88 0 0)) !important;
}

.dark .relative.min-h-svh.overflow-x-clip,
.dark [data-slot='sidebar-inset'] {
  background:
    radial-gradient(circle at 78% 0%, oklch(0.32 0 0 / 55%), transparent 38%),
    linear-gradient(135deg, oklch(0.095 0 0), oklch(0.17 0 0) 48%, oklch(0.075 0 0)) !important;
}

/* Keep section blocks open so the continuous gradient remains visible. */
.relative.min-h-svh.overflow-x-clip > section,
.relative.min-h-svh.overflow-x-clip > main,
section[data-slot='section'] {
  background-color: transparent !important;
}

/* Replace the landing page's hard-coded blue/violet brand effects. */
.from-blue-400.via-violet-400.to-purple-500 {
  background-image: linear-gradient(90deg, oklch(0.18 0 0), oklch(0.48 0 0), oklch(0.1 0 0)) !important;
}

.dark .from-blue-400.via-violet-400.to-purple-500 {
  background-image: linear-gradient(90deg, oklch(0.98 0 0), oklch(0.66 0 0), oklch(0.9 0 0)) !important;
}

[style*='oklch(0.72 0.18 250'] {
  background:
    radial-gradient(ellipse 60% 50% at 20% 20%, oklch(0.2 0 0 / 30%) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 80% 15%, oklch(0.65 0 0 / 35%) 0%, transparent 70%),
    radial-gradient(ellipse 40% 35% at 40% 80%, oklch(0.38 0 0 / 20%) 0%, transparent 70%) !important;
}

.dark [style*='oklch(0.72 0.18 250'] {
  background:
    radial-gradient(ellipse 60% 50% at 20% 20%, oklch(0.9 0 0 / 18%) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 80% 15%, oklch(0.55 0 0 / 20%) 0%, transparent 70%),
    radial-gradient(ellipse 40% 35% at 40% 80%, oklch(0.78 0 0 / 12%) 0%, transparent 70%) !important;
}

/* Neutralize explicit blue accents used by the default landing badge. */
[class*='border-blue-'],
[class*='border-violet-'],
[class*='border-purple-'] {
  border-color: color-mix(in oklch, var(--foreground) 22%, transparent) !important;
}

[class*='bg-blue-'],
[class*='bg-violet-'],
[class*='bg-purple-'] {
  background-color: color-mix(in oklch, var(--foreground) 10%, transparent) !important;
}

[class*='text-blue-'],
[class*='text-violet-'],
[class*='text-purple-'] {
  color: color-mix(in oklch, var(--foreground) 82%, var(--muted-foreground)) !important;
}

/* Keep the brand imagery inside the monochrome art direction as well. */
img[alt='logo'],
a[href='https://cherry-ai.com'] svg,
a[href='https://ccswitch.io'] img {
  filter: grayscale(1) contrast(1.08);
}

/* Slightly crisper monochrome surfaces without turning every card into glass. */
[data-slot='card'] {
  box-shadow: 0 1px 0 oklch(1 0 0 / 55%) inset, 0 16px 42px oklch(0 0 0 / 7%);
}

.dark [data-slot='card'] {
  box-shadow: 0 1px 0 oklch(1 0 0 / 7%) inset, 0 18px 48px oklch(0 0 0 / 24%);
}

:focus-visible {
  outline-color: var(--ring);
}

/* Belt-and-suspenders hiding for stale status caches and the hard-coded hero docs CTA. */
a[href='/about'],
a[href='/about/'],
a[href='/rankings'],
a[href='/rankings/'],
a[href='/__snowapi_docs_disabled__'] {
  display: none !important;
}

@media (max-width: 640px) {
  .relative.min-h-svh.overflow-x-clip,
  [data-slot='sidebar-inset'] {
    background:
      radial-gradient(circle at 90% 0%, oklch(1 0 0 / 72%), transparent 32%),
      linear-gradient(155deg, oklch(0.94 0 0), oklch(0.99 0 0) 48%, oklch(0.89 0 0)) !important;
  }

  .dark .relative.min-h-svh.overflow-x-clip,
  .dark [data-slot='sidebar-inset'] {
    background:
      radial-gradient(circle at 90% 0%, oklch(0.34 0 0 / 50%), transparent 34%),
      linear-gradient(155deg, oklch(0.09 0 0), oklch(0.16 0 0) 48%, oklch(0.07 0 0)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}