@import"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap";
@import'../../fonts/font-awesome/css/all.min.css';

:root {
	--color-primary: #492C77;
	--color-primary-rgb: 36, 32, 92;
	--color-secondary: #f58822;
	--color-secondary-rgb: 245, 136, 34;
	--color-tertiary: #999392;
	--color-tertiary-rgb: 153, 147, 146;
	--color-red: #dc3545;
	--color-white: #fff;
	--color-black: #000;
	--color-gray-0: var(--color-white);
	--color-gray-100: #f5f6f7;
	--color-gray-200: #ebedf0;
	--color-gray-300: #dadde1;
	--color-gray-400: #ccd0d5;
	--color-gray-500: #bec3c9;
	--color-gray-600: #8d949e;
	--color-gray-700: #606770;
	--color-gray-800: #444950;
	--color-gray-900: #1c1e21;
	--color-gray-1000: var(--color-black);
	--color-content-primary: #202125;
	--color-content-secondary: #a7a7a7;
	--font-weight-medium: 500;
	--font-weight-heading: 600;
	--font-weight-normal: 400;
	--font-family-sans-serif: "Inter", sans-serif;
	--font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--line-height-heading: 1.25;
	--line-height-content: 1.5;
	--bs-backdrop-opacity: .85
}

body {
	font-size: 16px;
	line-height: 1.5;
	font-family: var(--font-family-sans-serif)
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--color-content-primary);
	line-height: 1.25;
	margin: 0;
	font-family: inherit;
	font-weight: var(--font-weight-heading)
}

a {
	color: var(--color-primary);
	outline: none;
	cursor: pointer
}

a:hover {
	color: var(--color-primary);
	text-decoration: underline
}

a:not([href]) {
	color: var(--color-primary);
	outline: none
}

a:not([href]):hover {
	color: var(--color-primary);
	text-decoration: none
}

.btn {
	font-size: inherit;
	line-height: inherit;
	font-weight: var(--font-weight-medium);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	padding: 0 24px;
	white-space: nowrap;
	border-radius: 12px;
	outline: none !important;
	box-shadow: none !important;
	font-family: inherit;
	color: var(--color-content-primary);
	cursor: pointer;
	transition: none
}

.btn i {
	margin-right: 8px
}

.btn:hover {
	color: var(--color-content-primary);
	text-decoration: none !important
}

.btn.btn-sm {
	height: 28px;
	padding: 0 12px
}

.btn.btn-lg {
	padding: 0 32px;
	height: 56px;
	min-width: 240px
}

.btn.disabled,
.btn:disabled,
.btn[disabled] {
	background-color: var(--color-gray-300) !important;
	color: var(--color-content-secondary) !important;
	border: none;
	opacity: .6;
	pointer-events: none;
	cursor: not-allowed !important
}

.btn.disabled:hover,
.btn:disabled:hover,
.btn[disabled]:hover {
	color: var(--color-content-secondary) !important
}

.btn.loading {
	pointer-events: none
}

.btn.btn--primary {
	background-color: var(--color-primary);
	color: var(--color-white) !important;
	border: none
}

.btn.btn--primary:hover {
	background-color: var(--color-primary);
	color: var(--color-white)
}

.btn.btn--primary:active {
	background-color: var(--color-primary);
	color: var(--color-white)
}

.btn.btn--secondary {
	background-color: var(--color-secondary);
	color: var(--color-white) !important;
	border: none
}

.btn.btn--secondary:hover {
	color: var(--color-white)
}

.btn.btn--outline {
	background-color: rgba(0, 0, 0, 0);
	color: var(--color-primary);
	border: 1px solid var(--color-primary)
}

.btn.btn--outline:hover {
	color: var(--color-primary)
}

.btn.btn--outline.secondary {
	color: var(--color-content-primary);
	border: 1px solid var(--color-tertiary)
}

.btn.btn--outline.secondary:hover {
	color: var(--color-content-primary)
}

.btn.btn--outline.reverse {
	border-color: var(--color-white);
	color: var(--color-white)
}

.btn.btn--outline.reverse:hover {
	color: var(--color-white)
}

.btn.btn--outline.reverse.disabled,
.btn.btn--outline.reverse:disabled {
	background-color: unset !important;
	color: var(--color-white) !important;
	border: 1px solid var(--color-white)
}

