.user-orders__items {
	display: flex;
	flex-direction: column;
	row-gap: 5px;
}

.user-orders__item {
	display: flex;
	flex-direction: column;
	row-gap: 5px;
	padding: 16px;
	border-radius: 20px;
	background: #F4F4F4;
}

.user-orders__info {
	display: flex;
	align-items: flex-start;
	column-gap: 20px;

	padding: 26px;
	border-radius: 20px;
	background: #fff;
}

@media (max-width: 768px) {
	.user-orders__info{
		flex-direction: column;
		align-items: flex-start;
		row-gap: 20px;
		padding: 20px;
	}
}

.user-orders__leftside {
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
	row-gap: 20px;
}

.user-orders__leftside	ul {
	display: flex;
	flex-direction: column;
	row-gap: 5px;
}

.user-orders__leftside ul	li {
	display: flex;
	align-items: center;
	column-gap: 8px;
}
@media (max-width: 468px) {
	.user-orders__leftside ul li{
		flex-direction: column;
		align-items: flex-start;
	}
}
.user-orders__leftside ul li span:first-child{
	color: #848484;
}

.user-orders__rightside {
	padding-right: 10px;
	display: flex;
	flex-direction: column;
	row-gap: 12px;
}

.user-orders__rightside	a,
.user-orders__rightside	button {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;

	color: #F4283C;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: 14%;
	text-underline-offset: 22%;
	text-underline-position: from-font;
}

.user-orders__rightside a svg,
.user-orders__rightside a img,
.user-orders__rightside button svg,
.user-orders__rightside button img{
	width: 20px;
	height: 20px;
	object-fit: contain;
}

.green-label {
	color: #239115;
}
.red-label {
	color: #F4283C;
}
.yellow-label {
	color: #dbbc0d;
}

.user-orders-spoller {
	padding: 20px 26px;
	border-radius: 20px;
	background: #fff;
}

.user-orders-spoller__title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}

.user-orders-spoller__title	span:last-child {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;

	color: #F4283C;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: 14%;
	text-underline-offset: 22%;
	text-underline-position: from-font;
	transition: all 0.5s ease;
}

.user-orders-spoller__title span:last-child svg,
.user-orders-spoller__title span:last-child img{
	width: 20px;
	height: 20px;
	object-fit: contain;
	transition: all 0.5s ease;
}

.user-orders-spoller__title span:last-child svg path {
	transition: all 0.5s ease;
}

.user-orders-spoller__title._spoller-active span:last-child{
	color: #848484;
}

.user-orders-spoller__title._spoller-active span:last-child svg,
.user-orders-spoller__title._spoller-active span:last-child img{
	transform: rotate(180deg);
}

.user-orders-spoller__title._spoller-active span:last-child svg path{
	stroke: #848484;
}

.user-orders-spoller__body {
	margin-top: 20px;

	padding: 20px 24px;
	border-radius: 20px;
	border: 1px solid #F4F4F4;
	background: #fff;
	box-shadow: 0 2px 18px 0 rgba(30, 26, 5, 0.04);
}

.user-orders-spoller__item {
	display: flex;
	flex-direction: column;
	row-gap: 5px;
}

.order-status {
	display: flex;
	align-items: center;
	column-gap: 8px;
}
.order-status span:first-child{
	color: #848484;
}

@media (max-width: 992px){
	.user-orders-spoller__body{
		padding: 16px;
	}
}

@media (max-width: 768px){
	.user-orders-spoller{
		padding: 20px;
	}
}

@media (max-width: 468px){
	.user-orders-spoller__title{
		flex-direction: column;
		align-items: flex-start;
		row-gap: 4px;
	}
}

/* ------------------------------ */

.modal.small-modal {
	justify-content: center;
}

.modal.small-modal .modal-solid {
	max-width: 500px;
	width: 100%;
	margin: auto;
	height: auto;
}

