/**
 * woocommerce-theme.scss
 * Governs the general look and feel of WooCommerce sections of stores using themes that do not
 * integrate with WooCommerce specifically.
 *
 */

/**
 * Woo-elements
 * Cart page
 *
 */

.return-to-shop {
	padding-bottom: 40px;
}

.woocommerce {
	.wc-proceed-to-checkout {
		padding: 2.2em 0 1em;
		text-align: right;
	}

	a.remove {
		font-weight: 400;
		margin-left: 10px;
		font-size: 0;
		line-height: 1;

		&:hover {
			background: transparent;
		}

		&:before {
			content: '\f00d';
			font-family: 'Fontawesome';
			font-size: 21px;
		}
	}

	table.shop_table {
		width: 100%;
		margin: 61px 0 30px;
		border: 1px solid $wooborder_color;
		border-collapse: collapse;
		@include media-breakpoint-up(sm) {
			border: none;

			&.customer_details {
				border: 1px solid $wooborder_color;
				td {
					border-bottom: 1px solid $wooborder_color;
				}
			}
		}
		@media (max-width: 768px) {
			.product-thumbnail {
				display: none;
			}
		}

		thead {
			border-bottom: 1px solid $wooborder_color;

			th {
				padding: 20px 5px 21px;
				border: none;
				font-weight: 700;
				text-align: center;
				text-transform: capitalize;
				font-size: 16px;
				&.product-name {
					text-align: left;
				}

				@include media-breakpoint-up(md) {
					padding: 30px 10px 32px;
				}
			}
		}

		tbody {
			tr {
				td {
					border: none;
					padding: 20px 10px 28px;
					vertical-align: middle;
					@include media-breakpoint-up(md) {
						padding: 50px 10px 58px;
					}

					&.product-remove {
						width: 50px;
						padding: 0;
						position: relative;
						a.remove {
							position: absolute;
							left: 5px;
							top: 20%;
							@include media-breakpoint-up(sm) {
								left: -15px;
								top: 41%;
							}
							&:before {
								@include nc-icon-outline();
								content: "\ed2c";
								font-size: 30px;
							}
						}
					}

					&.product-price,
					&.product-quantity {
						border-right: none;
						@include media-breakpoint-up(sm) {
							border-right: 1px solid $wooborder_color;
						}
					}

					&.product-remove,
					&.product-thumbnail,
					&.product-name,
					&.product-subtotal,
					&.product-quantity,
					&.product-total,
					&.product-price {
						border-bottom: 1px solid $wooborder_color;
					}

					&.product-subtotal,
					&.product-quantity,
					&.product-total,
					&.product-price {
						text-align: center;
						border-bottom: 1px solid $wooborder_color;

						.amount {
							@include font-size(1.125);
							@include media-breakpoint-up(md) {
								@include font-size(1.5);
							}
						}
					}

					&.product-subtotal,
					&.product-quantity,
					&.product-price {
						@include media-breakpoint-up(lg) {
							width: 232px;
						}

						&:before {
							margin-top: 0;
							@include media-breakpoint-up(sm) {
								margin-top: 9px;
							}
						}
					}

					&.product-thumbnail {
						min-width: 161px;

						a {
							display: block;
						}

						img {
							display: block;
							width: auto;
							max-width: 100%;
						}
					}

					&.product-name {
						border-right: none;
						padding-left: 25px;
						@include media-breakpoint-up(sm) {
							border-right: 1px solid $wooborder_color;
						}

						.mini_cart_item_title,
						a {
							font-size: 14px;
							font-weight: 400 !important;
							text-decoration: none;
						}

						h5 {
							overflow: hidden;
							white-space: nowrap;
							text-overflow: ellipsis;
						}

						dl.variation {
							margin: 5px 0 0;

							dt {
								margin: 0 5px 0 0;
								padding: 0;
								font: inherit;
								font-size: 12px;
								font-style: italic;
							}

							dd {
								margin: 0;
								padding: 0;
								text-transform: lowercase;
								font-size: 12px;
								font-style: italic;

								p {
									margin: 0;
								}
							}
						}
					}

					input[type="number"] {
						width: 80px;
						padding: 7px;

						@include media-breakpoint-up(md) {
							width: 115px;
							padding: 14px;
						}
					}

					&.actions {
						padding: 20px 0;
						border-bottom: 1px solid $wooborder_color;
						@include media-breakpoint-up(md) {
							padding: 50px 0 28px;
						}

						.coupon {
							input.button {
								padding: 22px 25px;
								border-radius: 0;
							}

							input.input-text#coupon_code {
								width: 100%;
								padding: 12px 20px 13px 41px !important;
								margin-bottom: 10px;
								border-color: lighten(desaturate(adjust_hue($wooborder_color, -240), 53.333333333333364%), 3.1372549019607874%);
								@include media-breakpoint-up(sm) {
									width: auto;
									margin-right: 12px;
								}
							}
						}

						input.btn {
							padding: 22px 25px;
							border-radius: 0;
						}
					}
				}

				&.cart_item,
				&.order_item {
					background: none;

					td:before {
						margin-right: 15px;
					}
				}

				&.cart-subtotal,
				&.order-total,
				&.tax-total,
				&.tax-rate{
					background: none;
					//border: none;
					display: block;
					//text-align: right;
					line-height: 1.2em;

					th,
					td {
						display: inline;
						padding: 0;
					}

					td:before {
						display: none;
					}
				}
				&.cart-subtotal,
				&.tax-total,
				&.tax-rate {
					margin-bottom: 7px;
				}

				&.cart-subtotal,
				&.order-total,
				&.tax-total,
				&.tax-rate {
					th,
					td,
					.amount {
						font-size: 14px;
						line-height: 24px;
						font-weight: 800;
					}

					th {
						font-weight: 900;
						line-height: 30px;
					}

					.amount {
						font-size: 22px;
					}
				}
			}

			th {
				font-weight: 600;
				text-transform: uppercase !important;
				font-size: 16px;
				line-height: 24px;
				text-align: right;
			}
		}

		tfoot {
			font-weight: normal;
			
			th,
			td {
				border: none;
				padding: 10px;
			}

			tr {
				&.shipping,
				&.order-total {
					border-bottom: 1px solid $wooborder_color;
				}
				&:first-child {
					th,
					td {
						padding-top: 30px;
					}
				}
				&.cart-subtotal,
				&.shipping,
				&.order-total {
					th {
						border-right: 1px solid $wooborder_color;
					}
				}
			}
		}

		&.woocommerce-checkout-review-order-table {
			margin-top: 32px;
			margin-bottom: 36px;
			@include media-breakpoint-up(sm) {
				margin-bottom: 50px;
			}

			thead {
				tr {
					th,
					td {
						padding: 11px 10px 15px;
						@include media-breakpoint-up(sm) {
							padding: 21px 0 30px;
						}
					}
				}
			}

			tbody {
				tr {
					th,
					td {
						padding: 21px 10px 27px;
						@include media-breakpoint-up(sm) {
							padding: 31px 0 37px;
						}
					}
				}
			}
			th,
			td {
				padding: 0;
				&.product-total {
					text-align: right;
				}
			}

			tfoot {
				padding-top: 20px;
				tr {
					th {
						> span {
							&:after {
								content: ":";
							}
						}
					}

					&.cart-subtotal,
					&.order-total,
					&.tax-total,
					&.tax-rate {
						background: none;
						//border: none;
						//text-align: right;
						line-height: 1.2em;
						th, td {
							//border: none;
						}
						td {
							padding-right: 10px;
						}

						th, td, .amount {
							font-size: 14px;
							line-height: 24px;
							font-weight: 800;
						}

						th {
							font-weight: 900;
							line-height: 30px;
						}

						.amount {
							font-size: 22px;
						}
					}

					&.cart-subtotal {
						border-bottom: 1px solid $wooborder_color;
						th, td {
							padding-top: 30px;
							padding-bottom: 30px;
						}

					}
					&.tax-total,
					&.tax-rate {
						th, td {
							padding-top: 10px;
						}
					}

					&.order-total {
						th, td {
							padding-top: 17px;
							padding-bottom: 20px;
							@include media-breakpoint-up(sm) {
								padding-bottom: 0;
							}
						}
					}
				}
			}
		}

		@media (max-width: 768px) {
			&.shop_table_responsive {
				tbody tr td {
					padding: 15px 10px;

					&:before {
						margin: 0;
						@include font-size(.875);
					}

					&:last-child {
						border-bottom: none;
					}

					&.product-remove {
						width: 100%;
						padding-top: 15px;
						border: none;

						a {
							margin-left: 0;
						}
					}

					&.product-quantity {
						&:before {
							margin-top: 8px;
						}
					}

					&.product-name a {
						width: 50%;
						margin-left: 20px;
						display: inline-block;
					}
				}
			}
		}
	}

	.cart-collaterals {
		padding-top: 8px;
		padding-bottom: 4em;

		div.cart_totals {
			table {
				margin: 0;
				border: none;

				tbody {
					tr,
					td,
					td,
					th {
						border: none;
						padding: 5px 0 5px;
						text-transform: none;
					}

					td {
						text-align: right;
					}
				}

				tr:nth-child(2n) td {
					background: none;
				}
			}

			.checkout-button {
				border-radius: 0;
				@include media-breakpoint-up(md) {
					padding: 13px 39px 13px;
				}
			}
		}

		.cross-sells {
			width: 100%;
			padding-top: 50px;
			float: none;
			clear: both;
			text-align: center;
		}
	}
}

