/* ATDT barnåren.se - designtokens.
   Tema: svensk sajt för föräldrar till barn mellan ungefär ett och tolv år,
   från förskolestart till mellanstadiet. Vardag, förskola och skola, säkerhet,
   hälsa i vardagen, fritid och familjeekonomi.
   Uttryck: lekfullt (arketyp C), men vuxet. Läsaren är föräldern, inte barnet.
   Systersajterna i familjeklustret (bebisar.se: babyblå och persika, toddler.se:
   terrakotta och salvia, unga.se: violett och solgul) är alla pastell eller
   mättat glada. barnåren.se får paletten "Sandlådan": en varm sandgrå botten,
   skifferblått bläck, hinkblått för länkar och knappar och rönnbärsrött som
   enda varma signalfärg, sparsamt: rubrikmarkering, hopphagemotivet och fokus.

   Kontrast, räknad mot WCAG 2.1:
     ink på bg 13,06 ink på surface 14,73
     muted på bg 5,57 muted på surface 6,28
     accent på bg 5,97 accent på surface 6,73  vit på accent 6,73
     accent-2 på bg 5,2  accent-2 på surface 5,87
     on-deep på deep 11,26  link-on-deep på deep 8,49
   Accenten får aldrig bära text på den mörka sidfoten (2,19). Där används
   --atdt-link-on-deep. */

:root {
	--atdt-bg:        #F5F1E7;  /* sandlådan: sidbakgrund */
	--atdt-ink:       #20283A;  /* skiffer: brödtext och rubriker */
	--atdt-muted:     #5A6070;  /* gråsten: ingress, bildtext, meta */
	--atdt-surface:   #FFFFFF;  /* läsyta, kort och tabeller */
	--atdt-neutral:   #E2DCCD;  /* krita: mjuk linje */
	--atdt-accent:    #2D5F8B;  /* hinkblått: länkar, knappar */
	--atdt-accent-2:  #A9461C;  /* rönnbär: rubrikmarkering, motiv, fokus */
	--atdt-on-accent: #FFFFFF;
	--atdt-positive:  #2E6B4A;
	--atdt-negative:  #A3362B;

	--atdt-deep:         #20283A;  /* sidfotens band */
	--atdt-on-deep:      #E4E1D8;  /* text på bandet */
	--atdt-link-on-deep: #F2B98F;  /* länkar på bandet */

	--atdt-font-display: "Bree Serif", "Rockwell", Georgia, serif;
	--atdt-font-body:    "Rethink Sans", "Segoe UI", system-ui, sans-serif;
	--atdt-font-mono:    ui-monospace, "SFMono-Regular", Menlo, monospace;

	--atdt-radius:    14px;
	--atdt-maxwidth:  740px;
}