/*
	Color palette
	-------------
	Every color on the QR code generator comes from this file. Change a value
	here and it updates everywhere. The names and values match the main page
	(1_main_page/public/assets/css/palette.css), so you can copy colors
	between the two.
*/

:root {
	/* Header background */
	--color-bg:              #242e49;
	/* Main area background (same as the main page's Welcome/Contact sections) */
	--color-accent1:         #37415c;
	/* Footer background (same as the main page's footer) */
	--color-accent3:         #54162b;

	/* Text and lines. These are white at different opacities, so they
	   work on any background color. */
	--color-text-strong:     #ffffff;                  /* headings, labels, buttons */
	--color-text:            rgba(255, 255, 255, 0.55); /* body text */
	--color-text-light:      rgba(255, 255, 255, 0.35); /* header link, captions */
	--color-border:          rgba(255, 255, 255, 0.15); /* borders, input outlines */
	--color-border-bg:       rgba(255, 255, 255, 0.05); /* input fills */

	/* Warnings ("too long", low contrast) */
	--color-warning:         #ff9a8a;

	/* Underline under the page heading */
	--color-gradient-start:  #c94b18;
	--color-gradient-end:    #953d75;

	/* Default QR code colors (visitors can change them on the page) */
	--qr-dark:               #000000;
	--qr-light:              #ffffff;
}