@import "variables.less";
@import "mixins.less";

.woocommerce,
.woocommerce-page {
	// Product
	ul.products li.product,
	.related ul li.product,
	.related ul.products li.product,
	.upsells.products ul li.product,
	.upsells.products ul.products li.product {
		background-color: @wc-product-bg-color;
		padding: 20px;
		width: @wc-product-width;
	}

	// Result count
	.woocommerce-result-count {
		position: relative;
		top: 20px;
	}
}

.woocommerce {
	// Products list
	ul.products li.product {
		h3 {
			font-size: @wc-product-title-font-size;
			padding-bottom: 5px;
		}

		.onsale {
			margin: 10px 10px 0 0;
		}

		.price {
			color: @wc-price-text-color;
			font-size: @wc-price-font-size;
			font-weight: @wc-price-font-weight;

			del {
				display: inline-block;
			}

			ins {
				font-weight: @wc-price-ins-font-weight;
				text-decoration: none;
			}
		}
	}

	a.added_to_cart {
		display: none;
		// margin-left: 10px;
	}

	a.remove {
		color: @wc-cart-icon-color !important;
		visibility: hidden;

		&:before {
			content: "\f216";
			font-family: MaterialDesignIcons;
			font-size: @wc-cart-icon-font-size;
			visibility: visible;
		}

		&:hover {
			color: @wc-cart-icon-hover-color !important;
		}
	}

	// Product
	div.product {
		p.price,
		span.price {
			color: @wc-price-text-color;

			del {
				display: inline-block;
			}

			ins {
				text-decoration: none;
			}
		}

		.woocommerce-tabs {
			margin-top: 40px;

			ul.tabs {
				padding: 0;

				&:before {
					display: none !important;
				}

				li {
					background-color: @wc-tab-bg-color;
				  border: 2px solid @wc-tab-border-color;
					border-radius: @wc-tab-border-radius;
				  margin: 0 5px 0 0;
				  padding: 0;

				  &.active {
				  	background: @wc-tab-active-bg-color;
				  	border-bottom-color: @wc-tab-border-color;
				  }

				  &:before,
				  &:after {
				  	display: none;
				  }

				  a {
				  	color: @wc-tab-text-color;
					  font-weight: @wc-tab-font-weight;
					  padding: 10px 20px;
				  }

				  a:hover,
				  &.active a {
				  	color: @wc-tab-hover-text-color;
				  }
				}
			}

			.panel {
				margin-top: 30px;
			}
		}

		form.cart {
			margin: 20px 0 40px;
		}
	}

	// Related products
	.related.products {
		clear: both;
	}

	// Button
	#respond input#submit,
	a.button,
	button.button,
	input.button,
	#respond input#submit.alt,
	a.button.alt,
	button.button.alt,
	input.button.alt,
	.widget_product_search input[type="submit"],
	&.widget_product_search input[type="submit"] {
		background-color: @wc-button-bg-color;
		border: 0;
		border-radius: @wc-button-border-radius;
		color: @wc-button-text-color;
		font-weight: @wc-button-font-weight;
		line-height: @wc-button-line-height;
		padding: 7px 16px;
		text-transform: uppercase;
		.transition(background-color @main-animation);

		&:hover {
			background-color: @wc-button-hover-bg-color;
			color: @wc-button-hover-text-color;
		}
	}

	#respond input#submit.alt.disabled,
	#respond input#submit.alt.disabled:hover,
	#respond input#submit.alt:disabled,
	#respond input#submit.alt:disabled:hover,
	#respond input#submit.alt:disabled[disabled],
	#respond input#submit.alt:disabled[disabled]:hover,
	a.button.alt.disabled,
	a.button.alt.disabled:hover,
	a.button.alt:disabled,
	a.button.alt:disabled:hover,
	a.button.alt:disabled[disabled],
	a.button.alt:disabled[disabled]:hover,
	button.button.alt.disabled,
	button.button.alt.disabled:hover,
	button.button.alt:disabled,
	button.button.alt:disabled:hover,
	button.button.alt:disabled[disabled],
	button.button.alt:disabled[disabled]:hover,
	input.button.alt.disabled,
	input.button.alt.disabled:hover,
	input.button.alt:disabled,
	input.button.alt:disabled:hover,
	input.button.alt:disabled[disabled],
	input.button.alt:disabled[disabled]:hover {
		background-color: @wc-button-hover-bg-color;
		color: @wc-button-hover-text-color;
	}

	// Sale
	span.onsale {
		background-color: @wc-sale-bg-color;
		line-height: @wc-sale-line-height;
		margin: 20px 0 0 20px;
		padding: 0;
		text-transform: uppercase;
		width: @wc-sale-width;
		height: @wc-sale-height;
	}

	// Pagination
	nav.woocommerce-pagination {
		line-height: @wc-pagination-line-height;
		text-align: left;
		ul {
			margin: 0;

			&, li {
				border: 0;
			}

			li {
				margin-right: 4px;

				a, span {
					background-color: @wc-pagination-bg-color;
					border-radius: @wc-pagination-border-radius;
					color: @wc-pagination-text-color;
					font-weight: @wc-pagination-font-weight;
					line-height: @wc-pagination-min-height;
					min-width: @wc-pagination-min-width;
					min-height: @wc-pagination-min-height;
					padding: 0;
					text-align: center;
					.transition(background-color @main-animation);
				}

				.page-numbers > .mdi {
					font-size: @wc-pagination-arrow-font-size;
					position: relative;
					top: 3px;
				}

				a:focus,
				a:hover,
				span.current {
					background-color: @wc-pagination-hover-bg-color;
					color: @wc-pagination-hover-text-color;
				}
			}
		}
	}

	// Review
	#reviews {
		#comments {
			background-color: @wc-reviews-bg-color;
			margin-top: 0;
			padding: 0;

			h2 {
				margin-bottom: 30px;
			}
			
			ol.commentlist {
				margin-top: 20px;
				padding: 0;

				li {
					img.avatar {
						border: 0;
						border-radius: @wc-review-avatar-border-radius;
						padding: 0;
						width: @wc-review-avatar-width;
					}

					.comment-text {
						border: 0;
						// border-color: @wc-review-text-border-color;
						// border-radius: @wc-review-text-border-radius;
						margin-top: -5px;
						margin-left: 60px;
						padding: 0;

						p.meta {
							color: @wc-review-meta-text-color;
							font-size: @wc-review-meta-font-size;
							margin-bottom: 5px;

							time {
								color: @wc-review-meta-time-text-color;
								font-weight: @wc-review-meta-time-font-weight;
							}
						}
					}
				}
			}
		}
	}

	#review_form #commentform {
		& > p {
			margin-top: 20px;
		}

		.comment-form-rating {
			.stars {
				margin-top: 8px;
			}
		}
	}

	// Rating
	.star-rating span {
		color: @wc-rating-star-color;
	}

	// Titles
	#tab-description > h2,
	#comments > h2,
	#reply-title,
	.related > h2,
	.cross-sells > h2,
	.cart_totals > h2,
	.upsells > h2,
	.woocommerce-billing-fields > h3,
	#ship-to-different-address,
	#order_review_heading,
	.myaccount_user + h2,
	.address > .title > h3 {
		font-size: @wc-title-font-size;
	}

	#ship-to-different-address label {
		font-size: inherit;
		line-height: inherit;
	}

	#reply-title {
		display: none;
	}

	.related > h2,
	.cross-sells > h2,
	.upsells > h2 {
		margin-bottom: 20px;
	}

	// Alerts
	.woocommerce-error,
	.woocommerce-info,
	.woocommerce-message {
		padding: 25px 20px 25px 60px !important;

		&:before {
			content: "\f371";
			font-family: MaterialDesignIcons;
			font-size: @wc-alert-icon-font-size;
			line-height: @wc-alert-icon-line-height;
			top: 24px;
			left: 15px;
		}

		.button {
			position: relative;
			top: -7px;
		}
	}

	.woocommerce-error {
		&:before {
			content: "\f120";
		}
	}

	.woocommerce-message {
		&:before {
			content: "\f1f9";
		}
	}

	// Cart
	table.shop_table {
		border-collapse: collapse;
		border-color: @wc-cart-border-color;

		th, td {
			border: 0;
			border-top: 0 !important;
			border-bottom: 1px solid @wc-cart-border-color;
			padding: 15px 12px;
		}

		td.actions .coupon .input-text {
			border-color: @form-input-border-color;
			line-height: @wc-input-height;
			padding: 0 15px;
			width: auto !important;
		}

		img {
			width: @wc-cart-thumbnail-width;
		}
	}

	// Form
	form .form-row {
		margin-bottom: 10px;
		padding: 0;
	}

	form.checkout_coupon,
	form.login,
	form.register {
		border-color: @wc-checkout-form-border-color;
		border-radius: @wc-checkout-form-border-radius;
		padding: 30px 30px 20px;
	}

	form.login .button {
		margin-right: 10px;
	}

	// Widget
	.widget_price_filter {
		.ui-slider .ui-slider-handle {
			background-color: @wc-widget-price-filter-handle-bg-color;
		}

		.price_slider {
			margin-bottom: 25px;
		}

		.ui-slider-horizontal {
			height: @wc-widget-price-filter-bar-height;
		}

		.price_slider_wrapper .ui-widget-content {
			background-color: @wc-widget-price-filter-bar-alt-bg-color;
		}

		.ui-slider .ui-slider-range {
			background-color: @wc-widget-price-filter-bar-bg-color;
		}

		.price_label {
			color: @wc-widget-price-filter-label-text-color;
			font-size: @wc-widget-price-filter-label-font-size;
			font-weight: @wc-widget-price-filter-label-font-weight;
			position: relative;
			top: -9px;
		}
	}

	.widget_product_search .search-field,
	&.widget_product_search .search-field {
		margin-bottom: 10px;
	}

	ul.product_list_widget li {
		img {
			width: @wc-widget-thumbnail-width;
		}

		.star-rating {
			display: none;
		}

		ins {
			text-decoration: none;
		}
	}

	.widget_layered_nav_filters ul li {
		margin-right: 5px;

		a:before {
			color: @wc-widget-nav-filter-icon-color;
			content: "\f216";
			font-family: MaterialDesignIcons;
			font-size: @wc-widget-nav-filter-icon-font-size;
			font-weight: @wc-widget-nav-filter-icon-font-weight;
			margin-right: 5px;
			position: relative;
			top: -1px;
		}
	}

	.widget,
	&.widget {
		&.widget_recent_reviews .reviewer,
		&.widget_products .amount,
		&.widget_recently_viewed_products .amount,
		&.widget_top_rated_products .amount {
			color: @wc-widget-meta-text-color;
			font-weight: @wc-widget-meta-font-weight;
			position: relative;
			top: -3px;
		}
	}
}

