/*
Theme Name: _ftm

WooCommerce styles override
*/



.woocommerce-page .entry-header-wrapper,
.woocommerce-page .entry-content-wrapper,
.woocommerce-page .entry-footer-wrapper {
	max-width: var(--max_width_wide);
}








.woocommerce-products-header {
	padding: 0 var(--gutter_width);
	margin: var(--space_large) auto;
}
.woocommerce-notices-wrapper {
	padding: 0 var(--gutter_width);
	margin: 0 auto;
}


/* My Account (not logged in), Cart, Checkout pages */
.entry-content .woocommerce-notices-wrapper {
	padding: 0;
	min-width: 100%;
	margin-top: 0;
}

/* This can exist on the page even when unused (my-account page not logged in) */
.woocommerce-notices-wrapper:empty {
	margin: 0;	
}
.woocommerce-MyAccount-content .woocommerce-notices-wrapper {
	margin: 0;
}



/**
 * WC Messages & Notices
 */
.woocommerce-message, /* Single product, after adding to cart */
.woocommerce-info, /* Cart Notices, Checkout Returning User & Coupon */
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
	margin-top: 0;
	margin-bottom: var(--space_large);
	padding: var(--space_small) var(--space_medium);
	border: 1px solid rgba(0,0,0,0.125);
	background-color: var(--gray_xlight);
}
.woocommerce-info {
	margin-top: var(--space_large);	
}
/* Sometimes messages show up inside the cart form - very strange indeed... */
.woocommerce-cart-form .woocommerce-info {
	margin-top: 0;	
}
/* Shows up after coupon applied successfully */
.woocommerce-form-coupon-toggle + .woocommerce-message,
.woocommerce-form-coupon-toggle + .woocommerce-error {
	margin-top: var(--space_large);	
}

.woocommerce-info,
.woocommerce-noreviews,
p.no-comments {
	/*background-color: var(--notice_color);*/
}

.woocommerce-error {
	list-style: none;
	/*background-color: var(--error_color);*/
	/*color: #fff;*/
}

.woocommerce-NoticeGroup-checkout ul.woocommerce-error:before {
	content: 'Checkout Errors:';
	display: block;
}


/* Should .button links always be floated right like this? */
/* What template is this in? */
.woocommerce-Message .button,
/* Single Product after adding to cart */
.woocommerce-message .button,
/* If using WC Cart Notices plugin */
.woocommerce-cart-notice .button {  
	float: right;
	margin-left: 0.25em;
}
.woocommerce-Message .button,
.woocommerce-message .button,
.woocommerce-cart-notice:after {
	content: '';
	display: block;
	clear: both;	
}


.woocommerce-message:before {
	font-family: 'woocommerce' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.woocommerce-message:before {
	content:"\e015";
	color: var(--color_success);
}




/**
 * Shop The Image functionality
 */
.ft-shop-the-image {
	position: relative;
	display: table;
}
.shop-the-image-button {
	position: absolute;
	bottom: var(--space_large);
	right: var(--space_large);	
}



/**
 * My Account
 * 
 */
.account-navigation {
	margin-bottom: var(--space_large);	
}
.wc-account-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;	
}
.wc-account-nav li {
	padding: var(--space_xsmall) var(--space_normal);	
}
.wc-account-nav li.is-active {
	background-color: var(--gray_xlight);
}
.wc-account-nav a {
	color: inherit;
	font-weight: bold;
	text-decoration: none;
	white-space: nowrap;
}



@media(min-width: 45em){
	
	/* If not logged in we can put the login/register forms next to each other */
	#customer_login.col2-set {
		display: flex;	
	}
	#customer_login.col2-set .col-1 {
		width: 50%;
		padding-right: var(--space_normal);
	}
	#customer_login.col2-set .col-2 {
		width: 50%;
		padding-left: var(--space_normal);
	}
}



/* Account Pages start to have the account nav on the side at some point */
@media(min-width: 64em){
	
	.woocommerce-account .woocommerce {
		display: flex;
		flex-wrap: wrap;
	}
	
	.account-navigation {
		width: 22.5%;	
	}
	.woocommerce-MyAccount-content {
		padding-left: var(--space_xlarge);
		width: 77.5%;
	}
	
	/* Account nav doesn't toggle anymore */
	button.wc-account-nav-toggle {
		display: none;	
	}
	
	.wc-account-nav.toggled-off {
		visibility: visible;
		position: static;
		transform: none;
		opacity: 1;	
	}
	
	
}








