@import "tailwindcss";
@import "tailwind-rounded-out";

:root {
  --background: #ffffff;
  --foreground: #171717;
}

@theme {
  --color-britton-dark: #04153E;
  --color-britton-medium: #2A4B6F;
  --color-britton-newblue: #0096E0;
  --color-britton-newblue2: #0094de;
  --color-britton-light: #6AC8F1;
  --color-britton-electric: #00F0FF;
  --color-britton-electric2: #7DF9FF;
  --color-britton-neutral: #E0E0E0;
  --color-britton-accent2: #B06E30;
  --color-britton-accent: #D38F4A;

    /* for testing */
  /* --color-britton-light: #7DF9FF; */


  /* --color-britton-neutral: #EEF2E3; */
  /* name colors like below AFTER we settle on them for sure */
  /* --color-britton-deepcove: #04153E;
  --color-britton-bluetang: #2A4B6F;
  --color-britton-bluemana: #6AC8F1; */
  /* --color-britton-deepcove-background: #04153E;
  --color-britton-bluetang-background: #2A4B6F;
  --color-britton-bluemana-background: #6AC8F1; */
  /* Add more custom colors as needed */
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: Arial, Helvetica, sans-serif;
}
