.overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--bg-color);
	z-index: 999;
	opacity: 0;
	visibility: hidden;
	transition: var(--transition)
}

.overlay:not(.active) {
	pointer-events: none;
}

.overlay.active {
	opacity: 1;
	visibility: visible
}

a {
	text-decoration: none;
	font-family: var(--font-regular);
	color: var(--orange);
	cursor: pointer;
	transition: var(--transition)
}

a:not(.disabled):hover {
	color: var(--d-orange)
}

ul.style-none {
	padding: 0
}

ul.style-none li {
	list-style: none
}

.icon {
	display: inline-block;
	width: 1rem;
	height: 1rem;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transition: var(--transition)
}

.icon.moon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M421.6 379.9c-.6641 0-1.35 .0625-2.049 .1953c-11.24 2.143-22.37 3.17-33.32 3.17c-94.81 0-174.1-77.14-174.1-175.5c0-63.19 33.79-121.3 88.73-152.6c8.467-4.812 6.339-17.66-3.279-19.44c-11.2-2.078-29.53-3.746-40.9-3.746C132.3 31.1 32 132.2 32 256c0 123.6 100.1 224 223.8 224c69.04 0 132.1-31.45 173.8-82.93C435.3 389.1 429.1 379.9 421.6 379.9zM255.8 432C158.9 432 80 353 80 256c0-76.32 48.77-141.4 116.7-165.8C175.2 125 163.2 165.6 163.2 207.8c0 99.44 65.13 183.9 154.9 212.8C298.5 428.1 277.4 432 255.8 432z' fill='%23212631'/%3E%3C/svg%3E")
}

.icon.sun {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 144C194.1 144 144 194.1 144 256c0 61.86 50.14 112 112 112s112-50.14 112-112C368 194.1 317.9 144 256 144zM256 320c-35.29 0-64-28.71-64-64c0-35.29 28.71-64 64-64s64 28.71 64 64C320 291.3 291.3 320 256 320zM256 112c13.25 0 24-10.75 24-24v-64C280 10.75 269.3 0 256 0S232 10.75 232 24v64C232 101.3 242.8 112 256 112zM256 400c-13.25 0-24 10.75-24 24v64C232 501.3 242.8 512 256 512s24-10.75 24-24v-64C280 410.8 269.3 400 256 400zM488 232h-64c-13.25 0-24 10.75-24 24s10.75 24 24 24h64C501.3 280 512 269.3 512 256S501.3 232 488 232zM112 256c0-13.25-10.75-24-24-24h-64C10.75 232 0 242.8 0 256s10.75 24 24 24h64C101.3 280 112 269.3 112 256zM391.8 357.8c-9.344-9.375-24.56-9.372-33.94 .0031s-9.375 24.56 0 33.93l45.25 45.28c4.672 4.688 10.83 7.031 16.97 7.031s12.28-2.344 16.97-7.031c9.375-9.375 9.375-24.56 0-33.94L391.8 357.8zM120.2 154.2c4.672 4.688 10.83 7.031 16.97 7.031S149.5 158.9 154.2 154.2c9.375-9.375 9.375-24.56 0-33.93L108.9 74.97c-9.344-9.375-24.56-9.375-33.94 0s-9.375 24.56 0 33.94L120.2 154.2zM374.8 161.2c6.141 0 12.3-2.344 16.97-7.031l45.25-45.28c9.375-9.375 9.375-24.56 0-33.94s-24.59-9.375-33.94 0l-45.25 45.28c-9.375 9.375-9.375 24.56 0 33.93C362.5 158.9 368.7 161.2 374.8 161.2zM120.2 357.8l-45.25 45.28c-9.375 9.375-9.375 24.56 0 33.94c4.688 4.688 10.83 7.031 16.97 7.031s12.3-2.344 16.97-7.031l45.25-45.28c9.375-9.375 9.375-24.56 0-33.93S129.6 348.4 120.2 357.8z' fill='%23f3f4f7'/%3E%3C/svg%3E")
}

