@import "mixins";

// Header
#header {
	.widget_product_search {
		clear:both;
	}
	.cart-contents {
		&:before {
			.iconbefore;
			content: "\f07a";
		}
	}
}

// General WooCommerce
.star-rating {
	width:80px;
	height: 1em;
	background: @border_main;
	.border_radius(3.631em);
	clear:both;
	span {
		background: @color_links;
		height:100%;
		overflow: hidden;
		float: left;
		text-indent: -999em;
		.borderbox;
		.border_radius(3.631em);
		span {
			display: none;
		}
	}
}

p.stars {
	overflow: hidden;
	zoom: 1;
	span {
		width: 80px;
		height: 16px;
		position: relative;
		float: left;
		background: @border_main;
		.border_radius(3.631em);
		a {
			float: left;
			position: absolute;
			left: 0;
			top: 0;
			width: 16px;
			height: 0;
			padding-top: 16px;
			overflow: hidden;
		}
		a:hover, a:focus {
			background: @color_links;
			.border_radius(3.631em);
		}
		a.active {
			background: @color_links;
			.border_radius(3.631em);
		}
		a.star-1 { width: 16px; z-index: 10; .border_radius_left(3.631em); }
		a.star-2 { width: 32px; z-index: 9; }
		a.star-3 { width: 48px; z-index: 8; }
		a.star-4 { width: 64px; z-index: 7; }
		a.star-5 { width: 80px; z-index: 6; }
	}
}

.form-row {
	label {
		display: block;
	}
}

a.remove {
	background: @error;
	color: #fff;
	.border_radius(3px);
	font-weight: bold;
	padding:.382em .53em;
	line-height: 1;
	display: inline-block;
	&:hover {
		background: darken(@error,10%);
		text-decoration: none;
	}
}

.required {
	color: @error;
	border: 0;
}

.validate-required {
	&.woocommerce-validated input {
		border-color:@success;
	}
	&.woocommerce-invalid input {
		border-color:@error;
	}
}

// Widgets
.widget .product_list_widget {
	list-style: none;
	li {
		.clearfix;
		border-bottom: 1px dotted @border_main;
		margin: 0 0 1em;
		padding: 0 .53em 1em;
		img {
			width:3.631em;
			height:auto;
			float: right;
			background: #fff;
			padding: .327em;
			.box_shadow(0, 0, 7px, 0, @border_main - #222);
		}
		a {
			display:block;
			font-weight: bold;
		}
		&:last-child  {
			margin: 0;
			border: none;
		}
		.amount {
			color: @color_buttons2;
			font-size: 1em;
			font-weight: bold;
		}
	}
}

.widget {
	.star-rating {
		width: 60px;
		height: .618em;
		clear:none;
	}
}

.widget_layered_nav {
	ul {
		list-style: none;
		li {
			.count {
				float: right;
			}
			&.chosen {
				a {
					background: @color_links;
					color: #fff;
					font-weight: bold;
					padding:.382em .618em;
					&:before {
						.iconbefore;
						content: "\f00d";
						font-size:.875em;
					}
				}
			}
		}
	}
}

.widget_product_categories {
	ul {
		list-style: none;
		li {
			.count {
				float: right;
			}
		}
	}
}

.widget_login  {
	form  {
		margin: 0;
	}
	label  {
		display: block;
	}
	input[type=text], input[type=password]  {
		width: 100%;
	}
	p  {
		margin-bottom: .53em;
		&:nth-child(3)  {
			margin: .857em 0 0;
			a  {
				text-transform: uppercase;
				margin-left: 1em;
				font-size: .857em;
			}
		}
	}
}

.widget_price_filter {
	.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
	}
	.price_slider {
		margin-bottom:1em;
	}
	.price_slider_amount {
		text-align: right;
		line-height: 2.4em;

		.button {
			float: left;
		}
	}
   .ui-slider {
		position: relative;
		text-align: left;
	}
   .ui-slider .ui-slider-handle {
		position: absolute;
		z-index: 2;
		width: 1em;
		height: 1em;
		.border_radius(1em);
		cursor: pointer;
		outline: none;
		background: #fff;
		border:1px solid @color_links;
		.borderbox;

		&:last-child {
			margin-left:-1em;
		}
	}
   .ui-slider .ui-slider-range {
		position: absolute;
		z-index: 1;
		font-size: .7em;
		display: block;
		border: 0;
		background: @color_links;
		.border_radius(1em);
	}
   .price_slider_wrapper .ui-widget-content {
		.border_radius(1em);
		background: @border_main;
	}
   .ui-slider-horizontal {
		height: 1em;
	}
   .ui-slider-horizontal .ui-slider-range {
		top: 0;
		height: 100%;
	}
   .ui-slider-horizontal .ui-slider-range-min {
		left: -1px;
	}

   .ui-slider-horizontal .ui-slider-range-max {
		right: -1px;
	}
}

