Varia: Add more WC support & styles

varia/sass/abstracts/_config-global.scss

@@ -74,6 +74,12 @@ $config-global: (
 			"light": #FAFAFA,
 			"dark": #AAAAAA,
 		),
+		"alert": (
+			"success": yellowgreen,
+			"info": skyblue,
+			"warning": gold,
+			"error": salmon,
+		),
 		"text-selection": lightblue,
 		"black": black,
 		"white": white,

varia/sass/child-theme/_config-child-theme-deep.scss

@@ -83,6 +83,12 @@ $config-global: (
 			"light": #FAFAFA,
 			"dark": #AAAAAA,
 		),
+		"alert": (
+			"success": yellowgreen,
+			"info": skyblue,
+			"warning": gold,
+			"error": salmon,
+		),
 		"text-selection": lightblue,
 		"black": black,
 		"white": white,

varia/sass/components/comments/_comments.scss

@@ -56,7 +56,7 @@
 	}
 }
 
-.children {
+.comment-list .children {
 	list-style: none;
 	padding-left: #{map-deep-get($config-global, "spacing", "horizontal")};
 

varia/sass/vendors/woocommerce/_woocommerce.scss

@@ -3,6 +3,9 @@
  */
 
 // Fonts
+$font_family_primary: #{map-deep-get($config-global, "font", "family", "primary")};
+$font_family_secondary: #{map-deep-get($config-global, "font", "family", "secondary")};
+$fontsize_xs: map-deep-get($config-global, "font", "size", "xs");
 $fontsize_small: map-deep-get($config-global, "font", "size", "sm");
 $fontsize_base: map-deep-get($config-global, "font", "size", "base");
 $fontsize_medium: map-deep-get($config-global, "font", "size", "md");
@@ -15,11 +18,19 @@ $color_primary: map-deep-get($config-global, "color", "primary", "default");
 $color_secondary: map-deep-get($config-global, "color", "secondary", "default");
 $color_subtext: map-deep-get($config-global, "color", "foreground", "light");
 $color_background: map-deep-get($config-global, "color", "background", "default");
+$color_info: map-deep-get($config-global, "color", "alert", "info");
+$color_success: map-deep-get($config-global, "color", "alert", "success");
+$color_warning: map-deep-get($config-global, "color", "alert", "warning");
+$color_error: map-deep-get($config-global, "color", "alert", "error");
+$color_background: map-deep-get($config-global, "color", "background", "default");
+$color_background_light: map-deep-get($config-global, "color", "background", "light");
 $color_foreground: map-deep-get($config-global, "color", "foreground", "default");
+$color_foreground_dark: map-deep-get($config-global, "color", "foreground", "dark");
+$color_foreground_light: map-deep-get($config-global, "color", "foreground", "light");
 $color_border_default: map-deep-get($config-global, "color", "border", "default");
 $color_border_light: map-deep-get($config-global, "color", "border", "light");
 $color_border_dark: map-deep-get($config-global, "color", "border", "dark");
-$color_highlight: map-deep-get($config-global, "color", "text-selection");
+$color_highlight: $color_warning;
 // Spacing
 $spacing_base: (0.5 * map-deep-get($config-global, "spacing", "unit"));
 $spacing_unit: map-deep-get($config-global, "spacing", "unit");
@@ -30,13 +41,13 @@ $border_radius: map-deep-get($config-global, "border-radius", "sm");
 .woocommerce {
 
 	a.remove {
-		font-size: 1.5rem;
-		height: 1rem;
-		width: 1rem;
+		font-size: $fontsize_large;
+		height: $fontsize_large;
+		width: $fontsize_large;
 		color: red !important; // Required for default theme compatibility
 
 		&:hover {
-			color: #fff !important; // Required for default theme compatibility
+			color: $color_background !important; // Required for default theme compatibility
 			background: red;
 		}
 	}
@@ -64,6 +75,12 @@ $border_radius: map-deep-get($config-global, "border-radius", "sm");
 @import "blocks/button/style";
 
 // Components
+@import "components/cart-sidebar";
+@import "components/cart-collaterals";
+@import "components/notices";
+@import "components/onsale";
+@import "components/password-strength-meter";
+@import "components/product-loops";
 @import "components/reviews";
 @import "components/star-rating";
 @import "components/tables";
@@ -72,4 +89,7 @@ $border_radius: map-deep-get($config-global, "border-radius", "sm");
 @import "layout/structure";
 
 // Pages
+@import "pages/account";
+@import "pages/cart";
 @import "pages/product-page";
+@import "pages/single-product";

varia/sass/vendors/woocommerce/blocks/button/_style.scss

@@ -2,7 +2,7 @@
  * Button
  */
 
-.woocommerce #content { // adding #content here to override default wc styles without !important
+body[class*="woocommerce"] #content { // adding #content here to override default wc styles without !important
 
 	#respond input#submit,
 	#respond input#submit.alt,
@@ -14,8 +14,31 @@
 	input.button.alt,
 	.cart .button,
 	.cart input.button,
-	a.added_to_cart {
+	a.added_to_cart,
+	.woocommerce #respond input#submit,
+	.woocommerce a.button,
+	.woocommerce button.button,
+	.woocommerce input.button {
 		// Extend button style
 		@extend %button-style;
 	}
+
+	.woocommerce #respond input#submit.disabled,
+	.woocommerce #respond input#submit:disabled,
+	.woocommerce #respond input#submit:disabled[disabled],
+	.woocommerce a.button.disabled,
+	.woocommerce a.button:disabled,
+	.woocommerce a.button:disabled[disabled],
+	.woocommerce button.button.disabled,
+	.woocommerce button.button:disabled,
+	.woocommerce button.button:disabled[disabled],
+	.woocommerce input.button.disabled,
+	.woocommerce input.button:disabled,
+	.woocommerce input.button:disabled[disabled] {
+		cursor: not-allowed;
+
+		&:hover {
+			background-color: $color_primary;
+		}
+	}
 }

varia/sass/vendors/woocommerce/components/_cart-collaterals.scss

@@ -0,0 +1,58 @@
+/**
+ * Cart Collaterals
+ */
+
+.woocommerce-cart,
+.woocommerce-checkout,
+#add_payment_method {
+
+	.cart-collaterals {
+
+		.shipping-calculator-button {
+			margin-top: #{0.5 * $spacing_vertical};
+		}
+
+		.shipping-calculator-form {
+			margin-top: $spacing_horizontal;
+		}
+
+		.cart_totals {
+
+			p small {
+				color: $color_subtext;
+				font-size: $fontsize_small;
+			}
+
+			table {
+				margin: 0 0 $spacing_base;
+
+				td,
+				th {
+					line-height: $font_line_height;
+				}
+
+				small {
+					color: $color_subtext;
+				}
+			}
+
+			.discount td {
+				color: $color_highlight;
+			}
+
+			tr td,
+			tr th {
+				border-top-color: $color_border_default;
+			}
+		}
+	}
+}
+
+.woocommerce .cart-collaterals .cross-sells,
+.woocommerce-page .cart-collaterals .cross-sells,
+.woocommerce .cart-collaterals .cart_totals,
+.woocommerce-page .cart-collaterals .cart_totals {
+	& > h2 {
+		font-size: $fontsize_large;
+	}
+}

varia/sass/vendors/woocommerce/components/_cart-sidebar.scss

@@ -0,0 +1,41 @@
+/**
+ * Reviews
+ */
+
+.woocommerce #content { // adding #content here to override default wc styles without !important
+
+	/**
+	 * Cart sidebar
+	 */
+	ul.cart_list,
+	ul.product_list_widget {
+
+		li {
+			img {
+				margin-left: 4px;
+				width: $spacing_vertical;
+			}
+
+			dl {
+				border-left-color: $color_border_default;
+
+				dt,
+				dd {
+					margin-bottom: $spacing_vertical;
+				}
+			}
+		}
+	}
+
+	&.widget_shopping_cart,
+	.widget_shopping_cart {
+
+		.total {
+			border-top-color: $color_secondary;
+		}
+
+		.cart_list li {
+			padding-left: $spacing_horizontal;
+		}
+	}
+}

varia/sass/vendors/woocommerce/components/_notices.scss

@@ -0,0 +1,36 @@
+/**
+ * Notices
+ */
+
+.woocommerce {
+	.woocommerce-message,
+	.woocommerce-error,
+	.woocommerce-info {
+		padding: $spacing_unit $spacing_vertical $spacing_unit #{2 * $spacing_vertical};
+		margin-bottom: $spacing_vertical;
+		background-color: $color_background_light;
+		color: $color_foreground_dark;
+		border-top-color: $color_primary;
+	}
+
+	.woocommerce-message {
+		border-top-color: $color_success;
+		&:before {
+			color: $color_success;
+		}
+	}
+
+	.woocommerce-error {
+		border-top-color: $color_error;
+		&:before {
+			color: $color_error;
+		}
+	}
+
+	.woocommerce-info {
+		border-top-color: $color_primary;
+		&:before {
+			color: $color_primary;
+		}
+	}
+}

varia/sass/vendors/woocommerce/components/_onsale.scss

@@ -0,0 +1,26 @@
+/**
+ * Star ratings
+ */
+
+.woocommerce #content { // adding #content here to override default wc styles without !important
+
+	span.onsale {
+		border-radius: 100%;
+		background-color: $color_highlight;
+		color: $color_foreground_dark;
+		font-size: $fontsize_small;
+		font-weight: 700;
+		font-family: $font_family_primary;
+		min-height: 3.236rem;
+		min-width: 3.236rem;
+		padding: 0.202rem;
+		position: absolute;
+		text-align: center;
+		line-height: 3.236;
+		top: -0.5em;
+		right: -0.5em;
+		left: auto;
+		margin: 0;
+		z-index: 9;
+	}
+}