.icon.exclamation.yellow {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-114.7 0-208-93.31-208-208S141.3 48 256 48s208 93.31 208 208S370.7 464 256 464zM256 304c13.25 0 24-10.75 24-24v-128C280 138.8 269.3 128 256 128S232 138.8 232 152v128C232 293.3 242.8 304 256 304zM256 337.1c-17.36 0-31.44 14.08-31.44 31.44C224.6 385.9 238.6 400 256 400s31.44-14.08 31.44-31.44C287.4 351.2 273.4 337.1 256 337.1z' fill='%23edac20'/%3E%3C/svg%3E")
}

.icon.exclamation.red {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-114.7 0-208-93.31-208-208S141.3 48 256 48s208 93.31 208 208S370.7 464 256 464zM256 304c13.25 0 24-10.75 24-24v-128C280 138.8 269.3 128 256 128S232 138.8 232 152v128C232 293.3 242.8 304 256 304zM256 337.1c-17.36 0-31.44 14.08-31.44 31.44C224.6 385.9 238.6 400 256 400s31.44-14.08 31.44-31.44C287.4 351.2 273.4 337.1 256 337.1z' fill='%23de5a5a'/%3E%3C/svg%3E")
}

#themeToggle {
	position: fixed;
	top: 2rem;
	right: 2rem;
	display: flex;
	gap: .5rem;
	background: none;
	border: none;
	cursor: pointer;
	padding: .5rem;
	border-radius: 10rem;
	align-items: center;
	justify-content: center;
	background: rgba(var(--rgb-dark), .1);
	transition: var(--transition)
}

[data-theme="dark"] #themeToggle {
	background: rgba(var(--rgb-gray), .1)
}

#themeToggle:hover {
	background: rgba(var(--rgb-dark), .2)
}

[data-theme="dark"] #themeToggle:hover {
	background: rgba(var(--rgb-gray), .2)
}

form {
	margin: auto
}

.form-control {
	display: block;
	width: 100%;
	height: 50px;
	padding: .75rem 1rem;
	color: var(--text-color);
	background-color: rgba(var(--rgb-cyan), .05);
	background-clip: padding-box;
	border: 1px solid rgba(var(--rgb-cyan), .5);
	border-radius: var(--border-radius-lg);
	font-family: var(--font-normal);
	appearance: none;
	transition: var(--transition)
}

.form-control:focus {
	border-color: var(--cyan);
	outline: 0;
	box-shadow: 0 0 0 .25rem rgba(var(--rgb-cyan), .25)
}

.input-group ::placeholder {
	color: rgba(var(--rgb-text-color), .5);
	opacity: 1
}

.form-control:disabled,
.form-control[readonly]{
	background-color: var(--gray);
	cursor: not-allowed
}

[data-theme="dark"] .form-control:disabled,
[data-theme="dark"] .form-control[readonly] {
	background: var(--vd-gray)
}

.input-group {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%
}

.input-group > .form-control {
	position: relative;
	flex: 1 1 auto;
	width: 1%;
	min-width: 0
}

.input-group .small {
	font-size: .9rem
}

.input-group > .form-control:not(:first-child),
.input-group .input-group-text:not(:first-child) {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0
}

input.dropzone-hidden-input {
	display: none;
	height: 0;
	width: 0
}

.file-dropzone {
	width: 100%;
	user-select: none
}

.dropzone-area {
	position: relative;
	border: 2px dashed rgba(var(--rgb-cyan), .5);
	border-radius: var(--border-radius-lg);
	background-color: rgba(var(--rgb-cyan), .05);
	cursor: pointer;
	transition: var(--transition)
}

input:disabled ~ .dropzone-area {
	background-color: var(--gray);
	cursor: not-allowed
}

[data-theme="dark"] input:disabled ~ .dropzone-area {
	background-color: var(--vd-gray)
}

input:not(:disabled) ~ .dropzone-area:not(.max-files-reached):hover,
input:not(:disabled) ~ .dropzone-area:not(.max-files-reached).drag-over {
	background-color: rgba(var(--rgb-cyan), .1);
	border-color: var(--cyan)
}

.dropzone-area.max-files-reached {
	background-color: rgba(var(--rgb-red), .05);
	border: 2px dashed rgba(var(--rgb-red), .5);
	cursor: not-allowed
}

