/* Secure-Merge Brand Tokens - Shared across SPA and Static Pages */

:root {
  /* Secure-Merge Brand Colors */
  --background: hsl(0, 0%, 100%);
  --foreground: hsl(0, 0%, 10%); /* #1A1A1A - Charcoal */
  --muted: hsl(216, 33%, 97%); /* #F5F7FA - Light Gray */
  --muted-foreground: hsl(0, 0%, 45%);
  --popover: hsl(0, 0%, 100%);
  --popover-foreground: hsl(0, 0%, 10%);
  --card: hsl(0, 0%, 100%);
  --card-foreground: hsl(0, 0%, 10%);
  --border: hsl(216, 33%, 91%);
  --input: hsl(216, 33%, 91%);
  --primary: hsl(217, 65%, 33%); /* #1E4E8C - Deep Trust Blue */
  --primary-foreground: hsl(0, 0%, 100%);
  --secondary: hsl(216, 33%, 97%); /* #F5F7FA - Light Gray */
  --secondary-foreground: hsl(0, 0%, 10%);
  --accent: hsl(154, 48%, 46%); /* #37B36D - Teal Green */
  --accent-foreground: hsl(0, 0%, 100%);
  --destructive: hsl(0, 84%, 60%);
  --destructive-foreground: hsl(0, 0%, 100%);
  --ring: hsl(217, 65%, 33%);
  --radius: 0.5rem;
  --success: hsl(154, 48%, 46%); /* #37B36D - Teal Green */
  --success-foreground: hsl(0, 0%, 100%);
  --violet: hsl(262, 83%, 58%);
  --violet-foreground: hsl(210, 40%, 98%);
}

.dark {
  /* Secure-Merge Dark Mode Colors */
  --background: hsl(0, 0%, 7%); /* Dark background */
  --foreground: hsl(0, 0%, 100%); /* White text */
  --muted: hsl(0, 0%, 15%); /* Dark muted */
  --muted-foreground: hsl(0, 0%, 65%);
  --popover: hsl(0, 0%, 7%);
  --popover-foreground: hsl(0, 0%, 100%);
  --card: hsl(0, 0%, 10%);
  --card-foreground: hsl(0, 0%, 100%);
  --border: hsl(0, 0%, 20%);
  --input: hsl(0, 0%, 20%);
  --primary: hsl(217, 65%, 40%); /* Lighter Deep Trust Blue for dark mode */
  --primary-foreground: hsl(0, 0%, 100%);
  --secondary: hsl(0, 0%, 15%);
  --secondary-foreground: hsl(0, 0%, 100%);
  --accent: hsl(154, 48%, 50%); /* Slightly lighter Teal Green for dark mode */
  --accent-foreground: hsl(0, 0%, 100%);
  --destructive: hsl(0, 62%, 50%);
  --destructive-foreground: hsl(0, 0%, 100%);
  --ring: hsl(217, 65%, 40%);
  --success: hsl(154, 48%, 50%);
  --success-foreground: hsl(0, 0%, 100%);
  --violet: hsl(262, 83%, 58%);
  --violet-foreground: hsl(0, 0%, 100%);
}

/* Typography - Secure-Merge Brand Fonts */
body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background-color: var(--background);
  color: var(--foreground);
  line-height: 1.6;
  margin: 0;
  padding: 0;
}

.font-heading, h1, h2, h3, h4, h5, h6 {
  font-family: 'Nunito Sans', system-ui, -apple-system, sans-serif;
}

.font-body, p, li, span, a, button {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}