/**
 * Product Archives
 */

.position-wc_archive_before_content .page-section {
	margin: var(--space_large) 0;	
}



/* WC product Result Count and Orderby form */
.product-results-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}
p.woocommerce-result-count {
	margin: 0;
	line-height: 40px; /* Magic Number? - Matches the height of the select box */	
}



/* Shop Sidebar is usually collapsable */
.sidebar-shop {
	position: relative;	
}
.sidebar-shop-toggle {
		
}
.collapsable-sidebar-shop,
.shop-widget-collapsable {
	position: absolute;
	top: 100%;
	left: -9999em;
	opacity: 0;
	transition: opacity 0.25s ease-out;
}
.collapsable-sidebar-shop.toggled,
.shop-widget-collapsable.toggled {
	position: static;
	opacity: 1;	
}


/* Usual styling of product filter widgets is checkbox list */
ul.product-categories,
ul.product-categories ul,
ul.woocommerce-widget-layered-nav-list {
	list-style: none;
	padding: 0;	
}
ul.product-categories a,
ul.woocommerce-widget-layered-nav-list a {
	padding-left: 1.5em;
	position: relative;
}
ul.product-categories a:before,
ul.woocommerce-widget-layered-nav-list a:before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	width: 1em;
	height: 1em;
	border: 1px solid var(--gray_light);
	transform: translateY(-50%);
}
ul.product-categories .current-cat-parent > a:after,
ul.product-categories .current-cat > a:after,
ul.woocommerce-widget-layered-nav-list .chosen a:after {
	
	font-family: 'ftm' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

  	/* Better Font Rendering =========== */
  	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
	
	content: '\f00c';
	display: block;
	position: absolute;
	left: 0.125em;
	top: 50%;
	transform: translateY(-50%);
}


.widget_layered_nav_filters ul {
	list-style: none;
	padding: 0;
}
.widget_layered_nav_filters a:before {
	font-family: 'ftm' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

  	/* Better Font Rendering =========== */
  	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
	
	content: '\f00d';
}


/* And the widgets inside that sidebar are usually collapsable too :( */
.widget-toggle {
	
}

.widget-toggle .widget-title {
	font: inherit;
	margin: 0;
}



ul.products {
	list-style: none;
	margin: 0;
	padding: 0;

}

/* Covers product lists, related products, upsells, etc. */
ul.products {
	display: grid;
    grid-gap: var(--space_medium);
	grid-template-columns: repeat(2, 1fr);
}

/*
@media screen and (min-width: 48em) {
	ul.products li.product {
		width: 30.7966666667%;
		float: left;
		margin-right: 3.8%;
	}
	ul.products li.product.first {
		clear: both;
	}
	ul.products li.product.last {
		margin-right: 0;
	}
	.columns-1 ul.products li.product {
		float: none;
		width: 100%;
	}
	.columns-2 ul.products li.product {
		width: 48.1%;
	}
	.columns-3 ul.products li.product {
		width: 30.7966666667%;
	}
	.columns-4 ul.products li.product {
		width: 22.15%;
	}
	.columns-5 ul.products li.product {
		width: 16.96%;
	}
	.columns-6 ul.products li.product {
		width: 13.4933333333%;
	}
}
*/






/* Little "Sale!" badge needs to be absolutely positioned */
.ftm-parent-shop-loop-image-wrapper {
	position: relative;
}
.product-inner .onsale {
	position: absolute;
	z-index: 9;
	top: 0;
	left: 0;
	padding: var(--space_xxsmall) var(--space_xsmall);
	background-color: #c0ffee;
}

/* The image, title, and price html are all inside this <a> tag */
.woocommerce-LoopProduct-link {
	color: inherit;
	text-decoration: none;	
}

/* Loop product titles get sized like h3s */
.woocommerce-loop-product__title {
	font-size: var(--font_size_h3);
}