.dropzone-area.max-files-reached .dropzone-content {
	pointer-events: none
}

.dropzone-content {
	text-align: center;
	padding: 1rem;
	pointer-events: none;
	transition: var(--transition)
}

.upload-icon {
	display: block;
	width: 3rem;
	height: 3rem;
	margin: 0 auto 1rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M447.1 96h-172.1L226.7 50.75C214.7 38.74 198.5 32 181.5 32H63.1c-35.35 0-64 28.66-64 64v320c0 35.34 28.65 64 64 64h384c35.35 0 64-28.66 64-64V160C511.1 124.7 483.3 96 447.1 96zM463.1 416c0 8.824-7.178 16-16 16h-384c-8.822 0-16-7.176-16-16V96c0-8.824 7.178-16 16-16h117.5c4.273 0 8.293 1.664 11.31 4.688L255.1 144h192c8.822 0 16 7.176 16 16V416z' fill='%232bb3b3'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	transition: var(--transition)
}

.dropzone-area.max-files-reached .upload-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M447.1 96h-172.1L226.7 50.75C214.7 38.74 198.5 32 181.5 32H63.1c-35.35 0-64 28.66-64 64v320c0 35.34 28.65 64 64 64h384c35.35 0 64-28.66 64-64V160C511.1 124.7 483.3 96 447.1 96zM463.1 416c0 8.824-7.178 16-16 16h-384c-8.822 0-16-7.176-16-16V96c0-8.824 7.178-16 16-16h117.5c4.273 0 8.293 1.664 11.31 4.688L255.1 144h192c8.822 0 16 7.176 16 16V416z' fill='%23de5a5a'/%3E%3C/svg%3E")
}

.dropzone-content .text,
.dropzone-content .hint {
	margin: 0;
	font-size: 1rem;
	line-height: normal;
	color: var(--text-color);
	transition: var(--transition)
}

.dropzone-content .text {
	margin-bottom: .5rem
}

.dropzone-content .hint {
	font-size: .8rem;
	color: var(--vd-gray)
}

[data-theme="dark"] .dropzone-content .hint {
	color: var(--d-gray)
}

.files-list {
	padding: 0 1rem;
	overflow-y: auto;
	transition: var(--transition)
}

.dropzone-area.has-files .files-list {
	padding: 1rem
}

.files-list ul {
	list-style: none;
	padding: 0;
	margin: 0
}

.file-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .75rem;
	background-color: rgba(var(--rgb-text-color), .1);
	border-radius: var(--border-radius-lg);
	animation: slideIn .3s ease;
	cursor: default;
	transition: var(--transition)
}

.file-item:not(:last-of-type) {
	margin-bottom: .5rem
}

@keyframes slideIn {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.file-info {
	display: flex;
	align-items: center;
	flex: 1;
	gap: .75rem;
	min-width: 0
}

.file-icon {
	font-size: 1.5rem;
	flex-shrink: 0
}

.file-details {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0
}

.file-name {
	font-size: .85rem;
	color: var(--text-color);
	word-break: break-all;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: var(--transition)
}

.file-meta {
	font-size: .7rem;
	color: var(--label-color);
	margin-top: .25rem
}

.file-remove {
	background: none;
	border: none;
	cursor: pointer;
	color: var(--red);
	padding: .75rem;
	border-radius: var(--border-radius-sm);
	background-color: rgba(var(--rgb-red), .1);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M378.4 440.6c8.531 10.16 7.203 25.28-2.938 33.81C370.9 478.2 365.5 480 360 480c-6.844 0-13.64-2.906-18.39-8.562L192 293.3l-149.6 178.1C37.63 477.1 30.83 480 23.98 480c-5.453 0-10.92-1.844-15.42-5.625c-10.14-8.531-11.47-23.66-2.938-33.81L160.7 256L5.625 71.44C-2.906 61.28-1.578 46.16 8.563 37.63C18.69 29.08 33.84 30.39 42.38 40.56L192 218.7l149.6-178.1c8.547-10.17 23.67-11.47 33.81-2.938s11.47 23.66 2.938 33.81L223.3 256L378.4 440.6z' fill='%23cb2821'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: .75rem;
	background-position: center;
	flex-shrink: 0;
	line-height: 1;
	transition: var(--transition)
}

.file-remove:hover {
	background-color: rgba(var(--rgb-red), .25)
}

input:disabled ~ .dropzone-area .file-remove {
	opacity: 0;
	visibility: hidden
}

.dropzone-footer {
	display: flex;
	justify-content: end;
	align-items: center;
	margin-top: .5rem;
	padding: 0 .25rem
}

.clear-all-btn {
	background: none;
	border: none;
	color: var(--red);
	font-size: .75rem;
	cursor: pointer;
	padding: .25rem .5rem;
	border-radius: .25rem;
	transition: var(--transition)
}

.clear-all-btn:hover {
	background-color: rgba(var(--rgb-red), .1)
}

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	letter-spacing: .5px;
	color: var(--gray);
	background-color: var(--cyan);
	border: 2px solid var(--cyan);
	text-align: center;
	text-decoration: none;
	outline: none;
	vertical-align: middle;
	cursor: pointer;
	user-select: none;
	padding: .75rem 1.5rem;
	border-radius: 10rem;
	font-family: var(--font-semibold);
	transition: var(--transition)
}