varia/sass/vendors/woocommerce/components/_password-strength-meter.scss

@@ -0,0 +1,33 @@
+/**
+ * Password strength meter
+ */
+.woocommerce-password-strength {
+	text-align: center;
+	font-weight: 600;
+	padding: #{0.5 * $spacing_base};
+	font-size: $fontsize_small;
+
+	&.strong {
+		background-color: $color_success;
+		border-color: none;
+	}
+
+	&.good {
+		background-color: $color_warning;
+		border-color: none;
+	}
+
+	&.short {
+		background-color: $color_error;
+		border-color: none;
+	}
+
+	&.bad {
+		background-color: $color_error;
+		border-color: none;
+	}
+}
+
+woocommerce-password-hint {
+	font-size: $fontsize_xs;
+}

varia/sass/vendors/woocommerce/components/_product-loops.scss

@@ -0,0 +1,131 @@
+/**
+ * Product loops
+ */
+
+#content .woocommerce {
+
+	.products ul,
+	ul.products {
+		margin: 0;
+		padding: 0;
+	}
+
+	ul.products li.product {
+
+		.onsale {
+		}
+
+		.star-rating {
+			margin: inherit;
+		}
+
+		h3,
+		.woocommerce-loop-product__title,
+		.woocommerce-loop-category__title {
+			padding: inherit;
+			margin: inherit;
+			font-size: $fontsize_base;
+		}
+
+		a img {
+			margin: inherit;
+		}
+
+		strong {
+		}
+
+		.woocommerce-placeholder {
+			border-color: $color_border_default;
+		}
+
+		.star-rating {
+			font-size: $fontsize_small;
+		}
+
+		.button {
+			margin-top: inherit;
+		}
+
+		.price {
+			color: $color_foreground_dark;
+			margin-bottom: inherit;
+			font-size: $fontsize_medium;
+
+			del {
+				color: inherit;
+				opacity: 0.5;
+				display: inline-block;
+			}
+
+			ins {
+				background: none;
+				font-weight: 700;
+				display: inline-block;
+			}
+
+			.from {
+				font-size: $fontsize_xs;
+				color: $color_highlight;
+			}
+		}
+
+		&.sale a > .price ins {
+			color: $color_success;
+		}
+	}
+
+	.woocommerce-result-count {
+		margin-bottom: $spacing_unit;
+	}
+
+	.woocommerce-ordering {
+		margin-bottom: $spacing_unit;
+
+		select {
+			vertical-align: top;
+		}
+	}
+
+	nav.woocommerce-pagination {
+		text-align: center;
+
+		ul {
+			display: inline-block;
+			white-space: nowrap;
+			padding: 0;
+			clear: both;
+			border-color: $color_border_default;
+			border-right: 0;
+			margin: 1px;
+
+			li {
+				border-color: $color_border_default;
+				padding: 0;
+				margin: 0;
+				float: left;
+				display: inline;
+				overflow: hidden;
+
+				a,
+				span {
+					margin: 0;
+					text-decoration: none;
+					padding: 0;
+					line-height: 1;
+					font-size: 1em;
+					font-weight: normal;
+					padding: 0.5em;
+					min-width: 1em;
+					display: block;
+				}
+
+				span.current,
+				a:hover,
+				a:focus {
+					background: $color_border_default;
+					color: $color_foreground_light;
+				}
+			}
+		}
+	}
+}

