@font-face {
    font-family: 'PP Mori';
    src: url('../fonts/PPMori-Extralight.woff2') format('woff2'),
    url('../fonts/PPMori-Extralight.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PP Mori';
    src: url('../fonts/PPMori-Regular.woff2') format('woff2'),
    url('../fonts/PPMori-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PP Mori';
    src: url('../fonts/PPMori-Bold.woff2') format('woff2'),
    url('../fonts/PPMori-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@media (prefers-color-scheme: dark) {
    :root {
		--primary: #79aec8 !important;
		--primary-fg: #fff !important;

		--body-fg: #333 !important;
		--body-bg: #fff !important;
		--body-quiet-color: #666 !important;
		--body-loud-color: #000 !important;

		--breadcrumbs-link-fg: var(--body-bg) !important;
		--breadcrumbs-bg: var(--primary) !important;

		--link-fg: #417893 !important;
		--link-hover-color: #036 !important;
		--link-selected-fg: #5b80b2 !important;

		--hairline-color: #e8e8e8 !important;
		--border-color: #ccc !important;

		--error-fg: #ba2121 !important;
		--message-success-bg: #dfd !important;
		--message-warning-bg: #ffc !important;
		--message-error-bg: #ffefef !important;

		--darkened-bg: #f8f8f8 !important;
		--selected-bg: #e4e4e4 !important;
		--selected-row: #ffc !important;

		--close-button-bg: #747474 !important;
		--close-button-hover-bg: #333 !important;
	}
}

html[data-theme="dark"] {
	--primary: #79aec8 !important;
		--primary-fg: #fff !important;

		--body-fg: #333 !important;
		--body-bg: #fff !important;
		--body-quiet-color: #666 !important;
		--body-loud-color: #000 !important;

		--breadcrumbs-link-fg: var(--body-bg) !important;
		--breadcrumbs-bg: var(--primary) !important;

		--link-fg: #417893 !important;
		--link-hover-color: #036 !important;
		--link-selected-fg: #5b80b2 !important;

		--hairline-color: #e8e8e8 !important;
		--border-color: #ccc !important;

		--error-fg: #ba2121 !important;
		--message-success-bg: #dfd !important;
		--message-warning-bg: #ffc !important;
		--message-error-bg: #ffefef !important;

		--darkened-bg: #f8f8f8 !important;
		--selected-bg: #e4e4e4 !important;
		--selected-row: #ffc !important;

		--close-button-bg: #747474 !important;
		--close-button-hover-bg: #333 !important;
}



:root {
	--white: #fff;
	--black: #000;
	--orange: #FF590B;
	--red: #95120B;
	--green: #005344;
	--lilac: #B99FEA;
	--red: #95120B;
	--bright-orange: #FF9211;
	--bright-green: #CDE966;
	--grey-wash: #F2F2F2;
	--grey-line: #DCDCDC;
	--grey-dark: #4A4A4A;
	--soft-black: #262626;
	--font: 'PP Mori', sans-serif;
	--transition: 0.4s ease;
}

body {
	background-color: var(--grey-wash) !important;
	font-family: var(--font);
}

#content {
	position: relative;
}

#content p {
	line-height: 1.6;
}

#content p a {
	color: var(--black);
	font-weight: 700;
	text-decoration: underline;
}
#content p a:hover,
#content p a:active {
	color: var(--orange);
}

#content h2 {
	font-size: 24px;
	font-weight: 200;
}

#header .theme-toggle {
	display: none;
}

* {
	box-sizing: border-box;
}
*::after,
*::before {
	box-sizing: border-box;
}

