/*
 * Design tokens, read off the Figma form components.
 *
 * Two layers are visible in the source file: the Untitled UI kit these were
 * built on, and the overrides this project made on top of it. The overrides
 * are what the components actually look like, so they are what is recorded
 * here — Outfit rather than Inter, square corners rather than radius-md, and
 * black-alpha text rather than the neutral ramp.
 */

/*
 * Outfit, self-hosted — the same thing chaplin-child does with Caslon and
 * Brandon, and for the same reason: no request off the site to render a form.
 *
 * One variable file per subset covers 400 to 700, which is every weight the
 * form asks for. latin-ext is not optional here: ā ē ī ū ģ ķ ļ ņ š ž all live
 * in it, so without it half of every Latvian label falls back to another face.
 * SIL Open Font License 1.1.
 */
@font-face {
	font-family: "Outfit";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url(fonts/outfit-latin-ext.woff2) format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Outfit";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url(fonts/outfit-latin.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*
 * Inter, self-hosted beside Outfit and for the same reason.
 *
 * The search screen's design tokenises it as font-family-body, and it is drawn
 * in exactly two places there — the card's external link and the pager numbers.
 * Same two subsets as Outfit: latin-ext carries every Latvian diacritic, so it
 * is required rather than an optimisation. SIL Open Font License 1.1.
 */
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url(fonts/inter-latin-ext.woff2) format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url(fonts/inter-latin.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	/* Type ------------------------------------------------------------- */
	--lp-font: "Outfit", system-ui, sans-serif;

	--lp-text-sm: 14px;
	--lp-text-sm-line: 20px;
	--lp-text-md: 16px;
	--lp-text-md-line: 24px;

	--lp-weight-regular: 400;
	--lp-weight-medium: 500;

	/* Spacing — Figma's own scale, kept under its own names ------------- */
	--lp-space-xxs: 2px;
	--lp-space-xs: 4px;
	--lp-space-sm: 6px;
	--lp-space-md: 8px;
	--lp-space-lg: 12px;

	/* Ink --------------------------------------------------------------- */
	--lp-ink: #171717;
	--lp-ink-label: rgba(0, 0, 0, 0.6);
	--lp-ink-hint: rgba(0, 0, 0, 0.52);
	--lp-ink-placeholder: rgba(0, 0, 0, 0.4);
	--lp-ink-required: #5f7470;
	--lp-ink-icon: #a3a3a3;

	/* Option lists carry their own two-tone text */
	--lp-ink-option: #404040;
	--lp-ink-option-support: #525252;

	/* A menu row states itself twice: colour of ink and colour of ground */
	--lp-ink-option-idle: #808080;
	--lp-ink-option-chosen: #597570;
	--lp-surface-option-hover: #fafafa;
	--lp-surface-option-chosen: #f7fcf9;

	--lp-edge-menu: rgba(0, 0, 0, 0.1);
	--lp-edge-menu-inner: #e5e5e5;
	--lp-scrollbar: rgba(0, 0, 0, 0.15);

	/* Badge, brand — one chosen answer, sitting in the control that holds it */
	--lp-badge-edge: rgba(210, 229, 220, 0.5);
	/* The count badge in a multi-choice control is neutral, not brand. */
	--lp-badge-edge-neutral: #ededed;
	--lp-edge-checkbox: #d4d4d4;
	--lp-radius-pill: 12px;

	/* Surface and edge, per state --------------------------------------- */
	--lp-surface: #ffffff;
	--lp-surface-empty: #fcfcfc;
	--lp-surface-disabled: #f5f5f5;

	--lp-edge-empty: rgba(0, 0, 0, 0.07);
	--lp-edge-filled: #f0f0f0;
	--lp-edge-disabled: #d4d4d4;

	--lp-accent: #006600;
	--lp-accent-ring: #9bb1a7;

	--lp-danger: #ef4444;
	--lp-danger-subtle: #fca5a5;
	--lp-danger-ink: #dc2626;

	--lp-disabled-opacity: 0.5;

	/* Figma's shadow-lg, the one a floating menu sits on */
	--lp-shadow-lg:
		0 12px 16px -4px rgba(0, 0, 0, 0.08),
		0 4px 6px -2px rgba(0, 0, 0, 0.03),
		0 2px 2px -1px rgba(0, 0, 0, 0.04);

	/* Geometry ---------------------------------------------------------- */
	--lp-edge-width: 1px;
	--lp-edge-width-focus: 2px;

	--lp-control-pad-y: 8px;
	--lp-control-pad-x: 12px;
	--lp-control-height: 40px;

	--lp-textarea-pad-y: 12px;
	--lp-textarea-pad-x: 14px;
	--lp-textarea-height: 128px;

	/* Label to control to hint */
	--lp-field-gap: 6px;
	/* Adornment to text, inside a control */
	--lp-control-gap: 8px;

	--lp-box-md: 20px;
	--lp-box-sm: 16px;

	--lp-icon-sm: 16px;
	--lp-icon-md: 20px;

	/* Search screen ------------------------------------------------------
	 *
	 * Added for blocks/search/. Nothing above changes: the public form is
	 * signed off and reads the same values it always did.
	 */
	--lp-font-ui: "Inter", system-ui, sans-serif;

	/* The brand green the search draws its chrome in. The design writes the
	   H1 as #5a7570 and everything else as #597570 — one digit apart, taken
	   as the same colour. */
	--lp-brand: #597570;
	--lp-brand-hover: #47615c;
	--lp-brand-active: #384f4a;
	--lp-brand-ink: #006600;

	--lp-edge-card: #e5e5e5;
	--lp-surface-hover: #fafafa;
	--lp-ink-muted: #737373;

	--lp-radius-md: 8px;
}