:root {
	--header-height: 82px;
	--sidebar-background: #fff;
	--sidebar-border: 1px solid #eee;
	--font-main: 'Golos Text', sans-serif;
}

body,
html {
	scroll-behavior: smooth;
}

body.light-theme {
	--btn-default-background: rgba(172, 173, 175, 0.1);
}

::placeholder {
	color: var(--text-neutral) !important;
	font-family: var(--font-main) !important;
}

body {
	background: var(--body-background-color);
	transition: 0.2s ease all;
	min-height: 100dvh;
}

.display-5
{
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.3;
}
@media (max-width: 1200px)
{
    .display-5
    {
        font-size: calc(1.125rem + .9vw) ;
    }
}

.cursor-pointer {
	cursor: pointer !important;
}

.monospace {
	font-feature-settings: 'tnum' on, 'lnum' on;
}

.content > .row {
	width: 100%;
}

.link {
	font-weight: 500;
	position: relative;
	font-size: 18px;
	line-height: 25px;
	color: var(--text-gray) !important;
	transition: 0.2s ease all;
	text-decoration: underline !important;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	width: fit-content;
}

.link[target]:not(.without-icon) {
	padding-left: 22px;
}

.link[target]:not(.without-icon):after {
	content: url("data:image/svg+xml,%3Csvg width='19' height='19' viewBox='0 0 19 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.25 8.5V2.75M10.5 2.75H16.25M16.25 2.75L8.5 10.5M7 2.75H4.75C3.64543 2.75 2.75 3.64543 2.75 4.75V14.25C2.75 15.3546 3.64543 16.25 4.75 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V12.1731' stroke='%23BEBEF7' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	width: 18px;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	height: 18px;
	vertical-align: middle;
}

.link:before {
	content: '';
	display: block;
	position: absolute;
	top: -5px;
	left: -7px;
	right: -7px;
	bottom: -5px;
	border-radius: 10px;
	text-decoration: none !important;
	background: rgba(217, 217, 217, 0.01);
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5);
	transition: 0.2s ease all;
	opacity: 0;
}

.link:hover {
	opacity: 0.75;
}

.link:active {
	opacity: 0.5;
}

.link:focus:before {
	display: block;
	opacity: 1;
}

.icon-arrow-right-after::after {
	content: url("data:image/svg+xml,%3Csvg width='18' height='19' viewBox='0 0 18 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 9.5H3M15 9.5L10.5 5M15 9.5L10.5 14' stroke='%23ACAEAF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	width: 18px;
	height: 18px;
	display: inline-block;
	margin-bottom: 2px;
	margin-left: 10px;
}

.navbar-main {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: var(--header-background-color);
	transition: 0.2s ease all;
	padding: 18px 20px;
	border-bottom: 1px solid #eeeeee;
}

.text-decoration-none {
	text-decoration: none !important;
}

.logo {
	height: 36px !important;
	user-select: none;
}

.card {
	background: var(--card-background-color);
	border: 0;
	box-shadow: none;
	border-radius: 25px;
	border: 2px solid #f3f3f3;
	margin-bottom: 24px;
	transition: 0.2s ease all;
}

.card-auth {
	border: 1px solid var(--card-border-color);
	border-radius: 20px;
}

.card-auth .card-body {
	padding: 50px;
}

.card-auth .card-footer {
	padding: 30px 50px 72px;
	border-top: 1px solid var(--card-footer-border-color);
	text-align: center;
}

.auth-section {
	padding-top: 38px;
	overflow: hidden;
}

.card-auth .card-title {
	font-weight: 700;
	font-size: 32px;
	line-height: 40px;
	margin-bottom: 50px;
}

.stripe-loading-indicator {
	display: none;
}

.form-group {
	position: relative;
}

input,
textarea {
	padding: 0 33px !important;
	height: 70px;
	font-weight: 500 !important;
	font-size: 18px !important;
	line-height: 25px !important;
	color: var(--text-default) !important;
	transition: 0.2s ease all !important;
	background: var(--input-background-color) !important;
	border-radius: 15px !important;
}

.overflow-scroll-x {
	height: auto;
	width: auto;
	overflow-x: scroll;
}

.overflow-scroll-y {
	max-height: 500px;
	width: auto;
	overflow-y: auto;
	overflow-x: hidden;
}

.overflow-scroll-x::-webkit-scrollbar {
	height: 13px;
}

.overflow-scroll-x::-webkit-scrollbar-thumb {
	border-radius: 23px;
	background-clip: content-box;
	background-color: #e2e2e2;
	border: 4px solid transparent;
}

.overflow-scroll-x::-webkit-scrollbar-track {
	border-radius: 0px;
	background-color: #fbfbfb;
}

.form-control {
	border: 2px solid transparent !important;
}

.form-group {
	margin-bottom: 12px;
}

.form-group + .form-group {
	margin-top: 24px;
}

.form-group label:not([for="message-files"]) {
	user-select: none;
	position: absolute;
	top: 50%;
	left: 34px;
	transform: translateY(-50%);
	color: var(--text-gray) !important;
	transition: 0.2s ease all;
	cursor: text;
	z-index: 10;
	font-weight: 500;
	font-size: 18px;
	line-height: 25px;
	margin-bottom: 0;
}

.form-group.focused .form-control {
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5) !important;
	border: 2px solid #2e3c59 !important;
}

.form-group.focused label:not([for="message-files"]),
.form-group.filled label:not([for="message-files"]) {
	top: 10.5px;
	transform: inherit;
	font-size: 14px;
	line-height: 19px;
}

[data-validate-for] {
	padding-left: 22px;
	user-select: none;
	margin-top: 12px;
	text-align: right;
	color: #ff5b5b;
	font-weight: 400;
	font-size: 14px;
	line-height: 19px;
	position: relative;
	margin-bottom: 0;
}

[data-validate-for]:not(.oc-visible) {
	display: none !important;
	visibility: hidden;
}

[data-validate-for] svg {
	vertical-align: bottom;
	margin-right: 6px;
}

.form-group.error label {
	color: #ff5b5b !important;
}

.form-group.error .form-control {
	box-shadow: 0px 0px 0px 4px rgba(255, 91, 91, 0.5) !important;
	border: 2px solid #ff5b5b !important;
}

.form-group.small:not(.input-group-search-main) .form-control {
	border-width: 1px !important;
	padding: 14.5px 19px !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	line-height: normal !important;
	height: auto;
}

.form-group:has(label) .form-control {
	padding-top: 20px !important;
}

.form-group.small .append > p {
	font-weight: 500 !important;
	font-size: 16px !important;
	line-height: 22px !important;
	color: var(--light-gray) !important;
	transition: var(--transition-2) !important;
}

.decorated {
	position: relative;
}

.decorated:before {
	content: '';
	position: absolute;
	top: -7.46px;
	left: -19px;
	right: -32px;
	bottom: -7.23px;
	background: url(/public/view/assets/images/title-decor.svg) no-repeat;
	background-size: 100%;
}

