/* Theme variables copied from the live site to match colors exactly */
:root {
  --background: 133 100% 0%;
  --foreground: 129 100% 87%;
  --muted: 144 100% 16%;
  --muted-foreground: 129 100% 87%;
  --popover: 134 100% 5%;
  --popover-foreground: 129 100% 87%;
  --card: 134 100% 5%;
  --card-foreground: 129 100% 87%;
  --border: 144 100% 16%;
  --input: 144 100% 16%;
  --primary: 146 100% 29%;
  --primary-foreground: 126 41% 98%;
  --secondary: 144 100% 16%;
  --secondary-foreground: 129 100% 87%;
  --accent: 144 100% 16%;
  --accent-foreground: 129 100% 87%;
  --destructive: 0 62.8% 30.6%;
  --destructive-foreground: 0 0% 98%;
  --ring: 146 100% 29%;
  --radius: 0.5rem;
}

/* Light mode variables if needed */
.light {
  --background: 129 40% 69%;
  --foreground: 134 100% 5%;
  --muted: 134 42% 52%;
  --muted-foreground: 134 100% 5%;
  --popover: 127 100% 95%;
  --popover-foreground: 134 100% 5%;
  --card: 127 100% 95%;
  --card-foreground: 134 100% 5%;
  --border: 134 42% 52%;
  --input: 134 42% 52%;
  --primary: 146 100% 37%;
  --primary-foreground: 126 52% 99%;
  --secondary: 129 51% 75%;
  --secondary-foreground: 134 100% 5%;
  --accent: 129 51% 75%;
  --accent-foreground: 134 100% 5%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 60 9.1% 97.8%;
  --ring: 146 100% 37%;
  --radius: 0.5rem;
}

/* Apply background and foreground globally using theme tokens */
html, body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
}