/**
 * Woo-elements
 * Checkout page
 *
 */
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
	border: none;
	padding: 0;
	margin: 0;
	border-radius: 0;
}

.woocommerce-checkout {
	.entry-content {
		padding-top: 74px;
	}

	.woocommerce-info {
		border: none;
		border-top: 1px solid $wooborder_color;
		background: none;
		padding: 58px 0 0 0 !important;
		margin-bottom: .95em !important;
		font-style: normal;

		&:first-child {
			border-top: none;
			padding-top: 0 !important;
			margin-top: 0;
		}

		> a {
			font-size: 14px;
			margin-left: 8px;
		}

		&:before {
			display: none;
		}
	}
}

//Styles for Woocommerce Country Select Menu
.select2-drop-active {
	border: 1px solid $color__border-input;

	.select2-results {
		font-size: 14px;
		line-height: 20px;
		font-style: italic;
	}
}

.woocommerce {
	//Styles for Woocommerce Forms
	form .form-row.woocommerce-invalid .select2-container,
	form .form-row.woocommerce-invalid input.input-text,
	.form .form-row.woocommerce-invalid select {
		border-color: $woo_pink;
	}

	form .form-row.woocommerce-validated .select2-container,
	form .form-row.woocommerce-validated input.input-text,
	form .form-row.woocommerce-validated select {
		border-color: $woo_green;
	}

	form label {
		.woocommerce-cart &,
		.woocommerce-checkout & {
			font-size: 12px;
			padding-left: 10px;
		}
	}

	form.woocommerce-checkout {
		padding-top: 57px;
		margin-top: 25px;
		border-top: 1px solid $wooborder_color;
	}

	form {
		.form-row {
			max-width: 420px;
			padding: 0;
			margin-bottom: 15px;

			&.validate-postcode {
				margin-bottom: 25px;
			}

			&.create-account {
				input {
					width: 25px;
					height: 25px;
					margin-right: 5px;
					display: inline-block;
					top: 1px;
					outline: 0;
					position: relative;
					cursor: pointer;
					border: 1px solid;
					-webkit-appearance: none;
					appeareance: none;
				}
				input[type=checkbox] + span {
					&:before {
						content: '\e934';
						position: absolute;
						@include linear-icon();
						left: 4px;
						top: 3px;
						font-size: 18px;
						color: #000;
						opacity: 0;
					}
				}
				input[type=checkbox]:checked + span {
					&:before {
						opacity: 1;
					}
				}

				label.checkbox {
					display: inline-block;
					cursor: pointer;
					font-size: 14px;
					line-height: 25px;
					position: relative;
					border: none;
					top: 1px;
				}
			}

			.select2-container.country_to_state {
				-webkit-appearance: none;
				border: none;
				@include border-radius;
				@include font-size(14/16);
				line-height: 1.2143;
				font-style: italic;
				transition: .3s;

				.select2-choice {
					padding: $input__indents_y $input__indents_x;
					border: 1px solid $color__border-input;
					background-color: $color__background-input;
					box-shadow: none;

					.select2-arrow b {
						&:after {
							@include nc-icon-outline();
							content: "\ee47";
							border: none;
							font-size: 16px;
							line-height: 23px;
							margin: -12px 0 0 -24px;
						}
					}
				}
			}
		}

		.form-row-first,
		.form-row-last {
			float: none;
			width: auto;
		}

		&.login {
			padding-bottom: 0.8em;
			margin-bottom: 1em;

			.form-row-last {
				margin-bottom: 39px;
			}

			.form-row {
				label.inline {
					display: inline-block;
					position: relative;
					cursor: pointer;
					font-size: 14px;
					line-height: 25px;
					padding-left: 30px;
					margin: 5px 0 0 28px;

					input {
						width: 25px;
						height: 25px;
						display: block;
						position: absolute;
						left: 0;
						top: 0;
						cursor: pointer;
						border: 1px solid;
						outline: 0;
						background: transparent;
						background-color: transparent;
						-webkit-appearance: none;
						appeareance: none;
					}
					input[type=checkbox] + span {
						&:before {
							content: '\e934';
							position: absolute;
							@include linear-icon();
							left: 4px;
							top: 3px;
							font-size: 18px;
							color: #000;
							opacity: 0;
						}
					}
					input[type=checkbox]:checked + span {
						&:before {
							opacity: 1;
						}
					}
				}
			}

			.lost_password {
				padding-top: 25px;
				font-size: 14px;
				line-height: 20px;
			}
		}

		&.checkout_coupon {
			padding: 0.5em 0 2em;
			margin-bottom: 1.2em;
			@include flexbox();
			@include flex-direction(row);
			@include flex-wrap(wrap);
			@include media-breakpoint-up(sm) {
				padding: 0.8em 0 2em;
			}

			.form-row-first {
				@include flex(1 1 100%);
				min-width: 185px;
				@include media-breakpoint-up(sm) {
					@include flex(5 1 185px);
				}

				input {
					-webkit-box-sizing: border-box;
					box-sizing: border-box;
					width: 100%;
					max-width: 100%;
					min-width: 50px;
				}
			}

			.form-row-last {
				@include flex(0 1 auto);
				@include media-breakpoint-up(sm) {
					margin-left: 10px;
				}
			}
		}
	}

	.entry-content table.shop_table,
	table.shop_table {
		&.order_details,
		&.customer_details {
			margin: 10px 0 50px;

			thead tr th.product-total {
				text-align: right;
			}

			tbody, tfoot {
				tr {
					th,
					td {
						padding: 10px;
						text-align: right;
					}
				}
			}
		}

		&.order_details,
		&.customer_details {
			tfoot {
				tr {
					th {
						font-weight: 900;
						padding: 0;
						font-size: 14px;
						line-height: 30px;
					}

					td {
						padding: 0;
						font-size: 20px;
						line-height: 24px;
						font-weight: 800;

						.amount {
							font-size: 22px;
							line-height: 24px;
							font-weight: 800;
						}
					}
				}
			}
		}
	}
	
	ul#shipping_method {
		text-align: center;
	}
}

