:root {
  /* scheme based on https://syntax.tailwindui.com/docs/cacheadvance-predict */
  
  --miwi-body-bg-light: hsl(210, 40%, 98%);
  --miwi-body-bg-light-hex: #f8fafc;
  --miwi-body-bg-light-rgb: 248, 250, 252;

  --miwi-body-bg-dark: hsl(223, 30%, 15%);
  --miwi-body-bg-dark-hex: rgb(27, 33, 50);
  --miwi-body-bg-dark-rgb: 223, 30%, 15%;

  --miwi-header-bg-light:     hsla(222, 80%, 7%, 0.9);
  --miwi-header-border-light: hsla(222, 20%, 1%, 0.9);

  --miwi-header-bg-dark:     hsla(222, 40%, 9%, 0.75);
  --miwi-header-border-dark: hsla(222, 38%, 16%, 0.9);

  --miwi-footer-bg-light: hsl(222, 50%, 10%);
  --miwi-footer-bg-dark: hsl(222, 40%, 9%);

  --miwi-color-text-light: hsl(215, 45%, 85%);
  --miwi-color-text-light-hex: #cfd7e2;
  --miwi-color-text-light-rgb: 207, 215, 226;

  --miwi-color-text-dark: hsl(215, 25%, 27%);
  --miwi-color-text-dark-hex: #334155;
  --miwi-color-text-dark-rgb: 51, 65, 85;

  --miwi-link-color-light: hsl(199, 89%, 40%);
  --miwi-link-color-light-hex: #0b87c1;
  --miwi-link-color-light-rgb: 11, 135, 193;
  --miwi-link-color-underline-light: rgba(14, 165, 233, 0.3);

  --miwi-link-color-dark: hsl(199, 90%, 60%);
  --miwi-link-color-dark-hex: #3dbbf5;
  --miwi-link-color-dark-rgb: 61, 187, 245;
  --miwi-link-color-underline-dark: rgba(14, 165, 233, 0.3);

  --miwi-color-accent-1: #FDDB3A;
  --miwi-color-accent-1-darker: hsl(50, 98%, 45%);
  --miwi-color-accent-1-darkest: hsl(50, 98%, 35%);
  
  --miwi-color-accent-2: hsl(330, 50%, 48%);
}

:root,
[data-bs-theme=light] {
  --bs-font-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: "IBM Plex Mono", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --bs-body-bg: var(--miwi-body-bg-light-hex);
  --bs-body-bg-rgb: var(--miwi-body-bg-light-rgb);

  --bs-body-color: var(--miwi-color-text-dark-hex);
  --bs-body-color-rgb: var(--miwi-color-text-dark-rgb);

  --bs-link-color: var(--miwi-link-color-light-hex);
  --bs-link-color-rgb: var(--miwi-link-color-light-rgb);
  --miwi-link-color-underline: var(--miwi-link-color-underline-light);
}

[data-bs-theme=dark] {
  --bs-body-bg: var(--miwi-body-bg-dark-hex);
  --bs-body-bg-rgb: var(--miwi-body-bg-dark-rgb);

  --bs-body-color: var(--miwi-color-text-light-hex);
  --bs-body-color-rgb: var(--miwi-color-text-light-rgb);

  --bs-link-color: var(--miwi-link-color-dark-hex);
  --bs-link-color-rgb: var(--miwi-link-color-dark-rgb);
  --miwi-link-color-underline: var(--miwi-link-color-underline-dark);
}