:root {
	color-scheme: light;

	--bs-bg: #F8F8F8;
	--bs-surface: #FFFFFF;
	--bs-surface-alt: #F0F0F0;
	--bs-border: #E5E5E5;

	--bs-text: #0A0A0A;
	--bs-text-dim: #6B7280;

	--bs-primary: #0A0A0A;
	--bs-primary-soft: #F0F0F0;

	--bs-accent: #7C3AED;
	--bs-accent-strong: #6D28D9;
	--bs-accent-soft: #EDE9FE;

	--bs-on-accent: #FFFFFF;
	--bs-shadow: rgba(0, 0, 0, .28);
	--bs-scroll: #0000003d;
	--bs-scroll-hover: #00000066;

	--bs-danger: #DC2626;
	--bs-danger-soft: #FEE2E2;
	--bs-info: #2563EB;
	--bs-info-soft: #DBEAFE;
	--bs-success: #16A34A;
	--bs-success-soft: #DCFCE7;
	--bs-warning: #EA580C;
	--bs-warning-soft: #FFEDD5;

	--bs-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
		Arial, sans-serif;
}

@media (prefers-color-scheme: dark) {
	:root {
		color-scheme: dark;

		--bs-bg: #000000;
		--bs-surface: #0A0A0A;
		--bs-surface-alt: #171717;
		--bs-border: #1F1F1F;

		--bs-text: #F5F5F5;
		--bs-text-dim: #9CA3AF;

		--bs-primary: #F5F5F5;
		--bs-primary-soft: #171717;

		--bs-accent: #A78BFA;
		--bs-accent-strong: #8B5CF6;
		--bs-accent-soft: #1E1838;

		--bs-on-accent: #0A0A0A;
		--bs-shadow: rgba(0, 0, 0, .5);
		--bs-scroll: #ffffff33;
		--bs-scroll-hover: #ffffff59;

		--bs-danger: #EF4444;
		--bs-danger-soft: #3B1111;
		--bs-info: #3B82F6;
		--bs-info-soft: #0F1E3A;
		--bs-success: #22C55E;
		--bs-success-soft: #0A2818;
		--bs-warning: #F97316;
		--bs-warning-soft: #2E1A07;
	}
}

body {
	background: var(--bs-bg);
	color: var(--bs-text);
	font-family: var(--bs-font);
}

body > .container {
	padding-top: 24px;
}

body.page-login > .container,
body.page-login-mfa > .container,
body.page-password-recover > .container,
body.page-password-change > .container {
	padding-top: 75px;
}

a {
	color: var(--bs-accent);
}

a:hover,
a:focus {
	color: var(--bs-accent-strong);
}

hr {
	border-top-color: var(--bs-border);
}

code,
pre {
	background: var(--bs-surface-alt);
	border-color: var(--bs-border);
	color: var(--bs-text);
}

*,
*::before,
*::after {
	border-radius: 0 !important;
}

* {
	scrollbar-color: var(--bs-scroll) transparent;
}

*::-webkit-scrollbar {
	width: 14px;
	height: 14px;
}

*::-webkit-scrollbar-thumb {
	background: var(--bs-scroll);
	border: 3px solid transparent;
	background-clip: content-box;
}

