/* Custom color overrides to match http://k12games.ddns.net/stats/ (PsychoStats "blue" theme) */
:root {
	--cassiopeia-color-primary: #0066cc;
	--cassiopeia-color-link: #0066cc;
	--link-color: #0066cc;
	--link-color-rgb: 0, 102, 204;
	--cassiopeia-color-hover: #003355;
	--link-hover-color: #003355;
	--link-hover-color-rgb: 0, 51, 85;
	--body-color: #000;
	--body-color-rgb: 0, 0, 0;
	--secondary-color: #1a1a1a;
}

/* Darker, slightly bolder text for readability over the background image */
body.site {
	font-weight: 500;
}

.breadcrumb {
	--breadcrumb-item-active-color: #1a1a1a;
}

/* !important is needed: template.min.css has a hand-added body { ... !important } rule */
html,
body.site {
	background-color: #c5cedc !important;
	background-image: linear-gradient(rgba(197, 206, 220, .55), rgba(197, 206, 220, .55)), url("/media/templates/site/cassiopeia/images/custom/cs-bg.jpg") !important;
	background-position: center top !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
	background-attachment: fixed !important;
}

/* Semi-transparent panels so the background image shows through */
.container-header,
.footer,
.card,
.boxed .blog-item {
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

.card {
	--card-bg: rgba(197, 206, 220, .3);
}

.boxed .blog-item {
	background-color: rgba(197, 206, 220, .3);
}

/* Top navbar: semi-transparent page tint, dark text */
.container-header {
	background-color: rgba(197, 206, 220, .3);
	background-image: none;
	border-bottom: 1px solid rgba(179, 190, 208, .4);
}

.container-header .navbar-brand,
.container-header .navbar-brand a,
.container-header .site-description,
.container-header .mod-menu,
.container-header .navbar-toggler,
.container-header .mod-finder,
.container-header .mod-finder a:not(.jmodedit) {
	color: #22262a;
}

.container-header .navbar-toggler {
	border-color: #22262a;
}

.container-header .navbar-brand:hover,
.container-header .navbar-brand:focus,
.container-header .mod-finder a:not(.jmodedit):hover,
.container-header .mod-finder a:not(.jmodedit):focus {
	color: var(--cassiopeia-color-hover);
}

.container-header .mod-menu > li.active:after,
.container-header .mod-menu > li:hover:after,
.container-header .metismenu > li > a:hover:after,
.container-header .metismenu > li > button:hover:before,
.container-header .metismenu > li.active > a:after,
.container-header .metismenu > li.active > button:before {
	background: var(--cassiopeia-color-primary);
}

/* Footer: semi-transparent page tint, dark text */
.footer {
	background-color: rgba(197, 206, 220, .3);
	background-image: none;
	color: #22262a;
	border-top: 1px solid rgba(179, 190, 208, .4);
}

.footer a:not(.btn):hover,
.footer a:not(.btn):focus,
.footer .btn-link:hover,
.footer .btn-link:focus {
	color: var(--cassiopeia-color-hover);
}

.footer .metismenu.mod-menu .mm-collapse {
	background: #c5cedc;
}