// Messages / notifications
.woocommerce_message, .woocommerce_info, .woocommerce_error, .woocommerce-message, .woocommerce-info, .woocommerce-error {
	padding:1em 1em 1em 2.618em;
	border:1px solid @border_main;
	position: relative;
	margin-bottom:1.618em;
	list-style: none;
	.border_radius(.327em);
	&:before {
		.iconbefore;
		position: absolute;
		top:1em;
		left:1em;
	}
	.button {
		float: right;
		font-size:.857em;
		margin-left:1em;
	}
}
.woocommerce_message, .woocommerce-message {
	&:before {
		content: "\f05d";
		color: @success;
	}
}
.woocommerce_info, .woocommerce-info {
	clear: both;
	&:before {
		content: "\f05a";
		color: @info;
	}
}
.woocommerce_error, .woocommerce-error {
	&:before {
		content: "\f05c";
		color: @error;
	}
}

ul.woocommerce-error {
	margin-left:0 !important;
}

.stock.out-of-stock, .stock.in-stock  {
	&:before {
		.iconbefore;
	}
}
.stock.out-of-stock {
	&:before {
		content: "\f05c";
		color: @error;
	}
}
.stock.in-stock {
	&:before {
		content: "\f05d";
		color: @success;
	}
}

p.demo_store {
	position: fixed;
	top:0;
	left: 0;
	right:0;
	text-align: center;
	padding: 0.75em 0;
	background: @bg_light;
	border-bottom: 2px solid @border_main;
	z-index: 999999;
}

// Products
.onsale {
	display: block;
	width:3.631em;
	padding:1em 0;
	text-align: center;
	background: @color_buttons;
	.opacity(.7);
	color: #fff;
	font-weight: bold;
	font-size:.857em;
	.border_radius(100%);
}
.quantity {
	width:3.9em;
	position: relative;
	input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
		display:none;
	}
	.qty {
		.borderbox;
		width:2.618em;
		height: 30px;
		.border_radius_right(0);
	}
	.plus, .minus {
		width: 1.618em;
		padding: 0;
		height: 18px;
		text-align: center;
		background: @color_links;
		position: absolute;
		right:0;
		border:0;
		color:#fff;
		.border_radius(0);
	}
	.plus {
		top:0;
		.border_radius_right(.327em);
		.border_radius_bottom(0);
	}
	.minus {
		bottom:0;
		.border_radius_right(.327em);
		.border_radius_top(0);
	}
	.plus, .minus, input {
		-moz-appearance: textfield;
		-webkit-appearance: textfield;
	}
}
ul.products {
	.clearfix;
	list-style: none;
	position: relative;
	clear:both;
	li.product {
		position: relative;
		width:48%;
		float: left;
		clear: left;
		margin-bottom:1.618em;
		border: 1px solid darken(@border_main, 9%);
		.box_shadow(0, 0, 10px, 0, darken( @border_main, 1% ));
		.border_radius(.202em);
		background: lighten(@border_main, 5%);
		.borderbox;
		.button {
			.opacity(0);
			display: none;
			margin: .326em 1em 1em;
		}
		.added_to_cart {
			padding:.53em .857em;
			border:1px solid rgba(0,0,0,0.1);
			border-bottom:0;
			border-right:0;
			.border_radius_top(3px);
			.border_radius_right(0);
			font-size: .857em;
			position: absolute;
			bottom:0;
			right:0;
			background: rgba(0,0,0,0.025);
			font-weight: bold;
			&:hover {
				background: rgba(255,255,255,0.8);
			}
		}
		&:hover {
			border: 1px solid darken(@border_main, 12%);
			.box_shadow(0, 0, 10px, 0, darken( @border_main, 10% ));
 			.button {
 				position: absolute;
 				top: 50%;
 				width: 80%;
 				margin: 0 10%;
				display: block;
				height: auto;
				.opacity(1);
				&.product_type_simple {
					width: 70%;
					margin: 0 15%;
				}
			}
		}
		&:nth-child(2n) {
			float: right;
			clear: none;
		}
		img {
			background: #fff;
			display: block;
			height: auto;
			margin:0 auto;
			padding: 1em;
			.borderbox;
		}
		.onsale {
			position: absolute;
			top: 1em;
			right: 1em;
			z-index: 99;
		}
		.button.loading {
			&:after {
				.iconafter;
				content: "\f021";
				-webkit-animation-name:spin-360; // for when you can animate pseudo elements
				-webkit-animation-duration:1s;
				-webkit-animation-iteration-count:infinite;
			}
		}
		.button.added {
			&:after {
				.iconafter;
				content: "\f00c";
			}
		}
		.star-rating {
			margin:.5em 0;
		}
		a {
			display: block;
			&:hover {
				text-decoration: none;
			}
			h3 {
				font-family: @sans !important;
				font-weight: bold !important;
				font-size: 1em !important;
				margin: 0;
			}
			span.price {
				display: block;
				font-weight: bold;
			}
			.more-info {
				padding: .53em 1em;
				border-top: 1px solid darken(@border_main, 4%);
				background: lighten(@border_main, 5%);
				.inset_box_shadow(0, 3px, 3px, 0, lighten(@border_main, 2%));
			}
		}
	}
}