*::-webkit-scrollbar-thumb:hover {
	background: var(--bs-scroll-hover);
	background-clip: content-box;
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-corner {
	background: transparent;
}

.panel,
.panel-body,
.dropdown-menu,
.table-responsive,
.modal-body,
pre {
	scrollbar-width: thin;
}

.panel::-webkit-scrollbar,
.panel-body::-webkit-scrollbar,
.dropdown-menu::-webkit-scrollbar,
.table-responsive::-webkit-scrollbar,
.modal-body::-webkit-scrollbar,
pre::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

.panel::-webkit-scrollbar-thumb,
.panel-body::-webkit-scrollbar-thumb,
.dropdown-menu::-webkit-scrollbar-thumb,
.table-responsive::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb,
pre::-webkit-scrollbar-thumb {
	background: var(--bs-scroll);
	border: 2px solid transparent;
	background-clip: content-box;
}

.panel::-webkit-scrollbar-track,
.panel-body::-webkit-scrollbar-track,
.dropdown-menu::-webkit-scrollbar-track,
.table-responsive::-webkit-scrollbar-track,
.modal-body::-webkit-scrollbar-track,
pre::-webkit-scrollbar-track {
	background: transparent;
}

.navbar-default {
	background: var(--bs-surface);
	border: 0;
	border-bottom: 1px solid var(--bs-border);
	box-shadow: none;
}

.navbar-default .navbar-brand,
.navbar-default .navbar-text {
	color: var(--bs-text);
}

.navbar > .container,
.navbar > .container-fluid {
	margin-left: auto;
	margin-right: auto;
	min-width: 80%;
}

.navbar > .container .navbar-header,
.navbar > .container-fluid .navbar-header {
	margin-left: 0;
	margin-right: 0;
}

@media (min-width: 768px) {
	.navbar > .container,
	.navbar > .container-fluid {
		width: 750px;
	}
}

@media (min-width: 992px) {
	.navbar > .container,
	.navbar > .container-fluid {
		width: 970px;
	}
}

@media (min-width: 1200px) {
	.navbar > .container,
	.navbar > .container-fluid {
		width: 1170px;
	}
}

.navbar > .container .navbar-brand,
.navbar > .container-fluid .navbar-brand {
	margin-left: -8px;
}

.navbar-header a.navbar-brand,
.navbar-default .navbar-brand {
	align-items: center;
	display: flex;
	height: 50px;
	padding: 0 8px;
}

.navbar-header a.navbar-brand img,
#login_header_logo {
	display: block;
	height: 28px;
	width: auto;
}

.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-nav > li > a.btn {
	background: transparent;
	border: 0;
	color: var(--bs-text-dim);
}

.navbar-default .navbar-nav > li > a.navbar-btn {
	margin-bottom: 0;
	margin-top: 0;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a.btn:hover,
.navbar-default .navbar-nav > li > a.btn:focus {
	background: var(--bs-surface-alt);
	color: var(--bs-text);
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
	background: var(--bs-accent-soft);
	color: var(--bs-accent-strong);
}

.navbar-default .navbar-toggle {
	border-color: var(--bs-border);
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
	background: var(--bs-surface-alt);
}

.navbar-default .navbar-toggle .icon-bar {
	background: var(--bs-text);
}

.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
	border-color: var(--bs-border);
}

.dropdown-menu {
	background: var(--bs-surface);
	border: 1px solid var(--bs-border);
	box-shadow: 0 4px 16px var(--bs-shadow);
	padding: 4px 0;
}

.dropdown-menu > li > a {
	color: var(--bs-text);
	padding: 7px 16px;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
	background: var(--bs-surface-alt);
	color: var(--bs-text);
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
	background: var(--bs-accent-soft);
	color: var(--bs-accent-strong);
}

.dropdown-menu .divider {
	background: var(--bs-border);
}

.well,
.panel,
.panel-default {
	background: var(--bs-surface);
	border: 1px solid var(--bs-border);
	box-shadow: none;
}

.panel-heading,
.panel-default > .panel-heading {
	background: var(--bs-surface-alt);
	border-bottom: 1px solid var(--bs-border);
	color: var(--bs-text);
}

.panel-footer,
.panel-default > .panel-footer {
	background: var(--bs-surface-alt);
	border-top: 1px solid var(--bs-border);
	color: var(--bs-text-dim);
}

.panel-title {
	color: var(--bs-text);
}

.panel > section,
#main_menu > section {
	display: block;
	padding: 8px 16px 16px;
}

#main_menu[style] {
	padding-top: 0 !important;
}

[role="main"] h1,
[role="main"] h2,
[role="main"] h3,
[role="main"] h4 {
	margin-bottom: 14px;
	margin-top: 26px;
}

[role="main"] h1:first-child,
[role="main"] h2:first-child,
[role="main"] h3:first-child,
[role="main"] h4:first-child,
[role="main"] section > h1:first-child,
[role="main"] section > h2:first-child {
	margin-top: 8px;
}

.table {
	color: var(--bs-text);
}