.btn:not(.disabled):hover,
.btn.active {
	background: var(--orange);
	border-color: var(--orange);
	color: var(--gray)
}

.btn.second {
	color: var(--cyan);
	background: transparent
}

.btn.second:not(.disabled):hover {
	color: var(--orange);
	background: transparent
}

.btn.hover-up:not(.disabled):hover {
	transform: translateY(-2px)
}

.btn.disabled {
	opacity: .65;
	cursor: not-allowed;
	transform: none
}

.form-input[type="checkbox"] {
	width: 2rem;
	height: 2rem;
	margin-right: 1rem;
	background-color: rgba(var(--rgb-cyan), .05);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border: 1px solid rgba(var(--rgb-cyan), .5);
	border-radius: var(--border-radius-sm);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M440.1 103C450.3 112.4 450.3 127.6 440.1 136.1L176.1 400.1C167.6 410.3 152.4 410.3 143 400.1L7.029 264.1C-2.343 255.6-2.343 240.4 7.029 231C16.4 221.7 31.6 221.7 40.97 231L160 350.1L407 103C416.4 93.66 431.6 93.66 440.1 103V103z' fill='%23f3f4f7'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 0;
	appearance: none;
	flex-shrink: 0;
	print-color-adjust: exact;
	transition: var(--transition)
}

.form-input[type="checkbox"]:disabled {
	background-color: var(--gray);
	cursor: not-allowed
}

[data-theme="dark"] .form-input[type="checkbox"]:disabled {
	background-color: var(--vd-gray)
}

.form-input[type="checkbox"]:not(:disabled):hover {
	cursor: pointer;
	background-color: rgba(var(--rgb-cyan), .5);
	border-color: var(--cyan)
}

.form-input[type="checkbox"]:checked {
	background-color: var(--cyan) !important;
	background-size: 1rem;
	border-color: var(--cyan)
}

.form-input[type="checkbox"]:checked:disabled {
	opacity: .75
}

.form-label {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
	color: var(--text-color);
	transition: var(--transition)
}

.form-label .icon {
	width: .9rem;
	height: .9rem;
	background-size: .9rem;
	opacity: .75;
	flex-shrink: 0;
	cursor: pointer;
	margin-left: .25rem
}

.form-label .icon:hover {
	opacity: 1
}

textarea {
	min-height: 150px;
	max-height: 300px
}

#message {
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	max-width: min(400px, calc(100% - 4rem));
	max-height: 80vh;
	overflow: auto;
	border-radius: 15px;
	padding: 15px;
	opacity: 0;
	visibility: hidden;
	color: var(--green);
	background-color: var(--l-green);
	z-index: 999999;
	transition: var(--transition)
}

#message p {
	margin: 0
}

#message.show {
	opacity: 1;
	visibility: visible;
}

#message.error {
	color: var(--red);
	background-color: var(--l-red)
}

#message.success {
	color: var(--green);
	background-color: var(--l-green)
}

.logos {
	padding: 1rem 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	flex-shrink: 0;
	margin: 3rem auto
}