/* Login page */
body.login {
	align-items: center;
	background-color: var(--red) !important;
	display: flex;
	height: 100%;
	padding: 20px;
}
body.login #container {
	background: transparent;
	border: 0;
	border-radius: 24px;
	margin: 0 auto;
	width: 420px;
}
body.login #header {
	background-color: var(--white);
	padding: 32px 16px 8px;
}
body.login #branding {
	float: none;
}
body.login #header #site-name {
	color: var(--black);
	font-size: 30px;
	font-weight: 100;
	line-height: 33px;
	text-align: center;
}
body.login #content {
	padding: 16px 31px 18px;
}
body.login .content {
	background-color: var(--white);
	border: 2px solid var(--grey-light);
	border-top: 0;
}
body.login #login-form label {
	color: var(--black);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
}
body.login #login-form input {
	background-color: var(--white) !important;
	border: 1px solid var(--black) !important;
	border-radius: 24px !important;
	font-family: var(--font) !important;
	font-size: 16px !important;
	font-weight: 400;
	height: 48px;
	padding: 0 20px !important;
}
body.login #login-form input:focus-visible {
	outline: 0;
}
body.login #login-form input:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 30px var(--white) inset !important;
	font-family: var(--font);
}
body.login #login-form .submit-row input {
	background-color: var(--black) !important;
	border-color: var(--black) !important;
	font-size: 14px !important;
	font-weight: 700;
	height: 48px;
	padding: 0 24px !important;
	text-transform: none;
	transition: var(--transition);
	transition-property: background, color;
}
body.login #login-form .submit-row input:hover {
	background-color: var(--white) !important;
	color: var(--black);
	opacity: 1;
}
@media only screen and (max-width: 767px) {
	body.login {
		padding: 20px !important;
		width: 100%;
	}
	body.login #content {
		padding: 16px 24px 24px;
	}
	body.login #container {
		max-width: 392px;
		min-width: 10px;
		width: 100%;
	}
	body.login #header #site-name {
		font-size: 28px;
	}
	body.login #login-form label,
	body.login #login-form input {
		font-size: 14px;
	}
}

/* header */
body #header {
	background-color: var(--white);
	border-bottom: 1px solid var(--grey-line);
	height: 70px;
}
body #header #site-name {
	color: var(--black);
	font-size: 24px;
	line-height: 1.2;
	margin: 5px 0 0
}
body #user-tools {
	color: var(--black);
	font-size: 14px;
	font-weight: 400;
	text-transform: none;
}
body #user-tools a {
	color: inherit !important;
	border: 0;
	font-size: 14px;
	font-weight: 700;
	margin: 0 2px;
	text-decoration: underline;
}
body #user-tools a:first-of-type {
	margin-left: 10px;
}
body #user-tools #logout-form button {
	color: inherit !important;
	font-size: 14px;
	font-weight: 700;
	text-decoration: underline;
	text-transform: none;
}
body #user-tools a:hover,
body #user-tools #logout-form button:hover {
	color: var(--orange) !important;
	text-decoration: underline;
}
@media only screen and (max-width: 1024px) {
	body #header {
		height: auto;
	}
}
@media only screen and (max-width: 767px) {
	body #user-tools {
		text-align: center;
	}
}

/* sidebar */
.main #content-related {
	background: none;
}
.main #content-related .module {
	background-color: var(--white);
	border: 0;
	border-radius: 24px;
	padding-bottom: 8px;
}
.main #content-related .module h2 {
	border-color: var(--grey-line);
	color: var(--black);
	font-size: 24px;
	font-weight: 300;
	padding: 20px 16px 16px
}
.main #content-related .module h3 {
	color: var(--black);
	font-size: 16px;
}
.main #content-related .module .actionlist a {
	color: var(--black);
	font-weight: 700;
	text-decoration: underline;
}
.main #content-related .module .actionlist a:hover,
.main #content-related .module .actionlist a:active {
	color: var(--orange);
}