varia/sass/vendors/woocommerce/components/_tables.scss

@@ -2,21 +2,24 @@
  * Tables
  */
 
-.woocommerce { // adding #content here to override default wc styles without !important
+.woocommerce {
 
 	table.shop_attributes {
-		border-top-color: $color_border_light;
+		border-top-color: $color_border_default;
+		border-top-style: solid;
 		margin-bottom: $spacing_vertical;
 
 		th {
 			padding: $spacing_base;
-			border-bottom-color: $color_border_light;
+			border-bottom-color: $color_border_default;
+			border-bottom-style: solid;
 			line-height: $font_line_height;
 		}
 
 		td {
 			font-style: inherit;
-			border-bottom-color: $color_border_light;
+			border-bottom-color: $color_border_default;
+			border-bottom-style: solid;
 			line-height: $font_line_height;
 
 			p {
@@ -31,55 +34,8 @@
 		}
 	}
 
-	.woocommerce-cart #content & table.shop_table {
-		border-color: transparent;
-		border-radius: 0;
-
-		th {
-			border-color: $color_border_default;
-			padding: $spacing_base $spacing_unit;
-			line-height: $font_line_height;
-		}
-
-		td {
-			border-color: $color_border_default;
-			padding: $spacing_base $spacing_unit;
-			line-height: $font_line_height;
-		}
-
-		tfoot td,
-		tfoot th,
-		tbody th {
-			border-top-color: $color_border_light;
-		}
-	}
-
-	table.my_account_orders {
-		font-size: $fontsize_small;
-
-		th,
-		td {
-			padding: (0.5 * $spacing_base) $spacing_base;
-		}
-	}
-
-	td.product-name {
-
-		dl.variation,
-		.wc-item-meta {
-
-			dt,
-			.wc-item-meta-label {
-				margin-right: $spacing_base;
-			}
-		}
-
-		p.backorder_notification {
-			font-size: $fontsize_small;
-		}
-	}
-
-	td.product-quantity {
-		min-width: 80px;
+	table td,
+	table th {
+		border: inherit;
 	}
 }

varia/sass/vendors/woocommerce/layout/_structure.scss

@@ -2,18 +2,58 @@
  * Structure
  */
 
-.woocommerce #content { // adding #content here to override default wc styles without !important
+/**
+ * Vertical Space - 32px
+ */
+.woocommerce #content div.summary,
+.woocommerce #content div.product .woocommerce-tabs .panel,
+.woocommerce #content .products.related,
+.woocommerce .woocommerce-MyAccount-content,
+.woocommerce .woocommerce-EditAccountForm,
+.woocommerce .up-sells {
 
-	div.summary,
-	div.product .woocommerce-tabs .panel,
-	.products.related {
+	& > *:not(:first-child) {
+		margin-top: $spacing_vertical;
+	}
 
-		& > *:not(:first-child) {
-			margin-top: $spacing_vertical;
-		}
+	& > *:not(:last-child) {
+		margin-bottom: $spacing_vertical;
+	}
 
-		& > *:not(:last-child) {
-			margin-bottom: $spacing_vertical;
-		}
+	& > *:empty + *,
+	& > .form-row-last {
+		margin-top: 0;
+	}
+
+	& > *:empty {
+		margin: 0;
 	}
 }
+
+/**
+ * Vertical Space - 16px
+ */
+#content .woocommerce ul.products li.product a,
+#content .woocommerce ul.products li.product-category a,
+.woocommerce .cart-collaterals .cross-sells,
+.woocommerce-page .cart-collaterals .cross-sells,
+.woocommerce .cart-collaterals .cart_totals,
+.woocommerce-page .cart-collaterals .cart_totals {
+
+	& > *:not(:first-child) {
+		margin-top: $spacing_unit;
+	}
+
+	& > *:not(:last-child),
+	& > .price {
+		margin-bottom: $spacing_unit;
+	}
+
+	& > *:not(img):empty + * {
+		margin-top: 0;
+	}
+
+	& > *:empty {
+		margin: 0;
+	}
+}

varia/sass/vendors/woocommerce/pages/_account.scss

@@ -0,0 +1,33 @@
+/**
+ * Account page
+ */
+.woocommerce-account #content { // adding #content here to override default wc styles without !important
+
+	.woocommerce-MyAccount-content {
+		.woocommerce-notices-wrapper:empty {
+			display: none;
+		}
+
+		fieldset {
+			border: 1px solid $color_border_default;
+			padding: $spacing_unit;
+			border-radius: 3px;
+		}
+	}
+
+	.addresses .title h3 {
+		font-size: $fontsize_base;
+	}
+
+	.woocommerce {
+	}
+
+	.addresses .title {
+	}
+
+	ol.commentlist.notes li.note {
+	}
+
+	ul.digital-downloads {
+	}
+}

varia/sass/vendors/woocommerce/pages/_cart.scss

@@ -0,0 +1,230 @@
+/**
+ * Cart
+ */
+/**
+ * Cart/checkout page
+ */
+.woocommerce-cart,
+.woocommerce-checkout,
+#add_payment_method {
+
+	table.cart {
+
+		.product-thumbnail {
+			min-width: $spacing_horizontal;
+		}
+
+		img {
+			width: $spacing_horizontal;
+		}
+
+		td.actions .coupon .input-text {
+			border-color: $color_border_default;
+			padding: $spacing_base;
+			margin: 0 $spacing_base 0 0;
+		}
+	}
+
+	.wc-proceed-to-checkout {
+
+		padding: $spacing_vertical 0;
+
+		a.checkout-button {
+			margin-bottom: $spacing_vertical;
+			font-size: $fontsize_medium;
+			padding: $spacing_unit;
+		}
+	}
+
+	.checkout {
+
+		.create-account small {
+			font-size: $fontsize_xs;
+			color: $color_subtext;
+		}
+	}
+
+	#payment {
+		background: $color_secondary;
+		border-radius: 3px;
+
+		ul.payment_methods {
+
+			padding: $spacing_base;
+			border-bottom-color: $color_border_default;
+
+			li {
+				line-height: $font_line_height;
+
+				input {
+					margin-right: $font_line_height;
+				}
+			}
+		}
+
+		div.form-row {
+			padding: $spacing_base;
+		}
+
+		div.payment_box {
+			padding: $spacing_base;
+			margin-bottom: $spacing_base;
+			margin-top: $spacing_base;
+			font-size: $fontsize_small;
+			border-radius: 3px;
+			line-height: $font_line_height;
+			background-color: $color_border_default;
+			color: $color_foreground;
+
+			input.input-text,
+			textarea {
+				border-color: $color_border_default;
+				border-top-color: $color_border_default;
+			}
+
+			::-webkit-input-placeholder {
+				color: $color_foreground_light;
+			}
+
+			:-moz-placeholder {
+				color: $color_foreground_light;
+			}
+
+			:-ms-input-placeholder {
+				color: $color_foreground_light;
+			}
+
+			.woocommerce-SavedPaymentMethods {
+
+				.woocommerce-SavedPaymentMethods-tokenInput {
+					margin-right: $spacing_unit;
+				}
+			}
+
+			.wc-credit-card-form {
+				margin-top: $spacing_unit;
+			}
+
+			.wc-credit-card-form-card-number,
+			.wc-credit-card-form-card-expiry,
+			.wc-credit-card-form-card-cvc {
+				font-size: $fontsize_large;
+				padding: $spacing_base;
+			}
+
+			span.help {
+				font-size: $fontsize_small;
+				color: $color_subtext;
+			}
+
+			.form-row {
+				margin: 0 0 $spacing_vertical;
+			}
+
+			p:last-child {
+				margin-bottom: 0;
+			}
+
+			&::before {
+				border-color: $color_border_default; /* arrow size / color */
+			}
+		}
+
+		.payment_method_paypal {
+
+			.about_paypal {
+				float: right;
+				line-height: 52px;
+				font-size: $fontsize_small;
+			}
+
+			img {
+				max-height: 52px;
+				vertical-align: middle;
+			}
+		}
+	}
+}
+
+.woocommerce-terms-and-conditions {
+	border-color: $color_border_default;
+}
+
+.woocommerce-invalid {
+
+	#terms {
+		outline-color: $color_error;
+	}
+}
+
+.woocommerce-cart #content { // adding #content here to override default wc styles without !important
+
+	table.shop_table {
+		border-color: $color_border_default;
+		border-radius: 3px;
+
+		th {
+			padding: $spacing_base $spacing_unit;
+			line-height: $font_line_height;
+		}
+
+		td {
+			padding: $spacing_base $spacing_unit;
+			line-height: $font_line_height;
+		}
+
+		tfoot td,
+		tfoot th,
+		tbody th {
+			border-top-color: $color_border_default;
+		}
+	}
+
+	table.my_account_orders {
+		font-size: $fontsize_small;
+
+		th,
+		td {
+			padding: (0.5 * $spacing_base) $spacing_base;
+		}
+	}
+
+	td.product-name {
+
+		dl.variation,
+		.wc-item-meta {
+
+			dt,
+			.wc-item-meta-label {
+				margin-right: $spacing_base;
+			}
+		}
+
+		p.backorder_notification {
+			font-size: $fontsize_small;
+		}
+	}
+
+	td.product-quantity {
+		min-width: 80px;
+	}
+}
+
+.woocommerce-page #content { // adding #content here to override default wc styles without !important
+	table.cart td.actions .input-text,
+	.woocommerce table.cart td.actions .input-text,
+	table.cart td.actions .input-text {
+		width: inherit;
+		float: inherit;
+		padding: $spacing_unit;
+	}
+}
+
+#add_payment_method .cart-collaterals .cart_totals tr td,
+#add_payment_method .cart-collaterals .cart_totals tr th,
+.woocommerce-cart .cart-collaterals .cart_totals tr td,
+.woocommerce-cart .cart-collaterals .cart_totals tr th,
+.woocommerce-checkout .cart-collaterals .cart_totals tr td,
+.woocommerce-checkout .cart-collaterals .cart_totals tr th {
+	border-top-color: $color_border_default;
+}