.related, .upsells {
	h2 {
		margin-bottom: 1em;
	}
	ul.products {
		li.product {
			.onsale {
				position: absolute;
				top: 1em;
				right: 1em;
				left: auto;
			}
		}
	}
}
.woo-pagination, .woocommerce-result-count {
	width:65.4%;
	float: left;
	text-align: left;
	padding:0;
	margin-bottom:1.618em;
}
.woocommerce_ordering, .woocommerce-ordering {
	width:30.75%;
	float: right;
	text-align: right;
	select {
		width:100%;
	}
}

// Single product
.single-product {
	.summary {
		margin-bottom:1.618em;
	}
	.product {
		position:relative;
		.onsale {
			z-index: 9999;
			position: absolute;
			top: 1em;
			left: 1em;
		}
	}
	.single_variation_wrap  {
		.price  {
			display: block;
			font-size: 2.224em;
			color: darken(@color_body, 20%);
		}
	}
	.quantity  {
		float: left;
		margin: 0 1em 0 0;
	}
	.images {
		img {
			width:100%;
			height: auto;
			margin-bottom:1em;
			.box_shadow(0, 0, 10px, 0, darken( @border_main, 1% ));
			border: 1px solid darken(@border_main, 9%);
			.border_radius(.202em);
		}
	}
	.thumbnails {
		a {
			display: block;
			width:30.75%;
			margin-right:3.8%;
			float: left;
			&.last {
				margin-right:0;
			}
		}
	}
	.woocommerce_tabs, .woocommerce-tabs {
		margin: 0 0 2.244em;
		border: 1px solid darken(@border_main, 9%);
		.box_shadow(0, 0, 10px, 0, darken( @border_main, 1% ));
		.border_radius(.202em);
		clear:both;
		.tabs {
			.vertical_gradient(lighten(@border_main, 11%), lighten(@border_main, 2%));
			border-bottom: 1px solid darken(@border_main, 9%);
			li {
				border-right: 1px solid darken(@border_main, 9%);
				a {
					font-size: .857em;
					padding: .857em 1em !important;
					color: @color_headings;
					font-weight: bold;
				}
			}
		}
		.panel {
			padding: 0 2em;
			.borderbox;
		}
	}
	#reviews {
		#comments {
			h2 {
				border-bottom: 1px solid @border_main;
				padding: 0 0 .857em;
			}
			.star-rating {
				float:right;
			}
			ol.commentlist {
				margin: 0 0 1.618em;
				li {
					&:first-child {
						padding: 0;
					}
					.comment-text {
						width: 80%;
						float: right;
						.star-rating {
							float: right;
							top:0;
							right:0;
							overflow: hidden;
							position: relative;
							height: 1em;
							line-height: 1em;
							font-size: 1em;
							width: 4.7em;
						}
					}
				}
			}
			.comment_container {
				border-bottom: 1px solid #EEE;
				padding: 1em 0;
				margin: 0;
				overflow: hidden;
			}
			.avatar {
				.border_radius(0);
				margin: 0 .618em 0 0;
				@media only screen and (max-width: 768px) {
					height: auto;
					width: 15%;
				}
			}
			.comment-text {
				.star-rating {
					top: 2.244em;
					right: 0;
				}
			}
		}
		.comment-form-rating {
			clear: both;
		}
	}
}