/* Product images */
.product img {
	/* Might need to stretch? :( */
	width: 100%;
	height: auto; 
}


/* Ajax add to cart buttons */
/* NOTE: 4-6-19 - This should be moved to a utilty css file... */
@keyframes infinite-spinning {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* These links by default just have a text node and a pseudo element */
.add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.archive-add-to-cart-button-text {
	white-space: nowrap;
	text-transform: capitalize;	
}
.ajax_add_to_cart.loading .archive-add-to-cart-button-text,
.ajax_add_to_cart.added .archive-add-to-cart-button-text {
	font-size: 0;
}	

.ajax_add_to_cart.loading:before {
	content: 'Adding';	
}
.ajax_add_to_cart.added:before {
	content: attr(data-already-in-cart-text);
	white-space: nowrap;	
}

/* We could have some fun with this... */
/*
.ajax_add_to_cart.added[data-product_id$="0"]:before {
	content: 'Holla!';	
}
.ajax_add_to_cart.added[data-product_id$="1"]:before {
	content: 'Word!';	
}
.ajax_add_to_cart.added[data-product_id$="2"]:before {
	content: 'Thanks!';	
}
.ajax_add_to_cart.added[data-product_id$="3"]:before {
	content: 'You Rock!';	
}
.ajax_add_to_cart.added[data-product_id$="4"]:before {
	content: 'My Man!';	
}
.ajax_add_to_cart.added[data-product_id$="5"]:before {
	content: 'Yuck!';	
}
.ajax_add_to_cart.added[data-product_id$="6"]:before {
	content: 'Really?';	
}
.ajax_add_to_cart.added[data-product_id$="7"]:before {
	content: 'Sad!';	
}
.ajax_add_to_cart.added[data-product_id$="8"]:before {
	content: 'Ok..?';	
}
.ajax_add_to_cart.added[data-product_id$="9"]:before {
	content: 'Sucker!';	
}
*/





.ajax_add_to_cart:after {
	content: "\e031";
	font-family: 'woocommerce' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	position: absolute;
	opacity: 0;
	display: inline-block;
	margin-left: 1em;
	transform: rotate(0);
}
.ajax_add_to_cart.loading:after {
	position: static;
	opacity: 1;
	content: "\e031";
	animation: infinite-spinning 1s infinite;
	
}
.ajax_add_to_cart.added:after {
	position: static;
	opacity: 1;
	content: "\e017";
}

/* link that appears */
.added_to_cart.wc-forward {
	display: inline-block;
	text-decoration: none;
	font-size: 0.8888em;
}







/* Single Product Pages */
.ftm-single-product-wrapper {
	padding: 0 var(--gutter_width);	
}
.ftm-single-product-inner {
	max-width: var(--max_width_wide);
	margin: 0 auto;	
}


.ftm-single-product-images-summary,
.ftm-single-product-images,
.ftm-single-product-images-summary .summary { 
	margin: var(--space_large) 0;	
}

/* Need this for the little badges */
.ftm-single-product-images {
	position: relative; 
}



.single-product div.product .woocommerce-product-gallery {
	position: relative;
}

.woocommerce-product-gallery__trigger {
	position: absolute;
	top: 1rem;
	right: 1rem;
	display: block;
	z-index: 9;
	text-decoration: none;
}

figure.woocommerce-product-gallery__wrapper {
	margin: 0;
}

.woocommerce-product-gallery .flex-viewport {
	margin-bottom: 1em;
}
.woocommerce-product-gallery .flex-control-thumbs {
	list-style: none;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}
.woocommerce-product-gallery .flex-control-thumbs li {
	width: 25%;
}
/* Need this if product images are set to 100% */
.woocommerce-product-gallery .flex-control-thumbs li img {
	width: auto;	
}


.stock:empty:before {
	display: none;
}

.stock.in-stock {
	color: var(--success_color);
}

.stock.out-of-stock {
	color: var(--error_color);
}

.single_add_to_cart_button {
	margin-top: var(--space_large);
}


@media(min-width: 48.5em){
	
	/* At some point the product summary will come up next to the images */
	.ftm-single-product-images-summary {
		display: flex;	
	}
	.ftm-single-product-images {
		min-width: 39.75%;
		max-width: 39.75%;
	}
	.summary {
		padding-left: var(--space_xlarge);	
	}
	
}







/* Shop Tables */

/* Simplest Shop Tables (Order details, subscription details, checkout review order table */
.shop_table {
	border-spacing: 0;
	border-collapse: collapse;
	border: 1px solid var(--gray_light);
}
.shop_table tr {
	border: 1px solid var(--gray_light);	
}
.shop_table th,
.shop_table td {
	vertical-align: top;
	text-align: right;
	padding: var(--space_xsmall) var(--space_small);
}
.shop_table th:first-child,
.shop_table td:first-child {
	text-align: left;
}

/* Specific for product bundles */
.shop_table tr.bundle_table_item,
.shop_table tr.bundled_table_item {
	background-color: transparent;	
}

/* Mostly for the Switch Subscription button */
.shop_table.order_details .product-quantity {
	margin-right: 0.5em;
}



/* Responsive Shop Tables */
/* The "Cart Totals" responsive table should probably just always stay in this mode... */
.shop_table_responsive,
.shop_table_responsive tbody,
.shop_table_responsive tr,
.shop_table_responsive tfoot,
.cart_totals .shop_table_responsive,
.cart_totals .shop_table_responsive tbody,
.cart_totals .shop_table_responsive tr,
.cart_totals .shop_table_responsive tfoot {
	display: block;
	border: none;
}
/* These show later*/
.shop_table_responsive thead, 
.cart_totals .shop_table_responsive thead {
    display: none
}
.shop_table.shop_table_responsive tr,
.cart_totals .shop_table.shop_table_responsive tr {
	padding: var(--space_xsmall) 0;
	border-bottom: 1px solid var(--border_color);	
}
.shop_table_responsive tbody tr:first-child,
.cart_totals .shop_table_responsive tbody tr:first-child {
	border-top: 1px solid var(--border_color);
}
.shop_table_responsive th,
.shop_table_responsive td,
.shop_table_responsive td:first-child,
.cart_totals .shop_table_responsive th,
.cart_totals .shop_table_responsive td,
.cart_totals .shop_table_responsive td:first-child {
	padding: var(--space_xsmall) 0;
    display: block;
    text-align: right;
}
.shop_table_responsive th,
.cart_totals .shop_table_responsive th  {
    display: none
}
.shop_table.shop_table_responsive th:first-child,
.shop_table_responsive td.actions,
.cart_totals .shop_table.shop_table_responsive th:first-child,
.cart_totals .shop_table_responsive td.actions {
	text-align: initial;	
}


/* Output the faux label */
.shop_table_responsive td::after,
.shop_table_responsive td::before,
.cart_totals .shop_table_responsive td::after,
.cart_totals .shop_table_responsive td::before {
    content: '';
    display: table
}
.shop_table_responsive td::after,
.cart_totals .shop_table_responsive td::after {
    clear: both
}
.shop_table_responsive td[data-title]::before,
.cart_totals .shop_table_responsive td[data-title]::before {
	display: block;
    font-weight: 600;
    float: left;
	text-align: left;
	content: attr(data-title);
}

.cart_totals .shop_table_responsive td[data-title]::before {
	font-weight: normal;	
}










/* No label on these? */
.shop_table.shop_table_responsive td.product-remove::before,
.shop_table.shop_table_responsive td.product-remove::after,
.shop_table.shop_table_responsive td.actions::before,
.shop_table.shop_table_responsive td.download-actions::before {
    display: none
}
/* Sometimes the remove link is not present - But this only works with a template override of cart.php to remove whitespace :( */
.shop_table.shop_table_responsive td.product-remove:empty {
	display: none;	
}
/* 6-22-19 - It's never really empty though because of whitespace. */
.bundled_table_item td.product-remove {
	display: none;	
}


/* 5-21-19 - These need testing */
table.shop_table_responsive tr td.download-actions .button {
    display: block;
    text-align: center
}
table.shop_table_responsive.my_account_orders .order-actions {
    text-align: right
}
table.shop_table_responsive.my_account_orders .order-actions::before {
    display: none
}

/* Make the buttons in shop table rows a little shorter (/my-account/orders/) */
.shop_table:not(.cart) .button {
	padding-top: 0;
	padding-bottom: 0;
	font-size: 0.875em;
	margin-left: var(--space_xxsmall);
}




/* Variation <dl>s in cart rows */
/* 6-22-19 This has only been tested with Product Addons, not actual WC Variable Products... */
.variation {
	margin: 0;
	font-size: 0.875em;
}
.variation dt,
.variation dd {
	display: inline;
}

.variation dt {
	margin-right: 0.25em;	
}
.variation dd {
	margin: 0;
}

.variation p {
	margin: 0;
	display: inline;
}

.variation dd:after {
	content: "\A";
	white-space: pre;	
}



/* Displaying cart table rows as flex allows us to move things around without template overrides :) */

/* Allow margin collapsing */
.woocommerce-cart-form .cart,
.woocommerce-cart-form .cart tbody {
	display: block;	
}

.woocommerce-cart-form .cart tr {
	display: flex;
	flex-direction: column;
	padding: var(--space_small) 0;
	border-bottom: 1px solid var(--gray_light);
}




/* Product Bundles specific */
/* This is the actual product bundle */
.woocommerce-cart-form .cart tr.bundle_table_item {
	padding-bottom: 0;	
}


/* Whatever comes after the last bundled item need a top-border */
.bundled_table_item + .cart_item:not(.bundled_table_item) {
	clear: left;
	border-top: 1px solid var(--gray_light);	
}

/* Add some text to explain that these are bundled products */
.bundle_table_item:after {
	content: 'This Product Bundle Includes:';
	order: 6;
	display: none; /* This seems like a cool idea, but needs work. Maybe some sort of toggle to show/hide the bundled products? */
}
.bundled_table_item .product-name {
	padding-bottom: 0;	
}
.bundled_table_item .product-quantity {
	padding-top: 0;	
}
.bundled_table_item .product-price,
.bundled_table_item .product-subtotal {
	display: none;	
}



/* This is stupid - WC Extended Coupon Features Pro plugin... */
.woocommerce-cart-form .cart tr.wjecf-fragment-cart-select-free-product {
	margin: 0;
	padding: 0;
	border-bottom: none;
}
tr.wjecf-fragment-cart-select-free-product .wjecf-select-free-products {
	padding: 0;
	text-align: start;
}
.wjecf-fragment-cart-select-free-product .wjecf-select-free-products h3 {
	
}
.wjecf-fragment-cart-select-free-product .wjecf-select-free-products ul {
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	margin-left: calc( -1 * var(--space_xsmall) );
	margin-right: calc( -1 * var(--space_xsmall) );
}

.wjecf-fragment-cart-select-free-product td.wjecf-select-free-products ul li {
	float: none;
	width: auto;
	margin: var(--space_small) 0;
	max-width: 33.3333%;
	padding: 0 var(--space_xsmall);

}
.wjecf-select-free-products ul li input {
	margin-right: var(--space_xxsmall);
}


/* This plugin adds inline styles to add margin to these (dumb) */
.woocommerce-cart-form table.cart td.actions .input-text, 
.woocommerce-cart-form table.cart td.actions .button, 
.woocommerce-cart-form table.cart td.actions .checkout-button {
	margin-bottom: 0 !important;

}



.woocommerce-cart-form .shop_table_responsive tbody tr:first-child {
	border-top: none;
	padding-top: 0;
}

.woocommerce-cart-form .product-remove {
	order: 6;
}
.woocommerce-cart-form .product-thumbnail {
	order: 1;
	padding-top: var(--space_normal);
}

.woocommerce-cart-form .product-name {
	order: 2;
}

.woocommerce-cart-form .product-price {
	order: 3;
}

.woocommerce-cart-form .product-quantity {
	order: 4;
}

.woocommerce-cart-form .product-subtotal {
	order: 5;
}

.woocommerce-cart-form .remove-icon {
	display: none;
}


.woocommerce-cart-form .product-quantity input {
	width: 80px;	
}


/* The variation <dl>s can be hard to read if right-aligned */
.woocommerce-cart-form .product-name {
	text-align: start;
}
.woocommerce-cart-form .product-name > a,
.woocommerce-cart-form .product-name .bundled-product-name > a {
	float: right;
}
.woocommerce-cart-form .product-name > a + *,
.woocommerce-cart-form .product-name .bundled-product-name + * {
	clear: right;
}

/**
 * Cart 
 */


/* The coupon form displays inline */
.actions .coupon {
	display: flex;
	align-items: center;
}
.actions .coupon input {
	min-width: 0;
	margin-right: var(--space_normal);
}
.actions .coupon button {
	white-space: nowrap;
}


button[name="update_cart"] {
	margin-top: var(--space_large);
}



/* Special case for Cart totals table */

.cart_totals .woocommerce-shipping-totals td {
	text-align: inherit;	
}
.woocommerce-shipping-methods {
	list-style: none;
	padding: 0;
	margin: 0;
}








@media(min-width: 45em){
	
	
	.shop_table_responsive {
		display: table;
	}
	.shop_table_responsive tbody {
		display: table-row-group;
	}
	.shop_table_responsive tr {
		display: table-row;
	}
	.shop_table_responsive tfoot {
		display: table-footer-group;	
	}
	.shop_table_responsive th,
	.shop_table_responsive td, 
	.shop_table_responsive td:first-child {
		display: table-cell;	
	}
	.shop_table_responsive td:first-child {
		text-align: initial;
	}

	
	/* Start to use this instead of the fake labels */
	.shop_table_responsive thead {
		display: table-header-group;	
	}
	.shop_table_responsive th {
		display: table-cell;	
	}
	.shop_table_responsive td[data-title]::before {
		display: none;	
	}

	
	/* Special treatment for just cart table */
	.woocommerce-cart-form thead {
		display: block;	
	}
	/* Line up <th> items to look like table  */
	.woocommerce-cart-form thead tr {
		display: flex;
		justify-content: flex-end;	
	}
	.woocommerce-cart-form thead tr th {
		display: block;	
	}
	/* This is empty anyway */
	.woocommerce-cart-form thead tr th.product-thumbnail {
		display: none;
	}
	
	/* NOTE: This needs to be defined for the above spacing to work. (The <th> and <td> share the same class) */
	.woocommerce-cart-form .cart .product-remove {
		min-width: 40px;
		text-align: right;
	}
	/* reset some bs :( */
	.shop_table.shop_table_responsive td.product-remove:empty {
		display: table-cell;	
	}
	/* Each cart item now displays it's properties inline, like a table ;) */
	.woocommerce-cart-form .cart tr {
		flex-direction: row;
		align-items: center;
		padding-bottom: var(--space_normal);
		padding-top: var(--space_normal);
	}
	.woocommerce-cart-form .cart tbody tr:first-child {
		padding-top: var(--space_normal);
		
	}
	/* Limit the size of the images */
	.woocommerce-cart-form .product-thumbnail {
		width: 100px;
		flex-grow: 0;
		flex-shrink: 0;
		align-self: flex-start;
		padding-bottom: var(--space_xsmall);
		padding-top: var(--space_xsmall);
	}
	
	/* Cart item spacing */
	.woocommerce-cart-form .product-name,
	.woocommerce-cart-form .product-price,
	.woocommerce-cart-form .product-quantity,
	.woocommerce-cart-form .product-subtotal {
		min-width: 15%;
		padding-left: var(--space_xlarge); /* NOTE: This spacing lines up non-input fields with input quantity fields :) */
		text-align: inherit;
	}
	.woocommerce-cart-form .product-name {
		flex-grow: 1;
	}
	.woocommerce-cart-form th.product-name {
		padding-left: 0
	}
	
	
	.woocommerce-cart-form .product-name > a,
	.woocommerce-cart-form .product-name .bundled-product-name > a {
		float: none;
	}
	.woocommerce-cart-form .product-name > a + *,
	.woocommerce-cart-form .product-name .bundled-product-name + * {
		clear: none;
	}
	
	/* Remove link changes from text to icon */
	.woocommerce-cart-form a.remove {
		display: inline-block;
		line-height: 1;	
	}
	.woocommerce-cart-form .remove-icon {
		display: block;
		font-size: 2em;
		font-weight: bold;
	}
	.woocommerce-cart-form .remove-text {
		display: none;
	}
	
	
	/* Bundled Products specific */
	.woocommerce-cart-form .cart tr.bundle_table_item {
		padding-bottom: var(--space_normal);	
	}
	/* Remove the 'This Product Bundle Includes:' on bundled products */
	.bundle_table_item::after {
		display: none;	
	}
	.woocommerce-cart-form .cart tr.bundled_table_item {
		margin-top: calc( -1 * var(--space_normal) );
		padding-bottom: var(--space_normal);	
	}
	.woocommerce-cart-form .bundled_table_item .product-quantity {
		display: none;
	}

	
	
}


@media(min-width: 64em){
	
	.woocommerce-cart .woocommerce {
		display: flex;
		flex-wrap: wrap;	
	}
	.woocommerce-cart-form {
		width: 70%;
		padding-right: var(--space_xlarge);
	}
	.cart-collaterals {
		width: 30%;	
	}
	
	.woocommerce-cart-form .cart td.actions {
		display: flex;
		width: 100%;
	}
	
	button[name="update_cart"] {
		margin-top: 0;
		margin-left: auto;	
	}
	
	.cart-empty + .return-to-shop {
		margin-left: var(--space_large);	
	}
	
}



 
/**
 * Checkout
 */

.woocommerce-form-login-toggle,
.woocommerce-form-coupon-toggle {
	margin-bottom: var(--space_normal);	
}

.woocommerce-form-coupon {
	display: flex;
	flex-wrap: wrap;	
}

.woocommerce-form-coupon p:first-child {
	min-width: 100%;
}
.woocommerce-form-coupon/*.checkout_coupon*/ p  {
	margin: 0;
}

ul.wc_payment_methods {
	list-style: none;
	padding: 0;	
}


@media screen and (min-width: 64em) {
	
	.col2-set .form-row-first {
		float: left;
		padding-right: var(--space_normal);
	}
	.col2-set .form-row-last {
		float: right;
		padding-left: var(--space_normal);
	}
	.col2-set .form-row-first,
	.col2-set .form-row-last {
		width: 50%;
		margin: 0;
	}
	.col2-set .form-row-last + * {
		clear: both;
		margin-top: 0;
		padding-top: 1em;
	}
	
	
	
	.ftm-wc-checkout {
		display: flex;
	}
	.ftm-wc-checkout-customer-details {
		width: 68.75%;
		padding-right: var(--space_xlarge);	
	}
	.ftm-wc-checkout-order-review {
		width: 31.25%;	
	}
	
}










/**
 * General WooCommerce components
 */
/**
 * Header cart
 */
.site-header-cart {
	position: relative;
	margin: 0;
	padding: 0;
	content: "";
	display: table;
	table-layout: fixed;
}
.site-header-cart .cart-contents {
	text-decoration: none;
}
.site-header-cart .widget_shopping_cart {
	display: none;
}
.site-header-cart .product_list_widget {
	margin: 0;
	padding: 0;
}


/*
ul.cart_list {
	display: table;
	table-layout: fixed;
}
.cart_list li {
	display: table-row;	
}
.cart_list li > * {
	display: table-cell;
}
*/


ul.woocommerce-mini-cart {
	list-style: none;
	margin: 0;
	padding: 0;

}




/**
 * Star rating
 */
.star-rating {
	overflow: hidden;
	position: relative;
	height: 1.618em;
	line-height: 1.618;
	font-size: 1em;
	width: 5.3em;
	font-family: 'star';
	font-weight: 400;
}

.star-rating:before {
	content: "\53\53\53\53\53";
	opacity: .25;
	float: left;
	top: 0;
	left: 0;
	position: absolute;
}

.star-rating span {
	overflow: hidden;
	float: left;
	top: 0;
	left: 0;
	position: absolute;
	padding-top: 1.5em;
}

.star-rating span:before {
	content: "\53\53\53\53\53";
	top: 0;
	position: absolute;
	left: 0;
	color: royalblue;
}

p.stars a {
	position: relative;
	height: 1em;
	width: 1em;
	text-indent: -999em;
	display: inline-block;
	text-decoration: none;
	margin-right: 1px;
	font-weight: 400;
}

p.stars a:before {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 1em;
	height: 1em;
	line-height: 1;
	font-family: "star";
	content: "\53";
	color: #404040;
	text-indent: 0;
	opacity: .25;
}

p.stars a:hover ~ a:before {
	content: "\53";
	color: #404040;
	opacity: .25;
}

p.stars:hover a:before {
	content: "\53";
	color: royalblue;
	opacity: 1;
}

p.stars.selected a.active:before {
	content: "\53";
	color: royalblue;
	opacity: 1;
}

p.stars.selected a.active ~ a:before {
	content: "\53";
	color: #404040;
	opacity: .25;
}

p.stars.selected a:not(.active):before {
	content: "\53";
	color: royalblue;
	opacity: 1;
}

/**
 * Tabs
 */
.woocommerce-tabs ul.tabs {
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

.woocommerce-tabs ul.tabs li {
	display: block;
	margin: 0;
	position: relative;
}

.woocommerce-tabs ul.tabs li a {
	padding: 1em 0;
	display: block;
}

.woocommerce-tabs .panel h2:first-of-type {
	margin-bottom: 1em;
}

/**
 * Password strength meter
 */
.woocommerce-password-strength {
	text-align: right;
}

.woocommerce-password-strength.strong {
	color: var(--color_success);
}

.woocommerce-password-strength.short {
	color: var(--color_notice);
}

.woocommerce-password-strength.bad {
	color: var(--color_error);
}

.woocommerce-password-strength.good {
	color: var(--color_correct);
}

/**
 * Forms
 */
.form-row.woocommerce-validated input.input-text {
	box-shadow: inset 2px 0 0 #0f834d;
}

.form-row.woocommerce-invalid input.input-text {
	box-shadow: inset 2px 0 0 #e2401c;
}

.required {
	color: red;
}


.demo_store {
	position: fixed;
	left: 0;
	bottom: 0;
	right: 0;
	margin: 0;
	padding: 1em;
	background-color: #3D9CD2;
	z-index: 9999;
}

@media screen and (min-width: 48em) {
	/**
	 * Header cart
	 */
	.site-header-cart .widget_shopping_cart {
		position: absolute;
		top: 100%;
		width: 100%;
		z-index: 999999;
		left: -999em;
		display: block;
		box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	}
	.site-header-cart:hover .widget_shopping_cart, .site-header-cart.focus .widget_shopping_cart {
		left: 0;
		display: block;
	}
}

/**
 * WooCommerce widgets
 */
/**
 * WooCommerce Price Filter
 */


 /* 6-1-19 - This still needs to be reworked... */
.widget_price_filter .price_slider {
	margin-bottom: 1.5em;
}

.widget_price_filter .price_slider_amount {
	text-align: right;
	line-height: 2.4em;
}

.widget_price_filter .price_slider_amount .button {
	float: left;
	line-height: normal;
}

.widget_price_filter .ui-slider {
	position: relative;
	text-align: left;
}

.widget_price_filter .ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	cursor: ew-resize;
	outline: none;
	background: var(--primary_color);
	box-sizing: border-box;
	margin-top: -.25em;
	opacity: 1;
}

.widget_price_filter .ui-slider .ui-slider-handle:last-child {
	margin-left: -1em;
}

.widget_price_filter .ui-slider .ui-slider-handle:hover, .widget_price_filter .ui-slider .ui-slider-handle.ui-state-active {
	box-shadow: 0 0 0 0.25em rgba(0, 0, 0, 0.1);
}

.widget_price_filter .ui-slider .ui-slider-range {
	position: absolute;
	z-index: 1;
	display: block;
	border: 0;
	background: var(--primary_color);
	
	/* Ned this if you want to make the handles round */
	border-radius: 0.5em;
}

.widget_price_filter .price_slider_wrapper .ui-widget-content {
	background: rgba(0, 0, 0, 0.1);
}

.widget_price_filter .ui-slider-horizontal {
	height: .5em;
}

.widget_price_filter .ui-slider-horizontal .ui-slider-range {
	height: 100%;
}
