/*
 * Design tokens from _design/ (BaseStack Łódź.dc.html).
 * Every colour, font and size used by the theme should come from here.
 */
:root {
	/* Backgrounds */
	--bs-bg: #080F26;            /* page background */
	--bs-bg-muted: #0A1330;      /* empty calendar cells */
	--bs-bg-weekend: #0B142F;    /* weekend columns in the panel */
	--bs-surface: #0E1C41;       /* cards, panels, header, footer */
	--bs-surface-today: #132349; /* today in the calendar */
	--bs-surface-2: #16274F;     /* chips, nested panels */
	--bs-surface-hover: #1A2C58; /* hovered calendar day */
	--bs-surface-3: #1D3163;     /* hovered chip */
	--bs-header-bg: rgba(14, 28, 65, 0.92);

	/* Text */
	--bs-text: #FBDDDF;
	--bs-text-muted: rgba(251, 221, 223, 0.65);
	--bs-text-subtle: rgba(251, 221, 223, 0.45);
	--bs-text-faint: rgba(251, 221, 223, 0.3);

	/* Accent */
	--bs-accent: #FF2E7E;
	--bs-on-accent: #0E1C41;     /* text on pink buttons/labels */
	--bs-accent-soft: rgba(255, 46, 126, 0.12);

	/* Lines */
	--bs-line: rgba(251, 221, 223, 0.14);
	--bs-line-strong: rgba(251, 221, 223, 0.22);

	/* Fonts */
	--bs-font-display: 'Archivo', 'Arial Narrow', system-ui, sans-serif;
	--bs-font-body: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;

	/* Layout */
	--bs-container: 1360px;
	--bs-gutter: 16px;
	--bs-section-space: 56px;

	/* Letter-spacing used for uppercase labels */
	--bs-track-tight: -0.03em;
	--bs-track-label: 0.12em;
	--bs-track-eyebrow: 0.24em;
}

@media (min-width: 768px) {
	:root {
		--bs-gutter: 28px;
		--bs-section-space: 88px;
	}
}