/* YMAIL theme overrides — teal/slate over Sezon cream/pink tokens. */
:root {
  --background: 210 20% 98%;
  --foreground: 215 28% 12%;
  --card: 0 0% 100%;
  --card-foreground: 215 28% 12%;
  --popover: 0 0% 100%;
  --popover-foreground: 215 28% 12%;
  --primary: 173 58% 32%;
  --primary-foreground: 0 0% 100%;
  --secondary: 210 18% 93%;
  --secondary-foreground: 215 25% 20%;
  --muted: 210 16% 94%;
  --muted-foreground: 215 12% 42%;
  --accent: 38 70% 48%;
  --accent-foreground: 30 20% 12%;
  --destructive: 0 72% 48%;
  --destructive-foreground: 0 0% 100%;
  --border: 210 14% 88%;
  --input: 210 14% 88%;
  --ring: 173 58% 32%;
  --radius: 0.75rem;
  --font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-display: "Source Serif 4", ui-serif, Georgia, serif;
}

.dark {
  --background: 215 28% 8%;
  --foreground: 210 20% 96%;
  --card: 215 24% 11%;
  --card-foreground: 210 20% 96%;
  --popover: 215 24% 11%;
  --popover-foreground: 210 20% 96%;
  --primary: 173 48% 45%;
  --primary-foreground: 215 28% 8%;
  --secondary: 215 20% 16%;
  --secondary-foreground: 210 18% 90%;
  --muted: 215 18% 15%;
  --muted-foreground: 210 12% 65%;
  --accent: 38 60% 52%;
  --accent-foreground: 215 28% 8%;
  --destructive: 0 62% 48%;
  --destructive-foreground: 0 0% 100%;
  --border: 215 16% 20%;
  --input: 215 16% 20%;
  --ring: 173 48% 45%;
}

.font-sans {
  font-family: var(--font-sans);
}

.font-display {
  font-family: var(--font-display);
}

.brand-wordmark {
  font-family: var(--font-display);
  letter-spacing: -0.02em;
}

.surface-hero {
  position: relative;
  border-radius: 1.25rem;
  padding: 2rem 1.25rem;
  background:
    radial-gradient(120% 80% at 0% 0%, hsl(173 58% 32% / 0.12), transparent 55%),
    radial-gradient(90% 70% at 100% 20%, hsl(210 40% 40% / 0.08), transparent 50%),
    linear-gradient(165deg, hsl(var(--card)) 0%, hsl(var(--muted)) 100%);
  border: 1px solid hsl(var(--border));
}

@media (min-width: 640px) {
  .surface-hero {
    padding: 2.75rem 2rem;
  }
}

[x-cloak] {
  display: none !important;
}