.social-login {
	margin-top: 50px;
}

.fade-out.aos-animate {
	transition: 2s ease all;
	top: -999px;
}

.user-signup-steps {
	display: flex;
	align-items: start;
	left: 0;
	right: 0;
}

.user-signup-steps .card {
	flex: 1 0 100%;
	transition: none;
}

.user-signup-steps .card:not(:first-child) {
	right: -100%;
}

.social-login .row > * {
	padding-left: 12.5px;
	padding-right: 12.5px;
}

.btn {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 22.5px 45px;
	gap: 10px;
	font-weight: 500;
	font-size: 20px;
	line-height: 28px;
	border: 0;
	box-shadow: none !important;
	transition: 0.2s ease all;
	border-radius: 15px;
}

.btn > * {
	flex-shrink: 0;
}

.btn:not([class*='btn-outline']):hover,
.btn[class*='btn-outline']:active {
	opacity: 0.75 !important;
}

.btn:not([class*='btn-outline']):active {
	opacity: 0.5;
}

.hr-line {
	height: 1px;
	border: none;
	background: #eff0f6;
	opacity: 1;
	margin: 0;
}

.hr-line.gray {
	background: #acaeaf;
}

.opacity-2 {
	opacity: 0.2 !important;
}

.btn[class*='btn-outline']:hover path {
	stroke: white;
}

.btn:focus {
	isolation: isolate;
}

.btn-purple {
	color: #2e3c59 !important;
	background: #bebef7 !important;
}

.btn-auth {
	width: 100%;
	margin-top: 50px;
}

.btn.disabled {
	pointer-events: none;
	cursor: not-allowed !important;
}

.pointer-events-none {
	pointer-events: none !important;
}

.btn-social {
	background: #f3f3f3;
	padding-top: 13px;
	padding-bottom: 13px;
}

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

.btn-transparent {
	background: transparent;
	color: var(--text-default);
}

.btn-transparent:hover {
	background: var(--btn-default-background);
}

.btn-lg {
	padding: 18px 35px !important;
	/* font-size: 18px !important; */
}

.form-group:has(.append):not(.input-group-search-main) .form-control, .form-group.small:has(.append):not(.input-group-search-main) .form-control {
	padding-right: 60px !important;
}

.form-group.small:has(.search) .form-control {
	padding-left: 45px !important;
}

.input-length {
	font-weight: 400;
	font-size: 18px;
	line-height: 25px;
	color: var(--text-gray);
	transition: 0.2s ease all;
	margin-bottom: 0;
}

.input-length.error {
	color: #ff5b5b;
}

.form-control + .append {
	cursor: pointer;
	z-index: 10;
	position: absolute;
	top: 25.5px;
	right: 13px;
	transform: translateY(-50%);
	border: 1px solid transparent;
	background: var(--input-background-color);
	border-radius: 7px;
	user-select: none;
}

.form-control + .search {
	z-index: 10;
	position: absolute;
	top: 50%;
	left: 15px;
	transform: translateY(-50%);
	border: none;
	background: transparent;
	pointer-events: none;
}

.link__left-line {
	padding: 5px 7px;
	position: relative;
	color: #acaeaf !important;
	font-size: 16px;
	font-weight: 500;
	line-height: normal;
	background: transparent;
	display: flex;
	flex-direction: row;
	gap: 10px;
	align-items: center;
	border-radius: 10px;
	width: fit-content;
}

.link__left-line:hover {
	color: #747474 !important;
}

.link__left-line:active {
	color: #717375 !important;
	opacity: 0.75;
}

.link__left-line:focus {
	color: #747474 !important;
	opacity: 1;
	background: rgba(217, 217, 217, 0.01);
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5);
}

.link__left-line.active {
	color: #8f86e0 !important;
	background: rgba(143, 134, 224, 0.07);
}

.link__left-line.active:before {
	position: absolute;
	width: 2px;
	height: 22px;
	top: 50%;
	left: -7px;
	translate: 0 -50%;
	content: '';
	background: #8f86e0;
}

.show-password:hover path {
	stroke: #2e3c59;
}

.show-password:active path {
	stroke-opacity: 0.6;
}

.show-password:active path {
	stroke-opacity: 0.6;
}

.show-password:focus {
	border-color: rgba(255, 255, 255, 0.01);
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5);
}

.text-neutral {
	color: var(--text-neutral) !important;
	transition: 0.2s ease all;
}

.card-interest {
	margin-bottom: 24px;
	background: var(--card-background-color);
	border: 2px solid var(--card-border-color);
	border-radius: 37px;
	height: calc(100% - 24px);
	cursor: pointer;
	transition: 0.2s ease all;
	user-select: none;
}

.card-interest:hover {
	border: 2px solid var(--card-hover-border-color);
}

.card-interest:active {
	border: 2px solid var(--card-active-border-color);
	opacity: 0.75;
}

.card-interest.selected {
	border: 2px solid var(--card-selected-border-color);
}
.card-interest:after {
	content: url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 5.70588L3.91667 9L11 1' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	position: absolute;
	right: -5px;
	top: -5px;
	width: 30px;
	text-align: center;
	height: 30px;
	border-radius: 50%;
	background: #8f86e0;
	transition: 0.2s ease all;
	opacity: 0;
}

.card-interest.selected:after {
	opacity: 1;
}

.card-interest .card-body {
	padding: 25px;
	text-align: center;
}

.card-interest .card-title {
	margin-bottom: 0;
	font-weight: 500;
	font-size: 18px;
	line-height: 25px;
	color: var(--text-default);
	font-family: var(--font-main);
	margin-top: 10px;
}

.interests-row > .row > * {
	padding-right: 12px;
	padding-left: 12px;
}

@media (max-width: 767px) {
	.auth-section {
		padding-top: 80px;
	}

	.card-auth .card-body {
		padding: 30px;
	}
	.card-auth .card-footer {
		padding: 30px;
		border-top: 0;
	}
}

@media (max-width: 575px) {
	.btn {
		padding: 15px 30px;
	}

	input:not(.input-search-global),
	textarea {
		height: 58px !important;
		font-weight: 500 !important;
		font-size: 16px !important;
		line-height: 23px !important;
		padding: 0 27px !important;
	}

	.form-group label {
		font-size: 16px;
		line-height: 23px;
		left: 28px !important;
	}

	.form-group.focused label,
	.form-group.filled label {
		top: 8.5px;
		font-size: 12px;
		line-height: 17px;
	}
}

input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type='number'] {
	-moz-appearance: textfield;
}

.badge {
	padding: 6px 12px;
	display: flex;
	align-items: center;
	gap: 10px;
	border-radius: 15px;
	font-weight: 500;
	font-size: 16px;
	line-height: 22px;
	color: rgba(0, 0, 0, 1);
	background: rgba(0, 0, 0, 0.05);
}

