:focus { outline: none; }
main {
	width: 100%;
} 
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }

.invalid { outline: 1px solid #e50000; }

.validation-message { color: #e50000; }

.darker-border-checkbox.form-check-input { border-color: #929292; }

h1 { font-family: var(--font-family); }

body {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

:root {
	--active-brightness: 0.85;
	--border-radius: 0px;
	--box-shadow: 2px 2px 10px;
	--color-accent: #F1EFE4;
	--color-bg: #fff;
	--color-bg-secondary: #73A790;
	--color-link: #2A4765;
	--color-secondary: #D7B17C;
	--color-secondary-accent: #F1EFE4;
	--color-shadow: #F1EFE4;
	--color-text: black;
	--color-text-secondary: black;
	--color-table: #73A790;
	--font-family: Gotham, Verdana, Georgia, sans-serif;
	--hover-brightness: 1.2;
	--justify-important: center;
	--justify-normal: left;
	--line-height: 1.5;
	--width-card: 285px;
	--width-card-medium: 460px;
	--width-card-wide: 1080px;
	--width-content: 1080px;
	--system-blue-dark: #4479b0;
	--system-blue-light: #5BA1EB;
}

:root {
	/* Blue */
	--blue-lighten-95: #F2F6FA;
	--blue-lighten-90: #E5EDF4;
	--blue-lighten-80: #CBDAE9;
	--blue-base: #2A4765;
	--blue-darken-15: #243C56;
	--blue-darken-25: #1F354C;
	--blue-darken-35: #1B2E42;
	/* Pink */
	--pink-lighten-90: #FDF8F8;
	--pink-lighten-80: #FBF1F1;
	--pink-lighten-50: #F4DCDC;
	--pink-base: #EABAB9;
	--pink-darken-10: #E09A99;
	--pink-darken-15: #DB8A89;
	--pink-darken-20: #D77A79;
	/* Green */
	--green-lighten-90: #F1F6F4;
	--green-lighten-85: #EAF2EE;
	--green-lighten-50: #B9D3C7;
	--green-base: #73A790;
	--green-darken-15: #5D937B;
	--green-darken-30: #4C7965;
	--green-darken-50: #365748;
	/* Gold */
	--gold-lighten-90: #FBF7F2;
	--gold-lighten-80: #F7EFE5;
	--gold-lighten-50: #EBD8BD;
	--gold-base: #73A790;
	--gold-darken-15: #CB9A55;
	--gold-darken-30: #B68138;
	--gold-darken-40: #9C6F30;
}

dialog {
	margin-top: unset;
	top: 20%;
}

	dialog button {
		width: 100%;
	}

dialog::backdrop { background-color: hsl(0 0% 0% / 50%); }

form {
	border: none;
	min-width: 0;
	box-shadow: none;
	padding: revert;
}

.watermark {
	position: fixed;
	top: 30%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-45deg);
	opacity: 0.5; /* Adjust the opacity to make it less intrusive */
	font-size: 200px; /* Adjust the font size as needed */
	color: darkred; /* Adjust the color as needed */
	pointer-events: none; /* Ensure it doesn't interfere with other elements */
	z-index: 1000; /* Ensure it stays on top of other elements */
	white-space: nowrap;
	user-select: none;
}

.filter-box {
	display: flex;
	align-items: center;
	gap: 10px;
}

.filter-box [class*="info-button"] {
	margin: 0; /* Ta bort marginaler inom filter-boxen */
}

table td { white-space: normal; }


.info-button,
.info-button-alt {
	border: none;
	padding: 1.25rem 1.55rem;
	cursor: pointer;
	align-self: flex-start;
	text-decoration: none;
	margin-top: 2rem;
	margin-bottom: 2rem;
}

.info-button {
	background-color: var(--color-bg-secondary);
	color: black;
}
.info-button.disabled {
	cursor: not-allowed;
}



.info-button-alt {
	background-color: #ffffff;
	color: #000;
	border: 1px solid #000000;
}

.info-button-alt:hover { filter: brightness(0.95); }

.horizontal-form {
	display: flex;
	align-items: flex-end;
	gap: 1rem;
	flex-wrap: nowrap;
	border: none;
}

	.horizontal-form label:has(input[type="email"]),
	.horizontal-form label:has(input[type="text"]) {
		flex: 1 1 0;
		width: auto;
	}

button {
	color: unset;
	background-color: white;
	border: 1px solid;
}


#qrcode {
	margin: auto;
	width: fit-content;
}