/* main content */
.main h1 {
	color: var(--black);
	border-bottom: 1px solid var(--grey-line);
	font-size: 36px;
	font-weight: 100;
	margin: 15px 0;
	padding-bottom: 8px;
}
.main .module caption,
.inline-group h2 {
	background: var(--green);
	border-radius: 16px;
	font-weight: 600;
	padding: 13px 16px 10px;
}
.main .module table caption a,
.inline-group h2 a {
	color: var(--white);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	text-transform: none;
}
.main .module table caption a:hover,
.inline-group h2 a:hover {
	color: var(--white);
	text-decoration: underline;
}
.main .module table {
	border: 0;
}
.main .module tbody {
	border: 2px solid var(--grey-light);
	border-top: 0;
}
.main .module td,
.main .module th {
	border-color: var(--grey-line);
	color: var(--black);
	padding: 16px 12px;
}
.main .module table a {
	color: var(--black);
	font-weight: 700;
	text-decoration: underline;
}
.main .module table a:hover {
	color: var(--orange);
}
.main .module table .viewlink,
.main .module table .inlineviewlink,
.main .module table .addlink,
.main .module table .changelink,
.main .module table .inlinechangelink {
	font-weight: 600;
}
.main .module table tr:nth-child(even),
.main .module table tr:nth-child(even) .errorlist,
.main .module table tr:nth-child(odd) + .row-form-errors,
.main .module table tr:nth-child(odd) + .row-form-errors .errorlist {
	background: var(--input-bg);
}

/* breadcrumbs */
body .breadcrumbs {
	background-color: var(--grey-wash);
	border-bottom: 1px solid var(--grey-line);
	color: var(--black);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.5px;
	margin-bottom: 16px;
	padding: 18px 40px 17px;
}
body .breadcrumbs a {
	color: var(--black);
	font-weight: 700;
	text-decoration: underline;
}
body .breadcrumbs a:hover {
	color: var(--orange);
	text-decoration: none;
}
body .breadcrumbs a:focus {
	color: var(--orange);
}

/* toggle sidebar */
.main .toggle-nav-sidebar {
	align-items: flex-start;
	background-color: var(--lilac);
	border: 0;
	border-radius: 0 16px 0 0;
	color: var(--white);
	font-size: 22px;
	font-weight: 900;
	flex: 0 0 24px;
	height: 100%;
	max-height: none;
	padding-top: 8px;
	width: 24px;
}

/* sidebar */
.main #nav-sidebar {
	background-color: var(--grey-lighter);
	border: 0;
	max-height: none;
}
.main.shifted > #nav-sidebar {
	margin-left: 15px;
}
#nav-sidebar .module {
	border-radius: 16px 16px 0 0;
	margin-bottom: 20px;
	overflow: hidden;
}
#nav-sidebar .module table caption a {
	color: var(--white);
}
#nav-sidebar .module.current-app table caption a {
	color: var(--white) !important;
	font-size: 14px;
}
#nav-sidebar .module table tbody {
	border-left: 0;
}
#nav-sidebar .module table .current-model {
	background-color: var(--selected);
}
#nav-sidebar .module table .current-model a {
	color: var(--black);
}
#nav-sidebar .module table .current-model a:hover {
	color: var(--orange);
}

#nav-filter {
	border-color: var(--black);
	border-radius: 24px;
	font-family: var(--font);
	font-size: 14px;
	margin: 0 0 16px;
	padding: 16px 16px 15px;
}
#nav-filter:focus {
	border-color: var(--black);
}

/* changelist */
.change-list #changelist {
	background: transparent;
}
.change-list #changelist .toplinks {
	border-bottom: 2px solid var(--grey-light);
}
#changelist #changelist-filter {
	background: var(--white);
	border: 2px solid var(--grey-light);
}
#changelist #changelist-filter h2 {
	background: none;
	border-bottom: 1px solid var(--hairline-color);
	color: var(--green);
	font-size: 18px;
	font-weight: 600;
	padding: 16px;
	text-transform: none;
}
#changelist #changelist-filter h3 {
	font-weight: bold;
}
#changelist #changelist-filter ul a {
	color: var(--orange);
	font-weight: 600;
	text-decoration: underline;
}
#changelist #changelist-filter ul a:hover {
	text-decoration: none;
}
#changelist #changelist-filter ul li.selected {
	border-color: var(--selected);
}
#changelist #changelist-filter #changelist-filter-clear {
	font-weight: 500;
}
#changelist #changelist-filter #changelist-filter-clear a {
	color: var(--orange);
}
@media only screen and (min-width: 768px) and (max-width: 1025px) {
	#changelist.module {
		flex-direction: column;
		justify-content: flex-start;
	}
	#changelist.module .changelist-form-container {
		flex: 0 0 auto;
		margin-bottom: 20px;
		width: 100%;
	}
	#changelist #changelist-filter {
		flex-basis: 100%;
		margin: 0;
		width: 100%;
	}
}