.woocommerce, .woocommerce-page {
	.col2-set {
		@include flexbox();
		@include flex-direction(row);
		@include flex-wrap(wrap);
		@include justify-content(flex-start);
		@include align-content(flex-start);
		@include align-items(flex-start);
		border-bottom: 1px solid $wooborder_color;
		padding-bottom: 59px;
		margin-bottom: 57px;

		.col-1, .col-2 {
			width: auto;
		}

		.col-1 {
			float: none;
			@include flex(0 1 100%);
			@include media-breakpoint-up(sm) {
				@include flex(0 1 100%);
			}
		}

		.col-2 {
			float: none;
			padding-top: 30px;
			@include media-breakpoint-up(md) {
				@include flex(0 1 100%);
			}
		}
	}
}

.woocommerce-checkout-payment#payment {
	padding: 20px !important;
	background-color: $woo_comment_bg;
	@include media-breakpoint-up(sm) {
		padding: 20px 20px 40px 20px !important;
	}

	ul.payment_methods {
		padding: 0;
		border: none;
		li {
			label {
				padding: 0 0 10px 0;
				@include media-breakpoint-up(sm) {
					padding: 0 0 27px 0;
				}
			}
		}
	}

	div.form-row {
		padding: 0;
		max-width: none;

		&.place-order {
			padding-top: 20px;
		}
	}
}

