.woocommerce {
	.col2-set {
		width: 100%;

		.col-1 {
			float: left;
			width: 48%;
		}

		.col-2 {
			float: right;
			width: 48%;
		}
	}
}

.star-rating {
	overflow: hidden;
	position: relative;
	width: 7em;
	height: 1em;
	font-family: 'star';
	font-size: 0.9em;
	font-weight: 400;
	line-height: 1em;
	letter-spacing: 0.4em;
	backface-visibility: hidden;
	color: $color_background_button !important;

	&::before {
		content: '\53\53\53\53\53';
		float: left;
		top: 0;
		left: 0;
		right: initial;
		position: absolute;
	}

	span {
		overflow: hidden;
		float: left;
		top: 0;
		left: 0;
		position: absolute;
		padding-top: 1em;

		&::before {
			content: '\53\53\53\53\53';
			top: 0;
			left: 0;
			position: absolute;
			color: $color_dark_blue !important;
		}
	}
}

.woocommerce-Reviews {
	#comments {
		.woocommerce-Reviews-title {
			margin-top: 0;
			padding-bottom: 1.5rem;
			font-size: 1.4rem;
			border-bottom: 1px solid $color_border;
		}

		p.woocommerce-noreviews {
			margin-top: 0;
		}

		.commentlist {
			.review {
				.comment_container {
					position: relative;
					padding-top: 2.5rem;

					img.avatar {
						position: absolute;
						left: 0;
						width: 2.9rem;
						height: 2.9rem;
						border-radius: 100%;
					}

					.comment-text {
						padding-left: 4.4rem;

						.star-rating {
							float: right;
							margin-top: 0.125rem;
						}

						.meta {
							display: flex;
							align-items: center;
							margin-top: 0;
							margin-bottom: 1rem;
							line-height: 1.25rem;

							.woocommerce-review__verified {
								padding-left: 0.4rem;
							}

							.woocommerce-review__dash {
								font-size: 0;

								&::before {
									content: '/';
									font-size: 0.9rem;
									padding: 0 0.4rem;
									float: left;
									text-indent: 1px;
								}
							}

							span,
							time {
								color: #b4b4b4;
								font-size: 0.7rem;
								font-weight: 600;
								letter-spacing: .1em;
								text-transform: uppercase;
								-webkit-font-smoothing: antialiased;
							}
						}
					}
				}
			}
		}
	}

	#review_form_wrapper {
		.comment-respond {
			.comment-reply-title {
				display: inline-block;
				font-size: 1.4rem;
				font-weight: 500;
				margin-bottom: 1rem;
			}

			.comment-form {
				.comment-form-cookies-consent {
					input {
						width: auto;
					}
				}

				textarea,
				input {
					width: 100%;

					&:valid {
						color: $color_text_main;
					}
				}

				.comment-form-rating {
					display: flex;
					align-items: center;
					padding-top: 2.5rem;

					label {
						font-size: 0;

						&:before {
							content: 'your reting';
							font-size: 0.7rem;
							font-weight: 500;
							letter-spacing: 0.1rem;
							text-transform: uppercase;
						}
					}

					.stars {
						font-size: 0.9em;
						margin: 0 0 0 10px !important;

						span {
							display: -webkit-box;
							display: -ms-flexbox;
							display: flex;

							a {
								position: relative;
								display: inline-block;
								width: 1em;
								height: 1em;
								text-indent: -999em;
								text-decoration: none;
								color: $color_background_button;

								&:not(:last-child) {
									margin-right: 7px;
								}

								&:before {
									content: '\73';
									font-family: 'star';
									position: absolute;
									display: block;
									top: 0;
									left: 0;
									width: 1em;
									height: 1em;
									line-height: 1;
									text-indent: 0;
									color: $color_dark_blue;
								}

								&:hover {
									~ {
										a {
											&:before {
												content: '\73';
											}
										}
									}
								}
							}

							&:hover {
								a {
									&:before {
										content: '\53';
									}
								}
							}
						}
					}

					.stars.selected {
						a.active {
							&:before {
								content: '\53';
							}

							~ {
								a {
									&:before {
										content: '\73';
									}
								}
							}
						}

						a {
							&:not(.active) {
								&:before {
									content: '\53';
								}
							}
						}
					}
				}
			}
		}
	}
}

