/*
 * DoYouTax design tokens (tickets 0003, 0103 and 0105, docs/design/systeme.md).
 * Shared by the site (site.css) and by the print templates rendered with WeasyPrint
 * (print.css). Hand-written, no build step. Every colour variable is covered by the
 * contrast test (apps/core/tests/test_design_tokens.py): a new colour needs a pair there.
 */

/* Fonts (ticket 0103): DoyouTax Serif, DoyouTax Sans and DoyouTax Mono are Latin
   subsets of Spectral, Hanken Grotesk and IBM Plex Mono, renamed so that no modified
   file carries the name of the original (SIL Open Font License 1.1, condition 3 for the
   Reserved Font Name "Plex"; scripts/subset_fonts.py, static/fonts/LICENSE-*.md). The
   family names are identifiers and keep the spelling of the preloaded files. Served
   from static/fonts only: no font is ever loaded from another domain. */
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-regular.e30a57677338.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-italic.d6902ae2c5ca.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-medium.61ef8e362e1c.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-medium-italic.1b2b980965fd.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-semibold.e26c608c411b.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Sans";
  src: url("../fonts/doyoutax-sans-regular.8d5bcfe3246a.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Sans";
  src: url("../fonts/doyoutax-sans-medium.bc10a4c089fe.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Sans";
  src: url("../fonts/doyoutax-sans-semibold.2b2e0c0dd56c.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Mono";
  src: url("../fonts/doyoutax-mono-regular.eed859c9836c.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Mono";
  src: url("../fonts/doyoutax-mono-medium.393dd7a6f2fa.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Light theme only: the site does not follow the colour scheme of the system
     (docs/12-design-ux.md, "Thème sombre"). */
  color-scheme: light;

  /* Colours (ticket 0103, docs/12-design-ux.md, "Couleurs"). Each variable is named by
     its role, never by its hue nor by the name of the palette; each value of the palette
     is written once, the other roles of the same value refer to it. Derived tints are
     sRGB mixes of two palette values (docs/design/systeme.md). */

  /* Text. */
  --color-ink: #14242b;
  --color-ink-muted: #566870;
  --color-ink-inverse: var(--color-surface);

  /* Backgrounds and lines. */
  --color-page: #f4f7f8;
  --color-surface: #ffffff;
  --color-surface-muted: #e9eef0; /* page mixed with a third of line */
  --color-line: #d3dde1;
  --color-border: #78868d; /* ink-muted mixed with 20 % of surface */

  /* Links, structure accent and bands of the header and footer. */
  --color-link: var(--color-ink);
  --color-band: #0d212a;
  --color-band-ink: #eef3f5;
  --color-band-ink-muted: #9fb3bb;
  --color-band-rule: #2c3e46; /* band mixed with 14 % of band ink: rule of the home band */
  --color-accent: var(--color-band);
  --color-accent-strong: var(--color-ink);
  --color-accent-soft: #ecedee; /* surface mixed with 8 % of band */

  /* Main action and deadlines; mark of the brand. */
  --color-action: #8e1b1e;
  --color-action-strong: #6e1c21; /* action mixed with 25 % of band */
  --color-brand: var(--color-action);
  --color-brand-on-band: #c93a52; /* framboise, decision of Antoine 2026-10-06 */
  --color-brand-ink-on-band: var(--color-surface); /* "DoYou" of the logo on the band */

  /* Deadline, status "à confirmer par un avocat" and error (ticket 0105, docs/12, rule
     2): the Visa and the Visa pâle, read by those components only. */
  --color-attention: var(--color-action);
  --color-attention-soft: #f6e9e9;

  /* Status "vérifié" only (docs/12, rule 3), on the site and in print. */
  --color-verified: #1c6a4d;
  --color-verified-soft: #e4f1ec;

  /* Focus indicator. */
  --color-focus: var(--color-ink);
  --color-focus-on-band: var(--color-surface);

  /* The only shadow (docs/12, "Parti pris"): under the document extract, a sheet laid
     on the page; Nuit at 55 %, as on the validated mock-up. */
  --shadow-sheet: 0 18px 40px -28px color-mix(in srgb, var(--color-band) 55%, transparent);

  /* Typography (docs/12-design-ux.md, "Typographie"). */
  --font-sans: "DoyouTax Sans", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: "DoyouTax Serif", Georgia, "Times New Roman", serif;
  --font-mono: "DoyouTax Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas,
    "Liberation Mono", monospace;
  --font-size-xs: 0.875rem;
  --font-size-sm: 0.9375rem;
  --font-size-base: 1.0625rem;
  --font-size-md: 1.25rem;
  --font-size-lg: 1.5rem;
  --font-size-xl: 1.875rem;
  --font-size-2xl: 2.25rem;
  --font-size-3xl: 2.875rem;
  --line-height-tight: 1.15;
  --line-height-base: 1.6;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-strong: 600;

  /* Spacing scale (rem, base 16 px). */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;

  /* Layout and shapes (docs/12-design-ux.md, "Formes"). */
  --measure: 40rem;
  --container: 64rem;
  --radius: 2px;
  --border-width: 1px;
  --focus-width: 3px;
  --focus-offset: 2px;
  --target-size: 2.75rem;
}