#content-main .module {
	border-radius: 24px;
	padding: 16px;
}

/* paginator */
.module #changelist-form .paginator {
	border-color: var(--grey-light);
}

/* changelist search */
.changelist-form-container #toolbar {
	padding: 14px;
}
.changelist-form-container #changelist-search #searchbar,
.changelist-form-container #changelist-search input[type="submit"] {
	border-radius: 0;
	font-family: var(--font);
	height: 40px;
}
.changelist-form-container #changelist-search #searchbar {
	background-color: var(--input-bg);
	border: 2px solid var(--grey-light);
	font-size: 14px;
	outline: none;
	padding: 0 20px !important;
}
.changelist-form-container #changelist-search #searchbar:focus,
.changelist-form-container #changelist-search #searchbar:focus-visible {
	border-color: var(--grey-light);
}
.changelist-form-container #changelist-search input[type="submit"] {
	background: var(--orange);
	border: 0;
	color: var(--white);
	font-size: 12px;
	font-weight: 700;
	padding: 0 26px !important;
	text-transform: uppercase;
	transition: opacity var(--transition);
}
.changelist-form-container #changelist-search input[type="submit"]:hover {
	opacity: 0.7;
}
@media only screen and (min-width: 1026px) and (max-width: 1200px) {
	.changelist-form-container #changelist-search > div {
		display: flex;
		flex-wrap: wrap;
	}
	.changelist-form-container #changelist-search label {
		align-items: center;
		display: flex;
		justify-content: center;
		width: 20px;
	}
	.changelist-form-container #changelist-search #searchbar {
		width: calc(100% - 20px);
	}
	.changelist-form-container #changelist-search input[type="submit"] {
		margin: 10px 0 0 20px;
	}
}
@media only screen and (min-width: 768px) and (max-width: 1025px) {
	.changelist-form-container #changelist-search > div {
		display: flex;
		flex-wrap: wrap;
	}
}

.object-tools {
	margin-top: 0;
    position: absolute;
    right: 20px;
    top: 20px;

}

#content-main .object-tools a.addlink,
#content-main .object-tools a.historylink {
	background-color: var(--black);
	background-position: right 16px center;
	border: 1px solid var(--black);
	border-radius: 24px;
	font-family: var(--font);
	font-size: 14px;
	font-weight: 700;
	padding: 14px 32px 12px 24px;
	text-transform: none;
	transition: opacity var(--transition);
}
#content-main .object-tools a.addlink:hover,
#content-main .object-tools a.historylink:hover {
	background-color: transparent;
	color: var(--black);
}

#changelist .changelist-form-container .actions select {
	border: 1px solid var(--black);
	border-radius: 24px;
	color: var(--black);
	height: 48px;
	outline: none;
	padding: 0 24px;
}
#changelist .changelist-form-container .actions select:focus,
#changelist .changelist-form-container .actions select:focus-visible {
	border-color: var(--grey-light);
}
#changelist .changelist-form-container .actions .button {
	background-color: var(--black);
	border: 1px solid var(--black);
	border-radius: 24px;
	box-shadow: none;
	color: var(--white);
	font-family: var(--font);
	font-size: 14px;
	font-weight: 700;
	height: 48px;
	padding: 0 24px;
	text-transform: uppercase;
}
#changelist .changelist-form-container .actions .button:hover,
#changelist .changelist-form-container .actions .button:active {
	background-color: transparent;
	color: var(--black);
	opacity: 1;
}
#changelist .changelist-form-container #result_list thead {
	border: 2px solid var(--grey-light);
}
#changelist .changelist-form-container #result_list thead th {
	font-weight: 700;
}
#changelist .changelist-form-container #result_list thead th.sorted,
#changelist .changelist-form-container #result_list thead th .text a:hover {
	background-color: var(--darkened-bg);
}
#changelist .changelist-form-container #result_list tbody {
	border-bottom: 0;
}
#content-main #changelist table tbody tr.selected {
	background-color: var(--lilac);
}
#content-main form .form-row label {
	color: var(--black);
	font-size: 14px;
	padding-top: 12px;
}
#content-main form .form-row select,
#content-main form .form-row input,
#content-main form .form-row textarea{
	border: 1px solid var(--black);
	border-radius: 24px;
	color: var(--black);
	font-size: 14px;
	height: 48px;
	outline: none;
	padding: 0 16px;
}