.badge.active {
	color: white;
	background: #2e3c59;
}

.btn.oc-attach-loader, .btn.oc-attach-loader * {
	color: transparent !important;
}

.btn.oc-attach-loader svg {
	opacity: 0 !important;
}

.btn.oc-attach-loader:after {
	font-size: initial;
	margin-left: 0 !important;
	position: absolute;
	width: 15px !important;
	height: 15px !important;
	border: 1.5px solid var(--text-inverse-default) !important;
	border-right-color: transparent !important;
	opacity: 1 !important;
}

.accordion .arrow {
	transition: 0.2s ease all;
}

.accordion .accordion-btn[aria-expanded='true'] .arrow {
	transform: rotate(-180deg);
}

.image-cover-preview {
	background-image: url("data:image/svg+xml,%3Csvg width='373' height='222' viewBox='0 0 373 222' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='373' height='222' fill='%23F5F5F5'/%3E%3Cpath d='M186 142.167C180.299 138.875 173.833 137.143 167.25 137.143C160.667 137.143 154.201 138.875 148.5 142.167V88C154.201 84.7087 160.667 82.976 167.25 82.976C173.833 82.976 180.299 84.7087 186 88M186 142.167C191.701 138.875 198.167 137.143 204.75 137.143C211.333 137.143 217.799 138.875 223.5 142.167V88C217.799 84.7087 211.333 82.976 204.75 82.976C198.167 82.976 191.701 84.7087 186 88M186 142.167V88M194 103V103C201.274 101.678 208.726 101.678 216 103V103M194 112.5V112.5C201.274 111.178 208.726 111.178 216 112.5V112.5M194 122V122C201.274 120.678 208.726 120.678 216 122V122M156 103V103C163.274 101.678 170.726 101.678 178 103V103M156 112.5V112.5C163.274 111.178 170.726 111.178 178 112.5V112.5M156 122V122C163.274 120.678 170.726 120.678 178 122V122' stroke='%23ACAEAF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	border-radius: 20px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.file-preview {
	background-image: url("data:image/svg+xml,%3Csvg width='150' height='90' viewBox='0 0 150 90' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='150' height='90' rx='10' fill='%23F5F5F5'/%3E%3Cpath d='M79.168 26.25V34.5833C79.168 35.1359 79.3875 35.6658 79.7782 36.0565C80.1689 36.4472 80.6988 36.6667 81.2513 36.6667H89.5846' stroke='%23717375' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M68.7513 38.75H70.8346M68.7513 47.0833H81.2513M68.7513 55.4167H81.2513M85.418 63.75H64.5846C63.4796 63.75 62.4198 63.311 61.6384 62.5296C60.857 61.7482 60.418 60.6884 60.418 59.5833V30.4167C60.418 29.3116 60.857 28.2518 61.6384 27.4704C62.4198 26.689 63.4796 26.25 64.5846 26.25H79.168L89.5846 36.6667V59.5833C89.5846 60.6884 89.1456 61.7482 88.3642 62.5296C87.5828 63.311 86.523 63.75 85.418 63.75Z' stroke='%23717375' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	border-radius: 20px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.video-preview {
	background-image: url("data:image/svg+xml,%3Csvg width='373' height='222' viewBox='0 0 373 222' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='373' height='222' rx='20' fill='%23F5F5F5'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M156.833 88C155.154 88 153.543 88.6673 152.355 89.855C151.167 91.0427 150.5 92.6536 150.5 94.3333V127.667C150.5 129.346 151.167 130.957 152.355 132.145C153.543 133.333 155.154 134 156.833 134H190.167C191.846 134 193.457 133.333 194.645 132.145C195.833 130.957 196.5 129.346 196.5 127.667V94.3333C196.5 92.6536 195.833 91.0427 194.645 89.855C193.457 88.6673 191.846 88 190.167 88H156.833ZM200.5 99.4309V94.3333C200.5 91.5928 199.411 88.9644 197.473 87.0266C195.536 85.0887 192.907 84 190.167 84H156.833C154.093 84 151.464 85.0887 149.527 87.0266C147.589 88.9644 146.5 91.5928 146.5 94.3333V127.667C146.5 130.407 147.589 133.036 149.527 134.973C151.464 136.911 154.093 138 156.833 138H190.167C192.907 138 195.536 136.911 197.473 134.973C199.411 133.036 200.5 130.407 200.5 127.667V122.569L216.577 130.606C217.516 131.075 218.561 131.297 219.611 131.25C220.66 131.203 221.681 130.888 222.575 130.336C223.468 129.783 224.206 129.012 224.718 128.094C225.23 127.177 225.499 126.143 225.5 125.093V96.9073C225.499 95.8565 225.23 94.8233 224.718 93.9058C224.206 92.9882 223.468 92.2167 222.575 91.6644C221.681 91.1121 220.66 90.7974 219.611 90.7501C218.561 90.7029 217.517 90.9246 216.577 91.3943L200.5 99.4309ZM200.5 103.903V118.097L218.365 127.028C218.365 127.028 218.365 127.028 218.365 127.028C218.695 127.193 219.062 127.271 219.431 127.254C219.8 127.237 220.158 127.127 220.472 126.933C220.786 126.739 221.046 126.468 221.225 126.145C221.405 125.823 221.5 125.46 221.5 125.091V96.9094C221.5 96.5402 221.405 96.1772 221.225 95.8548C221.046 95.5324 220.786 95.2614 220.472 95.0673C220.158 94.8733 219.8 94.7627 219.431 94.7461C219.062 94.7295 218.695 94.8073 218.365 94.9723C218.365 94.9723 218.365 94.9722 218.365 94.9723L200.5 103.903ZM163 96C160.791 96 159 97.7909 159 100C159 102.209 160.791 104 163 104C165.209 104 167 102.209 167 100C167 97.7909 165.209 96 163 96ZM155 100C155 95.5817 158.582 92 163 92C167.418 92 171 95.5817 171 100C171 104.418 167.418 108 163 108C158.582 108 155 104.418 155 100Z' fill='%23ACAEAF'/%3E%3C/svg%3E%0A");
	border-radius: 20px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.fw-medium {
	font-weight: 500 !important;
}

.icon-btn {
	opacity: 0.5;
	background: transparent;
	padding: 8px;
	border: none;
	border-radius: 10px;
	outline: none;
	height: 34px;
	width: 34px;
	transition: 0.2s ease all;
}

.icon-btn.icon-btn__20px {
	height: 36px;
	width: 36px;
}

.icon-btn.icon-btn__24px {
	height: 40px;
	width: 40px;
}

.icon-btn:hover {
	background: rgba(0, 0, 0, 0.07);
	opacity: 1;
}

.icon-btn:active,
.icon-btn:focus,
.icon-btn[aria-expanded='true'] {
	opacity: 0.75;
	box-shadow: 0px 0px 0px 2px rgba(46, 60, 89, 0.5);
}

.icon-btn svg {
	vertical-align: top;
}

.line-clamp-1 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	overflow: hidden;
}

.line-clamp-2 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
}

.line-clamp-3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
}