.woocommerce-cart {
	h3 {
		text-align: center;
	}
}

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
	border-radius: 0;

	div.payment_box {
		font-size: 14px;
		line-height: 20px;
		padding: 7px 16px;
		border-radius: 2px;
		font-style: italic;
		background: $woo_payment_box_bg;
		margin-bottom: 1em;
		@include media-breakpoint-up(sm) {
			margin-bottom: 3em;
		}

		&:before {
			display: none;
		}
	}
}

/**
 * Woo-elements
 * Order details page
 *
 */

.woocommerce-checkout .woocommerce-thankyou-order-details {
	background: $woo_info_bg;
	padding: 15px;
	position: relative;

	li {
		strong {
			font-weight: 500;
			display: block;
			padding-top: 10px;

			.amount {
				font-size: 24px;
				line-height: 1em;
			}
		}

		&.method {
			&:after {
				position: absolute;
				right: 1em;
				top: .7em;
				@include nc-icon-outline();
				content: "\ebda";
				font-size: 30px;
			}
		}
	}
}

/**
 * Woo-elements
 * Account page
 *
 */
.woocommerce-account.logged-in {
	.entry-content > .woocommerce {
		.woocommerce-table--customer-details{
			tbody{

				th{
					border-top-width: 0!important;
				}

				td{
					border: none!important;
				}
			}
		}

		.woocommerce-table--order-details{
			tfoot{
				border-bottom: 1px solid $wooborder_color;

				th{
					padding-right: 20px;
					border-right: 1px solid $wooborder_color;
				}

				tr{
					td,
					th{
						padding: 8px 10px 8px 20px;
					}

					&:nth-child(even) {
						background: #f6f6f6;
					}
				}

				td{
					text-align: left;
					padding-left: 20px;

					&,
					.amount{
						font-size: 16px;
						font-weight: 400;
					}
				}
			}
		}

		.woocommerce-table__product-total{
			text-align: left;

			.woocommerce-Price-amount{
				font-size: 16px;
			}
		}

		.order-number,
		.order-date,
		.order-status {
			background: transparent;
			font-style: normal;
		}

		.woocommerce-order-details{
			margin-top: 30px;
		}

		.woocommerce-customer-details h2,
		.woocommerce-order-details__title {
			@include media-breakpoint-up(md) {
				font-size: 22px;
			}
		}

		.woocommerce-order-details__title{
			margin-bottom: 25px;
		}

		table.shop_table {
			margin-top: 10px;
		}

		.woocommerce-MyAccount-navigation,
		.woocommerce-MyAccount-content {
			width: auto;
			float: none;
			display: inline-block;
			vertical-align: top;
			padding: 20px;
		}

		.woocommerce-MyAccount-navigation {
			text-transform: uppercase;

			ul,
			li:last-child {
				margin-bottom: 0;
			}
			li {
				width: 100%;
				list-style-type: none;
				border: 1px solid $wooborder_color;
				margin-left: 0;

				+ li {
					margin-top: 8px;
				}

				a {
					padding: 18px 19px;
					display: block;
					border-radius: 3px;
					text-transform: none;
				}

				&:before {
					display: none;
				}
			}
		}

		.woocommerce-MyAccount-content {
			fieldset {
				border: 1px solid $color__background-hr;
				margin-bottom: 25px;
			}
			.woocommerce-button.button.view {
				padding: 6px 20px;
				border-radius: 3px;
				background-color: transparent;
				text-transform: capitalize;
			}

			table.shop_table {
				font-size: 16px;
				thead th {
					padding: 8px 10px 8px 20px;
					text-align: left;
					text-transform: capitalize;
					border-right: 1px solid $wooborder_color;

					&:last-child {
						border-right-width: 0;
					}
				}

				tbody tr {
					td {
						padding: 8px 10px 8px 20px;

						border-right: 1px solid $wooborder_color;

						a {
							background-color: transparent;
							text-transform: capitalize;
							padding: 6px 10px;
						}

						&:last-child {
							border-right-width: 0;
						}

						&:before {
							margin-right: 10px;
						}
					}
					&:nth-child(even) {
						background: #f6f6f6;
					}

					+ tr td {
						border-top: 1px solid $color__background-hr;
					}
				}
			}

			@include media-breakpoint-down(md) {
				.woocommerce-info {
					&:before {
						display: none;
					}
				}
			}

			@include media-breakpoint-down(sm) {
				.woocommerce-info {
					padding: 2em !important;

					a.button {
						margin: 0 500px 15px 0;
						float: none;
					}
				}
			}
		}
		.woocommerce-MyAccount-navigation,
		.woocommerce-MyAccount-content {
			width: 100%;
		}

		@include media-breakpoint-up(md) {

			.woocommerce-MyAccount-navigation {
				width: 30%;
				max-width: 22.5%;
				padding: 0 40px 0 0;
			}

			.woocommerce-MyAccount-content {
				width: 67%;
				max-width: 76.2%;
				padding: 0 0 0 33px;

				p {
					font-size: 16px;
				}
			}
		}
	}

	form.edit-account{
		margin-top: -12px;

		.form-row{
			max-width: 100%;
			margin-bottom: 10px;

			label{
				font-weight: 700;
			}
		}

		fieldset{
			padding: 8px 30px 40px 30px;
			margin-bottom: 40px!important;

			+ .clear{
				+ p{
					.woocommerce-Button{
						border-radius: 3px;
					}
				}
			}


			legend{
				font-size: 18px;
				font-weight: 700;
			}
		}
	}
}