/* define the position and shape of various elements. colors are connected lower in this list */

body {
	position: relative;
	padding: 0;
	margin: 0;
	opacity: 0;
	font-size: 1rem;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, segoe ui, Roboto, Oxygen, Ubuntu, Cantarell, open sans, helvetica neue, sans-serif;
}

h1 {
	font-size: 2.5em;
}

h2 {
	font-size: 2.25em;
}

h3 {
	font-size: 2em;
}

h4 {
	font-size: 1.75em;
}

h5 {
	font-size: 1.5em;
}

iframe {
	background: rgba(180, 180, 180, .5);
}

.mobile-sort-wrapper{
	position: relative;
}

.mobile-sort-element {
	position:relative;
}

.mobile-sort-element .dragging {
	opacity: 0.75;
	outline: .25em solid var(--mobile-sort-dragging-background-color);
	background: var(--mobile-sort-dragging-background-color);
	cursor: grabbing;
}

.mobile-sort-element .placeholder {
	position: relative;
	outline: .25em dotted var(--mobile-a-highlight-foreground);
	background: var(--mobile-sort-dragging-background-color);;
	opacity: 75%;
	height: 2em;
	margin: 5px 0;
	animation: outline-pulse 0.25s ease-in-out infinite alternate;
}

@keyframes outline-pulse {
	0% {
		outline-offset: 0;
	}

	100% {
		outline-offset: .25em;
	}
}

.mobile-sort-handle {
	content: "";
	cursor: row-resize;
	width: 1.5em;
	height: 1.5em;
	position: absolute;
	top: 0;
	right: 0;
	background-image: var(--mobile-sort-handle-image);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.youtube-wrapper {
	position: relative;
	display: block;
	text-align: center;
}

.youtube-video {
	border: var(--mobile-grid-border);
	min-height: auto;
	max-height: 75vh;
	max-width: 95%;
	width: 100%;
	display: inline-block;
	aspect-ratio: 16 / 9;
	padding: 0;
	margin: 0;
}

.no-select,
.no-select * {
	user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

@media (max-aspect-ratio: 9 / 16) {
	.youtube-video {
		width: 100%;
		max-height: 75vh;
	}
}

.language-inline-edit-link {
	font-size: smaller;
	background: pink;
	color: black;
	outline: 1px solid black;
	padding: 1px 4px;
	cursor: pointer;
	white-space: nowrap;
}

.adsWrapper {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

[data-role=page] {
	font-size: inherit;
	display: grid;
	grid-template-rows: max-content auto max-content;
	height: 100dvh !important;
	overflow: auto;
}

[data-role=content] {
	position: relative;
	margin: 0;
	padding: 1em;
	overflow-x: auto;
	max-width: 100vw;
	font-size: inherit;
}

form {
	font-size: inherit;
	margin: 0;
	padding: 0;
}

img {
	max-width: 100%;
	max-height: 100%;
	height: auto;
}

fieldset {
	border: 1px solid;
	border-radius: 0.5em;
	margin: 0.5em 0px;
}

legend:not(:has(*)) {
	border: 1px solid;
	border-radius: 0.5em;
	padding: 0px 0.5em;
}

input {
	max-width: 99%;
}

select {
	max-width: 99%;
}

input[readonly] {
	opacity: .75 !important;
}

input[disabled],
textarea[disabled],
select[disabled] {
	outline: none !important;
	box-shadow: none !important;
	max-height: none !important;
	border-color: rgba(0, 0, 0, 0) !important;
	background: rgba(0, 0, 0, 0) !important;
}

input[type=button]:not([data-role=none]),
input[type=submit]:not([data-role=none]),
input[type=reset]:not([data-role=none]),
button:not([data-role=none]) {
	display: block;
	position: relative;
	font-size: inherit;
	padding: var(--mobile-button-padding);
	margin: var(--mobile-button-margin);
	border-radius: var(--mobile-border-radius);
	font-weight: bolder;
	text-decoration: none;
	text-align: center;
	text-overflow: hidden;
	overflow: hidden;
	white-space: nowrap;
	cursor: pointer;
	user-select: none;
	width: 100%;
	border: 0;
	box-sizing: border-box;
}

input[type=button][data-inline=true],
input[type=submit][data-inline=true],
input[type=reset][data-inline=true],
button[data-inline=true] {
	display: inline-block;
	margin: .2em .075em 0 .075em;
	width: initial;
	vertical-align: middle;
}

ul[data-theme] {
	display: block;
	position: relative;
	margin: .8em 0;
	padding: 0;
	list-style-type: none;
	width: 100%;
	border-radius: var(--mobile-border-radius);
	font-weight: bolder;
	box-sizing: border-box;
}

ul[data-theme]>li {
	margin: 0;
	padding: .5em 1em;
	display: block;
	overflow-wrap: break-word;
}

ul[data-theme]>li:last-child {
	border: none;
}

button.passkey {
	background-image: url("/icon/fingerprint.svg") !important;
	background-position: .5em center !important;
	background-size: 2em 2em !important;
	min-width: 4em !important;
	padding-left: 3em !important;
	background-repeat: no-repeat !important;
}

.grid-header th {
	padding-top: .25em;
	padding-bottom: .25em;
}

.grid-transparent td,
.grid-transparent th,
.grid-nohover td,
.grid-nohover th,
.grid td,
.grid th {
	padding-left: 10px;
	padding-right: 10px;
}

.grid-wrapper {
	position: relative;
	overflow: auto;
	display: inline-block;
	max-width: 100%;
	padding: 0;
	margin: 0;
	border: var(--mobile-grid-border);
	border-radius: var(--mobile-grid-border-radius);
	box-shadow: var(--mobile-grid-border-shadow);
}

.grid-wrapper:has(.grid-transparent) {
	border: none;
	border-radius: none;
	box-shadow: none;
}

select:not([data-role=none]) {
	display: block;
	margin: .8em 0;
	padding: var(--mobile-button-padding-narrow);
	border-radius: var(--mobile-border-radius);
	cursor: pointer;
	width: 100%;
	box-sizing: border-box;
}

select:not([data-role=none]),
select:not([data-role=none]) option {
	font-weight: bolder;
	text-align: left;
}

select:not([data-role=none])[data-inline=true] {
	display: inline-block;
	width: initial;
	vertical-align: middle;
	margin: 0;
}

select:not([multiple]):not([size]):not([data-role=none]) {
	padding: .65em 1.5em;
	margin: .8em 0;
}

select[multiple]:not([data-role=none]),
select[size]:not([data-role=none]) {
	border-top-right-radius: none;
	border-bottom-right-radius: none;
	vertical-align: bottom;
}

select:not([data-role=none]) option {
	padding-top: .5em;
	padding-bottom: .5em;
	padding-left: 1em;
	padding-right: 1em;
}

select:not([data-role=none]) option:first-child {
	padding-top: 1em;
}

.notice {
	display: block;
	position: relative;
	margin: .8em 0;
	padding: 1em;
	font-size: larger;
	border-radius: var(--mobile-border-radius);
}

.notice[data-line=true] {
	display: inline;
	position: relative;
	margin: 0;
	vertical-align: bottom;
}

.notice>p:first-child {
	margin-top: 0;
}

.highlight {
	padding-left: .5em;
	padding-right: .5em;
	font-weight: bolder;
}

.nowrap {
	white-space: nowrap;
}

.inline {
	display: inline-block;
}

.bright {
	font-weight: bolder;
}

.inline {
	display: inline-block !important;
	position: relative;
}

.fixed-font {
	font-family: monospace;
}

.strikeout {
	text-decoration: line-through;
	text-decoration-thickness: .08em;
	text-decoration-style: double;
}

.smaller {
	font-size: smaller;
}

.bold {
	font-weight: bolder;
}

.larger {
	font-size: larger;
}

.left {
	text-align: left !important;
}

.center {
	text-align: center !important;
}

.right {
	text-align: right !important;
}

.nowrap {
	white-space: nowrap;
}

.wrap {
	white-space: normal;
}

.jodit .code {
	padding: .5em !important;
	border: 1px solid black !important;
	background: black !important;
	border-radius: .25em !important;
	color: white !important;
}

code,
.code,
.markup-code {
	display: block !important;
	max-height: 25em !important;
	padding: 1em !important;
	margin: 0 !important;
	font-family: monospace !important;
	white-space: pre !important;
	overflow: auto !important;
}

.code-block-header {
	background-image: var(--mobile-code-copy-icon) !important;
	background-repeat: no-repeat !important;
	background-position: calc(100% - .25em) center !important;
	background-size: contain !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	position: relative !important;
	display: block !important;
	box-sizing: border-box !important;
	cursor: pointer !important;
	padding: .3em 3em .25em .5em !important;
	margin: 0 !important;
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}

.hide {
	visibility: hidden;
}

.mobile-icon-only {
	background-size: 2em !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
}

[data-inline].mobile-icon-only {
	width: 2em !important;
}

.mobile-icon-only>span {
	opacity: 0;
	width: 1px;
}

.mobile-icon-left {
	background-size: 2em !important;
	background-repeat: no-repeat !important;
	background-position: left 0.25em center !important;
}

[data-inline].mobile-icon-left {
	padding-left: 3em !important;
}

.mobile-icon-right {
	background-size: 2em !important;
	background-repeat: no-repeat !important;
	background-position: right 0.25em center !important;
}

[data-inline].mobile-icon-right {
	padding-right: 3em !important;
}

.justify-left {
	display: flex;
	justify-content: left;
}

.justify-center {
	display: flex;
	justify-content: center;
}

.justify-right {
	display: flex;
	justify-content: right;
}

.justify-top {
	display: flex;
	align-items: top;
}

.justify-middle {
	display: flex;
	align-items: center;
}

.justify-bottom {
	display: flex;
	align-items: bottom;
}

textarea:not([data-role=none]),
input:not([type=file]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=reset]):not([data-role=none]) {
	display: block;
	padding: calc(.65em + 0.5px) 1.5em;
	font-size: inherit;
	margin: .8em .2em;
	border-radius: var(--mobile-border-radius);
	white-space: nowrap;
	width: 100%;
	border: 0;
	box-sizing: border-box;
}

textarea:not([data-role=none]) {
	white-space: normal;
	min-height: 3em;
	font-size: inherit;
	overflow-y: auto;
}

input:not([type=file]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=reset]):not([data-role=none])[data-inline=true] {
	display: inline;
	margin: 0;
	margin-top: .1em;
	width: initial;
	vertical-align: middle;
}

div[data-theme] {
	padding: .5em;
	margin: .5em;
	border-radius: var(--mobile-border-radius);
}

.mobile-file-picker-icon {
	width: 1.5em;
	height: 1.5em;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	overflow: hidden;
	position: relative;
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
}

.mobile-file-picker-label {
	max-width: 100%;
	overflow: hidden;
	white-space: nowrap;
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
}

label {
	display: block;
	font-weight: bolder;
}

label[data-inline=true] {
	display: inline-block;
	margin-left: .25em;
	margin-right: 1em;
}

label[for] {
	cursor: pointer;
}

label.mobile-checkbox-label {
	padding-top: .25em;
	padding-bottom: .25em;
	padding-left: 2em;
	padding-right: .25em;
	position: relative;
	cursor: pointer;
	min-height: 1.75em;
}

label>input.mobile-checkbox {
	position: absolute;
	top: .1em;
	left: .25em;
	width: 1.6em;
	height: 1.6em;
}

div.mobile-label-grid,
div.mobile-tight-form-grid,
div.mobile-form-grid {
	display: grid;
	grid-template-columns: max-content auto;
	gap: 0 1em;
	margin: .5em 0;
}

div.mobile-label-grid .grid-header,
div.mobile-tight-form-grid .grid-header,
div.mobile-form-grid .grid-header {
	font-family: var(--mobile-grid-header-font-family) !important;
	font-style: var(--mobile-grid-header-font-style) !important;
	font-weight: var(--mobile-grid-header-font-weight) !important;
	border-bottom: var(--mobile-grid-header-border) !important;
}

div.mobile-form-grid>div {
	position: relative;
}

div.mobile-form-grid>div textarea {
	width: calc(100% - 1.25em) !important;
}

div.mobile-form-grid .mobile-switch-wrapper {
	margin: .75em 0 !important;
}

div.mobile-form-grid>div:nth-child(odd) {
	padding-top: 1.5em;
	font-weight: bolder;
}

div.mobile-form-grid>div:nth-child(even):has(.mobile-bool-wrapper) {
	height: 4.2em;
	display: flex;
	align-items: center;
}

div.mobile-form-grid>div:nth-child(even):not(:has(>[class^="mobile-"], >textarea, >button, >input:first-child, >select:first-child, >label:first-child)),
div.mobile-form-grid>div.pad {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
}
 
div.mobile-form-grid>div:nth-child(even):has(>label) {
	padding-top: 1.25em;
	padding-bottom: 1.25em;
}

div.mobile-label-grid>div {
	padding: .2em;
}

div.mobile-label-grid>div:nth-child(odd) {
	font-weight: bolder;
}

div.mobile-tight-form-grid.mobile-extra-bottom-pad,
div.mobile-form-grid.mobile-extra-bottom-pad {
	row-gap: .5em;
}

div[class^="mobile-grid-"],
div[class^="ui-grid-"] {
	display: grid;
	gap: 0 .5em;
	margin: .5em 0;
}

div.ui-grid-a,
div.mobile-grid-a {
	grid-template-columns: 1fr 1fr;
}

div.ui-grid-b,
div.mobile-grid-b {
	grid-template-columns: 1fr 1fr 1fr;
}

div.ui-grid-c,
div.mobile-grid-c {
	grid-template-columns: 1fr 1fr 1fr 1fr;
}

div.ui-grid-d,
div.mobile-grid-d {
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

div[class^=ui-grid-]>div,
div[class^=mobile-grid-]>div {
	margin-right: .4em
}

#modal-leaving-page-overlay {
	position: fixed;
	inset: 0;
	background: var(--nice-modal-leaving-page-background);
	backdrop-filter: blur(3px) grayscale(100%);
	z-index: 99999998 !important;
}

#modal-leaving-page-graphic {
	position: fixed;
	inset: 0;
	background-image: var(--nice-modal-leaving-graphic-image);
	background-repeat: no-repeat;
	background-position: center center;
	z-index: 99999999 !important;
}