.text-transparent {
	color: transparent !important;
}

.w-fit-content {
	width: fit-content !important;
}

.link__icon-target {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	color: #717375 !important;
	font-size: 18px;
	font-weight: 500;
	line-height: normal;
	text-decoration-line: underline;
	border-radius: 10px;
	padding: 0.5px 2.5px;
}

.link__icon-target:hover {
	opacity: 0.75;
	text-decoration-line: underline !important;
}

.link__icon-target:active {
	opacity: 0.5;
	text-decoration-line: underline !important;
}

.link__icon-target:focus {
	opacity: 1;
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5);
	text-decoration: none !important;
}

.link__icon-target::before,
.link__icon-target_after::after {
	content: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.75 8V2.25M10 2.25H15.75M15.75 2.25L8 10M6.5 2.25H4.25C3.14543 2.25 2.25 3.14543 2.25 4.25V13.75C2.25 14.8546 3.14543 15.75 4.25 15.75H13.75C14.8546 15.75 15.75 14.8546 15.75 13.75V11.6731' stroke='%23717375' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	width: 18px;
	height: 18px;
}

.link__icon-target_purple {
	color: #bebef7 !important;
}

.link__icon-target_purple::before,
.link__icon-target_purple.link__icon-target_after::after {
	content: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.75 8V2.25M10 2.25H15.75M15.75 2.25L8 10M6.5 2.25H4.25C3.14543 2.25 2.25 3.14543 2.25 4.25V13.75C2.25 14.8546 3.14543 15.75 4.25 15.75H13.75C14.8546 15.75 15.75 14.8546 15.75 13.75V11.6731' stroke='%23BEBEF7' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.link__icon-target_after::before {
	content: none;
}

.tox-editor-header {
	border-radius: 0px !important;
	background: #f2f2f2 !important;
	border-bottom: 2px solid #e3e3e3 !important;
	box-shadow: none !important;
	padding: 7px 8px 6px !important;
}

.tox .tox-toolbar__group {
	padding: 0px 12px !important;
}

.tox-editor-header > div,
.tox-editor-header > div > div {
	background: #f2f2f2 !important;
}

.tox-tinymce {
	border-radius: 10px !important;
	border: 1px solid #e3e3e3 !important;
	background: #fff !important;
}

.tox .tox-tbtn {
	margin: 1px 0px 1px 0 !important;
}

.stats-block {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 12px 24px;
}

.stats-block__mini {
	gap: 6px 12px;
}