.logos .logo {
	display: block;
	height: 50px;
	width: 50px;
	flex-shrink: 0;
	background-repeat: no-repeat;
	background-size: contain;
	transition: var(--transition)
}

.logo.mrik {
	background-image: url('../images/logo_m.svg');
}

.logo.fmba {
	background-image: url('../images/fmba_m.svg');
}

#modal-wrapper {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(var(--rgb-dark), .5);
	opacity: 0;
	visibility: hidden;
	z-index: 999999;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow: auto;
	transition: var(--transition)
}

[data-theme="dark"] #modal-wrapper {
	background-color: rgba(var(--rgb-vd-gray), .5)
}

#modal-wrapper.show {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

section {
	margin: 3rem 0
}

.question-container {
	background-color: var(--bg-color);
	border-radius: var(--border-radius-lg);
	padding: 1rem;
	margin-bottom: 2rem;
	transition: var(--transition)
}

.question-text {
	font-size: 1.1rem;
	font-weight: var(--font-semibold);
	color: rgba(var(--rgb-text-color), .75);
	margin-bottom: 1.25rem;
	transition: var(--transition)
}

.question-options {
	display: flex;
	flex-direction: row;
	gap: 1rem
}

.question-item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
	pointer-events: none;
	transition: var(--transition)
}

.questions .question-item:not(:first-child) {
	display: none
}

.question-item.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: all
}

.option {
	display: flex;
	align-items: center;
	width: 50%;
	gap: 1rem;
	cursor: pointer;
	padding: 0 1rem;
	border-radius: var(--border-radius-lg);
	background-color: rgba(var(--rgb-cyan), .05);
	border: 1px solid rgba(var(--rgb-cyan), .5);
	position: relative;
	transition: var(--transition)
}

.option:not(:has(input[type="radio"]:disabled)):hover {
	box-shadow: 0 0 0 .25rem rgba(var(--rgb-cyan), .25)
}

.option:not(:has(input[type="radio"]:disabled)):hover,
.option:has(input[type="radio"]:checked) {
	background-color: rgba(var(--rgb-cyan), .1);
	border-color: var(--cyan)
}

.option:has(input[type="radio"]:disabled) {
	background-color: var(--gray);
	cursor: not-allowed
}

[data-theme="dark"] .option:has(input[type="radio"]:disabled) {
	background-color: var(--vd-gray)
}

.option input[type="radio"] {
	-webkit-appearance: none;
	appearance: none;
	width: 1.5rem;
	height: 1.5rem;
	border: 1px solid rgba(var(--rgb-cyan), .5);
	border-radius: 50%;
	background-color: var(--bg-color);
	cursor: pointer;
	position: relative;
	margin: 0;
	flex-shrink: 0;
	transition: var(--transition)
}

.option input[type="radio"]:disabled,
.option input[type="radio"]:disabled ~ label {
	cursor: not-allowed
}

.option input[type="radio"]:checked {
	border: .75rem solid var(--cyan)
}

.option input[type="radio"]:focus {
	outline: none
}

.option input[type="radio"]:hover {
	border-color: var(--cyan)
}

.option label {
	font-size: 1.2rem;
	color: rgba(var(--rgb-text-color), .75);
	cursor: pointer;
	padding: 1rem 0;
	margin: 0;
	flex: 1;
	transition: var(--transition)
}

.option:has(input[type="radio"]:checked) label {
	color: var(--cyan)
}

hr {
	border: none;
	width: 80%;
	margin: 2rem auto;
	height: 2px;
	background-color: rgba(var(--rgb-text-color), .25);
	transition: var(--transition)
}

footer {
	margin-top: auto;
	text-align: center;
	padding: 1rem 0;
	border-top: 2px solid rgba(var(--rgb-black), .1);
	transition: var(--transition)
}

[data-theme="dark"] footer {
	border-top: 2px solid rgba(var(--rgb-gray), .1)
}

footer p {
	margin: 0;
	font-size: .8rem
}

#modal-wrapper .modal {
	width: 600px;
	max-width: 90%;
	max-height: 100%;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	position: absolute;
	overflow: hidden;
	transition: var(--transition)
}

