/* ── Theme: GMID (gettingmarriedindenmark.com) — #1408 ─────────────────────
   Linked after portal.css by base_portal.html, and by base_auth.html, on the
   portal host only, when `settings.portal_theme` is "gmid"
   (core.template_globals.portal_theme_for). The only stylesheet that holds
   GMID values: its palette (from gmid-website src/styles/tokens.css) and
   which of the platform's semantic tokens each value fills. Its logo partial
   and font sit beside it (core/templates/themes/gmid/, static/themes/gmid/).
   Another venture's look is another file of this shape, with no component
   change; the portal's copy is not themed.

   A theme re-points tokens and never defines one: a name only a theme
   defines is a name the unthemed portal cannot resolve
   (tests/portal/test_theme.py). Its hex values sit only in custom-property
   definitions, which scripts/lint_css.py's raw-hex rule passes. */

@font-face {
  font-family: "GMID Sans";  /* Hanken Grotesk, OFL — the website's sans */
  src: url("/static/themes/gmid/HankenGrotesk-400-800.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

/* The palette. Private to this theme: only the :root block below reads it. */
:root {
  --gmid-olive: #3d3d24;
  --gmid-olive-soft: #5a5a3c;
  --gmid-terracotta: #ab5d38;
  --gmid-terracotta-deep: #8f4a2b;
  --gmid-terracotta-tint: #f6e4df;
  --gmid-cream: #f2ebde;
  --gmid-offwhite: #fcfafa;
  --gmid-sand: #f7f2e9;
  --gmid-sand-strong: #efe7d8;
  --gmid-sand-faint: #fdf9f3;
  --gmid-sage: #c2c29e;
  --gmid-rule: #e4dccb;
  --gmid-rule-subtle: #eee8dc;
  --gmid-label: #7a7663;           /* 4.5:1 on off-white */
  --gmid-grey-text: #666666;       /* the website's only text grey */
  --gmid-faint-text: #a9a48f;
  --gmid-success: #5b6b2e;
  --gmid-danger: #b0352b;
  --gmid-warning: #d9a53a;
  --gmid-warning-text: #7a5a12;
  --gmid-info: #3c5468;
  --gmid-info-tint: #e8edf0;
}

/* What each value is for, in Casebox's own words. */
:root {
  --font: "GMID Sans", "Hanken Grotesk", system-ui, sans-serif;

  --color-bg: var(--gmid-offwhite);
  --color-surface-muted: var(--gmid-cream);
  --color-surface-dim: var(--gmid-offwhite);
  --color-team-surface: var(--gmid-offwhite);
  --color-rail: var(--gmid-olive);
  --color-border: var(--gmid-rule);
  --color-border-subtle: var(--gmid-rule-subtle);

  --color-accent: var(--gmid-terracotta);
  --color-accent-hover: var(--gmid-terracotta-deep);
  --color-accent-50: color-mix(in srgb, var(--gmid-terracotta) 6%, var(--color-surface));
  --color-accent-100: color-mix(in srgb, var(--gmid-terracotta) 12%, var(--color-surface));
  --color-accent-200: color-mix(in srgb, var(--gmid-terracotta) 28%, var(--color-surface));
  --color-accent-500: var(--gmid-terracotta);
  --color-accent-600: var(--gmid-terracotta-deep);

  --color-text: var(--gmid-olive);
  --color-text-strong: var(--gmid-olive);
  --color-subtle: var(--gmid-olive-soft);
  --color-muted: var(--gmid-grey-text);
  --color-text-lavender-grey: var(--gmid-faint-text);
  --color-hover: color-mix(in srgb, var(--gmid-olive) 5%, transparent);
  --color-active: color-mix(in srgb, var(--gmid-olive) 9%, transparent);

  --color-success: var(--gmid-success);
  --color-danger: var(--gmid-danger);
  --color-warning: var(--gmid-warning);
  --color-warning-text: var(--gmid-warning-text);
  --color-info: var(--gmid-info);
  --color-presence-info: var(--gmid-info);

  --color-anim-surface: var(--gmid-cream);
  --color-anim-shape: var(--gmid-sage);
  --color-anim-paper: var(--gmid-offwhite);

  --avatar-bg: var(--gmid-sage);
  --avatar-border-radius: 50%;
  --color-avatar-text: var(--gmid-olive);

  --color-label: var(--gmid-label);
  --color-selected: var(--gmid-sand);
  --color-selected-marker: var(--gmid-terracotta);
  --color-surface-tint: var(--gmid-sand);
  --color-surface-tint-strong: var(--gmid-sand-strong);
  --color-attention-wash: var(--gmid-sand-faint);
  --color-danger-tint: var(--gmid-terracotta-tint);
  --color-info-tint: var(--gmid-info-tint);
  --color-step-done: var(--gmid-olive);
  --color-step-line: var(--gmid-sage);
  --color-rail-icon: var(--gmid-sage);
  --color-rail-icon-active: var(--gmid-olive);
  --color-rail-active-bg: var(--gmid-cream);
  --color-rail-mark: var(--gmid-cream);

  /* The website's voice: labels and buttons in tracked capitals. */
  --text-transform-label: uppercase;
  --letter-spacing-label: 0.14em;
  --text-transform-button: uppercase;
  --letter-spacing-button: 0.16em;

  --shadow-sm: none;
  --shadow-card: none;
  --shadow-md: 0 2px 10px color-mix(in srgb, var(--gmid-olive) 7%, transparent);
  --shadow-card-hover: var(--shadow-md);
  --shadow-rail-node: 0 0 0 3px var(--gmid-offwhite);
}