.woocommerce-cart {
	.cart-collaterals .cart_totals {
		table {
			border-collapse: collapse;
			width: @wc-total-table-width;

			th, td {
				border-color: @wc-total-table-border-color;
				padding: 15px 0;
			}
			th {
				text-align: left;
			}
		}
	}

	.woocommerce-shipping-calculator > p {
		margin-bottom: 0;
	}

	.shipping-calculator-form {
		margin-top: 15px;
	}
}

.woocommerce-checkout {
	h2, h3 {
		font-size: @wc-title-font-size;
	}

	#payment {
		border-radius: @wc-payment-border-radius;
	}
}

.woocommerce-account {
	.addresses .title .edit {
		margin-top: 20px;
	}
}

.widget_shopping_cart {
	.cart_list li {
		padding-bottom: 10px !important;

		a.remove {
			color: @wc-widget-cart-icon-color !important;
			top: -2px !important;
			visibility: hidden;
			width: @wc-widget-cart-icon-width;
			height: @wc-widget-cart-icon-height;

			&:before {
				content: "\f216";
				font-family: MaterialDesignIcons;
				font-size: @wc-widget-cart-icon-font-size;
				visibility: visible;
			}

			&:hover {
				background-color: @wc-widget-cart-icon-hover-bg-color;
			}
		}

		.quantity {
			color: @wc-widget-cart-quantity-text-color;
			font-size: @wc-widget-cart-quantity-font-size;
			font-weight: @wc-widget-cart-quantity-font-weight;
			position: relative;
			top: -3px;
		}
	}

	.total {
		border-top: 2px solid @wc-widget-cart-total-border-color !important;
		color: @wc-widget-cart-total-text-color;
		font-weight: @wc-widget-cart-total-font-weight;
		padding-top: 10px !important;

		span.amount {
			color: @wc-widget-cart-total-amount-text-color;
		}
	}
}