.btn.btn--outline.reverse.disabled:hover,
.btn.btn--outline.reverse:disabled:hover {
	color: var(--color-white) !important
}

.btn.btn--accent {
	border: none;
	background-color: rgba(0, 0, 0, 0);
	color: var(--color-primary)
}

.btn.btn--accent:hover {
	color: var(--color-primary)
}

.btn.btn--accent.secondary {
	color: var(--color-content-primary)
}

.btn.btn--accent.secondary:hover {
	color: var(--color-content-primary)
}

.btn.btn--accent.secondary .waves-ripple {
	background-color: rgba(0, 0, 0, .2)
}

.btn--primary.waves-effect .waves-ripple {
	background-color: rgba(255, 255, 255, .2)
}

.btn--secondary.waves-effect .waves-ripple {
	background-color: rgba(255, 255, 255, .2)
}

.btn--accent.waves-effect .waves-ripple {
	background-color: rgba(var(--color-primary-rgb), 0.2)
}

.btn--outline.waves-effect .waves-ripple {
	background-color: rgba(var(--color-primary-rgb), 0.2)
}

.btn--outline.secondary.waves-effect .waves-ripple {
	background-color: rgba(0, 0, 0, .2)
}

.btn--outline.reverse.waves-effect .waves-ripple {
	background-color: rgba(255, 255, 255, .2)
}

.lazyimg {
	transition: opacity .5s ease-in
}

.lazyimg:not([data-loaded=true]) {
	visibility: hidden;
	opacity: 0
}

label {
	margin-bottom: 8px;
	font-weight: 500
}

.form-control,
.form-select {
	padding: .75rem;
	border-width: 0;
	box-shadow: 0 0 0 2px var(--bs-border-color);
	transition: all .2s linear
}

.form-control:focus,
.form-select:focus {
	box-shadow: 0 0 0 2px var(--color-primary)
}

.form-control::-moz-placeholder,
.form-select::-moz-placeholder {
	color: #999
}

.form-control::placeholder,
.form-select::placeholder {
	color: #999
}

.form-control::-ms-input-placeholder,
.form-select::-ms-input-placeholder {
	color: #999
}

.form-control.is-invalid,
.was-validated .form-control:invalid,
.form-select.is-invalid,
.was-validated .form-select:invalid {
	background: none;
	padding-right: .75rem;
	box-shadow: 0 0 0 2px rgb(var(--bs-danger-rgb))
}

.form-control.is-invalid:focus,
.was-validated .form-control:invalid:focus,
.form-select.is-invalid:focus,
.was-validated .form-select:invalid:focus {
	box-shadow: 0 0 0 2px rgb(var(--bs-danger-rgb))
}

.invalid-feedback {
	display: block
}

form select.is-invalid~.select2 .select2-selection {
	box-shadow: 0 0 0 2px rgb(var(--bs-danger-rgb))
}

.input-group-text {
	padding: .75rem 0 .75rem .75rem;
	border: none;
	background-color: unset;
	border-width: 0;
	box-shadow: none
}

.input-group>.form-control,
.input-group>.form-floating,
.input-group>.form-select {
	box-shadow: none
}

.input-group {
	box-shadow: 0 0 0 2px var(--bs-border-color);
	border-radius: var(--bs-border-radius)
}

.input-group:focus-within {
	box-shadow: 0 0 0 2px var(--color-primary)
}

img {
	width: 100%;
	height: auto
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
	padding-left: 24px;
	padding-right: 24px
}

#app {
	padding-top: 72px
}

.nav-top {
	background-color: var(--color-white);
	z-index: 1030;
	transform: translateY(0);
	transition: all .5s ease-out;
	box-shadow: rgba(0, 0, 0, .2) 0 0 8px 0;
	border-bottom-left-radius: 24px;
	border-bottom-right-radius: 24px
}

.nav-top.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%
}

.nav-top .nav-content {
	display: flex;
	flex-wrap: nowrap;
	width: 100%;
	padding: 16px 0
}

.nav-top .logo {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin: 0
}

.nav-top .logo img {
	width: auto;
	height: 40px
}

.section {
	padding-top: 40px;
	padding-bottom: 40px
}

.card {
	width: 100%;
	background-color: #fff;
	border-radius: 12px;
	border: none;
	box-shadow: 0 0 0 1px var(--color-gray-300);
	overflow: hidden
}

.card .card-header {
	padding: 24px 24px 0;
	border-bottom: none;
	background-color: unset
}

