/* Uncomment and edit any variable to override the theme defaults. */

:root {
  --color-link:     #2d6e30;
  --color-tag-bg:   #dfe8df;
  --color-tag-text: #2d6e30;
  --color-muted:    #5d6b5d;
  --color-border:   #cfd9cf;

  --color-bg: #f7f5f0;
  --color-surface: #f0ede7;
  --color-text: #1c1917;
  --color-code-bg: #f8f8f8;

  --dark-color-bg: #1a1918;
  --dark-color-surface: #232120;
  --dark-color-text: #e8e2d9;
  --dark-color-muted: #8a8078;
  --dark-color-link: #6db870;
  --dark-color-tag-bg: #1f271f;
  --dark-color-tag-text: #6db870;
  --dark-color-border: #38332e;
  --dark-color-code-bg: #1e1b18;
}

html[data-theme="dark"] a:hover {
  color: color-mix(in srgb, var(--color-link) 75%, white);
  text-decoration-color: color-mix(in srgb, var(--color-link) 75%, white);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) a:hover {
    color: color-mix(in srgb, var(--color-link) 75%, white);
    text-decoration-color: color-mix(in srgb, var(--color-link) 75%, white);
  }
}