:root {
	--light-threshold: 60;
	--active-lightness-multiplier: .85;
	
	--body-hue: 0;
	--body-saturation: 100;
	--body-lightness: 100;

	--link-hue: 211;
	--link-saturation: 100;
	--link-lightness: 50;

	--primary-hue: 211;
	--primary-saturation: 100;
	--primary-lightness: 50;

	--secondary-hue: 208;
	--secondary-saturation: 7.3;
	--secondary-lightness: 45.7;

	--table-hue: 0;
	--table-saturation: 100;
	--table-lightness: 100;

	--table-striped-hue: 208;
	--table-striped-saturation: 7.3;
	--table-striped-lightness: 45.7;
	--table-striped-bg-opacity: 0.05;

	--table-head-hue: 204;
	--table-head-saturation: 2.1;
	--table-head-lightness: 54.3;
}

[data-bs-theme="dark"] {
	--body-lightness: 0;
	--table-lightness: 0;
}

body {
	--hue: var(--body-hue);
	--saturation: var(--body-saturation);
	--lightness: var(--body-lightness);
	--switch: calc((var(--lightness) - var(--light-threshold)) * -100%);

	color: hsl(0, 0%, var(--switch));
	background-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
}

:focus-visible {
	outline: 1px dotted;
	outline-offset: 2px;
}

a {
	--hue: var(--link-hue);
	--saturation: var(--link-saturation);
	--lightness: var(--link-lightness);
	--switch: calc((var(--lightness) - var(--light-threshold)) * -100%);

	color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
}
a:hover {
	--lightness: calc(var(--link-lightness) * var(--active-lightness-multiplier));
	color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
}

input {
	--hue: var(--primary-hue);
	--saturation: calc(var(--primary-saturation) * 1%);
	--lightness: calc(var(--primary-lightness) * var(--active-lightness-multiplier) * 1%);
	accent-color: hsl(var(--hue), var(--saturation), var(--lightness));
}

.text-muted {
	--switch: calc((var(--lightness) - var(--light-threshold)) * -100%);
	color: hsla(0, 0%, var(--switch), .5) !important;
}

.btn, .btn.disabled, .btn:disabled {
	--switch: calc((var(--lightness) - var(--light-threshold)) * -100%);

	--bs-btn-color: hsl(0, 0%, var(--switch));
	--bs-btn-bg: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
	--bs-btn-border-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
	--btn-focus-box-shadow: 0 0 0 0.2rem hsla(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%), 0.5);
}
.btn:hover, .btn:focus, .btn.focus, .btn:not(:disabled):not(.disabled):active, .btn:not(:disabled):not(.disabled).active, .show > .btn.dropdown-toggle {
	--switch: calc((var(--active-lightness) - var(--light-threshold)) * -100%);

	--bs-btn-color: hsl(0, 0%, var(--switch));
	--bs-btn-bg: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--active-lightness) * 1%));
	--bs-btn-border-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--active-lightness) * 1%));
}

.nav-link.btn {
	--bs-btn-color: var(--bs-secondary-color);
	color: var(--bs-btn-color);
}
.nav-link.btn:hover, .nav-link.btn:active, .nav-link.btn.show {
	--bs-btn-color: inherit;
}

.btn-primary {
	--hue: var(--primary-hue);
	--saturation: var(--primary-saturation);
	--lightness: var(--primary-lightness);
	--active-lightness: calc(var(--primary-lightness) * var(--active-lightness-multiplier));
}
.btn-primary.disabled, .btn-primary:disabled {
	--active-lightness: var(--primary-lightness);
}

.btn-secondary {
	--hue: var(--secondary-hue);
	--saturation: var(--secondary-saturation);
	--lightness: var(--secondary-lightness);
	--active-lightness: calc(var(--secondary-lightness) * var(--active-lightness-multiplier));
}
.btn-primary.disabled, .btn-primary:disabled {
	--active-lightness: var(--secondary-lightness);
}

.btn-link {
	--bs-btn-font-weight: 400;
	--bs-btn-color: var(--bs-link-color);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: transparent;
	--bs-btn-hover-color: var(--bs-link-hover-color);
	--bs-btn-hover-border-color: transparent;
	--bs-btn-active-color: var(--bs-link-hover-color);
	--bs-btn-active-border-color: transparent;
	--bs-btn-disabled-color: #6c757d;
	--bs-btn-disabled-border-color: transparent;
	--bs-btn-box-shadow: 0 0 0 #000;
	--bs-btn-focus-shadow-rgb: 49,132,253;
	text-decoration: underline;
}

.form-control:focus {
	--hue: var(--primary-hue);
	--saturation: var(--primary-saturation);
	--lightness: calc(var(--primary-lightness) * 1.5);

	border-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
	box-shadow: 0 0 0 .2rem hsla(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%), 0.25);
}

.form-check {
	--hue: var(--primary-hue);
	--saturation: var(--primary-saturation);
	--lightness: var(--primary-lightness);
	--switch: calc((var(--lightness) - var(--light-threshold)) * -100%);
}

.form-check-input:checked ~ .form-check-label::before {
	color: hsl(0, 0%, var(--switch));
	border-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
	background-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
}

.form-check-input:focus ~ .form-check-label::before {
	box-shadow: 0 0 0 0.2rem hsla(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%), 0.5);
}

.form-check-input:focus:not(:checked) ~ .form-check-label::before {
	--lightness: calc(var(--primary-lightness) * 1.5);
	border-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
}

.form-check-input:not(:disabled):active ~ .form-check-label::before {
	--lightness: calc(var(--primary-lightness) * 1.5);
	color: hsl(0, 0%, var(--switch));
	border-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
	background-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
}

.table {
	--hue: var(--table-hue);
	--saturation: var(--table-saturation);
	--lightness: var(--table-lightness);
	--switch: calc((var(--lightness) - var(--light-threshold)) * -100%);

	color: hsl(0, 0%, var(--switch));
	background-color: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));
}

.table-striped tbody tr:nth-of-type(odd) {
	background-color: hsla(var(--table-striped-hue), calc(var(--table-striped-saturation) * 1%), calc(var(--table-striped-lightness) * 1%), var(--table-striped-bg-opacity));
}

table.table thead, table.table thead th, table.table thead td {
	--hue: var(--table-head-hue);
	--saturation: var(--table-head-saturation);
	--lightness: var(--table-head-lightness);
	--switch: calc((var(--lightness) - var(--light-threshold)) * -100%);
	--bs-table-bg: hsl(var(--hue), calc(var(--saturation) * 1%), calc(var(--lightness) * 1%));

	color: hsl(0, 0%, var(--switch));
	background-color: var(--bs-table-bg);
}
table.table thead a {
	--link-hue: 0;
	--link-saturation: 0;
	--link-lightness: var(--switch);
}