/* ----~~~~ InControl - base ~~~~---- */
/* The picture is on html too (inc/themes.inc), so it shows through the transparent scrollbar track.
   The scrollbar only shows when the page scrolls - no space kept for it on pages that fit (the login page). */
html {
	background:#0c070d var(--ctl-bgr, none) no-repeat center top / 100% 100% fixed;
	scrollbar-color:rgba(255,255,255,.28) transparent;
}
::-webkit-scrollbar { width:10px; height:10px; background:transparent; }
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(255,255,255,.28); border-radius:999px; border:2px solid transparent; background-clip:padding-box; }
body.control, body.admin-login {
	min-height:100vh; margin:0; color:rgba(255,255,255,.92); position:relative;
	font:15px/1.4 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
	-webkit-font-smoothing:antialiased;
}
/* The background sits on a fixed layer behind the page: iOS ignores background-attachment:fixed, and the app
   template paints body's own background. The picture itself comes from inc/themes.inc (login: Sapphire Mist). */
body.control::before, body.admin-login::before {
	content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
	background-color:#0c070d; background-repeat:no-repeat; background-position:center top; background-size:100% 100%;
}
html.app body.control, html.app body.admin-login { background:transparent; }
a { color:var(--a-link); text-decoration:none; }
@media (hover:hover) { a:hover { color:var(--a-link-hover); } }