.quantity {
	display: inline-block;
	position: relative;
	width: 6rem;

	input {
		margin: 0 !important;
		border-right-width: 0 !important;
	}

	.vertical-buttons {
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: absolute;
		cursor: pointer;
		right: 0;
		top: 0;
		bottom: 0;
		flex-direction: column;
		width: 25%;
		max-width: 1.5rem;

		input {
			display: block;
			text-align: center;
			float: none;
			padding: 0;
			margin: 0;
			box-sizing: border-box;
			line-height: 1.25rem;
			transform: none;
			border: none !important;
		}

		input:hover {
			transform: none;
			cursor: pointer;
		}

		input:focus {
			outline: none;
		}

		.plus {
			width: 100%;
			top: 0;
			height: calc(50% - 1px);
			border-radius: 0 0.125rem 0 0;

			&:hover {
				border-radius: 0 0.125rem 0 0;
			}
		}

		.minus {
			width: 100%;
			border-top: 0;
			border-radius: 0 0 0.125rem 0;
			bottom: 0;
			height: 50%;

			&:hover {
				border-radius: 0 0 0.125rem 0;
			}

			&::before {
				transform: rotate(180deg);
			}
		}
	}

	.qty {
		padding: 0 0.6rem;
		height: 2.5rem;
		-moz-appearance: textfield;
		font-size: 13px;
	}

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

.cart {
	.quantity {
		input {
			height: 100%;
		}
	}
}

.wc_payment_methods {
	& > li {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		margin: 0;
		border: 1px solid $color_border;

		&:not(.woocommerce-notice) {
			padding: 0 1.5rem;
		}

		&:not(:last-child) {
			border-bottom: 0;
		}

		input {
			margin-right: 0.5rem;
		}

		label {
			flex: 1;
			display: flex;
			align-items: center;
			margin: 0;
			height: 3.4rem;
			font-size: 0.9rem;
			font-weight: 500;
			cursor: pointer;

			img:first-of-type {
				margin-left: auto;
			}

			.about_paypal {
				display: none;
			}
		}

		.payment_box {
			flex: 1;
			min-width: 100%;
			padding: 1.5rem;
			margin: 0 -1.5rem;
		}
	}
}

form.variations_form {
	table.variations {
		border: none;
		margin-bottom: 1.5rem;

		tr {
			display: flex;
			flex-direction: column;

			&:not(:last-child) {
				margin-bottom: 1.5em;
			}
		}

		td {
			padding: 0;
			border: none;
		}

		label {
			display: block;
			margin-bottom: 0.6rem;
			--fontWeight: 500;
		}

		select {
			width: 100%;
			max-width: 100%;
		}

		// reset variations
		.reset_variations {
			margin-top: 1em;
			font-size: 0.9rem;
			line-height: normal;
			display: none;

			&[style*="visibility: hidden"] {
				display: none !important;
			}

			&[style*="visibility: visible"] {
				display: inline-block !important;
			}

			&:before {
				content: '\f2ea';
				font-family: "Font Awesome 5 Free";
				font-weight: 700;
				font-size: 1rem;
				margin-right: 0.7rem;
				font-size: 0.8rem;
			}
		}
	}

	.single_variation {
		display: none;
	}

	.single_variation,
	.wc-no-matching-variations {
		margin-bottom: 1.5rem;
	}

	.single_variation {
		.woocommerce-variation-availability {
			p {
				color: $color_white;
				background-color: #3eaf7c;
				padding: 0.4rem 1rem;
				border-radius: 0.188rem;

				&::before {
					content: '\f00c';
					font-family: "Font Awesome 5 Free";
					font-weight: 700;
					font-size: 1rem;
					color: $color_white;
					margin-right: 0.4rem;
					font-size: 0.75rem;
				}
			}
		}
	}
}

.woocommerce-notices-wrapper {
	width: 100%;

	.woocommerce-message {
		position: relative;
		display: flex;
		justify-content: space-between;
		font-size: 1rem;
		padding: 1.1rem 0.9rem 1.1rem 4rem;
		margin-bottom: 2.8rem;
		border-radius: 0.188rem;
		background-color: $color_light_grey;
	}
}

.woocommerce-info,
.woocommerce-error,
.woocommerce-message {
	position: relative;
	display: flex;
	justify-content: space-between;
    align-items: center;
    font-size: 1rem;
    padding: 1.1rem 0.9rem 1.1rem 4rem;
    margin-bottom: 1.8rem;
    border-radius: 0.188rem;

	&::before {
		font-family: "Font Awesome 5 Free";
		font-weight: 600;
		font-size: 1.25rem;
		padding: 0 1rem 0 0;
		opacity: 0.9;
		position: absolute;
		left: 1.5rem;
	}
}

.woocommerce-info {
	&::before {
		content: '\f05a';
	}
}

.woocommerce-error {
	&::before {
		content: '\f06a';
	}
}

.woocommerce-message {
	&::before {
		content: '\f46c';
	}
}

.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
	a.button,
	a.showcoupon {
		float: right;
		color: $color_white;
		background-color: $color_main;
		padding: 10px;
		margin: -0.5rem -0.3rem -0.5rem 0;
		text-align: center;
		border-radius: 0.2rem;
		order: 1;
		text-decoration: none;
		@include transition;

		&:hover {
			transform: translateY(-2px);
			box-shadow: 0 2px 4px rgba(0,0,0,.1);
			@include transition;
		}
	}
}