.shipping_calculator {
    h2  {
    	font-size: 1.387em;
    	a  {
    		display: block;
    		&:before  {
    			.iconbefore();
    			content: '\f0ac';
    		}
    		&:hover  {
    			text-decoration: none;
    		}
    	}
    }
}
a.reset_variations {
	display:block;
	&:before {
		.iconbefore;
		content: "\f021";
	}
}

// My Account
.order_details {
	.clearfix;
	list-style: none;
	border:1px solid @border_main;
	position: relative;
	margin-left: 0 !important;
	.border_radius(.327em);
	li {
		float: left;
		padding:1em 1.618em;
		border-right:1px solid @border_main;
		font-size:.8em;
		text-transform: uppercase;
		color: @color_body + #555;
		strong {
			display: block;
			font-size:1.387em;
			text-transform: none;
			color: @color_body;
		}
	}
}
ul.digital-downloads {
	li {
		list-style: none;
		margin-bottom:.618em;
		padding-bottom:.618em;
		border-bottom:1px solid @border_main;
		.count {
			float: right;
		}
		a {
			&:before {
				.iconbefore;
				content: "\f01a";
			}
		}
		&:last-child {
			border-bottom:0;
			margin-bottom:0;
			padding-bottom:0;
		}
	}
}

// Cart
.backorder_notification {
	font-size:.857em;
	&:before {
		.iconbefore;
		content: "\f071";
	}
}
dl.variation {
	.clearfix;
	font-size:.857em;
	dt {
		float: left;
		clear:left;
		margin-right:.236em;
	}
	dd {
		margin-bottom:0;
	}
}
table.cart {
	.actions {
		text-align: right;
		.coupon {
			.clearfix;
			margin-bottom:1em;
			@media only screen and (min-width: 768px) {
				.button {
					margin-top: .53em !important;
				}
			}
			label {
				display:none;
			}
			.input-text {
				width:48%;
				float:left;
			}
			.button {
				padding: .382em 1em;
				width:48%;
				float: right;
			}
		}
		.button {
			margin: 0 0 .618em;
			padding: .382em 1em;
			width:48%;
			float: left;
		}
		.checkout-button {
			float:right;
		}
		@media only screen and (max-width: 768px) {
			.button, .checkout-button, .input-text {
				width:100%;
				display: block;
				.borderbox();
				margin-bottom:.5em !important;
				text-align: center;
			}
		}
	}
	.product-thumbnail {
		img {
			margin: 0;
			padding: 0;
			border:0;
			.box_shadow(0,0,0,0);
			max-width:2.618em;
		}
	}
	@media only screen and (max-width: 768px) {
		// Make cart fit responsive layout
		.product-thumbnail, .product-price, .product-quantity {
		  left: -999em;
		  position: absolute;
		}
	}
}

.create-account {
	clear: both;
}

// Product Reviews
#reviews  {
	.comment  {
		.clearfix();
		padding: 1em 0 0;
		position: relative;
		.comment_container  {
			margin: 0 1em;
		}
		img  {
			.border_radius(4px);
		}
		.meta  {
			margin: 0 .382em .618em;
			font-weight: normal;
			font-style: italic;
			color: lighten(@color_body, 20%);
		}
		.star-rating  {
			margin: 0;
			position: absolute;
			top: 18px;
			right: 20px;
		}
	}
	.add_review  {
		clear: both;
	}
}

#shipping_method {
	list-style: none;
	margin-left: 0;
}

// Checkout
#payment {
	border:1px solid @border_main;
	.clearfix;
	.border_radius(.327em);
	.create-account {
		clear:both;
	}
	.payment_methods {
		margin:0 !important;
		border-bottom:1px solid @border_main;
		padding:0 !important;
		li {
			list-style: none !important;
			padding:1em !important;
			border-bottom:1px solid @border_main;
			margin-left:0;
			img {
				float: right;
				border:0;
				padding:0;
			}
			&:last-child {
				padding-bottom:0;
				border-bottom:0;
			}
			label {
				width:92%;
				padding-top:0 !important;
				margin-left:.618em;
				font-weight: bold;
			}
			p {
				margin-bottom:0;
			}
			.payment_box {
				padding:1em;
				margin:1em -1em -1em -1em;
				.vertical_gradient(@bg_light, @bg_light - #040404);
				border-top:1px solid @border_main;
				fieldset {
					border: 0;
					margin: 0;
					padding: 1em 0 0 0;
					font-size: .857em;
					label {
						width:auto;
						margin-left:0;
					}
					.form-row {
						margin-bottom:1em;
					}
					.form-row-first {
						select {
							width:48%;
							&:nth-child(2n) {
								float: right;
							}
						}
					}

					#cvv {
						width:22% !important;
					}

					.help {
						width:75%;
						float: right;
					}
				}
			}
		}
	}
	.terms {
		padding-top:1em;
		float: right;
		margin:0 0 1em;
		text-align: right;
		label {
			display: inline;
		}
	}
	.place-order {
		padding:1em;
		margin-bottom:0;
		float: none;
		width:100%;
		.borderbox;
		.button {
			font-size: 1.387em;
			width: 100%;
		}
	}
}