#modal-wrapper .modal.wide {
	width: 800px
}

#modal-wrapper .modal.show {
	opacity: 1;
	visibility: visible;
	pointer-events: all;
	overflow: visible
}

#modal-wrapper .modal.show + .modal.show {
	margin-top: 1rem
}

#modal-wrapper .close {
	position: absolute;
	top: .5rem;
	right: .5rem;
	padding: 1rem;
	border-radius: 50%;
	background-color: rgba(var(--rgb-red), .1);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z' fill='%23de5a5a'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: .75rem;
	z-index: 1000;
	cursor: pointer;
	transition: var(--transition)
}

#modal-wrapper:not(:has(.modal:hover)) .close,
#modal-wrapper .close:hover {
	background-color: rgba(var(--rgb-red), .25);
	pointer-events: auto
}

.card {
	background-color: var(--white);
	border-radius: var(--border-radius-lg);
	padding: 2rem;
	transition: var(--transition)
}

[data-theme="dark"] .card {
	background-color: var(--total-black)
}

#modal-wrapper .modal .title {
	text-align: center;
	margin-bottom: 1rem;
	top: 0;
	z-index: 1
}

#modal-wrapper .modal .text {
	display: flex;
	width: 100%;
	text-align: center;
	line-height: 1.5;
	flex-direction: column;
	align-items: center;
	margin: 1rem 0;
	margin: 0
}

#modal-wrapper .modal .buttons {
	display: flex;
	gap: 1rem;
	justify-content: space-around;
	bottom: 0;
	margin-top: 2rem
}

#modal-wrapper .modal .text ul.flex {
	display: flex;
	margin: 0;
	gap: .5rem;
	list-style: none;
	padding: 0;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%
}

#modal-wrapper .modal .text ul.flex li.bg {
	min-width: min-content;
	flex: 0 1 auto;
	padding: .25rem;
	font-size: .9rem;
	color: var(--gray);
	background-color: rgba(var(--rgb-orange), .75);
	border-radius: var(--border-radius-lg)
}

@media (max-width: 767px) {
	.dropzone-content {
		padding: 1.5rem
	}

	.dropzone-area.has-files .dropzone-content {
		padding: .75rem .75rem .25rem .75rem
	}

	.file-item {
		padding: .5rem
	}

	.file-icon {
		font-size: 1.25rem
	}

	.file-name {
		font-size: .8rem
	}
}

@media (min-width: 992px) {
	.logo.mrik {
		width: 150px;
		background-image: url('../images/logo.svg');
	}

	[data-theme="dark"] .logo.mrik {
		background-image: url('../images/logo_dark.svg')
	}

	.logo.fmba {
		width: 162px;
		background-image: url('../images/fmba.svg')
	}

	[data-theme="dark"] .logo.fmba {
		background-image: url('../images/fmba_dark.svg')
	}

	section {
		margin: 4rem 0
	}
}

@media (min-width: 1200px) {
	section {
		margin: 5rem 0
	}
}

@media (max-width: 991px) {
	.m-hide {
		display: none
	}
}

.input-group > .form-control:not(:last-child) {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0
}

.input-group > .form-control:not(:first-child) {
	margin-left: -1px
}

.input-group .input-group-text {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	height: 50px;
	padding: .75rem 1rem;
	color: var(--text-color);
	background-color: rgba(var(--rgb-cyan), .1);
	border: 1px solid rgba(var(--rgb-cyan), .5);
	border-radius: 0 var(--border-radius-lg) var(--border-radius-lg) 0;
	white-space: nowrap
}

.input-group .input-group-text:not(:first-child) {
	border-left: 0
}

.input-group .input-group-text:not(:last-child) {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0
}

[data-theme="dark"] .form-control {
	color-scheme: dark
}

textarea.form-control {
	resize: vertical
}

textarea.form-control.compact {
	min-height: 100px
}

.note {
	font-size: .9rem;
	color: var(--vd-gray)
}

[data-theme="dark"] .note {
	color: var(--d-gray)
}

.icon.clipboard {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%232bb3b3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='8' width='30' height='36' rx='5'/%3E%3Cpath d='M18 8V6a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M17 27l5 5 9-10'/%3E%3C/svg%3E")
}

