/*
 * danskdansk: stilgrundlaget som CSS.
 *
 * Værdierne står i dokumentation/stilgrundlag.md. Ændres de, ændres de her
 * og i theme.json i samme omgang. Bruges af temaets sider og af
 * danskdansk-pluginnets skærme.
 *
 * Skrifterne ligger i temaet (SIL Open Font License, se fonts/OFL-*.txt).
 */

@font-face {
	font-family: "Bricolage Grotesque";
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url("fonts/bricolage-grotesque-latin-300-normal.woff2") format("woff2");
}

@font-face {
	font-family: "Bricolage Grotesque";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("fonts/bricolage-grotesque-latin-700-normal.woff2") format("woff2");
}

@font-face {
	font-family: "Atkinson Hyperlegible Next";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("fonts/atkinson-hyperlegible-next-latin-400-normal.woff2") format("woff2");
}

@font-face {
	font-family: "Atkinson Hyperlegible Next";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("fonts/atkinson-hyperlegible-next-latin-600-normal.woff2") format("woff2");
}

@font-face {
	font-family: "Atkinson Hyperlegible Next";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("fonts/atkinson-hyperlegible-next-latin-700-normal.woff2") format("woff2");
}

:root {
	/* Farver */
	--dd-kobolt: #2B44E8;
	--dd-orange: #FF7A3D;
	--dd-kobolt-lys: #E6E9FD;
	--dd-blaek: #121A19;
	--dd-daempet: #4E5755;
	--dd-papir: #F4F4F1;
	--dd-hvid: #FFFFFF;
	--dd-graa: #E8E9E5;
	--dd-kant: #C9CCC6;
	--dd-fare: #B42318;

	/* Skrift */
	--dd-skrift-overskrift: "Bricolage Grotesque", system-ui, sans-serif;
	--dd-skrift-tekst: "Atkinson Hyperlegible Next", system-ui, sans-serif;
	--dd-str-stor: 48px;
	--dd-str-overskrift: 34px;
	--dd-str-kort: 22px;
	--dd-str-tekst: 19px;
	--dd-str-lille: 17px;
	--dd-str-mindst: 16px;
	--dd-str-logo: 88px;
	--dd-linje-tekst: 1.45;
	--dd-linje-overskrift: 1.1;

	/* Former */
	--dd-radius-kort: 18px;
	--dd-radius-knap: 14px;
	--dd-radius-kode: 12px;
	--dd-hoejde-knap: 56px;
	--dd-hoejde-kode: 60px;
	--dd-tryk: 44px;
	--dd-kant-bredde: 2px;
	--dd-fokus: 3px;
	--dd-ikon: 20px;
	--dd-ikon-stor: 28px;

	/* Afstande */
	--dd-a1: 4px;
	--dd-a2: 8px;
	--dd-a3: 12px;
	--dd-a4: 16px;
	--dd-a5: 24px;
	--dd-a6: 32px;
	--dd-a7: 48px;
	--dd-kant-skaerm: 24px;
	--dd-kolonne: 440px;
	--dd-kolonne-tekst: 640px;
}