.woocommerce-info,
.woocommerce-message {
	color: $color_text_main;
	background-color: $color_light_grey;
}

.woocommerce-error {
	color: $color_white;
	background-color: $color_red;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;

	a {
		color: $color_red !important;
		background-color: $color_white;
		padding: 0.4rem 0.6rem;
		margin-top: 0.6rem;
		border-radius: 0.188rem;
		text-align: center;
	}
}

button,
.button {
	&:disabled,
	&.disabled {
		opacity: 0.6;
		pointer-events: none;
	}
}

span.required,
abbr.required {
	color: $color_red;
}

.select2-container--default {
	.select2-selection--single {
		border-color: $color_border;
	}
}

.woocommerce-pagination {
	&.woocommerce-Pagination {
		a.woocommerce-button {
			display: inline-block;
			border-radius: 0.2rem;
			color: $color_white;
			background-color: $color_main;
			border-width: 1px;
			border-color: $color_main;
			border-style: solid;
			padding: 0.8rem 2.5rem;
			font-size: 0.75rem;
			line-height: 1.5rem;
			font-weight: 700;
			text-transform: uppercase;
			cursor: pointer;
			@include transition;

			&:hover {
				transform: translateY(-2px);
				box-shadow: 0 2px 4px rgba(0,0,0,.1);
				@include transition;
			}
		}
	}
}

@media ( max-width: 62rem ) {
	.woocommerce {
		.col2-set {
			width: 100%;

			.woocommerce-Address {
				float: none;
				width: 100%;
			}

			.col-1 {
				padding-bottom: 1.8rem;
			}
		}
	}
}

@media ( max-width: 50rem ) {
	.woocommerce {
		.col2-set {
			width: 100%;

			.col-1,
			.col-2 {
				float: none;
				width: 100%;
			}
		}
	}
}


@media ( max-width: 42rem ) {
	.woocommerce-notices-wrapper {
		.woocommerce-message {
			flex-direction: column;
			padding: 1.1rem;

			a.button {
				width: 100%;
				margin: 0.5rem 0 0 0;
			}

			&::before {
				content: none;
			}
		}
	}

	.woocommerce-form-coupon-toggle {
		.woocommerce-info {
			flex-direction: column;
			align-items: flex-start;
			padding: 1.1rem;

			a.showcoupon {
				width: 100%;
				margin: 1.1rem 0 0 0;
			}

			&::before {
				content: none;
			}
		}
	}
}

@media only screen and (max-width: 35em) {
	.woocommerce {
		.woocommerce-message[role=alert] {
			flex-direction: column;
			align-items: flex-start;
		}
	}
}

@media ( max-width: 26rem ) {
	.woocommerce-Reviews {
		#comments {
			.commentlist {
				li.review:not(:last-child) {
					border-bottom: 1px solid $color_border;

					.comment_container {
						.comment-text {
							padding-left: 4rem;
						}
					}
				}
			}
		}
	}
}