* { margin: 0; padding: 0; }
* {box-sizing:border-box}
body {
	overflow-x: hidden;
}

.basket{
  display: flex;
  justify-content: space-between;
	align-items: flex-start;
}

.emptyBasket{
	width: 100%;
	display: none;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
}
.basketProductCount_maxcount{
	display: none;
}

.basketProducts{
  width: 100%;
}

.basketProducts hr{
  border: 1.2px solid #F0F1F3;
  background-color: #F0F1F3;
}

.basketProductsHeader{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 14px;
  margin-bottom: 20px;
}

.basketProductsHeader h1{
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 22px;
  color: #353535;
}

.basketProductDelete{
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
}

.basketProductDeleteBtn{
  background-color: inherit;
  padding: 7px 18px;
  font-style: normal;
  font-weight: 700;
  font-size: 10px;
  line-height: 12px;
  letter-spacing: 0.221428px;
  color: #626262;
  border: 1px solid #C9C9C9;
  border-radius: 2px;
}

.basketProductDeleteBtn:hover{
  cursor: pointer;
}

.basketProduct{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: -28px;
}

.basketProductContent{
  display: flex;
  align-items: center;
}

.basketProductId{
	display: none;
}

.basketProductImg{
  background: #FFFFFF;
  border: 1px solid #E4E4E4;
  box-shadow: 0px 4px 14px 7px rgba(121, 121, 121, 0.0527344);
  border-radius: 4px;
  padding: 22px 10px;
}

.basketProductImg_img{
	max-width: 200px;
	width: 200px;
	height: 200px;
}

.basketProductInfo{
  margin-left: 13px;
}

.basketProductInfo h1{
	text-transform: uppercase;
  margin-bottom: 8px;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 22px;
  color: #353535;
}

.basketProductInfo p{
  margin-top: 8px;
  font-style: normal;
  font-weight: 400;
  font-size: var(--p-main-text);
  line-height: 17px;
  letter-spacing: 0.45px;
  color: #353535;
}

.basketProductInfo__productManufacturer{
	text-transform: uppercase;
}

.basketProductInfo span{
  color: var(--accent-color);
}

.basketProductCount p{
  font-style: normal;
  font-weight: 400;
  font-size: var(--h-header-text);
  line-height: 25px;
  letter-spacing: 0.323809px;
  color: #414141;
}

.basketProductCountMinusBtn, .basketProductCountPlusBtn{
	width: 25px;
	margin-left: 10px;
	margin-right: 10px;
	background-color: white;
	color: var(--accent-color);
	border: 1px solid var(--accent-color);
	transition: 0.15s ease-in-out;
}
.basketProductCountMinusBtn:hover, .basketProductCountPlusBtn:hover{
	cursor: pointer;
	background-color: var(--accent-color);
	color: white;
}

.basketProductCountEditBtn{
  background-color: inherit;
  border: none;
  font-style: normal;
  font-weight: 400;
  font-size: var(--p-main-text);
  line-height: 17px;
  letter-spacing: 0.45px;
  text-decoration-line: underline;
  color: var(--accent-color);
}

.basketProductPrice p{
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 22px;
  letter-spacing: 0.578571px;
  color: var(--accent-color);
}

.basketItems hr{
  margin-top: 14px;
}

.ordering{
  margin-left: 35px;
	min-width: 300px;
  background-color: #F7F7F7;
	padding: 48px 31px 80px 31px;
}

.ordering h1{
	font-style: normal;
	font-weight: 400;
	font-size: var(--h-header-text);
	line-height: 19px;
	letter-spacing: 0.514285px;
	color: #000000;
}

.ordering-delivery-info-item{
	display: flex;
	flex-direction: column;
}

.ordering-p{
	margin-top: 21px;
	font-style: normal;
	font-weight: 400;
	font-size: var(--p-main-text);
	line-height: 27px;
	letter-spacing: 0.185714px;
	color: #000000;
}

.ordering input{
	width: 100%;
	background: #FFFFFF;
	border: 1px solid #EEEEEE;
	border-radius: 2px;
	padding: 4px 9px;
	font-style: normal;
	font-weight: 400;
	font-size: var(--p-main-text);
	line-height: 27px;
	letter-spacing: 0.185714px;
}

.ordering hr{
	border: 1.2px solid #F0F1F3;
	background-color: #F0F1F3;
	margin-top: 15px;
}

.orderingSum{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 10px;
}

.orderingSumText{
	font-style: normal;
	font-weight: 400;
	font-size: var(--p-main-text);
	line-height: 27px;
	letter-spacing: 0.185714px;
	color: #000000;
}

.orderingSumNumber{
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 22px;
	letter-spacing: 0.578571px;
	color: var(--accent-color);
}

.orderingBtn{
	display: flex;
	justify-content: center;
	margin-top: 24px;
}

.orderingBtn button{
	border: none;
	background-color: inherit;
	font-style: normal;
	font-weight: 400;
	font-size: var(--h-header-text);
	line-height: 17px;
	letter-spacing: 0.45px;
	text-decoration-line: underline;
	color: var(--accent-color);
}

.orderingBtn button:hover{
	cursor: pointer;
}

.lds-ring {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  margin: 8px;
  border: 8px solid var(--accent-color);
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: var(--accent-color) transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@media (max-width: 991px) {
	.basket{
		flex-direction: column;
		gap: 30px;
	}
	.ordering{
		margin-left: 0;
		width: 100%;
		padding-bottom: 30px;
	}
	.loader{
		width: 100%;
	}
	.ordering-delivery-info{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.basketProductCount{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.basketProductCount p{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
}

@media (max-width: 767px) {
	.basketProduct{
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 20px;
	}
	.basketProductCount p{
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
	}
}

@media (max-width: 650px) {
	.ordering-delivery-info{
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.ordering-select{
		width: 100%;
	}
}

@media (max-width: 450px) {
	.basketProductContent{
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 20px;
	}
	.basketProductInfo{
		margin-left: 0;
	}
}

@media (max-width: 374px) {
	.basketProduct{
		margin-top: 10px;
	}
}