varia/sass/vendors/woocommerce/pages/_product-page.scss

@@ -180,10 +180,4 @@
 			}
 		}
 	}
-
-	span.onsale {
-		background-color: $color_highlight;
-		color: $color_foreground;
-		font-size: $fontsize_small;
-	}
 }

varia/sass/vendors/woocommerce/pages/_single-product.scss

@@ -0,0 +1,204 @@
+/**
+ * Single Product Page
+ */
+.woocommerce-page #content { // adding #content here to override default wc styles without !important
+
+	/**
+	 * Remove the bright yellow background on mark elements.
+	 */
+	mark {
+		background: transparent;
+	}
+
+	div.product {
+
+		span.price,
+		p.price {
+			color: $color_primary;
+			font-size: $fontsize_xl;
+		}
+
+		p.stock {
+			font-size: $fontsize_base;
+		}
+
+		.stock {
+			color: $color_primary;
+		}
+
+		.out-of-stock {
+			color: red;
+		}
+
+		.woocommerce-product-rating {
+			margin-bottom: $spacing_vertical;
+		}
+
+		div.images {
+			margin-bottom: $spacing_vertical;
+
+			div.thumbnails {
+				padding-top: $spacing_unit;
+			}
+
+			.woocommerce-product-gallery__wrapper .zoomImg {
+				background-color: $color_background;
+			}
+
+			.woocommerce-product-gallery__image--placeholder {
+				border-color: $color_border_light;
+			}
+
+			.woocommerce-product-gallery__trigger {
+				font-size: $fontsize_medium;
+				background: $color_background;
+
+				&::before {
+					border-color: $color_border_dark;
+				}
+
+				&::after {
+					background-color: $color_border_dark;
+				}
+			}
+		}
+
+		div.summary {
+			margin-bottom: $spacing_vertical;
+		}
+
+		div.social {
+			margin-bottom: $spacing_vertical;
+		}
+
+		.product_meta > * {
+			display: block;
+		}
+
+		.woocommerce-tabs {
+
+			ul.tabs {
+				padding-left: $spacing_horizontal;
+				margin-bottom: $spacing_vertical;
+
+				li {
+					border-color: $color_border_default;
+					background-color: $color_background;
+					border-radius: $border_radius $border_radius 0 0;
+					padding-left: $spacing_horizontal;
+					padding-right: $spacing_horizontal;
+
+					a {
+						padding-top: (0.5 * $spacing_horizontal);
+						padding-bottom: (0.5 * $spacing_horizontal);
+						color: $color_foreground;
+
+						&:hover {
+							color: $color_primary;
+						}
+					}
+
+					&.active {
+						background-color: $color_background;
+						border-bottom-color: $color_background;
+
+						a {
+							color: inherit;
+							text-shadow: inherit;
+						}
+
+						&::before {
+							box-shadow: 2px 2px 0 $color_background;
+						}
+
+						&::after {
+							box-shadow: -2px 2px 0 $color_background;
+						}
+					}
+
+					&::before,
+					&::after {
+						border-color: $color_border_default;
+					}
+
+					&::before {
+						box-shadow: 2px 2px 0 $color_border_default;
+					}
+
+					&::after {
+						box-shadow: -2px 2px 0 $color_border_default;
+					}
+				}
+
+				&::before {
+					border-bottom-color: $color_border_default;
+				}
+			}
+
+			.panel {
+				margin-bottom: $spacing_vertical;
+
+				& > h2 {
+					font-size: $fontsize_large;
+				}
+			}
+		}
+
+		.up-sells {
+			& > h2 {
+				font-size: $fontsize_large;
+			}
+		}
+
+		p.cart {
+			margin-bottom: $spacing_vertical;
+		}
+
+		form.cart {
+
+			.variations {
+				margin-bottom: $spacing_unit;
+
+				td,
+				th {
+					line-height: $font_line_height;
+				}
+
+				select {
+					margin-right: $spacing_unit;
+				}
+
+				td.label {
+					padding-right: $spacing_unit;
+				}
+			}
+
+			.woocommerce-variation-description p {
+				margin-bottom: $spacing_unit;
+			}
+
+			.reset_variations {
+				font-size: $fontsize_small;
+			}
+
+			.group_table {
+
+				td.woocommerce-grouped-product-list-item__label {
+					padding-right: $spacing_unit;
+					padding-left: $spacing_unit;
+				}
+
+				td {
+					padding-bottom: $spacing_unit;
+				}
+			}
+
+			div.quantity,
+			button {
+				float: inherit;
+				display: inline-block;
+				vertical-align: middle;
+			}
+		}
+	}
+}