.auth{
	padding-top: 6rem;
}

.auth__wrapper{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 4rem;
	padding: 7rem 0;
}

.auth__form{
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 2rem;
	width: 40rem;
}

.auth__field{
	flex: 1;
}



.auth__input {
	height: 2.5rem;
	width: 100%;
}


.auth__error {
	color: var(--color-danger); /* красный цвет для ошибок */
	font-size: 1.2rem;
	margin-top: 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #ecc7cb;
	border: 1px solid var(--color-danger);
	border-radius: 1.5rem;
	padding: 3rem 3rem;
}



/* auth check  */
.auth__check-field {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.auth__check-label {
    cursor: pointer;
    font-size: var(--text-small);
    color: var(--color-body);
}

.checkbox-wrapper-12 {
    position: relative;
    display: flex;
    align-items: center;
    gap: 4.5rem;
}
.checkbox-wrapper-12 > svg {
    position: absolute;
    top: -130%;
    left: -170%;
    width: 110px;
    pointer-events: none;
}
.checkbox-wrapper-12 * {
    box-sizing: border-box;
}
.checkbox-wrapper-12 input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    margin: 0;
    position: absolute;
    width: 24px;
    height: 24px;
    border: 2px solid #009933;
    border-radius: 50%;
}
.checkbox-wrapper-12 input[type="checkbox"]:checked + label + svg path {
    stroke-dashoffset: 0;
}
.checkbox-wrapper-12 .cbx {
    width: 24px;
    height: 24px;
    position: relative;
}
.checkbox-wrapper-12 .cbx label {
    width: 24px;
    height: 24px;
    background: none;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-filter: url("#goo-12");
    filter: url("#goo-12");
    pointer-events: none;
}
.checkbox-wrapper-12 .cbx svg {
    position: absolute;
    top: 5px;
    left: 4px;
    z-index: 1;
    pointer-events: none;
}
.checkbox-wrapper-12 .cbx svg path {
    stroke: #fff;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 19;
    stroke-dashoffset: 19;
    transition: stroke-dashoffset 0.3s ease 0.2s;
}
.checkbox-wrapper-12 .cbx input:checked + label {
    animation: splash-12 0.6s ease forwards;
}
@keyframes splash-12 {
    40% {
        background: #009933;
        box-shadow: 0 -18px 0 -8px #009933, 16px -8px 0 -8px #009933, 16px 8px 0 -8px #009933, 0 18px 0 -8px #009933, -16px 8px 0 -8px #009933, -16px -8px 0 -8px #009933;
    }
    100% {
        background: #009933;
        box-shadow: 0 -36px 0 -10px transparent, 32px -16px 0 -10px transparent, 32px 16px 0 -10px transparent, 0 36px 0 -10px transparent, -32px 16px 0 -10px transparent, -32px -16px 0 -10px transparent;
    }
}




.auth__btn{
	width: 100%;
}

.auth__forgot{
	font-size: var(--text-small);
}

/* verification */

.verif__btn{
	/* width: 25rem; */
}



/* confirm */

.confirm{
	align-items: center;
	justify-content: center;
	height: 50vh;
}


/* reset */

.reset__wrapper{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 2rem;
}