#content-main form .form-row select {
	width: 20em;
}
#content-main form .form-row select[multiple] {
	padding: 12px 16px;
}

#content-main form .form-row .vIntegerField {
	width: 11em;
}

#content-main form .form-row .vLargeTextField {
	height: 220px;
	padding: 12px 16px;
	width: 20em;
}

#content-main form .form-row .url a {
	color: var(--orange);
	font-weight: 600;
	text-decoration: underline;
}
#content-main form .form-row .url a:hover {
	text-decoration: none;
}
#content-main form .submit-row {
	background-color: var(--white);
	border: none;
	border-radius: 24px;
	padding: 24px;
}
#content-main form .submit-row input,
#content-main form .submit-row .deletelink,
#content-main form .submit-row .closelink {
	background-color: var(--black);
	border: 1px solid var(--black);
	border-radius: 24px;
	font-family: var(--font);
	font-size: 14px;
	font-weight: 700;
	height: auto;
	padding: 16px 24px 15px;
	text-transform: none;
	transition: background var(--transition);
}
#content-main form .submit-row input:hover,
#content-main form .submit-row input:active {
	background-color: transparent;
	color: var(--black);
	opacity: 1;
}
#content-main form .submit-row .deletelink,
#content-main form .submit-row .closelink {
	align-items: center;
	background-color: transparent;
	color: var(--black);
	display: flex;
	float: left;
	text-decoration: none;
}
#content-main form .submit-row .deletelink:hover,
#content-main form .submit-row .deletelink:active {
	background-color: var(--black);
	color: var(--white);
	opacity: 1;
}
#content-main form .form-row .url {
	color: var(--black);
	font-size: 14px;
}
#content-main form .form-row .url a {
	color: inherit;
	font-weight: 700;
}
#content-main form .form-row .url a:hover,
#content-main form .form-row .url a:active {
	color: var(--orange);
	text-decoration: underline;
}
#content-main form .form-row .url input {
	margin-top: 4px;
}
.content ul.messagelist {
	margin-left: 20px;
}
.content ul.messagelist li {
	background-color: var(--bright-green);
	color: var(--black);
	font-weight: 600;
	padding-top: 12px;
}
.content ul.messagelist li a {
	color: var(--black);
	font-weight: 700;
	text-decoration: underline;
}
.content ul.messagelist li a:hover {
	text-decoration: none;
}

#content-main #toolbar,
#content-main .form-row,
#content-main .submit-row{
	border: 0;
}

#content-main .form-row .help li {
	color: var(--black);
	font-style: italic;
}

#content-main #changelist .actions {
	align-items: center;
	padding: 16px;
}
#content-main #changelist .actions label {
	align-items: center;
	color: var(--black);
}

.delete-confirmation #content form input[type="submit"],
.delete-confirmation #content form .cancel-link {
	border: 1px solid;
	border-radius: 24px;
	color: var(--white);
	height: 48px;
	line-height: 48px;
	padding: 0 24px;
}
.delete-confirmation #content form input[type="submit"] {
	background-color: var(--red);
	border-radius: 24px;
}
.delete-confirmation #content form input[type="submit"]:hover,
.delete-confirmation #content form input[type="submit"]:active {
	background-color: transparent;
	color: var(--red);
}
.delete-confirmation #content form .cancel-link {
	background-color: var(--black);
	border-color: var(--black);
}
.delete-confirmation #content form .cancel-link:hover,
.delete-confirmation #content form .cancel-link:active {
	background-color: transparent;
	color: var(--black);
	opacity: 1;
}

