/* Tokens van de etalage.
 *
 * Typografie, maten en neutrale kleuren komen uit het Parai-designsysteem waarin
 * Robin de pagina ontwierp (colors_and_type.css). Parai-rood staat alleen in het
 * logo. De drie accentkleuren zijn die van de module (module/duif/frontend/src/
 * app.css), zodat wie inlogt haar duif herkent.
 *
 * Licht of donker staat in data-theme op <html>, gezet door theme-early.js vóór
 * de eerste verf: de keuze van de bezoeker (gedeeld met de werkomgeving), anders
 * het systeem. Donker geldt alleen op het scherm; op papier blijft alles licht.
 *
 * De letters staan zelf in vendor/fonts (OFL): Fustat en een Latijnse subset van
 * Nanum Myeongjo, hernoemd tot "Duif Serif" omdat de licentie de naam Nanum
 * voorbehoudt aan de ongewijzigde letter. De volledige licenties en de herkomst
 * staan in docs/etalage/fonts/, want onder site/ staan alleen geserveerde bestanden.
 * Geen verzoeken naar buiten. */

/* Fustat · Copyright 2024 The Fustat Project Authors · SIL Open Font License 1.1, https://openfontlicense.org (docs/etalage/fonts/OFL-Fustat.txt) */
@font-face {
  font-family: "Fustat";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../vendor/fonts/fustat-latin.woff2") format("woff2");
}
/* Nanum Myeongjo, als Duif Serif (subset) · Copyright (c) 2010, NHN Corporation · SIL Open Font License 1.1, https://openfontlicense.org (docs/etalage/fonts/OFL-NanumMyeongjo.txt) */
@font-face {
  font-family: "Duif Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../vendor/fonts/duif-serif-400-latin.woff2") format("woff2");
}
/* Nanum Myeongjo, als Duif Serif (subset) · Copyright (c) 2010, NHN Corporation · SIL Open Font License 1.1, https://openfontlicense.org (docs/etalage/fonts/OFL-NanumMyeongjo.txt) */
@font-face {
  font-family: "Duif Serif";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../vendor/fonts/duif-serif-700-latin.woff2") format("woff2");
}
/* Nanum Myeongjo, als Duif Serif (subset) · Copyright (c) 2010, NHN Corporation · SIL Open Font License 1.1, https://openfontlicense.org (docs/etalage/fonts/OFL-NanumMyeongjo.txt) */
@font-face {
  font-family: "Duif Serif";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../vendor/fonts/duif-serif-800-latin.woff2") format("woff2");
}

:root {
  color-scheme: light;

  --radius: .625rem;
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --radius-2xl: 1.25rem;

  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --surface: oklch(0.985 0 0);
  --muted: oklch(0.96 0 0);
  --muted-foreground: oklch(0.5 0 0);
  --border: oklch(0.922 0 0);
  --border-strong: oklch(0.8 0 0);
  --secondary: oklch(0.325 0.115 265);          /* Parai-inkt, #29347B */
  --secondary-foreground: oklch(0.98 0 0);
  --link: var(--secondary);
  --focus: oklch(0.325 0.115 265);
  --warning-ink: oklch(0.47 0.11 70);
  --warning-soft: oklch(0.96 0.04 85);

  /* De drie duiven, zoals in de module. --*-ink is de tekstkleur, --on-* de
   * kleur van tekst óp de accentkleur. */
  --kp: #43674c;
  --sh: #906714;
  --sg: #5f6b75;
  /* Tekst in de duivenkleur, ook op een getint vlak ≥ 4,5:1 (AA). Het oker van
   * de module haalt op zijn eigen 12%-vlak maar 4,35:1; de inkt is donkerder. */
  --kp-ink: #43674c;
  --sh-ink: #7a5711;
  --sg-ink: #56616a;
  --on-accent: #ffffff;

  --font-sans: "Fustat", ui-sans-serif, system-ui, sans-serif;
  --font-serif: "Duif Serif", "Nanum Myeongjo", ui-serif, Georgia, serif;

  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.3, 0.64, 1);

  --shadow-xs: 0 1px 2px 0 oklch(0 0 0 / 5%);
  --shadow-sm: 0 1px 3px 0 oklch(0 0 0 / 8%), 0 1px 2px -1px oklch(0 0 0 / 6%);
  --shadow-md: 0 4px 12px -2px oklch(0 0 0 / 10%), 0 2px 4px -2px oklch(0 0 0 / 6%);
  --shadow-lg: 0 12px 32px -8px oklch(0 0 0 / 14%), 0 4px 8px -4px oklch(0 0 0 / 8%);

  --scrim: rgb(20 18 16 / .42);
}

@media screen {
  :root[data-theme="dark"] {
    color-scheme: dark;

    --background: oklch(0.2 0 0);
    --foreground: oklch(0.975 0 0);
    --surface: oklch(0.235 0 0);
    --muted: oklch(0.29 0 0);
    --muted-foreground: oklch(0.74 0 0);
    --border: oklch(0.34 0 0);
    --border-strong: oklch(0.48 0 0);
    --secondary: oklch(0.47 0.12 265);
    --secondary-foreground: oklch(0.985 0 0);
    --link: oklch(0.8 0.08 265);
    --focus: oklch(0.82 0.08 265);
    --warning-ink: oklch(0.85 0.1 85);
    --warning-soft: oklch(0.3 0.04 85);

    --kp: #9bbe91;
    --sh: #e5c473;
    --sg: #b7c3cc;
    --kp-ink: #9bbe91;
    --sh-ink: #e5c473;
    --sg-ink: #b7c3cc;
    --on-accent: #151b19;

    --shadow-sm: 0 1px 3px 0 oklch(0 0 0 / 40%);
    --shadow-md: 0 4px 12px -2px oklch(0 0 0 / 45%);
    --shadow-lg: 0 16px 40px -8px oklch(0 0 0 / 55%);
    --scrim: rgb(0 0 0 / .6);
  }
}