.card .card-title {
	font-size: 20px;
	color: var(--color-content-primary);
	font-weight: var(--font-weight-heading);
	margin-bottom: 0
}

.card .card-body {
	padding: 24px
}

.card .card-footer {
	padding: 0 24px 24px;
	border-top: none;
	background-color: unset
}

#toast-container>div {
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	padding: 16px;
	border-radius: 8px;
	font-size: 14px;
	opacity: .8;
	box-shadow: none;
	border: none;
	line-height: 24px;
	width: auto;
	max-width: 500px
}

#toast-container>div:hover {
	box-shadow: none;
	opacity: inherit
}

#toast-container>div.toast-info {
	background-image: none !important;
	background-color: var(--color-gray-800)
}

#toast-container>div.toast-error {
	background-image: none !important
}

#toast-container>div.toast-warning {
	background-image: none !important
}

#toast-container>div.toast-success {
	background-image: none !important
}

#toast-container.toast-bottom-center {
	bottom: 80px
}

#toast-container .toast-message {
	flex: 1 1 100%
}

#toast-container button.toast-close-button {
	font-size: 12px;
	line-height: 16px;
	font-weight: var(--font-weight-content);
	padding: 4px 8px;
	margin-right: -4px;
	border-radius: 4px;
	text-shadow: none;
	opacity: 1;
	right: unset;
	top: unset
}

#toast-container button.toast-close-button:hover,
#toast-container button.toast-close-button:focus {
	background-color: rgba(0, 0, 0, .1);
	color: inherit;
	opacity: inherit
}

#toast-container button.toast-close-button:active {
	background-color: rgba(0, 0, 0, .2)
}

#toast-container button.toast-close-button::before {
	content: "OK"
}

.select2-container {
	width: 100% !important
}

* {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

.select2-container.select2-container--default .select2-selection--single {
	height: unset;
	border-radius: var(--bs-border-radius);
	padding: .75rem 2rem .75rem .75rem;
	border-width: 0;
	box-shadow: 0 0 0 2px var(--bs-border-color);
	transition: all .2s linear
}

.select2-container.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 1.5;
	padding: 0;
	white-space: unset
}

.select2-container .select2-dropdown {
	border-width: 0;
	border-radius: var(--bs-border-radius);
	box-shadow: 0 0 0 2px var(--bs-border-color);
	transition: all .2s linear
}

.select2-container .select2-search--dropdown {
	padding: .75rem
}

.select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar {
	width: 15px
}

.select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar-thumb {
	height: 6px;
	border: 4px solid rgba(0, 0, 0, 0);
	background-clip: padding-box;
	-webkit-border-radius: 7px;
	background-color: #e3e3e3
}

.select2-container .select2-results__option {
	padding: .75rem
}

.select2-container .select2-results__option.select2-results__option--highlighted[aria-selected] {
	background-color: rgba(0, 0, 0, .05) !important;
	color: inherit
}

.select2-container.select2-container--default .select2-search--dropdown .select2-search__field {
	padding: .375rem .75rem;
	border: none;
	box-shadow: 0 0 0 2px var(--bs-border-color);
	border-radius: var(--bs-border-radius)
}

.select2-container.select2-container--default .select2-search--dropdown .select2-search__field:focus {
	outline-width: 0;
	box-shadow: 0 0 0 2px var(--color-primary)
}

.select2-container.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 48px;
	position: absolute;
	top: 0;
	right: .75rem;
	width: 12px
}

.select2-container.select2-container--default .select2-selection--single .select2-selection__arrow b {
	background-image: url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"%3e%3cpath fill="none" stroke="%23343a40" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m2 5 6 6 6-6"/%3e%3c/svg%3e');
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	border: none;
	width: 12px;
	height: 48px;
	margin: 0;
	top: 0;
	left: 0;
	transition: all .2s linear
}

.select2-container.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	transform: rotate(180deg);
	border: none
}