.table > thead > tr > th {
	background: var(--bs-surface-alt);
	border-bottom: 1px solid var(--bs-border);
	color: var(--bs-text-dim);
	font-weight: 600;
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: .04em;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > thead > tr > td {
	border-top: 1px solid var(--bs-border);
	vertical-align: middle;
}

.table-hover > tbody > tr:hover,
.table-hover > tbody > tr:hover > td {
	background: var(--bs-surface-alt);
}

.table-striped > tbody > tr:nth-of-type(odd) {
	background: transparent;
}

.table > tbody > tr.active > td,
.table > tbody > tr > td.active {
	background: var(--bs-accent-soft);
}

.form-control {
	background: var(--bs-surface);
	border: 1px solid var(--bs-border);
	box-shadow: none;
	color: var(--bs-text);
	height: 36px;
}

textarea.form-control {
	height: auto;
}

.form-control:focus {
	background: var(--bs-surface);
	border-color: var(--bs-accent);
	box-shadow: inset 0 0 0 1px var(--bs-accent);
	outline: 0;
}

.form-control::placeholder {
	color: var(--bs-text-dim);
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
	background: var(--bs-surface-alt);
	color: var(--bs-text-dim);
}

select,
select.form-control {
	background: var(--bs-surface);
	border: 1px solid var(--bs-border);
	box-shadow: none;
	color: var(--bs-text);
	height: 36px;
	padding: 6px 10px;
}

select:focus {
	border-color: var(--bs-accent);
	box-shadow: inset 0 0 0 1px var(--bs-accent);
	outline: 0;
}

select[multiple],
select[size] {
	height: auto;
}

input[type="checkbox"],
input[type="radio"] {
	accent-color: var(--bs-accent);
}

.control-label,
label {
	color: var(--bs-text);
	font-weight: 600;
}

.help-block {
	color: var(--bs-text-dim);
}

.has-error .form-control {
	border-color: var(--bs-danger);
}

.has-error .form-control:focus {
	box-shadow: inset 0 0 0 1px var(--bs-danger);
}

.has-error .control-label,
.has-error .help-block {
	color: var(--bs-danger);
}

.input-group-addon {
	background: var(--bs-surface-alt);
	border-color: var(--bs-border);
	color: var(--bs-text-dim);
}

.btn {
	border: 1px solid transparent;
	box-shadow: none;
	font-weight: 600;
	text-shadow: none;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.btn:focus,
.btn:active:focus,
a:focus {
	outline: 2px solid var(--bs-accent);
	outline-offset: 1px;
}

.btn-default {
	background: var(--bs-surface);
	border-color: var(--bs-border);
	color: var(--bs-text);
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
	background: var(--bs-surface-alt);
	border-color: var(--bs-border);
	color: var(--bs-text);
}

.btn-primary {
	background: var(--bs-accent);
	border-color: var(--bs-accent);
	color: var(--bs-on-accent);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
	background: var(--bs-accent-strong);
	border-color: var(--bs-accent-strong);
	color: var(--bs-on-accent);
}

.btn-danger {
	background: var(--bs-danger);
	border-color: var(--bs-danger);
	color: #FFFFFF;
}

.btn-warning {
	background: var(--bs-warning);
	border-color: var(--bs-warning);
	color: #FFFFFF;
}

.btn-info {
	background: var(--bs-info);
	border-color: var(--bs-info);
	color: #FFFFFF;
}

.btn-success {
	background: var(--bs-success);
	border-color: var(--bs-success);
	color: #FFFFFF;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-warning:hover,
.btn-warning:focus,
.btn-info:hover,
.btn-info:focus,
.btn-success:hover,
.btn-success:focus {
	filter: brightness(.9);
	color: #FFFFFF;
}

.table .btn {
	border-width: 1px;
	font-weight: 600;
	padding: 4px 10px;
}

.table .btn-warning {
	background: var(--bs-success-soft);
	border-color: var(--bs-success);
	color: var(--bs-success);
}

.table .btn-info {
	background: var(--bs-surface-alt);
	border-color: var(--bs-border);
	color: var(--bs-text-dim);
}

.table .btn-primary {
	background: var(--bs-surface);
	border-color: var(--bs-border);
	color: var(--bs-text);
}

.table .btn-primary .glyphicon {
	color: var(--bs-accent);
}

.table .btn-danger {
	background: var(--bs-danger-soft);
	border-color: var(--bs-danger);
	color: var(--bs-danger);
}

.table .btn-warning:hover,
.table .btn-warning:focus,
.table .btn-info:hover,
.table .btn-info:focus,
.table .btn-primary:hover,
.table .btn-primary:focus,
.table .btn-danger:hover,
.table .btn-danger:focus {
	filter: none;
	background: var(--bs-surface-alt);
}

.table .btn-danger:hover,
.table .btn-danger:focus {
	background: var(--bs-danger);
	color: #FFFFFF;
}

.table .btn-danger:hover .glyphicon,
.table .btn-danger:focus .glyphicon {
	color: #FFFFFF;
}

.page-main .btn-primary.btn-block {
	background: var(--bs-surface);
	border-color: var(--bs-border);
	color: var(--bs-text);
	text-align: left;
}

.page-main .btn-primary.btn-block:hover,
.page-main .btn-primary.btn-block:focus,
.page-main .btn-primary.btn-block:active {
	background: var(--bs-surface-alt);
	border-color: var(--bs-border);
	color: var(--bs-text);
}

.page-main .btn-primary.btn-block .glyphicon {
	color: var(--bs-accent);
	margin-right: 6px;
}

.btn-link {
	color: var(--bs-accent);
}

.btn-link:hover,
.btn-link:focus {
	color: var(--bs-accent-strong);
}

.alert,
ul.flash-info,
ul.flash-error {
	border: 1px solid transparent;
	border-left-width: 3px;
	list-style: none;
	margin-bottom: 18px;
	padding: 12px 16px;
}

.alert-info,
ul.flash-info {
	background: var(--bs-info-soft);
	border-color: var(--bs-info);
	color: var(--bs-text);
}

.alert-danger,
ul.flash-error {
	background: var(--bs-danger-soft);
	border-color: var(--bs-danger);
	color: var(--bs-text);
}

.alert-success {
	background: var(--bs-success-soft);
	border-color: var(--bs-success);
	color: var(--bs-text);
}

.alert-warning {
	background: var(--bs-warning-soft);
	border-color: var(--bs-warning);
	color: var(--bs-text);
}

.alert a,
ul.flash-info a,
ul.flash-error a {
	color: var(--bs-accent-strong);
	font-weight: 600;
}

#motd {
	background: var(--bs-accent-soft);
	border-left: 3px solid var(--bs-accent);
	color: var(--bs-text);
	margin-bottom: 18px;
	padding: 12px 16px;
}

.label-default {
	background: var(--bs-surface-alt);
	color: var(--bs-text-dim);
}

.label-primary {
	background: var(--bs-accent);
	color: var(--bs-on-accent);
}

.label-danger {
	background: var(--bs-danger);
}

.label-success {
	background: var(--bs-success);
}

.label-warning {
	background: var(--bs-warning);
}

.label-info {
	background: var(--bs-info);
}

.badge {
	background: var(--bs-accent);
	color: var(--bs-on-accent);
}

.pagination > li > a,
.pagination > li > span {
	background: var(--bs-surface);
	border-color: var(--bs-border);
	color: var(--bs-text);
}

.pagination > li > a:hover,
.pagination > li > span:hover {
	background: var(--bs-surface-alt);
	border-color: var(--bs-border);
	color: var(--bs-text);
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
	background: var(--bs-accent);
	border-color: var(--bs-accent);
	color: var(--bs-on-accent);
}

.footer {
	background: var(--bs-surface);
	border-top: 1px solid var(--bs-border);
	box-sizing: content-box;
	color: var(--bs-text-dim);
	left: 0;
	right: 0;
	width: auto;
}

.footer a {
	color: var(--bs-text-dim);
}

.footer a:hover {
	color: var(--bs-accent);
}

#login {
	margin-top: 32px;
}

#login .well {
	padding: 24px;
}