.stats-block__item {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.stats-block__item > p {
	color: #000;
	font-size: 20px;
	font-weight: 500;
	line-height: normal;
	margin: 0;
	white-space: nowrap;
}

.stats-block__item > p > span {
	color: rgba(0, 0, 0, 0.5);
}

.stats-block__item > span {
	color: #acaeaf;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

.stats-block__line {
	background: #acaeaf;
	opacity: 0.25;
	width: 1px;
	height: 37px;
	margin: 0;
	padding: 0;
}

.stats-block__center .stats-block__item > p,
.stats-block__center .stats-block__item > span {
	text-align: center;
}

.check-balance {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 12px 24px;
	align-items: center;
}

.check-balance.plus p {
	color: #50b700;
}
.check-balance.minus p {
	color: #ff4444;
}

.check-balance h1,
.check-balance__h1 {
	color: #000;
	font-size: 32px;
	font-weight: 500;
	line-height: normal;
	margin: 0;
	font-family: var(--font-main);
}

.check-balance span,
.check-balance__h1 span {
	opacity: 0.5;
}

.check-balance p {
	color: #000;
	font-size: 17px;
	font-weight: 500;
	line-height: normal;
	margin: 0;
}

.balance-user {
	border-radius: 25px;
	background: #fff;
	padding: 20px;
	display: flex;
	gap: 12px;
	align-items: center;
}

.balance-user__image {
	width: 45px;
	height: 45px;
	border-radius: 12px;
}

.balance-user__content {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
}

.balance-user__details {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
}

.balance-user__details p {
	color: rgba(172, 174, 175, 1);
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

.balance-user__data {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.balance-user__data h3::before {
	content: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2387_8776)'%3E%3Cpath d='M2.5928 12.9005C3.48424 14.3617 4.86145 15.4941 6.5 16.0732C7.28195 16.3496 8.12341 16.5 9 16.5C13.1421 16.5 16.5 13.1421 16.5 9C16.5 7.63633 16.1361 6.35766 15.5 5.25583C14.6129 3.71913 13.1965 2.52641 11.5 1.92677C10.7181 1.65039 9.87659 1.5 9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 10.4287 1.89947 11.7641 2.5928 12.9005ZM2.5928 12.9005C2.56126 12.8488 2.53032 12.7967 2.5 12.7442M7.5 8.75V5.75H10.125C10.5228 5.75 10.9044 5.90804 11.1857 6.18934C11.467 6.47064 11.625 6.85218 11.625 7.25C11.625 7.64782 11.467 8.02936 11.1857 8.31066C10.9044 8.59196 10.5228 8.75 10.125 8.75H7.5ZM7.5 8.75V10.5M7.5 12.25V10.5M7.5 10.5H9.5M7.5 10.5H6.5' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2387_8776'%3E%3Crect width='18' height='18' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
	margin-right: 0px;
	opacity: 0.3;
	width: 18px;
	height: 18px;
	margin-top: -2px;
}

.balance-user__data h3:has(.balance-user__time)::before {
	margin-right: -7px;
}

.balance-user__time {
	opacity: 0.3;
	color: #000;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
}

.checkbox-toggle {
	position: relative;
	display: flex;
	flex-direction: row;
	gap: 24px;
	align-items: center;
}

.checkbox-toggle input {
	display: none;
}

.checkbox-toggle__slider {
	position: relative;
	cursor: pointer;
	background-color: #ccc;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	border-radius: 20px;
	width: 50px;
	height: 30px;
	min-width: 50px;
	max-width: 50px;
	display: block;
}

.checkbox-toggle__slider:before {
	position: absolute;
	content: '';
	height: 22px;
	width: 22px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	border-radius: 50%;
}

input:checked + .checkbox-toggle__slider {
	background-color: #2e3c59;
}

input:checked + .checkbox-toggle__slider:before {
	-webkit-transform: translateX(20px);
	-ms-transform: translateX(20px);
	transform: translateX(20px);
}

input:checked + .checkbox-toggle__slider:hover {
	background: #424f69;
}

input:checked + .checkbox-toggle__slider:active {
	background: #293650;
}

input:not(:checked) + .checkbox-toggle__slider:hover {
	background: #cacaca;
}

input:not(:checked) + .checkbox-toggle__slider:active {
	background: #b3b3b3;
}

input:not(:checked) + .checkbox-toggle__slider:active::before {
	background: #ececec;
}

.checkbox-toggle__slider:focus,
input:focus .checkbox-toggle__slider {
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5) !important;
}

input:disabled + .checkbox-toggle__slider,
input.disabled + .checkbox-toggle__slider {
	opacity: 0.5 !important;
	background: #e0e0e0 !important;
}

label {
	margin-bottom: 0;
}

.checkbox-toggle__label {
	display: flex;
	flex-direction: row;
	gap: 12px;
	align-items: center;
	color: #000 !important;
	font-size: 18px;
	font-weight: 500;
	line-height: normal;
}

.checkbox-toggle__desc {
	display: flex;
	flex-direction: row;
	gap: 12px;
	align-items: center;
	color: rgba(0, 0, 0, 0.5) !important;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

.checkbox-block {
	display: flex;
	flex-direction: row;
	gap: 24px;
	align-items: center;
	position: relative;
}

.checkbox-block input {
	display: none;
}

.checkbox-block__radio {
	position: relative;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: rgba(224, 224, 224, 1);
	transition: 0.3s all;
}

.checkbox-block__radio::after {
	content: '';
	width: 14px;
	height: 14px;
	background: #ffffff;
	border-radius: 50%;
	position: absolute;
	top: 5px;
	left: 5px;
	scale: 0;
	transition: 0.3s all;
}

input:checked + .checkbox-block__radio {
	background: #2e3c59;
}

input:checked + .checkbox-block__radio::after {
	scale: 1;
}

input:checked + .checkbox-block__radio:hover {
	background: #424f69;
}

input:checked + .checkbox-block__radio:active {
	background: #293650;
}

input:not(:checked) + .checkbox-block__radio:hover {
	background: #cacaca;
}

input:not(:checked) + .checkbox-block__radio:active {
	background: #b3b3b3;
}

.checkbox-block__radio:focus,
input:focus .checkbox-block__radio {
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5) !important;
}

input:disabled + .checkbox-block__radio,
input.disabled + .checkbox-block__radio {
	opacity: 0.5 !important;
	background: #e0e0e0 !important;
}

.checkbox-block__labels {
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 667px;
	width: 100%;
}

.checkbox-block__title {
	color: #000 !important;
	font-size: 18px;
	font-weight: 500;
	line-height: normal;
}

.checkbox-block__desc {
	color: rgba(113, 115, 117, 1) !important;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

.btn-disabled {
	cursor: default !important;
	-webkit-user-select: none !important;
	-moz-user-select: none !important;
	-ms-user-select: none !important;
	user-select: none !important;
	pointer-events: none !important;
	opacity: 0.3 !important;
}

.balance-payments {
	border-radius: 25px;
	background: #fff;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.balance-payments__head {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-direction: row;
}

.balance-payments__image {
	width: 39px;
	height: 39px;
	border-radius: 50%;
}

.balance-payments__head-text {
	color: #82817e;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
	margin: 0;
}

.balance-payments__data {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 12px;
}

.balance-payments__data-item {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
}

.balance-payments__data-item p {
	color: #acaeaf;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
	margin: 0;
}

.balance-payments__data-item span {
	color: #717375;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

.balance-payments .course-status {
	width: fit-content;
}

progress {
	background: #e3e3e3;
	border: 0;
	height: 6px;
	border-radius: 12px;
}
progress::-webkit-progress-bar {
	background: #e3e3e3;
	border-radius: 12px;
}
progress::-webkit-progress-value {
	background: #2e3c59;
	border-radius: 12px;
}
progress::-moz-progress-bar {
	background: #2e3c59;
	border-radius: 12px;
}

.stat-volume {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.stat-volume__numbers {
	display: flex;
	flex-direction: row;
	gap: 12px;
	align-items: center;
	color: #000;
	font-size: 20px;
	font-weight: 500;
	line-height: normal;
}

.stat-volume__numbers span {
	color: rgba(172, 174, 175, 1);
	font-size: 20px;
	font-weight: 500;
	line-height: normal;
}

.stat-volume progress {
	max-width: 300px;
	margin-bottom: 6px;
}

.stat-volume__text {
	color: rgba(172, 174, 175, 1);
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

.btn {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	border: 2px solid transparent;
	padding: 12px 30px;
	gap: 10px;
	font-weight: 500;
	font-size: 16px;
	line-height: 22px;
}

.btn-slim {
	padding: 13.5px 15px;
}

.btn-slim-2 {
	padding: 13.5px 20px;
}

.btn-sm {
	padding: 9px 30px;
	border-radius: 10px;
}

.btn:focus {
	border: 2px solid #2e3c59;
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5) !important;
}

.btn.icon-only {
	padding: 14px;
}

.btn-outline-dark.no-outline {
	border-color: transparent;
}

.btn-outline-dark.no-outline:hover {
	border-color: #2e3c59;
	background: #2e3c59;
}

.btn-outline-dark {
	border-color: #2e3c59;
}

.btn-outline-dark:hover, .btn-outline-dark.oc-attach-loader {
	background: #2e3c59;
}

.btn-outline-dark:hover path {
	stroke: white !important;
}

.btn-outline-delete {
	border-color: #ff4444;
	color: #ff4444;
	transition: 0.3s all;
}

.btn-outline-delete:hover {
	border-color: #ff4444;
	background: #ff4444;
	color: #ffffff;
}

.btn-outline-delete:active {
	border-color: #ff4444 !important;
	background: #ff4444 !important;
	color: #ffffff;
}

.btn-outline-delete:focus {
	border-color: #ff4444;
	background: #ff4444;
	color: #ffffff;
	box-shadow: 0px 0px 0px 4px rgba(255, 68, 68, 0.5) !important;
}

.btn-outline-delete svg {
	transition: 0s all;
}

.btn-mini {
	padding: 7.5px 19px !important;
}

.btn-dark {
	border-color: #2e3c59;
	background: #2e3c59;
	color: white;
}

.btn-soft {
	background: #e8ecf3;
	color: #2e3c59;
}

.btn-back {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--light-gray);
	transition: 0.2s ease all;
}

.btn-back:hover {
	color: var(--text-default);
}

.btn-back:hover path {
	stroke: var(--text-default);
}

.header-default {
	display: flex;
	flex-direction: column;
	gap: 0;
	z-index: 100;
	background: #fff;
}

.header-default__top {
	padding: 21px 20px 22px;
	display: flex;
	flex-direction: row;
	gap: 26px;
}

.header-default__top-block {
	height: 12px;
	background: #d9d9d9;
}

.header-default__hr {
	margin: 0;
	padding: 0;
	border: none;
	height: 1px;
	width: 100%;
	opacity: 0.1;
	background: rgba(113, 115, 117, 1);
}

.header-default__main {
	z-index: 10;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	background: currentColor;
	padding: 13px 20px;
	border-bottom: 1px solid rgba(113, 115, 117, .1);
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}

.header-default__buttons {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 12px;
}

.header-default__bottom {
	display: flex;
	flex-direction: row;
	align-items: center;
	max-width: 100%;
	overflow-x: auto;
	scrollbar-width: 0;
	padding: 12.5px 20px;
	margin-top: 77px;
	border-bottom: 1px solid rgba(113, 115, 117, .1);
	scrollbar-width: none;
}

.header-default__bottom::-webkit-scrollbar {
	display: none;
}

.header-default__group {
	display: flex;
	flex-direction: row;
	gap: 48px;
	align-items: center;
}

.header-default__notify-btn {
	width: 50px;
	height: 50px;
	padding: 10px;
	border-radius: 15px;
	background: transparent;
	position: relative;
}

.header-default__notify-btn:hover {
	background: rgba(46, 60, 89, 0.15);
}

.header-default__notify-btn:active {
	opacity: 0.75;
	background: rgba(46, 60, 89, 0.15);
}

.header-default__notify-btn svg {
	fill: #2e3c59;
}

.header-default__notify-btn span {
	position: absolute;
	top: 4px;
	right: 4px;
	padding: 0 7.5px;
	border-radius: 11px;
	background: #ff4e4e;
	text-align: center;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	line-height: normal;
}

.header-default__user {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 14px;
	padding: 0 32px 0 0;
	position: relative;
}

.header-default__user:after {
	right: 0 !important;
}

.header-default__user-image {
	width: 40px;
	height: 40px;
	border-radius: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.header-default__user-data {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.header-default__user-name {
	color: #000;
	font-size: 16px;
	font-weight: 500;
	line-height: normal;
	margin: 0;
}

.header-default__user-group {
	color: #acaeaf;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

.nav-menu {
	padding: 3px 0 31px 0;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 34px;
}

.nav-menu__link {
	color: var(--text-default);
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	white-space: nowrap;
	position: relative;
	border-radius: 10px;
	transition: 0.2s ease all;
	padding: 5px 10px;
}

.nav-menu__link:hover {
	color: #00000075 !important;
}

.nav-menu__link:active {
	opacity: 0.3;
}

.nav-menu__link:focus {
	color: #2e3c59 !important;
	box-shadow: 0px 0px 0px 4px rgba(46, 60, 89, 0.5);
	opacity: 1;
}

.nav-menu__link:focus::after {
	content: none;
}

.nav-menu__link.active {
	color: #000 !important;
}

.nav-menu__link.active::after {
	content: '';
    background: #8f86e0;
    opacity: 1;
    display: block;
    height: 3px;
    position: absolute;
    bottom: -3px;
    width: calc(100% - 10px);
    left: 50%;
    transform: translateX(-50%);
}

.checkbox-mark {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 15px;
}

.checkbox-mark input {
	width: 28px;
	height: 28px;
}

.checkbox-mark label {
	color: rgba(113, 115, 117, 1) !important;
	font-size: 18px;
	font-weight: 400;
	line-height: normal;
}

.list-border-left {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
	padding: 0;
}

.list-border-left li {
	list-style-type: none !important;
	color: #000000;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	display: flex;
	width: 100%;
	flex-direction: row;
	align-items: center;
	gap: 24px;
	position: relative;
	padding: 0 0 0 14px;
	margin: 0;
}

.list-border-left li:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 2px;
	background: rgba(172, 174, 175, 1);
	border-radius: 11px;
	opacity: 0.3;
}

.list-border-left .not-ready,
.list-border-left .ready {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 6px;
}

.list-border-left .not-ready::after,
.list-border-left .ready::after {
	width: 15px;
	height: 15px;
	line-height: 0;
	display: inline-block;
}

.list-border-left .ready {
	color: #000000;
}

.list-border-left .ready::after {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6422 0 15 3.35775 15 7.5C15 11.6422 11.6422 15 7.5 15C3.35775 15 0 11.6422 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='%2350B700'/%3E%3Cpath d='M4 7.82891L6.08696 10L11 5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.list-border-left .not-ready {
	color: rgba(113, 115, 117, 1);
}

.list-border-left .not-ready::after {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6422 0 15 3.35775 15 7.5C15 11.6422 11.6422 15 7.5 15C3.35775 15 0 11.6422 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='%23ACAEAF'/%3E%3Cpath d='M7.8 10.9944C10.1196 10.9944 12 9.4185 12 7.47459C12 6.51555 11.5423 5.6461 10.8 5.01127M7.8 10.9944L10.2 12M7.8 10.9944L9 8.98306M7.2 4.00565C4.8804 4.00565 3 5.5815 3 7.52541C3 8.48445 3.45769 9.3539 4.2 9.98873M7.2 4.00565L4.8 3M7.2 4.00565L6 6.01694' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.pagination-bottom {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 12px;
	border: 1px solid #eee;
	border-top: none;
	background: #fff;
	width: 100%;
	padding: 14.5px 13px 26.5px 13px;
}

.user-grade__content {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.user-grade {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 2px;
	border: 1px solid transparent;
	border-radius: 14px;
	cursor: pointer;
	transition: 0.2s all ease;
}

.user-grade:hover {
	background: rgba(0, 0, 0, 0.05);
}

.user-grade:active {
	border-color: #acaeaf;
}

.user-grade.active {
	border-color: #acaeaf;
}

.user-grade.active .user-grade__name,
.user-grade.active .user-grade__lesson.done {
	background: #000;
	color: #fff;
}

.user-grade.active .user-grade__name::before,
.user-grade.active .user-grade__lesson.done::before {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6422 0 15 3.35775 15 7.5C15 11.6422 11.6422 15 7.5 15C3.35775 15 0 11.6422 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='white'/%3E%3Cpath d='M4 7.82891L6.08696 10L11 5' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.user-grade__name {
	border-radius: 22px;
	background: rgba(172, 174, 175, 1);
	padding: 2px 6px 2px 4px;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 4px;
	width: fit-content;
}

.user-grade__name p {
	margin: 0;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 2px;
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
}

.user-grade__name p::before {
	content: url("data:image/svg+xml,%3Csvg width='8' height='19' viewBox='0 0 8 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='4' cy='11' r='4' fill='white'/%3E%3C/svg%3E%0A");
	width: 8px;
	height: 16px;
	line-height: 0;
	margin-top: -4px;
	display: inline-block;
}

.user-grade__name span {
	color: #fff;
	font-size: 12px;
	font-weight: 400;
	line-height: normal;
	opacity: 0.5;
}

.user-grade__name::before {
	width: 15px;
	height: 15px;
	line-height: 0;
	display: inline-block;
}
.user-grade.done .user-grade__name {
	background: rgba(80, 183, 0, 1);
}

.user-grade.done .user-grade__name::before {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6422 0 15 3.35775 15 7.5C15 11.6422 11.6422 15 7.5 15C3.35775 15 0 11.6422 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='white'/%3E%3Cpath d='M4 7.82891L6.08696 10L11 5' stroke='%2350B700' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.user-grade.start .user-grade__name::before {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6422 0 15 3.35775 15 7.5C15 11.6422 11.6422 15 7.5 15C3.35775 15 0 11.6422 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='%23717375'/%3E%3Cpath d='M7.8 10.9944C10.1196 10.9944 12 9.4185 12 7.47459C12 6.51555 11.5423 5.6461 10.8 5.01127M7.8 10.9944L10.2 12M7.8 10.9944L9 8.98306M7.2 4.00565C4.8804 4.00565 3 5.5815 3 7.52541C3 8.48445 3.45769 9.3539 4.2 9.98873M7.2 4.00565L4.8 3M7.2 4.00565L6 6.01694' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.user-grade__lessons {
	display: flex;
	gap: 2px;
	flex-direction: row;
	flex-wrap: wrap;
}

.user-grade__lesson {
	min-width: 26px;
	padding: 2px 4px;
	text-align: center;
	border-radius: 22px;
	background: rgba(172, 174, 175, 1);
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: 4px;
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	margin: 0;
	opacity: 0.5;
}

.user-grade__lesson.done {
	opacity: 1;
	background: rgba(80, 183, 0, 0.15);
	color: rgba(80, 183, 0, 1);
	padding: 2px 6px 2px 4px;
}

.user-grade__lesson.done::before {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6422 0 15 3.35775 15 7.5C15 11.6422 11.6422 15 7.5 15C3.35775 15 0 11.6422 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='%2350B700'/%3E%3Cpath d='M4 7.82891L6.08696 10L11 5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	width: 15px;
	height: 15px;
	line-height: 0;
	display: inline-block;
}

.user-grade__lesson.error {
	opacity: 1;
	background: rgba(255, 68, 68, 1);
	color: rgba(255, 255, 255, 1);
	padding: 2px 6px 2px 4px;
}

.user-grade__lesson.error::before {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6422 0 15 3.35775 15 7.5C15 11.6422 11.6422 15 7.5 15C3.35775 15 0 11.6422 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='white'/%3E%3Cpath d='M5.04348 10L7.5 7.5M10 5L7.5 7.5M7.5 7.5L5 5M7.5 7.5L10 10' stroke='%23FF4444' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	width: 15px;
	height: 15px;
	line-height: 0;
	display: inline-block;
}

.user-grade__lesson span {
	opacity: 0.5;
	font-size: 12px;
}

.viewed-time {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
}

.viewed-time__time {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	gap: 9px;
}

.viewed-time__time p {
	color: #acaeaf;
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
	margin: 0;
}

.viewed-time__bar {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 0;
	border-radius: 6px;
	background: #e4e4e4;
	height: 30px;
	width: 100%;
	overflow: hidden;
}

.viewed-time__bar span {
	height: 30px;
	margin: 0;
	padding: 0;
}

.viewed-time__bar .orange {
	background: #ffb547;
}

.viewed-time__bar .green {
	background: #50b700;
}

.viewed-time__bar .red {
	background: #ff2e00;
}

.viewed-time__bar .streaks {
	background-image: url("data:image/svg+xml,%3Csvg width='470' height='30' viewBox='0 0 470 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.9023 -4.27002L18.0985 -1.27002L-3.4015 35.9691L-8.59766 32.9691L12.9023 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M12.9023 -4.27002L18.0985 -1.27002L-3.4015 35.9691L-8.59766 32.9691L12.9023 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M29.9023 -4.27002L35.0985 -1.27002L13.5985 35.9691L8.40234 32.9691L29.9023 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M46.9023 -4.27002L52.0985 -1.27002L30.5985 35.9691L25.4023 32.9691L46.9023 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M63.9023 -4.27002L69.0985 -1.27002L47.5985 35.9691L42.4023 32.9691L63.9023 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M80.9023 -4.27002L86.0985 -1.27002L64.5985 35.9691L59.4023 32.9691L80.9023 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M97.9023 -4.27002L103.098 -1.27002L81.5985 35.9691L76.4023 32.9691L97.9023 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M114.902 -4.27002L120.098 -1.27002L98.5985 35.9691L93.4023 32.9691L114.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M131.902 -4.27002L137.098 -1.27002L115.598 35.9691L110.402 32.9691L131.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M148.902 -4.27002L154.098 -1.27002L132.598 35.9691L127.402 32.9691L148.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M165.902 -4.27002L171.098 -1.27002L149.598 35.9691L144.402 32.9691L165.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M182.902 -4.27002L188.098 -1.27002L166.598 35.9691L161.402 32.9691L182.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M199.902 -4.27002L205.098 -1.27002L183.598 35.9691L178.402 32.9691L199.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M216.902 -4.27002L222.098 -1.27002L200.598 35.9691L195.402 32.9691L216.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M233.902 -4.27002L239.098 -1.27002L217.598 35.9691L212.402 32.9691L233.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M250.902 -4.27002L256.099 -1.27002L234.598 35.9691L229.402 32.9691L250.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M267.902 -4.27002L273.099 -1.27002L251.599 35.9691L246.402 32.9691L267.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M284.902 -4.27002L290.099 -1.27002L268.599 35.9691L263.402 32.9691L284.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M301.902 -4.27002L307.099 -1.27002L285.599 35.9691L280.402 32.9691L301.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M318.902 -4.27002L324.099 -1.27002L302.599 35.9691L297.402 32.9691L318.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M335.902 -4.27002L341.099 -1.27002L319.599 35.9691L314.402 32.9691L335.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M352.902 -4.27002L358.099 -1.27002L336.599 35.9691L331.402 32.9691L352.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M369.902 -4.27002L375.099 -1.27002L353.599 35.9691L348.402 32.9691L369.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M386.902 -4.27002L392.099 -1.27002L370.599 35.9691L365.402 32.9691L386.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M403.902 -4.27002L409.099 -1.27002L387.599 35.9691L382.402 32.9691L403.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M420.902 -4.27002L426.099 -1.27002L404.599 35.9691L399.402 32.9691L420.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M437.902 -4.27002L443.099 -1.27002L421.599 35.9691L416.402 32.9691L437.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M454.902 -4.27002L460.099 -1.27002L438.599 35.9691L433.402 32.9691L454.902 -4.27002Z' fill='%23CACACA'/%3E%3Cpath d='M471.902 -4.27002L477.099 -1.27002L455.599 35.9691L450.402 32.9691L471.902 -4.27002Z' fill='%23CACACA'/%3E%3C/svg%3E%0A");
}

.viewed-time__status {
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	border-radius: 22px;
	opacity: 0.5;
	background: #acaeaf;
	padding: 2px 7px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 4px;
	align-items: center;
	margin: 0;
}

.viewed-time__status.done {
	padding: 2px 6px 2px 4px;
	color: #50b700;
	background: rgba(80, 183, 0, 0.15);
	opacity: 1;
}
.viewed-time__status.done:before {
	content: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.5 0C11.6423 0 15 3.35775 15 7.5C15 11.6423 11.6423 15 7.5 15C3.35775 15 0 11.6423 0 7.5C0 3.35775 3.35775 0 7.5 0Z' fill='%2350B700'/%3E%3Cpath d='M4 7.82891L6.08696 10L11 5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
	width: 15px;
	height: 15px;
	margin-top: -2px;
}

.circle-wrap {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	position: relative;
	background-color: #d8d9da;
}

.circle-wrap .circle .mask,
.circle-wrap .circle .fill {
	width: 25px;
	height: 25px;
	position: absolute;
	border-radius: 50%;
	transition: 0.2s ease all;
}

.mask .fill {
	clip: rect(0px, 12.5px, 25px, 0px);
	background-color: #8f86e0;
}
.circle-wrap .circle .mask {
	clip: rect(0px, 25px, 25px, 12.5px);
}


.certificate-file, .certificate-file-uploading {
	width: 178px;
	height: 237px;
	background-color: #F2F2F2;
	border-radius: 10px;
	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
	cursor: pointer;
	transition: .2s ease all;
	position: relative;
	flex: none;
	overflow: hidden;
	isolation: isolate;
}

.certificate-file:hover {
	background-size: 105%;
}

.btn-certificate-delete {
	position: absolute;
	border: 0;
	top: 10px;
	right: 10px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #E8ECF3;
	cursor: pointer;
	transition: .2s ease all;
}

.btn-certificate-delete:after {
	content: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6L12 12M6 12L12 6' stroke='%232E3C59' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
	text-align: center;
	line-height: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: .2s ease all;
}

.btn-certificate-delete:hover {
	transform: scale(1.15);
}

.btn-certificate-delete:active {
	transform: scale(.9);
}

.btn-certificate-upload {
	width: 178px;
	height: 237px;
	border-radius: 15px;
	border: 2px solid #2E3C59;
	cursor: pointer;
	position: relative;
	transition: .2s ease all;
	flex: none;
}

.btn-certificate-upload:after {
	content: url("data:image/svg+xml,%3Csvg width='18' height='19' viewBox='0 0 18 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 4.25V14.75M3.75 9.5H14.25' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	text-align: center;
	line-height: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: .2s ease all;
}

.btn-certificate-upload:hover {
	background: #E8ECF340;
}

.btn-certificate-upload:active {
	opacity: .35
}

.certificate-file-uploading:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, .25);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}

.certificate-file-uploading.error:after {
	content: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 20 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.26768 4.25C9.03748 2.91667 10.962 2.91667 11.7318 4.25L17.794 14.75C18.5638 16.0833 17.6015 17.75 16.0619 17.75H3.93756C2.39795 17.75 1.4357 16.0833 2.2055 14.75L8.26768 4.25ZM10.9998 8.25V12.25C10.9998 12.8023 10.552 13.25 9.99976 13.25C9.44747 13.25 8.99976 12.8023 8.99976 12.25V8.25C8.99976 7.69772 9.44747 7.25 9.99976 7.25C10.552 7.25 10.9998 7.69772 10.9998 8.25ZM8.99976 15.25C8.99976 14.6977 9.44747 14.25 9.99976 14.25C10.552 14.25 10.9998 14.6977 10.9998 15.25C10.9998 15.8023 10.552 16.25 9.99976 16.25C9.44747 16.25 8.99976 15.8023 8.99976 15.25Z' fill='%23FF4D4D'/%3E%3C/svg%3E%0A");
	position: absolute;
	top: 103.5px;
	left: 74px;
	width: 30px;
	height: 30px;
	line-height: 0;
}

.certificate-file-uploading.error:before {
	background: rgba(255, 77, 77, .2);
}

.certificate-file-uploading:not(.error):after {
	content: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 21 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.25 10C17.6642 10 18.0039 9.66337 17.9625 9.25122C17.8402 8.03242 17.4208 6.85803 16.736 5.83322C15.9119 4.59985 14.7406 3.63856 13.3701 3.0709C11.9997 2.50325 10.4917 2.35472 9.03682 2.64411C7.58196 2.9335 6.24559 3.64781 5.1967 4.6967C4.14781 5.74559 3.4335 7.08196 3.14411 8.53682C2.85472 9.99168 3.00325 11.4997 3.5709 12.8701C4.13856 14.2406 5.09985 15.4119 6.33322 16.236C7.35803 16.9208 8.53242 17.3402 9.75122 17.4625C10.1634 17.5039 10.5 17.1642 10.5 16.75C10.5 16.3358 10.1629 16.0048 9.75193 15.9532C8.83032 15.8374 7.94457 15.5087 7.16658 14.9888C6.17988 14.3295 5.41085 13.3925 4.95672 12.2961C4.5026 11.1997 4.38378 9.99334 4.61529 8.82946C4.8468 7.66557 5.41824 6.59647 6.25736 5.75736C7.09647 4.91824 8.16557 4.3468 9.32946 4.11529C10.4933 3.88378 11.6997 4.0026 12.7961 4.45672C13.8925 4.91085 14.8295 5.67988 15.4888 6.66658C16.0087 7.44457 16.3374 8.33032 16.4532 9.25193C16.5048 9.66291 16.8358 10 17.25 10Z' fill='black'/%3E%3C/svg%3E%0A");
	position: absolute;
	top: 103.5px;
	left: 74px;
	width: 30px;
	height: 30px;
	line-height: 0;
	-webkit-animation: rotating .7s linear infinite;
    -moz-animation: rotating .7s linear infinite;
    -ms-animation: rotating .7s linear infinite;
    -o-animation: rotating .7s linear infinite;
    animation: rotating .7s linear infinite;
}

@-webkit-keyframes rotating {
  	from {
    	-webkit-transform: rotate(0deg);
    	-o-transform: rotate(0deg);
    	transform: rotate(0deg);
  	}
  	to {
    	-webkit-transform: rotate(360deg);
    	-o-transform: rotate(360deg);
    	transform: rotate(360deg);
  	}
}
@keyframes rotating {
  	from {
    	-ms-transform: rotate(0deg);
    	-moz-transform: rotate(0deg);
    	-webkit-transform: rotate(0deg);
    	-o-transform: rotate(0deg);
    	transform: rotate(0deg);
  	}
  	to {
    	-ms-transform: rotate(360deg);
    	-moz-transform: rotate(360deg);
    	-webkit-transform: rotate(360deg);
    	-o-transform: rotate(360deg);
    	transform: rotate(360deg);
  	}
}