.modal .btn-close {
	position: absolute;
	top: 0;
	right: 0;
	background-color: #fff;
	border-radius: .375rem;
	background: #fff url('data:image/svg+xml,%3Csvg width="19" height="18" viewBox="0 0 19 18" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M14 4.5L5 13.5" stroke="%23a5a3ae" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"/%3E%3Cpath d="M14 4.5L5 13.5" stroke="white" stroke-opacity="0.2" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"/%3E%3Cpath d="M5 4.5L14 13.5" stroke="%23a5a3ae" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"/%3E%3Cpath d="M5 4.5L14 13.5" stroke="white" stroke-opacity="0.2" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E%0A') center/1.125rem auto no-repeat;
	opacity: 1;
	padding: .44rem;
	box-shadow: 0 .125rem .25rem rgba(165, 163, 174, .3);
	transform: translate(50%, -50%);
	transition: all .3s ease
}

.modal .btn-close:active {
	transform: translate(50%, -50%) scale(0.9)
}

@media(min-width: 576px) {

	.container,
	.container-sm {
		max-width: unset
	}
}

@media(min-width: 768px) {

	.container,
	.container-md,
	.container-sm {
		max-width: unset
	}
}

@media(min-width: 992px) {

	.container,
	.container-lg,
	.container-md,
	.container-sm {
		max-width: unset
	}

	.container,
	.container-fluid,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl,
	.container-xxl {
		padding-left: 40px;
		padding-right: 40px
	}

	.section {
		padding-top: 60px;
		padding-bottom: 60px
	}
}

@media(min-width: 1200px) {

	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1140px
	}
}

@media(min-width: 1400px) {

	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl,
	.container-xxl {
		max-width: 1320px
	}
}

.overlay {
	background: rgba(0, 0, 0, .7);
	z-index: 1030;
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	right: 0;
	display: none
}

body::-webkit-scrollbar {
	width: 15px
}

body::-webkit-scrollbar-thumb {
	height: 6px;
	border: 4px solid rgba(0, 0, 0, 0);
	background-clip: padding-box;
	-webkit-border-radius: 7px;
	background-color: #e3e3e3
}

.noscroll {
	-ms-overflow-style: none;
	scrollbar-width: none
}

.noscroll::-webkit-scrollbar {
	display: none
}

.btn.loading .loader {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	width: 24px;
	height: 24px;
	font-family: "Font Awesome 5 Duotone";
	animation: fa-spin 1.4s linear infinite
}

.btn.loading .loader:before {
	position: absolute;
	color: var(--fa-primary-color, inherit);
	opacity: 1;
	opacity: var(--fa-primary-opacity, 1);
	content: ""
}

.btn.loading .loader:after {
	color: var(--fa-secondary-color, inherit);
	opacity: .4;
	opacity: var(--fa-secondary-opacity, 0.4);
	content: "􏏴"
}

.empty {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 40px 0;
	width: 100%
}

.empty .title {
	font-size: 14px;
	color: var(--color-content-primary);
	font-weight: var(--font-weight-heading)
}

.empty .caption {
	font-size: 12px
}

.loader {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 160px
}

.dot-loader {
	position: relative;
	left: -9999px;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: var(--color-primary);
	color: var(--color-primary);
	box-shadow: 9984px 0 0 0 var(--color-primary), 9999px 0 0 0 var(--color-primary), 10014px 0 0 0 var(--color-primary);
	animation: dotTyping 1.5s infinite linear
}

@keyframes dotTyping {
	0% {
		box-shadow: 9984px 0 0 0 var(--color-primary), 9999px 0 0 0 var(--color-primary), 10014px 0 0 0 var(--color-primary)
	}

	16.667% {
		box-shadow: 9984px -10px 0 0 var(--color-primary), 9999px 0 0 0 var(--color-primary), 10014px 0 0 0 var(--color-primary)
	}

	33.333% {
		box-shadow: 9984px 0 0 0 var(--color-primary), 9999px 0 0 0 var(--color-primary), 10014px 0 0 0 var(--color-primary)
	}

	50% {
		box-shadow: 9984px 0 0 0 var(--color-primary), 9999px -10px 0 0 var(--color-primary), 10014px 0 0 0 var(--color-primary)
	}

	66.667% {
		box-shadow: 9984px 0 0 0 var(--color-primary), 9999px 0 0 0 var(--color-primary), 10014px 0 0 0 var(--color-primary)
	}

	83.333% {
		box-shadow: 9984px 0 0 0 var(--color-primary), 9999px 0 0 0 var(--color-primary), 10014px -10px 0 0 var(--color-primary)
	}

	100% {
		box-shadow: 9984px 0 0 0 var(--color-primary), 9999px 0 0 0 var(--color-primary), 10014px 0 0 0 var(--color-primary)
	}
}