.modal.small-modal .modal-body {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
}

.modal.small-modal .modal-body .close-btn {
	position: absolute;
	top: 12px;
	right: 12px;

	width: 20px;
	height: 20px;
	flex: 0 0 auto;

	border-radius: 0px;
	background-color: transparent;
}
.modal.small-modal .modal-body .close-btn svg,
.modal.small-modal .modal-body .close-btn img {
	width: 20px;
	height: 20px;
	object-fit: contain;
}

@media (max-width: 992px){
	.modal.small-modal .modal-body .close-btn{
		width: 20px;
		height: 20px;
		flex: 0 0 auto;
		border-radius: 0px;
	}

	.modal.small-modal .modal-body .close-btn svg,
	.modal.small-modal .modal-body .close-btn img{
		width: 20px;
		height: 20px;
	}

	.modal.small-modal .modal-body{
		border-radius: 16px;
	}
}


.small-modal__content {
	display: flex;
	flex-direction: column;
	row-gap: 24px;

	padding: 30px;
	background-color: #fff;
}

@media (max-width: 992px){
	.small-modal__content{
		padding: 24px;
		row-gap: 16px;
	}
}

.small-modal__top {
	display: flex;
	flex-direction: column;
	row-gap: 5px;
}

.small-modal__top p{
	color: #848484;
}
	
.login-modal__form {
	display: flex;
	flex-direction: column;
	row-gap: 24px;
}

.login-modal__form label{
	color: #848484;
}

@media (max-width: 992px){
	.login-modal__form{
		row-gap: 16px;
	}
}


.phone-number-modal__form {
	display: flex;
	flex-direction: column;
	row-gap: 24px;
}
@media (max-width: 992px){
	.phone-number-modal__form{
		row-gap: 20px;
	}
}

.phone-number-modal__wrapper {
	display: flex;
	flex-direction: column;
	justify-content: center;
	row-gap: 12px;
}

.phone-number-modal__wrapper > span{
	color: #848484;
}
.phone-number-modal__wrapper>span span{
	color: #202226;
}

.phone-number-modal__buttons {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
}

.phone-number-modal__bottom {
	display: flex;
	flex-direction: column;
	row-gap: 16px;
}

.phone-number-modal__bottom .info-text a {
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: auto;
	text-underline-offset: auto;
	text-underline-position: from-font;
}

.number-inputs {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 10px;
}

.number-inputs input {
	width: 52px;
	height: 52px;
	padding: 10px;
	text-align: center;

	color: #202226;
	font-size: 16px;
	font-weight: 500;
	line-height: 125%;
	letter-spacing: 0.16px;

	border-radius: 12px;
	border: 1px solid #F4F4F4;
	background: #fff;
}

.number-inputs input::-webkit-outer-spin-button,
.number-inputs input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

@media (max-width: 992px) {
	.number-inputs{
		column-gap: 6px;
	}

	.number-inputs input{
		width: 46px;
		height: 46px;
		font-size: 15px;
	}
}

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


.profile-modal .small-modal__top {
	align-items: center;
	justify-content: center;
}

.profile-modal__content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 16px;
}

.profile-modal__icon {
	width: 92px;
	height: 92px;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 10px;

	border-radius: 50%;
	background-color: #F4283C;

	color: #fff;
	text-align: center;
	font-size: 40px;
	font-weight: 700;
	line-height: 105%;
	letter-spacing: 0.4px;
}

.profile-modal__wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 2px;
}

.profile-modal__bottom {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 16px;
}
.profile-modal__bottom a,
.profile-modal__bottom button {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;

	color: #F4283C;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: 14%;
	text-underline-offset: 22%;
	text-underline-position: from-font;
}

.profile-modal__bottom a svg,
.profile-modal__bottom a img,
.profile-modal__bottom button svg,
.profile-modal__bottom button img{
	width: 20px;
	height: 20px;
	object-fit: contain;
}