/**
 * dotSG Solutions – theme variable overrides.
 * Replaces haven_theme's src/theme.css with our brand palette.
 */

@font-face {
  font-family: "Gelasio";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(../../contrib/haven_theme/fonts/Gelasio/Gelasio-var.ttf) format("truetype");
}

@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(../../contrib/haven_theme/fonts/Geist/Geist-var.ttf) format("truetype");
}

body,
.layout-container {
  background-color: #ffffff;
}

:root {
  /* Brand palette */
  --ds-navy:          #0A1628;
  --ds-navy-mid:      #1E3A5F;
  --ds-blue:          #2563EB;
  --ds-blue-light:    #3B82F6;
  --ds-teal:          #0EA5E9;
  --ds-teal-light:    #38BDF8;
  --ds-white:         #FFFFFF;
  --ds-gray-50:       #F8FAFC;
  --ds-gray-100:      #F1F5F9;
  --ds-gray-200:      #E2E8F0;
  --ds-gray-400:      #94A3B8;
  --ds-gray-600:      #475569;
  --ds-gray-900:      #0F172A;

  /* haven_theme token overrides */
  --background:            oklch(1 0 0);
  --foreground:            oklch(0.18 0.04 260);
  --card:                  oklch(1 0 0);
  --card-foreground:       oklch(0.18 0.04 260);
  --primary:               oklch(0.52 0.22 254);
  --primary-foreground:    oklch(1 0 0);
  --secondary:             oklch(0.22 0.07 260);
  --secondary-foreground:  oklch(1 0 0);
  --muted:                 oklch(0.96 0.01 240);
  --muted-foreground:      oklch(0.45 0.05 260);
  --accent:                oklch(0.65 0.17 220);
  --accent-foreground:     oklch(1 0 0);
  --destructive:           oklch(0.637 0.208 25.331);
  --destructive-foreground: oklch(1 0 0);
  --border:                oklch(0.88 0.02 240);
  --input:                 oklch(0.92 0.01 240);
  --font-sans:             "Geist", "Helvetica Neue", Arial, Helvetica, sans-serif;
  --font-serif:            "Gelasio", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono:             "Fira Mono", "Menlo", "Consolas", "Liberation Mono", monospace;
  --radius:                0.75rem;

  --shadow-x: 0;
  --shadow-y: 1px;
  --shadow-blur: 3px;
  --shadow-spread: 0px;
  --shadow-opacity: 0.1;
  --shadow-color: oklch(0 0 0);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.08), 0 1px 2px -1px rgb(0 0 0 / 0.06);
  --shadow:    0 4px 6px -1px rgb(0 0 0 / 0.08), 0 2px 4px -2px rgb(0 0 0 / 0.06);
  --shadow-md: 0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.06);
  --shadow-lg: 0 20px 25px -5px rgb(0 0 0 / 0.08), 0 8px 10px -6px rgb(0 0 0 / 0.06);
  --shadow-xl: 0 25px 50px -12px rgb(0 0 0 / 0.15);

  --tracking-normal: 0em;
  --spacing: 0.25rem;

  --primary-light: color-mix(in oklch, var(--primary) 80%, white);
  --primary-dark:  color-mix(in oklch, var(--primary) 80%, black);
  --secondary-light: color-mix(in oklch, var(--secondary) 90%, white);
  --secondary-dark:  color-mix(in oklch, var(--secondary) 85%, black);
  --accent-light:  color-mix(in oklch, var(--accent) 95%, white);
  --accent-dark:   color-mix(in oklch, var(--accent) 95%, black);

  --navbar-height: calc(var(--spacing) * 14);

  @media (min-width: 768px) {
    --navbar-height: calc(var(--spacing) * 20);
  }
  @media (min-width: 1280px) {
    --navbar-height: calc(var(--spacing) * 22);
  }
}