:root {
	/*MAIN colors for text and navigation support */	
	--color-primary: #008296;
	--color-accent: #3D8700;

	/*CONTENT styling*/
	--color-background: #008296;
	--color-surface: #ffffff;
	--color-backface: #f5f5f5;
	--color-on-primary: #ffffff;
	--color-on-surface: #202020;

	/* LINKS styling*/
	--color-link: #3D8700;
	--color-link-hover: #C94091;

	/* HEADER banner for Portal, Enrolment, Pwd reset etc*/	
	--color-header-background: #008296;
	--color-header-text: #ffffff;
	--color-progress-filled: #008296;


	/* BUTTON styling*/
	--color-button-background: #008296;
	--color-button-background-hover: #ffffff;
	--color-button-text: #ffffff;
	--color-button-text-hover: #008296;
	--button-border: 1px solid #008296;
    --button-border-hover: 1px solid #008296;
	--color-button-text-disabled: #ffffff;
	--color-button-background-disabled: #a3afb9;
	--button-radius: 0.2rem;
	
	/* BACKGROUND image for authentication*/	
	--background-image: url("background.svg") no-repeat center center/cover fixed;

	/* SPINNER used for BankID, Freja, Fortified ID app and Passkey. Note, top is transparent*/
	--color-loader-indicator-top: rgba(149, 209, 249, 0.7);
	--color-loader-indicator-middle: #3D8700;
	--color-loader-indicator-bottom: #008296;
}