/* hidden sections*/
#content-main > div.app-authtoken.module,
#content-main > div.app-auth.module,
#nav-sidebar > div.app-authtoken.module,
#nav-sidebar > div.app-auth.module {
	display: none !important;
}

.select2-container--admin-autocomplete .select2-results__option--highlighted[aria-selected] {
	background-color: var(--black);
}

.paginator a:link, .paginator a:visited {
	background: var(--black);
}

.button,
input[type=submit],
input[type=button],
.submit-row input,
a.button {
	background: var(--orange);
	border-radius: 0;
	color: var(--white);
	font-family: var(--font);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	transition: opacity var(--transition);
}
.button:hover,
input[type=submit]:hover,
input[type=button]:hover {
	background: var(--orange);
	opacity: 0.7;
}
.button:active,
input[type=submit]:active,
input[type=button]:active,
.button:focus,
input[type=submit]:focus,
input[type=button]:focus {
	background-color: transparent !important;
	color: var(--black);
}

#user-tools a:focus, #user-tools a:hover {
	border: 0;
	color: #ddd;
}

.selector-chosen h2 {
	background: #f05a27 !important;
}

.calendar td.selected a {
	background: #f05a27 !important;
}

.calendar td a:focus, .timelist a:focus,
.calendar td a:hover, .timelist a:hover {
	background: #f05a27 !important;
}

#changelist-filter li.selected a {
	color: #444;
}

fieldset.collapsed .collapse-toggle {
	color: #444;
}


table thead th.sorted .sortoptions a.sortremove:focus:after,
table thead th.sorted .sortoptions a.sortremove:hover:after {
	color: #444;
}

a.active.selector-chooseall:focus, a.active.selector-clearall:focus,
a.active.selector-chooseall:hover, a.active.selector-clearall:hover {
	color: #999;
}

.calendar td a:active, .timelist a:active {
	background: #444;
}

.change-list ul.toplinks .date-back a:focus,
.change-list ul.toplinks .date-back a:hover {
	color: #222;
}

.paginator a.showall:focus, .paginator a.showall:hover {
	color: #222;
}

.paginator a:focus, .paginator a:hover {
	background: #222;
}

#changelist-filter a:focus, #changelist-filter a:hover,
#changelist-filter li.selected a:focus,
#changelist-filter li.selected a:hover {
	color: var(--black);
}

.calendar td a:active, .timelist a:active {
	background: #292D32;
	color: white;
}

.calendar caption, .calendarbox h2 {
	background: #999;
}

.button.default, input[type=submit].default, .submit-row input.default {
	background: #f05a27;
}

.button.default:hover, input[type=submit].default:hover {
	background: #191D22;
}

.button.default, input[type=submit].default, .submit-row input.default {
	background: var(--orange);
}

.object-tools a:focus, .object-tools a:hover {
	background-color: #292D32;
}

input[type=file]::-webkit-file-upload-button{
	border: 0;
	background: var(--grey-light);
	font-family: var(--font);
}

#changelist-filter {
	top: -250px;
	right: 15px;
}

#changelist-filter h2 {
	padding-top: 0px;
	padding-bottom: 0px
}
#content-main h3 a {
	color: var(--orange);
	text-decoration: underline;
}
#content-main h3 a:hover {
	text-decoration: none;
}

.module.aligned h2 {
	background-color: var(--green);
	font-weight: 600;
}
.module.aligned .selector-available h2 {
	background-color: var(--grey-lighter);
	border-radius: 0;
}
.module.aligned.collapse > h2 {
	color: var(--white);
}
.module.aligned.collapse > h2 .collapse-toggle {
	color: var(--white);
	font-weight: 700;
	text-decoration: underline;
}
.module.aligned.collapse > h2 .collapse-toggle:hover {
	text-decoration: none;
}
.module.collapse.collapsed .collapse-toggle {
	color: var(--orange);
	font-weight: 700;
	text-decoration: underline;
}
.module.collapse.collapsed .collapse-toggle:hover {
	text-decoration: none;
}
.module.collapse .add-row a {
	color: var(--orange);
	font-weight: 600;
	text-decoration: underline;
}
.module.collapse .add-row a:hover {
	text-decoration: none;
}