#login h2.h2 {
	color: var(--bs-text);
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 20px;
	text-align: center;
}

.page-login .navbar-brand img,
.page-login-mfa .navbar-brand img {
	height: 36px;
}

#login .form-group > label,
#login .form-group > select {
	display: block;
	width: 100%;
}

.form-signin .btn-primary {
	min-width: 160px;
}

.quota_bg {
	background: var(--bs-surface-alt);
	border: 1px solid var(--bs-border);
}

.quota_text,
.quota_text_low,
.quota_text_mid {
	color: var(--bs-text);
}

.quota_text_high {
	color: #FFFFFF;
}

.glyphicon {
	color: inherit;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--bs-text);
	font-weight: 700;
}

[role="main"] h1 { font-size: 26px; }
[role="main"] h2 { font-size: 20px; }
[role="main"] h3 { font-size: 17px; }
[role="main"] h4 { font-size: 15px; }

.text-muted {
	color: var(--bs-text-dim);
}

.close {
	color: var(--bs-text);
	opacity: .5;
	text-shadow: none;
}

.close:hover,
.close:focus {
	color: var(--bs-text);
	opacity: 1;
}

.modal-content {
	background: var(--bs-surface);
	border: 1px solid var(--bs-border);
	box-shadow: 0 8px 32px var(--bs-shadow);
}

.modal-header,
.modal-footer {
	border-color: var(--bs-border);
}

.modal-backdrop {
	background: #000000;
}