.woocommerce-account .entry .clear { clear: both; }

@media only screen and (min-width: 768px) {

	#header {
		.widget_product_search {
			float: right;
			clear:none;
		}
		ul.cart { float: right; }
	}

	// General WooCommerce layouts
	.col2-set {
		clear: both;
		.clearfix();

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

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

	.form-row {
		width:48%;
		float: left;
		margin-bottom:2.053em;
		label {
			display: block;
			padding:.236em 0;
			&.checkbox {
				display:inline;
			}
		}

		.input-text, select {
			width:100%;
			*width:90%;
			.borderbox();
		}

		&.notes {
			width:100%;
			float: none;

			textarea {
				width:100%;
				*width:90%;
			}
		}

		&.notes + h3 {
			clear: both;
		}
	}

	.form-row-first {
		clear: left;
	}

	.form-row-last {
		float: right;
	}

	.form-row-wide {
		float: left;
		width:100%;
		clear: both;
	}

	header.title {
		overflow: hidden;
		zoom:1;

		h1, h2, h3, h4, h5 {
			float: left;
		}

		a.edit {
			float: right;
			font-weight: bold;
			line-height: 2.4em;
			&:before {
				.iconbefore;
				content: "\f044";
			}
		}
	}

	// reset mobile product layout styles
	ul.products {
		li.product {
			margin-right:3.8%;
			clear: none;
			&:nth-child(2n) {
				float: left;
			}
			&.first {
				clear: both;
			}
			&.last {
				margin-right:0;
			}
		}
	}

	// product columns
	.woocommerce-columns-2, .woocommerce.columns-2 {
		ul.products {
			li.product {
				width:48%;
			}
		}
	}
	.woocommerce-columns-3, .woocommerce.columns-3 {
		ul.products {
			li.product {
				width:30.75%;
			}
		}
	}
	.woocommerce-columns-4, .woocommerce.columns-4 {
		ul.products {
			li.product {
				width:22.05%;
			}
		}
	}
	.woocommerce-columns-5, .woocommerce.columns-5 {
		ul.products {
			li.product {
				width:16.96%;
			}
		}
	}

	// Single product
	.single-product {
		h1 { margin: 0; }
		.woocommerce-product-rating {
			margin: 1em 0;
			overflow: hidden;
			.star-rating {
				float: right;
				margin-top: .4em;
			}
			.woocommerce-review-link {
				float: left;
			}
		}
		.images, .summary {
			width:48%;
		}
		.images {
			float: left;
		}
		.summary {
			float: right;
			width: 45%;
			.price {
				margin: 0 0 .857em;
				font-size: 1.618em;
				font-weight: bold;
				color: @color_buttons2;
			}
			.single_add_to_cart_button {
				background: @color_buttons2;
			}
		}
		.woocommerce_tabs, .woocommerce-tabs {
			.tabs {
				li {
					a {
						font-size: 1em;
						padding: .857em 1.618em !important;
					}
				}
			}
		}
	}

	// Cart
	table.cart {
		.actions {
			.button {
				width: auto;
				float:none;
			}
			.coupon {
				width:48%;
				float: left;
				text-align: left;
				margin-bottom:0;
				.input-text, .button {
					width:auto;
					float:none;
				}
			}
		}
	}
	.cart-collaterals {
		.clearfix;
		.cross-sells, .cart_totals, .shipping_calculator {
			width:48%;
		}
		.cross-sells {
			float: left;
			ul.products {
				margin-left:0;
			}
		}
		.cart_totals, .shipping_calculator {
			float: right;
			clear:right;
		}
		.shipping_calculator {
			.shipping-calculator-form {
				.clearfix;
			}
			.clear {
				clear:both;
			}
		}
	}

	// Checkout
	#customer_details {
		.col-1, .col-2 {
			float:none;
			width:100%;
			.clearfix;
		}
		#shiptobilling {
			float: none;
			width:100%;
		}
		.notes {
			clear:both;
		}
	}

}