.mobile-flex {
	display: flex;
	flex-direction: row;
}

.mobile-form-grid .mobile-range-grid
{
	margin: 1em 2em 1em 0;
}

.mobile-range {
	padding: 0 !important;
	margin: 0 !important;
}

.mobile-range-holder {
	display: block;
	position: relative;
	font-size: inherit;
	padding: var(--mobile-button-padding);
	margin: var(--mobile-button-margin);
	border-radius: var(--mobile-border-radius);
}

.mobile-range-holder[data-inline=true] {
	display: inline-block !important;
}

.mobile-range-range {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mobile-range-range input[type=range] {
	padding: 0;
	left: 0;
	right: 0;
}

.mobile-range-indicator {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bolder;
}

.mobile-password-wrapper {
	padding: 0;
	margin: var(--mobile-button-margin);
	position: relative;
	display: block;
	border-radius: var(--mobile-border-radius);
}

.mobile-password-wrapper:has([data-inline=true]) {
	display: inline-block;
	margin: .2em .075em 0 .075em;
}

.mobile-password-wrapper input {
	margin: 0 !important;
}

.mobile-password-clicker {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 2.5em;
	cursor: pointer;
	border-radius: var(--mobile-border-radius);
	background-image: url(/icon/show-password.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 2em 2em;
}

.mobile-switch-wrapper {
	position: relative;
	display: inline-block;
	white-space: initial !important;
	max-width: 100%;
}

.mobile-switch-left,
.mobile-switch-right {
	user-select: none;
	vertical-align: middle;
	position: relative;
	cursor: pointer;
	background-position: center left !important;
	background-repeat: no-repeat !important;
	background-size: 2em 2em !important;
	text-align: var(--mobile-switch-text-align);
	margin: var(--mobile-switch-margin);
	border: var(--mobile-switch-border);
	border-radius: var(--mobile-border-radius);
	font-weight: var(--mobile-switch-inactive-font-weight);
}

.mobile-switch-left>div,
.mobile-switch-right>div {
	overflow: hidden;
	text-overflow: clip;
	white-space: nowrap;
	max-width: 95%;
	width: var(--mobile-switch-width);
}




/* niceAlert styles */
.niceShadow {
	position: fixed;
	inset: 0;
	background: var(--nice-alert-background) !important;
	backdrop-filter: blur(3px) grayscale(100%);
}

.niceBox {
	position: fixed;
	top: 0;
	right: -100%;
	margin: var(--nice-alert-margin) !important;
	padding: var(--nice-alert-padding) !important;
	border-radius: var(--nice-alert-radius) !important;
	border: var(--nice-alert-outline) !important;
	box-shadow: var(--nice-alert-shadow) !important;
	min-width: 10em;
	max-width: min(90%, 35em);
	transition: right 0.5s ease;
}

.niceBoxShow {
	right: 0;
}

.niceContent {
	font-size: 1.075em;
	font-weight: bold;
	position: relative;
	min-height: 4em;
	max-height: calc(95vh - 6em);
	overflow-x: hidden;
	overflow-y: auto;
	margin: 0;
	padding: .25em;
}

.niceButton {
	margin-bottom: 0 !important;
}

.dialog-background {
	position: fixed !important;
	inset: 0 !important;
	background: var(--nice-alert-background) !important;
	backdrop-filter: blur(3px) grayscale(100%);
	z-index: 9999996;
}

.dialog-holder {
	background: var(--mobile-background);
	color: var(--mobile-foreground);
	border-radius: var(--nice-alert-radius) !important;
	border: var(--nice-alert-outline) !important;
	box-shadow: var(--nice-alert-shadow) !important;
	max-width: calc(100% - 1.5em);
	z-index: 9999997;
}

.dialog-title {
	font-size: larger;
	font-weight: bolder;
	padding: .35em;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--mobile-background);
	background: var(--mobile-foreground);
	text-shadow: none;
	padding-right: 2em;
}

.dialog-content {
	overflow: auto;
	padding: var(--nice-alert-dialog-padding) !important;
}

.dialog-close {
	position: absolute;
	cursor: pointer;
	top: .3em;
	right: .3em;
	width: 1.5em;
	height: 1.5em;
	background-image: var(--nice-alert-close-icon);
	background-size: contain;
	background-repeat: no-repeat !important;
	background-position: center center !important;
}


/* media specific changes */

@media screen {
	.nodisplay {
		display: none !important;
	}
}

@media print {
	.noprint {
		display: none !important;
	}

	a {
		text-decoration: underline !important;
	}
}

@media (max-width: 639px) {
	body {
		font-size: 11pt;
	}

	.mobile-flex {
		flex-direction: column;
	}

	.mobile-flex>div:not(:first-child) input {
		margin-top: 0 !important;
	}

	.mobile-icon-only-when-skinny {
		background-size: 2em !important;
		background-repeat: no-repeat !important;
		background-position: center center !important;
	}

	[data-inline].mobile-icon-only-when-skinny {
		width: 2em !important;
		padding: var(--mobile-button-padding) !important;
	}

	.mobile-icon-only-when-skinny>span {
		overflow: hidden !important;
		width: 1px !important;
		display: inline-block;
		opacity: 0;
	}

	.mobile-hide-when-skinny {
		display: none;
	}

	.mobile-switch-left,
	.mobile-switch-right,
	select:not([data-role=none]),
	input[type=button]:not([data-role=none]),
	input[type=submit]:not([data-role=none]),
	input[type=reset]:not([data-role=none]),
	button:not([data-role=none]) {
		padding: var(--mobile-button-padding-narrow);
		text-overflow: clip;
	}

	.mobile-keep-padding-when-skinny {
		padding: var(--mobile-button-padding) !important;
	}

	div.mobile-tight-form-grid:not(.mobile-skinny-no-split),
	div.mobile-form-grid:not(.mobile-skinny-no-split),
	div[class^="mobile-grid-"]:not(.mobile-skinny-no-split),
	div[class^="ui-grid-"]:not(.mobile-skinny-no-split) {
		display: block;
		gap: 0;
	}

	div.mobile-tight-form-grid>div:not(.mobile-skinny-no-split),
	div.mobile-form-grid>div:not(.mobile-skinny-no-split),
	div[class^="mobile-grid-"]>div:not(.mobile-skinny-no-split),
	div[class^="ui-grid-"]>div:not(.mobile-skinny-no-split) {
		width: 100% !important;
		float: none !important;
		display: block;
		padding: .25em 0;
	}

	div.mobile-tightform-grid:not(.mobile-skinny-no-split).mobile-extra-bottom-pad>div:nth-child(even),
	div.mobile-form-grid:not(.mobile-skinny-no-split).mobile-extra-bottom-pad>div:nth-child(even) {
		padding-bottom: 1em;
	}

	div.mobile-tight-form-grid:not(.mobile-skinny-no-split).mobile-extra-bottom-pad,
	div.mobile-form-grid:not(.mobile-skinny-no-split).mobile-extra-bottom-pad {
		row-gap: 0;
	}

	.niceBox {
		position: fixed;
		top: 0;
		left: 1em;
		right: 1em;
	}

	.niceContent {
		max-height: calc(95vh - 9em);
	}

	.dialog-content {
		overflow: auto;
		padding: .2em !important;
	}
}

@media (max-width: 764px) {

	div.mobile-tight-form-grid.mobile-break-grid-under-765,
	div.mobile-form-grid.mobile-break-grid-under-765,
	div[class^="mobile-grid-"].mobile-break-grid-under-765,
	div[class^="ui-grid-"].mobile-break-grid-under-765 {
		display: block;
		gap: 0;
	}

	div.mobile-tight-form-grid.mobile-break-grid-under-765>div,
	div.mobile-form-grid.mobile-break-grid-under-765>div,
	div[class^="mobile-grid-"].mobile-break-grid-under-765>div,
	div[class^="ui-grid-"].mobile-break-grid-under-765>div {
		width: 100% !important;
		float: none !important;
		display: block;
		margin: .25em 0;
	}

	div.mobile-tight-form-grid.mobile-break-grid-under-765.mobile-extra-bottom-pad>div:nth-child(even),
	div.mobile-form-grid.mobile-break-grid-under-765.mobile-extra-bottom-pad>div:nth-child(even) {
		padding-bottom: 1em;
	}

	div.mobile-tight-form-grid.mobile-break-grid-under-765.mobile-extra-bottom-pad,
	div.mobile-form-grid.mobile-break-grid-under-765.mobile-extra-bottom-pad {
		row-gap: 0;
	}
}












/* apply colors to the elements. The values colors must be defined in the theme css files */

body {
	background: var(--mobile-background);
	color: var(--mobile-foreground);
	text-shadow: var(--mobile-text-shadow);
}

input {
	accent-color: var(--mobile-accent-color);
}

input[type=button]:not([data-role=none]),
input[type=submit]:not([data-role=none]),
input[type=reset]:not([data-role=none]),
button:not([data-role=none]) {
	border: var(--mobile-a-button-outline);
	box-shadow: var(--mobile-a-button-shadow);
	text-shadow: var(--mobile-a-button-text-shadow);
	background: var(--mobile-a-button-background);
	color: var(--mobile-a-button-foreground);
}

input[type=button][data-theme=b],
input[type=submit][data-theme=b],
input[type=reset][data-theme=b],
button[data-theme=b] {
	border: var(--mobile-b-button-outline);
	box-shadow: var(--mobile-b-button-shadow);
	text-shadow: var(--mobile-b-button-text-shadow);
	background: var(--mobile-b-button-background);
	color: var(--mobile-b-button-foreground);
}

input[type=button][data-theme=c],
input[type=submit][data-theme=c],
input[type=reset][data-theme=c],
button[data-theme=c] {
	border: var(--mobile-c-button-outline);
	box-shadow: var(--mobile-c-button-shadow);
	text-shadow: var(--mobile-c-button-text-shadow);
	background: var(--mobile-c-button-background);
	color: var(--mobile-c-button-foreground);
}

input[type=button][data-theme=d],
input[type=submit][data-theme=d],
input[type=reset][data-theme=d],
button[data-theme=d] {
	border: var(--mobile-d-button-outline);
	box-shadow: var(--mobile-d-button-shadow);
	text-shadow: var(--mobile-d-button-text-shadow);
	background: var(--mobile-d-button-background);
	color: var(--mobile-d-button-foreground);
}

input[type=button][data-theme=e],
input[type=submit][data-theme=e],
input[type=reset][data-theme=e],
button[data-theme=e] {
	border: var(--mobile-e-button-outline);
	box-shadow: var(--mobile-e-button-shadow);
	text-shadow: var(--mobile-e-button-text-shadow);
	background: var(--mobile-e-button-background);
	color: var(--mobile-e-button-foreground);
}

input[type=button][data-theme=f],
input[type=submit][data-theme=f],
input[type=reset][data-theme=f],
button[data-theme=f] {
	border: var(--mobile-f-button-outline);
	box-shadow: var(--mobile-f-button-shadow);
	text-shadow: var(--mobile-f-button-text-shadow);
	background: var(--mobile-f-button-background);
	color: var(--mobile-f-button-foreground);
}

[data-theme=a] .mobile-button-darker {
	box-shadow: var(--mobile-a-button-shadow), var(--mobile-button-darker)
}

[data-theme=b] .mobile-button-darker {
	box-shadow: var(--mobile-b-button-shadow), var(--mobile-button-darker)
}

[data-theme=c] .mobile-button-darker {
	box-shadow: var(--mobile-c-button-shadow), var(--mobile-button-darker)
}

[data-theme=d] .mobile-button-darker {
	box-shadow: var(--mobile-d-button-shadow), var(--mobile-button-darker)
}

[data-theme=e] .mobile-button-darker {
	box-shadow: var(--mobile-e-button-shadow), var(--mobile-button-darker)
}

[data-theme=f] .mobile-button-darker {
	box-shadow: var(--mobile-f-button-shadow), var(--mobile-button-darker)
}

[data-theme=a] .mobile-button-lighter {
	box-shadow: var(--mobile-a-button-shadow), var(--mobile-button-lighter)
}

[data-theme=b] .mobile-button-lighter {
	box-shadow: var(--mobile-b-button-shadow), var(--mobile-button-lighter)
}

[data-theme=c] .mobile-button-lighter {
	box-shadow: var(--mobile-c-button-shadow), var(--mobile-button-lighter)
}

[data-theme=d] .mobile-button-lighter {
	box-shadow: var(--mobile-d-button-shadow), var(--mobile-button-lighter)
}

[data-theme=e] .mobile-button-lighter {
	box-shadow: var(--mobile-e-button-shadow), var(--mobile-button-lighter)
}

[data-theme=f] .mobile-button-lighter {
	box-shadow: var(--mobile-f-button-shadow), var(--mobile-button-lighter)
}

input[type=button]:hover,
input[type=submit]:hover,
input[type=reset]:hover,
button:hover,
input[type=button]:active,
input[type=submit]:active,
input[type=reset]:active,
button:active,
input[type=button]:focus,
input[type=submit]:focus,
input[type=reset]:focus,
button:focus {
	border: var(--mobile-a-button-outline-active);
	box-shadow: var(--mobile-a-button-shadow-active);
	background: var(--mobile-a-button-background-active);
	color: var(--mobile-a-button-foreground-active);
}

input[type=button][data-theme=b]:hover,
input[type=submit][data-theme=b]:hover,
input[type=reset][data-theme=b]:hover,
button:hover[data-theme=b],
input[type=button][data-theme=b]:active,
input[type=submit][data-theme=b]:active,
input[type=reset][data-theme=b]:active,
button:active[data-theme=b],
input[type=button][data-theme=b]:focus,
input[type=submit][data-theme=b]:focus,
input[type=reset][data-theme=b]:focus,
button:focus[data-theme=b] {
	border: var(--mobile-b-button-outline-active);
	box-shadow: var(--mobile-b-button-shadow-active);
	background: var(--mobile-b-button-background-active);
	color: var(--mobile-b-button-foreground-active);
}

input[type=button][data-theme=c]:hover,
input[type=submit][data-theme=c]:hover,
input[type=reset][data-theme=c]:hover,
button:hover[data-theme=c],
input[type=button][data-theme=c]:active,
input[type=submit][data-theme=c]:active,
input[type=reset][data-theme=c]:active,
button:active[data-theme=c],
input[type=button][data-theme=c]:focus,
input[type=submit][data-theme=c]:focus,
input[type=reset][data-theme=c]:focus,
button:focus[data-theme=c] {
	border: var(--mobile-c-button-outline-active);
	box-shadow: var(--mobile-c-button-shadow-active);
	background: var(--mobile-c-button-background-active);
	color: var(--mobile-c-button-foreground-active);
}

input[type=button][data-theme=d]:hover,
input[type=submit][data-theme=d]:hover,
input[type=reset][data-theme=d]:hover,
button:hover[data-theme=d],
input[type=button][data-theme=d]:active,
input[type=submit][data-theme=d]:active,
input[type=reset][data-theme=d]:active,
button:active[data-theme=d],
input[type=button][data-theme=d]:focus,
input[type=submit][data-theme=d]:focus,
input[type=reset][data-theme=d]:focus,
button:focus[data-theme=d] {
	border: var(--mobile-d-button-outline-active);
	box-shadow: var(--mobile-d-button-shadow-active);
	background: var(--mobile-d-button-background-active);
	color: var(--mobile-d-button-foreground-active);
}

input[type=button][data-theme=e]:hover,
input[type=submit][data-theme=e]:hover,
input[type=reset][data-theme=e]:hover,
button:hover[data-theme=e],
input[type=button][data-theme=e]:active,
input[type=submit][data-theme=e]:active,
input[type=reset][data-theme=e]:active,
button:active[data-theme=e],
input[type=button][data-theme=e]:focus,
input[type=submit][data-theme=e]:focus,
input[type=reset][data-theme=e]:focus,
button:focus[data-theme=e] {
	border: var(--mobile-e-button-outline-active);
	box-shadow: var(--mobile-e-button-shadow-active);
	background: var(--mobile-e-button-background-active);
	color: var(--mobile-e-button-foreground-active);
}

input[type=button][data-theme=f]:hover,
input[type=submit][data-theme=f]:hover,
input[type=reset][data-theme=f]:hover,
button:hover[data-theme=f],
input[type=button][data-theme=f]:active,
input[type=submit][data-theme=f]:active,
input[type=reset][data-theme=f]:active,
button:active[data-theme=f],
input[type=button][data-theme=f]:focus,
input[type=submit][data-theme=f]:focus,
input[type=reset][data-theme=f]:focus,
button:focus[data-theme=f] {
	border: var(--mobile-f-button-outline-active);
	box-shadow: var(--mobile-f-button-shadow-active);
	background: var(--mobile-f-button-background-active);
	color: var(--mobile-f-button-foreground-active);
}

a:not([data-role=button]) {
	color: var(--mobile-link-foreground);
	background-color: var(--mobile-link-background);
	text-shadow: var(--mobile-link-text-shadow);
	text-decoration: var(--mobile-link-decoration);
}

a:not([data-role=button]):hover,
a:not([data-role=button]):active {
	color: var(--mobile-link-active-foreground);
	background-color: var(--mobile-link-active-background);
	text-shadow: var(--mobile-link-active-text-shadow);
}

[data-theme=a] a:not([data-role=button]) {
	color: var(--mobile-a-link-foreground);
	background-color: var(--mobile-a-link-background);
	text-shadow: var(--mobile-a-link-text-shadow);
}

[data-theme=a] a:not([data-role=button]):hover,
[data-theme=a] a:not([data-role=button]):active {
	color: var(--mobile-a-link-active-foreground);
	background-color: var(--mobile-a-link-active-background);
	text-shadow: var(--mobile-a-link-active-text-shadow);
}

[data-theme=b] a:not([data-role=button]) {
	color: var(--mobile-b-link-foreground);
	background-color: var(--mobile-b-link-background);
	text-shadow: var(--mobile-b-link-text-shadow);
}

[data-theme=b] a:not([data-role=button]):hover,
[data-theme=b] a:not([data-role=button]):active {
	color: var(--mobile-b-link-active-foreground);
	background-color: var(--mobile-b-link-active-background);
	text-shadow: var(--mobile-b-link-active-text-shadow);
}

[data-theme=c] a:not([data-role=button]) {
	color: var(--mobile-c-link-foreground);
	background-color: var(--mobile-c-link-background);
	text-shadow: var(--mobile-c-link-text-shadow);
}

[data-theme=c] a:not([data-role=button]):hover,
[data-theme=c] a:not([data-role=button]):active {
	color: var(--mobile-c-link-active-foreground);
	background-color: var(--mobile-c-link-active-background);
	text-shadow: var(--mobile-c-link-active-text-shadow);
}

[data-theme=d] a:not([data-role=button]) {
	color: var(--mobile-d-link-foreground);
	background-color: var(--mobile-d-link-background);
	text-shadow: var(--mobile-d-link-text-shadow);
}

[data-theme=d] a:not([data-role=button]):hover,
[data-theme=d] a:not([data-role=button]):active {
	color: var(--mobile-d-link-active-foreground);
	background-color: var(--mobile-d-link-active-background);
	text-shadow: var(--mobile-d-link-active-text-shadow);
}

[data-theme=e] a:not([data-role=button]) {
	color: var(--mobile-e-link-foreground);
	background-color: var(--mobile-e-link-background);
	text-shadow: var(--mobile-e-link-text-shadow);
}

[data-theme=e] a:not([data-role=button]):hover,
[data-theme=e] a:not([data-role=button]):active {
	color: var(--mobile-e-link-active-foreground);
	background-color: var(--mobile-e-link-active-background);
	text-shadow: var(--mobile-e-link-active-text-shadow);
}

[data-theme=f] a:not([data-role=button]) {
	color: var(--mobile-f-link-foreground);
	background-color: var(--mobile-f-link-background);
	text-shadow: var(--mobile-f-link-text-shadow);
}

[data-theme=f] a:not([data-role=button]):hover,
[data-theme=f] a:not([data-role=button]):active {
	color: var(--mobile-f-link-active-foreground);
	background-color: var(--mobile-f-link-active-background);
	text-shadow: var(--mobile-f-link-active-text-shadow);
}

a[data-role=button] {
	background: none;
	color: currentColor;
	text-decoration: none;
}

ul[data-theme] {
	border: var(--mobile-a-button-outline);
	background: var(--mobile-a-button-background);
	color: var(--mobile-a-button-foreground);
	text-shadow: var(--mobile-a-button-text-shadow);
}

ul[data-theme]>li {
	border-bottom: var(--mobile-a-button-outline);
}

a[target=_blank]:not([class]):not([style]) {
	display: inline-block;
	padding-right: .90em !important;
	background-color: rgba(0, 0, 0, 0) !important;
	background-image: var(--mobile-blank-link-image) !important;
	background-position: right top !important;
	background-repeat: no-repeat !important;
	background-size: .75em .75em !important;
}

ul[data-theme] li a {
	color: currentColor !important;
	text-decoration: var(--mobile-list-link-decoration) !important;
	text-shadow: var(--mobile-a-button-text-shadow) !important;
	display: inline-block;
	padding-right: 1.5em !important;
	background-color: rgba(0, 0, 0, 0) !important;
	background-image: var(--mobile-list-link-image) !important;
	background-position: right top !important;
	background-repeat: no-repeat !important;
	background-size: 1em 1em !important;
}

ul[data-theme] li:hover:has(a),
ul[data-theme] li:has(a:active),
ul[data-theme] li:has(a:focus) {
	box-shadow: var(--mobile-button-lighter) !important
}

ul[data-theme=b] {
	border: var(--mobile-b-button-outline);
	background: var(--mobile-b-button-background);
	color: var(--mobile-b-button-foreground);
	text-shadow: var(--mobile-b-button-text-shadow);
}

ul[data-theme=b]>li {
	border-bottom: var(--mobile-b-button-outline);
}

ul[data-theme=b] li a {
	text-shadow: var(--mobile-b-button-text-shadow) !important;
}

ul[data-theme=c] {
	background: var(--mobile-c-button-background);
	color: var(--mobile-c-button-foreground);
	text-shadow: var(--mobile-c-button-text-shadow);
}

ul[data-theme=c]>li {
	border-bottom: var(--mobile-c-button-outline);
}

ul[data-theme=c] li a {
	text-shadow: var(--mobile-c-button-text-shadow) !important;
}

ul[data-theme=d],
ul.error_list {
	background: var(--mobile-d-button-background);
	color: var(--mobile-d-button-foreground);
	text-shadow: var(--mobile-d-button-text-shadow);
}

ul[data-theme=d]>li {
	border-bottom: var(--mobile-d-button-outline);
}

ul[data-theme=d] li a {
	text-shadow: var(--mobile-d-button-text-shadow) !important;
}

ul[data-theme=e],
ul.success_list {
	background: var(--mobile-e-button-background);
	color: var(--mobile-e-button-foreground);
	text-shadow: var(--mobile-e-button-text-shadow);
}

ul[data-theme=e]>li {
	border-bottom: var(--mobile-e-button-outline);
}

ul[data-theme=e] li a {
	text-shadow: var(--mobile-e-button-text-shadow) !important;
}

ul[data-theme=f],
ul.warning_list {
	background: var(--mobile-f-button-background);
	color: var(--mobile-f-button-foreground);
	text-shadow: var(--mobile-f-button-text-shadow);
}

ul[data-theme=f] li {
	border-bottom: var(--mobile-f-button-outline);
}

ul[data-theme=f] li a {
	text-shadow: var(--mobile-f-button-text-shadow) !important;
}

.warning {
	background: var(--mobile-f-button-background);
	color: var(--mobile-f-button-foreground);
	text-shadow: var(--mobile-f-button-text-shadow);
	border: var(--mobile-grid-border);
	border-radius: var(--mobile-border-radius);
	padding: 1em 1em 1em 4em;
	font-size: 1.2em;
	min-height: 1.5em;
	background-image: url('/icon/alert.svg');
	background-repeat: no-repeat;
	background-position: .5em .5em;
	background-size: 2.5em;
}

form {
	position: relative;
}

table {
	font-size: inherit;
	background: inherit;
	color: inherit;
}

th,
td {
	position: relative;
}

table.grid,
table.grid-nohover {
	border-spacing: 0;
	text-shadow: none !important;
}

table.grid a,
table.grid-nohover a {
	text-shadow: none !important;
}

table.grid td,
table.grid-nohover td {
	padding-left: .5em;
	padding-right: .5em;
	padding-top: .2em;
	padding-bottom: .2em;
}

.inline-block {
	display: inline-block;
	vertical-align: bottom;
	margin: .25em .25em 0 .25em;
}

.top {
	vertical-align: top;
}

.grid-nohover thead,
.grid-nohover tfoot,
.grid thead,
.grid tfoot,
.grid-separator td {
	background: var(--mobile-grid-separator-background);
	color: var(--mobile-grid-separator-foreground);
	font-weight: bold;
	text-align: left;
}

.grid-nohover tbody tr,
.grid tbody tr {
	background: var(--mobile-grid-even-background);
	color: var(--mobile-grid-even-foreground);
	text-shadow: var(--mobile-grid-even-text-shadow);
}

.grid-nohover tbody tr:nth-child(odd),
.grid tbody tr:nth-child(odd) {
	background: var(--mobile-grid-odd-background);
	color: var(--mobile-grid-odd-foreground);
	text-shadow: var(--mobile-grid-odd-text-shadow);
}

.grid tbody tr a {
	background: var(--mobile-grid-even-link-background) !important;
	color: var(--mobile-grid-even-link-foreground) !important;
}

.grid tbody tr:nth-child(odd) a {
	background: var(--mobile-grid-odd-link-background) !important;
	color: var(--mobile-grid-odd-link-foreground) !important;
}

table.hover {
	border-collapse: collapse;
}

table.hover td {
	padding: .25em 1em;
}

.hover tbody tr:not(.grid-separator):hover,
.grid tbody tr:not(.grid-separator):hover {
	background: var(--mobile-grid-hover-background);
	color: var(--mobile-grid-hover-foreground);
}

.hover tbody tr:not(.grid-separator):hover a,
.hover tbody tr:not(.grid-separator):hover a:visited,
.grid tbody tr:not(.grid-separator):hover a,
.grid tbody tr:not(.grid-separator):hover a:visited {
	background: var(--mobile-grid-hover-link-background) !important;
	color: var(--mobile-grid-hover-link-foreground) !important;
}

.grid-nohover tbody tr a,
.grid-nohover tbody tr a:visited,
.grid tbody tr a,
.grid tbody tr a:visited {
	background: var(--mobile-grid-even-link-background);
	color: var(--mobile-grid-even-link-foreground);
}

.grid-nohover tbody tr a:hover,
.grid-nohover tbody tr a:active,
.grid tbody tr a:hover,
.grid tbody tr a:active {
	background: var(--mobile-grid-even-link-active-background);
	color: var(--mobile-grid-even-link-active-foreground);
}

.grid-nohover tbody tr:nth-child(odd) a,
.grid-nohover tbody tr:nth-child(odd) a:visited,
.grid tbody tr:nth-child(odd) a,
.grid tbody tr:nth-child(odd) a:visited {
	background: var(--mobile-grid-odd-link-background);
	color: var(--mobile-grid-odd-link-foreground);
}

.grid-nohover tbody tr:nth-child(odd) a:hover,
.grid-nohover tbody tr:nth-child(odd) a:active,
.grid tbody tr:nth-child(odd) a:hover,
.grid tbody tr:nth-child(odd) a:active {
	background: var(--mobile-grid-odd-link-active-background);
	color: var(--mobile-grid-odd-link-active-foreground);
}

.grid-nohover tbody .grid-separator a,
.grid-nohover tbody .grid-separator a:visited,
.grid tbody .grid-separator a,
.grid tbody .grid-separator a:visited {
	background: var(--mobile-grid-separator-link-background);
	color: var(--mobile-grid-separator-link-foreground);
}

.grid-nohover tbody .grid-separator a:hover,
.grid-nohover tbody .grid-separator a:active,
.grid tbody .grid-separator a:hover,
.grid tbody .grid-separator a:active {
	background: var(--mobile-grid-separator-link-active-background);
	color: var(--mobile-grid-separator-link-active-foreground);
}

select:not([data-role=none]) {
	font-size: inherit;
	border: var(--mobile-a-button-outline);
	box-shadow: var(--mobile-a-button-shadow);
	text-shadow: var(--mobile-a-button-text-shadow);
	background: var(--mobile-a-button-background);
	color: var(--mobile-a-button-foreground);
}

select:not([data-role=none]):active,
select:not([data-role=none]):focus {
	border: var(--mobile-a-button-outline-active);
	box-shadow: var(--mobile-a-button-shadow-active);
	background: var(--mobile-a-button-background-active);
	color: var(--mobile-a-button-foreground-active);
}

select:not([data-role=none]) option:checked {
	background: var(--mobile-a-button-foreground);
	color: var(--mobile-a-button-background);
}

select:not([data-role=none]):active option:checked,
select:not([data-role=none]):focus option:checked {
	background: var(--mobile-a-button-foreground);
	color: var(--mobile-a-button-background);
}

select[data-theme=b]:not([data-role=none]) {
	border: var(--mobile-b-button-outline);
	box-shadow: var(--mobile-b-button-shadow);
	text-shadow: var(--mobile-b-button-text-shadow);
	background: var(--mobile-b-button-background);
	color: var(--mobile-b-button-foreground);
}

select[data-theme=b]:not([data-role=none]):active,
select[data-theme=b]:not([data-role=none]):focus {
	border: var(--mobile-b-button-outline-active);
	box-shadow: var(--mobile-b-button-shadow-active);
	background: var(--mobile-b-button-background-active);
	color: var(--mobile-b-button-foreground-active);
}

select[data-theme=b]:not([data-role=none]) option:checked {
	background: var(--mobile-b-button-foreground);
	color: var(--mobile-b-button-background);
}

select[data-theme=b]:not([data-role=none]):active option:checked,
select[data-theme=b]:not([data-role=none]):focus option:checked {
	background: var(--mobile-b-button-foreground);
	color: var(--mobile-b-button-background);
}

select[data-theme=c]:not([data-role=none]) {
	border: var(--mobile-c-button-outline);
	box-shadow: var(--mobile-c-button-shadow);
	text-shadow: var(--mobile-c-button-text-shadow);
	background: var(--mobile-c-button-background);
	color: var(--mobile-c-button-foreground);
}

select[data-theme=c]:not([data-role=none]):active,
select[data-theme=c]:not([data-role=none]):focus {
	border: var(--mobile-c-button-outline-active);
	box-shadow: var(--mobile-c-button-shadow-active);
	background: var(--mobile-c-button-background-active);
	color: var(--mobile-c-button-foreground-active);
}

select[data-theme=c]:not([data-role=none]) option:checked {
	background: var(--mobile-c-button-foreground);
	color: var(--mobile-c-button-background);
}

select[data-theme=c]:not([data-role=none]):active option:checked,
select[data-theme=c]:not([data-role=none]):focus option:checked {
	background: var(--mobile-c-button-foreground);
	color: var(--mobile-c-button-background);
}

select[data-theme=d]:not([data-role=none]) {
	border: var(--mobile-d-button-outline);
	box-shadow: var(--mobile-d-button-shadow);
	text-shadow: var(--mobile-d-button-text-shadow);
	background: var(--mobile-d-button-background);
	color: var(--mobile-d-button-foreground);
}

select[data-theme=d]:not([data-role=none]):active,
select[data-theme=d]:not([data-role=none]):focus {
	border: var(--mobile-d-button-outline-active);
	box-shadow: var(--mobile-d-button-shadow-active);
	background: var(--mobile-d-button-background-active);
	color: var(--mobile-d-button-foreground-active);
}

select[data-theme=d]:not([data-role=none]) option:checked {
	background: var(--mobile-d-button-foreground);
	color: var(--mobile-d-button-background);
}

select[data-theme=d]:not([data-role=none]):active option:checked,
select[data-theme=d]:not([data-role=none]):focus option:checked {
	background: var(--mobile-d-button-foreground);
	color: var(--mobile-d-button-background);
}

select[data-theme=e]:not([data-role=none]) {
	border: var(--mobile-e-button-outline);
	box-shadow: var(--mobile-e-button-shadow);
	text-shadow: var(--mobile-e-button-text-shadow);
	background: var(--mobile-e-button-background);
	color: var(--mobile-e-button-foreground);
}

select[data-theme=e]:not([data-role=none]):active,
select[data-theme=e]:not([data-role=none]):focus {
	border: var(--mobile-e-button-outline-active);
	box-shadow: var(--mobile-e-button-shadow-active);
	background: var(--mobile-e-button-background-active);
	color: var(--mobile-e-button-foreground-active);
}

select[data-theme=e]:not([data-role=none]) option:checked {
	background: var(--mobile-e-button-foreground);
	color: var(--mobile-e-button-background);
}

select[data-theme=e]:not([data-role=none]):active option:checked,
select[data-theme=e]:not([data-role=none]):focus option:checked {
	background: var(--mobile-e-button-foreground);
	color: var(--mobile-e-button-background);
}

select[data-theme=f]:not([data-role=none]) {
	border: var(--mobile-f-button-outline);
	box-shadow: var(--mobile-f-button-shadow);
	text-shadow: var(--mobile-f-button-text-shadow);
	background: var(--mobile-f-button-background);
	color: var(--mobile-f-button-foreground);
}

select[data-theme=f]:not([data-role=none]):active,
select[data-theme=f]:not([data-role=none]):focus {
	border: var(--mobile-f-button-outline-active);
	box-shadow: var(--mobile-f-button-shadow-active);
	background: var(--mobile-f-button-background-active);
	color: var(--mobile-f-button-foreground-active);
}

select[data-theme=f]:not([data-role=none]) option:checked {
	background: var(--mobile-f-button-foreground);
	color: var(--mobile-f-button-background);
}

select[data-theme=f]:not([data-role=none]):active option:checked,
select[data-theme=f]:not([data-role=none]):focus option:checked {
	background: var(--mobile-f-button-foreground);
	color: var(--mobile-f-button-background);
}

.notice {
	border: var(--mobile-notice-outline);
	box-shadow: var(--mobile-notice-shadow);
	text-shadow: var(--mobile-notice-text-shadow);
	background: var(--mobile-notice-background);
	color: var(--mobile-notice-foreground);
}

.highlight {
	border: var(--mobile-a-highlight-outline);
	box-shadow: var(--mobile-a-highlight-shadow);
	text-shadow: var(--mobile-a-highlight-text-shadow);
	background: var(--mobile-a-highlight-background);
	color: var(--mobile-a-highlight-foreground);
}

[data-theme=b] .highlight {
	border: var(--mobile-b-highlight-outline);
	box-shadow: var(--mobile-b-highlight-shadow);
	text-shadow: var(--mobile-b-highlight-text-shadow);
	background: var(--mobile-b-highlight-background);
	color: var(--mobile-b-highlight-foreground);
}

[data-theme=c] .highlight {
	border: var(--mobile-c-highlight-outline);
	box-shadow: var(--mobile-c-highlight-shadow);
	text-shadow: var(--mobile-c-highlight-text-shadow);
	background: var(--mobile-c-highlight-background);
	color: var(--mobile-c-highlight-foreground);
}

[data-theme=d] .highlight {
	border: var(--mobile-d-highlight-outline);
	box-shadow: var(--mobile-d-highlight-shadow);
	text-shadow: var(--mobile-d-highlight-text-shadow);
	background: var(--mobile-d-highlight-background);
	color: var(--mobile-d-highlight-foreground);
}

[data-theme=e] .highlight {
	border: var(--mobile-e-highlight-outline);
	box-shadow: var(--mobile-e-highlight-shadow);
	text-shadow: var(--mobile-e-highlight-text-shadow);
	background: var(--mobile-e-highlight-background);
	color: var(--mobile-e-highlight-foreground);
}

[data-theme=f] .highlight {
	border: var(--mobile-f-highlight-outline);
	box-shadow: var(--mobile-f-highlight-shadow);
	text-shadow: var(--mobile-f-highlight-text-shadow);
	background: var(--mobile-f-highlight-background);
	color: var(--mobile-f-highlight-foreground);
}

.bright {
	border: var(--mobile-a-bright-outline);
	box-shadow: var(--mobile-a-bright-shadow);
	text-shadow: var(--mobile-a-bright-text-shadow);
	background: var(--mobile-a-bright-background);
	color: var(--mobile-a-bright-foreground);
}

[data-theme=b] .bright {
	border: var(--mobile-b-bright-outline);
	box-shadow: var(--mobile-b-bright-shadow);
	text-shadow: var(--mobile-b-bright-text-shadow);
	background: var(--mobile-b-bright-background);
	color: var(--mobile-b-bright-foreground);
}

[data-theme=c] .bright {
	border: var(--mobile-c-bright-outline);
	box-shadow: var(--mobile-c-bright-shadow);
	text-shadow: var(--mobile-c-bright-text-shadow);
	background: var(--mobile-c-bright-background);
	color: var(--mobile-c-bright-foreground);
}

[data-theme=d] .bright {
	border: var(--mobile-d-bright-outline);
	box-shadow: var(--mobile-d-bright-shadow);
	text-shadow: var(--mobile-d-bright-text-shadow);
	background: var(--mobile-d-bright-background);
	color: var(--mobile-d-bright-foreground);
}

[data-theme=e] .bright {
	border: var(--mobile-e-bright-outline);
	box-shadow: var(--mobile-e-bright-shadow);
	text-shadow: var(--mobile-e-bright-text-shadow);
	background: var(--mobile-e-bright-background);
	color: var(--mobile-e-bright-foreground);
}

[data-theme=f] .bright {
	border: var(--mobile-f-bright-outline);
	box-shadow: var(--mobile-f-bright-shadow);
	text-shadow: var(--mobile-f-bright-text-shadow);
	background: var(--mobile-f-bright-background);
	color: var(--mobile-f-bright-foreground);
}

.dim {
	background: var(--mobile-dim-background);
	color: var(--mobile-dim-foreground);
}

[data-theme=a] .dim {
	border: var(--mobile-a-dim-outline);
	box-shadow: var(--mobile-a-dim-shadow);
	text-shadow: var(--mobile-a-dim-text-shadow);
	background: var(--mobile-a-dim-background);
	color: var(--mobile-a-dim-foreground);
}

[data-theme=b] .dim {
	border: var(--mobile-b-dim-outline);
	box-shadow: var(--mobile-b-dim-shadow);
	text-shadow: var(--mobile-b-dim-text-shadow);
	background: var(--mobile-b-dim-background);
	color: var(--mobile-b-dim-foreground);
}

[data-theme=c] .dim {
	border: var(--mobile-c-dim-outline);
	box-shadow: var(--mobile-c-dim-shadow);
	text-shadow: var(--mobile-c-dim-text-shadow);
	background: var(--mobile-c-dim-background);
	color: var(--mobile-c-dim-foreground);
}

[data-theme=d] .dim {
	border: var(--mobile-d-dim-outline);
	box-shadow: var(--mobile-d-dim-shadow);
	text-shadow: var(--mobile-d-dim-text-shadow);
	background: var(--mobile-d-dim-background);
	color: var(--mobile-d-dim-foreground);
}

[data-theme=e] .dim {
	border: var(--mobile-e-dim-outline);
	box-shadow: var(--mobile-e-dim-shadow);
	text-shadow: var(--mobile-e-dim-text-shadow);
	background: var(--mobile-e-dim-background);
	color: var(--mobile-e-dim-foreground);
}

[data-theme=f] .dim {
	border: var(--mobile-f-dim-outline);
	box-shadow: var(--mobile-f-dim-shadow);
	text-shadow: var(--mobile-f-dim-text-shadow);
	background: var(--mobile-f-dim-background);
	color: var(--mobile-f-dim-foreground);
}

.strikeout {
	text-decoration-color: var(--mobile-a-strike-color);
}

[data-theme=b] .strikeout {
	text-decoration-color: var(--mobile-b-strike-color);
}

[data-theme=c] .strikeout {
	text-decoration-color: var(--mobile-c-strike-color);
}

[data-theme=d] .strikeout {
	text-decoration-color: var(--mobile-d-strike-color);
}

[data-theme=e] .strikeout {
	text-decoration-color: var(--mobile-e-strike-color);
}

[data-theme=f] .strikeout {
	text-decoration-color: var(--mobile-f-strike-color);
}

textarea:not([data-role=none]),
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([data-role=none]):not([type=button]):not([type=submit]):not([type=reset]) {
	border: var(--mobile-a-button-outline);
	box-shadow: var(--mobile-a-button-shadow);
	text-shadow: var(--mobile-a-button-text-shadow);
	background: var(--mobile-a-button-background);
	color: var(--mobile-a-button-foreground);
}

textarea:not([data-role=none])[data-theme=b],
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([data-role=none]):not([type=button]):not([type=submit]):not([type=reset])[data-theme=b] {
	border: var(--mobile-b-button-outline);
	box-shadow: var(--mobile-b-button-shadow);
	text-shadow: var(--mobile-b-button-text-shadow);
	background: var(--mobile-b-button-background);
	color: var(--mobile-b-button-foreground);
}

textarea:not([data-role=none])[data-theme=c],
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([data-role=none]):not([type=button]):not([type=submit]):not([type=reset])[data-theme=c] {
	border: var(--mobile-c-button-outline);
	box-shadow: var(--mobile-c-button-shadow);
	text-shadow: var(--mobile-c-button-text-shadow);
	background: var(--mobile-c-button-background);
	color: var(--mobile-c-button-foreground);
}

textarea:not([data-role=none])[data-theme=d],
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([data-role=none]):not([type=button]):not([type=submit]):not([type=reset])[data-theme=d] {
	border: var(--mobile-d-button-outline);
	box-shadow: var(--mobile-d-button-shadow);
	text-shadow: var(--mobile-d-button-text-shadow);
	background: var(--mobile-d-button-background);
	color: var(--mobile-d-button-foreground);
}

textarea:not([data-role=none])[data-theme=e],
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([data-role=none]):not([type=button]):not([type=submit]):not([type=reset])[data-theme=e] {
	border: var(--mobile-e-button-outline);
	box-shadow: var(--mobile-e-button-shadow);
	text-shadow: var(--mobile-e-button-text-shadow);
	background: var(--mobile-e-button-background);
	color: var(--mobile-e-button-foreground);
}

textarea:not([data-role=none])[data-theme=f],
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([data-role=none]):not([type=button]):not([type=submit]):not([type=reset])[data-theme=f] {
	border: var(--mobile-f-button-outline);
	box-shadow: var(--mobile-f-button-shadow);
	text-shadow: var(--mobile-f-button-text-shadow);
	background: var(--mobile-f-button-background);
	color: var(--mobile-f-button-foreground);
}

div[data-theme=a] {
	border: var(--mobile-a-button-outline);
	box-shadow: var(--mobile-a-button-shadow);
	text-shadow: var(--mobile-a-button-text-shadow);
	background: var(--mobile-a-button-background);
	color: var(--mobile-a-button-foreground);
}

div[data-theme=b] {
	border: var(--mobile-b-button-outline);
	box-shadow: var(--mobile-b-button-shadow);
	text-shadow: var(--mobile-b-button-text-shadow);
	background: var(--mobile-b-button-background);
	color: var(--mobile-b-button-foreground);
}

div[data-theme=c] {
	border: var(--mobile-c-button-outline);
	box-shadow: var(--mobile-c-button-shadow);
	text-shadow: var(--mobile-c-button-text-shadow);
	background: var(--mobile-c-button-background);
	color: var(--mobile-c-button-foreground);
}

div[data-theme=d] {
	border: var(--mobile-d-button-outline);
	box-shadow: var(--mobile-d-button-shadow);
	text-shadow: var(--mobile-d-button-text-shadow);
	background: var(--mobile-d-button-background);
	color: var(--mobile-d-button-foreground);
}

div[data-theme=e] {
	border: var(--mobile-e-button-outline);
	box-shadow: var(--mobile-e-button-shadow);
	text-shadow: var(--mobile-e-button-text-shadow);
	background: var(--mobile-e-button-background);
	color: var(--mobile-e-button-foreground);
}

div[data-theme=f] {
	border: var(--mobile-f-button-outline);
	box-shadow: var(--mobile-f-button-shadow);
	text-shadow: var(--mobile-f-button-text-shadow);
	background: var(--mobile-f-button-background);
	color: var(--mobile-f-button-foreground);
}


.mobile-file-picker-icon {
	background-image: var(--mobile-a-file-picker-icon);
}

[data-theme=b] .mobile-file-picker-icon {
	background-image: var(--mobile-b-file-picker-icon);
}

[data-theme=c] .mobile-file-picker-icon {
	background-image: var(--mobile-c-file-picker-icon);
}

[data-theme=d] .mobile-file-picker-icon {
	background-image: var(--mobile-d-file-picker-icon);
}

[data-theme=e] .mobile-file-picker-icon {
	background-image: var(--mobile-e-file-picker-icon);
}

[data-theme=f] .mobile-file-picker-icon {
	background-image: var(--mobile-f-file-picker-icon);
}

.mobile-range-holder {
	border: var(--mobile-a-button-outline);
	box-shadow: var(--mobile-a-button-shadow);
	text-shadow: var(--mobile-a-button-text-shadow);
	background: var(--mobile-a-button-background);
	color: var(--mobile-a-button-foreground);
}

.mobile-switch-left,
.mobile-switch-right {
	display: var(--mobile-switch-inactive-display);
	background: var(--mobile-switch-inactive-background);
	color: var(--mobile-switch-inactive-foreground);
	box-shadow: var(--mobile-switch-inactive-shadow);
	text-shadow: var(--mobile-switch-inactive-text-shadow);
	opacity: var(--mobile-switch-inactive-opacity);
	padding: var(--mobile-switch-inactive-padding);
	outline: var(--mobile-switch-inactive-outline);
}

.mobile-switch-left.mobile-switch-selected,
.mobile-switch-right.mobile-switch-selected {
	display: var(--mobile-switch-active-display);
	background: var(--mobile-switch-active-background);
	color: var(--mobile-switch-active-foreground);
	box-shadow: var(--mobile-switch-active-shadow);
	text-shadow: var(--mobile-switch-active-text-shadow);
	opacity: var(--mobile-switch-active-opacity);
	padding: var(--mobile-switch-active-padding);
	outline: var(--mobile-switch-active-outline);
	font-weight: var(--mobile-switch-active-font-weight);
}

.mobile-switch-left {
	background-image: var(--mobile-switch-inactive-left-image);
}

.mobile-switch-right {
	background-image: var(--mobile-switch-inactive-right-image);
}

.mobile-switch-left.mobile-switch-selected {
	background-image: var(--mobile-switch-active-left-image);
}

.mobile-switch-right.mobile-switch-selected {
	background-image: var(--mobile-switch-active-right-image);
}

button.image-editor-button {
	padding-left: 3.5em;
	background-repeat: no-repeat;
	background-position: .75em center;
	background-size: 1.75em;
	background-image: var(--mobile-a-file-picker-icon);
}

[data-theme=b] button.image-editor-button {
	background-image: var(--mobile-b-file-picker-icon);
}

[data-theme=c] button.image-editor-button {
	background-image: var(--mobile-c-file-picker-icon);
}

[data-theme=d] button.image-editor-button {
	background-image: var(--mobile-d-file-picker-icon);
}

[data-theme=e] button.image-editor-button {
	background-image: var(--mobile-e-file-picker-icon);
}

[data-theme=f] button.image-editor-button {
	background-image: var(--mobile-f-file-picker-icon);
}

.mobile-bool-wrapper {
	position: relative;
	display: inline-block;
	width: var(--mobile-bool-width);
	height: var(--mobile-bool-height);
	margin: var(--mobile-button-margin);
	border-radius: 0;
	background-image: var(--mobile-bool-off);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

.mobile-bool-wrapper.mobile-bool-selected {
	background-image: var(--mobile-bool-on);
}

.good {
	color: var(--mobile-e-button-background);
}

.bad {
	color: var(--mobile-d-button-background);
}

.good-highlight {
	margin-left: 3px;
	margin-right: 3px;
	outline: 2px solid var(--mobile-e-button-background);
	background: var(--mobile-e-button-background);
	color: var(--mobile-e-button-foreground);
}

.bad-highlight {
	margin-left: 3px;
	margin-right: 3px;
	outline: 2px solid var(--mobile-d-button-background);
	background: var(--mobile-d-button-background);
	color: var(--mobile-d-button-foreground);
}

[popup] {
	cursor: pointer;
}

#nice-pop {
	position: fixed;
	inset: 0;
}

#nice-pop-back {
	position: fixed;
	inset: 0;
	background: var(--nice-modal-leaving-page-background);
	backdrop-filter: blur(3px) grayscale(100%);
}

#nice-pop-content {
	inset: 0;
	margin: 2em;
	border-radius: .5em;
	padding: 1em;
	overflow: auto;
	outline: var(--mobile-a-button-outline);
	background-color: var(--mobile-a-button-background);
	color: var(--mobile-a-button-foreground);
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	inset: 0;
}

#nice-pop-close {
	position: absolute;
	top: .5em;
	right: .5em;
	width: 3em;
	height: 3em;
	background-image: url('/icon/close.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	cursor: pointer;
}

.mobile-img-only {
	color: initial !important;
	background-color: initial !important;
	text-shadow: initial !important;
}

.pre{
	white-space: pre;
	font-family: monospace;
	text-align:left;
}