.icon.notebook {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%232bb3b3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='10' y='5' width='28' height='38' rx='4'/%3E%3Cpath d='M17 5v38'/%3E%3Cpath d='M23 16h9M23 24h9M23 32h6'/%3E%3C/svg%3E")
}

.choice {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	height: 100%;
	padding: 1.5rem;
	border-radius: var(--border-radius-lg);
	background-color: var(--bg-color);
	border: 1px solid rgba(var(--rgb-cyan), .5)
}

a.choice,
a.choice:not(.disabled):hover {
	color: var(--text-color)
}

a.choice:not(.disabled):hover {
	background-color: rgba(var(--rgb-cyan), .1);
	border-color: var(--cyan);
	box-shadow: var(--cyan-shadow);
	transform: translateY(-2px)
}

.choice .choice-icon {
	width: 3rem;
	height: 3rem;
	margin-bottom: .5rem
}

.choice .title {
	font-family: var(--font-semibold);
	font-size: 1.25rem;
	color: var(--cyan);
	transition: var(--transition)
}

a.choice:hover .title {
	color: var(--orange)
}

.choice .text {
	color: rgba(var(--rgb-text-color), .75)
}

.options {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem
}

.options .option {
	width: auto;
	flex: 1 1 auto
}

.options .option label {
	font-size: 1rem
}

.scale {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem
}

.scale-item {
	position: relative
}

.scale-item input {
	position: absolute;
	width: 0;
	height: 0;
	margin: 0;
	opacity: 0
}

.scale-item label {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	margin: 0;
	border-radius: 50%;
	border: 1px solid rgba(var(--rgb-cyan), .5);
	background-color: rgba(var(--rgb-cyan), .05);
	color: rgba(var(--rgb-text-color), .75);
	cursor: pointer;
	user-select: none;
	transition: var(--transition)
}

.scale-item label:hover {
	border-color: var(--cyan);
	background-color: rgba(var(--rgb-cyan), .1);
	box-shadow: 0 0 0 .25rem rgba(var(--rgb-cyan), .25)
}

.scale-item input:focus-visible + label {
	box-shadow: 0 0 0 .25rem rgba(var(--rgb-cyan), .25)
}

.scale-item input:checked + label {
	color: var(--gray);
	border-color: var(--cyan);
	background-color: var(--cyan)
}

.scale-legend {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin-top: .5rem;
	font-size: .9rem;
	color: var(--vd-gray)
}

[data-theme="dark"] .scale-legend {
	color: var(--d-gray)
}

.tab-nav {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-bottom: 2rem
}

.tab-nav .btn {
	padding: .5rem 1rem
}

.tab-nav.compact .btn {
	min-width: 2.75rem;
	padding: .5rem .75rem
}

.tab-nav .btn.filled:not(.active) {
	background-color: rgba(var(--rgb-cyan), .15)
}

.tab-nav .btn.active,
.tab-nav .btn.active:not(.disabled):hover {
	color: var(--gray);
	border-color: var(--cyan);
	background-color: var(--cyan)
}

.tab-pane {
	display: none
}

.tab-pane.active {
	display: block
}

.tab-controls {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1rem;
	margin-top: 2rem
}

.table-wrap {
	margin-bottom: 1.5rem;
	overflow-x: auto
}

.table {
	width: 100%;
	border-collapse: collapse
}

.table th,
.table td {
	padding: .75rem 1rem;
	text-align: left;
	border-bottom: 1px solid rgba(var(--rgb-text-color), .15)
}

.table th {
	font-family: var(--font-semibold);
	font-weight: normal;
	color: var(--cyan)
}

.table tbody tr:last-child td {
	border-bottom: 0
}

.table td .form-control {
	min-width: 8rem
}

.table.compact th,
.table.compact td {
	padding: .5rem;
	text-align: center
}

.table.compact td {
	white-space: nowrap
}

@media (max-width: 575px) {
	.scale {
		display: grid;
		grid-template-columns: repeat(6, 1fr)
	}

	.scale-item label {
		width: 100%;
		border-radius: var(--border-radius-md)
	}
}
