/* FILE: woocommerce/page/_cart.scss */

.cart-table-title {
	@extend %widget_heading;
}

.cart-collaterals {
	margin-top: calc( var(--white_space) / 2 );

	h2 {
		@extend %widget_heading;
	}

	@include media( map_get( $breakpoint, 'l' ) ) {

		&::after {
			content: '';
			clear: both;
			display: table;
			table-layout: fixed;
		}

		.cross-sells {
			float: $left;
			width: 48%;
		}

		.cart_totals {
			float: $right;
			width: 48%;
		}

	}

}

.cross-sells {
	margin-bottom: calc( var(--white_space) / 2 );

	@include media( map_get( $breakpoint, 'l' ) ) {

		h2 {
			margin-top: 2rem;
		}

	}

	ul.products {
		margin-top: 0;
		margin-bottom: 0;
	}

}

.cart_totals {
	@extend %shaded_background;
	position: relative;
	padding: 2em;

	h2 {
		margin-bottom: calc( var(--white_space) / 2 );
	}

	.shop_table {
		margin-bottom: 2em;
	}

	.checkout-button {
		display: block;
		padding: $form_field_padding_vertical 1em;
	}

	.continue-shopping {
		display: block;
		margin-top: 1em;
		text-align: center;

		&::before {
			content: '\21A9\00a0'; // leftwards arrow with hook + &nbsp;
		}

	}

}

.order-total {

	td {
		line-height: 1;
		font-size: var(--typography_heading_size_5);
	}

	small {
		display: block;
		margin-top: .5em;
		font-size: .8em;
		font-weight: 400;
	}

}

.shipping {

	td {

		> p {
			clear: both;
		}

	}

	.shipping-calculator {
		padding: 0;

		&-form {
			margin-top: 1em;
		}

		&-button {
			display: block;
			padding: $form_field_padding_vertical 1em;
			font-size: .8em;
			font-weight: 700;
			text-transform: uppercase;
			letter-spacing: var(--letter_spacing);
			text-align: center;
			text-decoration: none;
			color: inherit;
		}

	}

	ul {
		clear: both;
		margin: 0;
		list-style: none;
	}

	li {
		padding: .25em 0;

		label {
			padding: 0;
			margin-#{$left}: .25em;
		}

	}

}

.woocommerce-shipping-calculator {
	padding: 1em 0;
	margin: 0;

	@include media( map_get( $breakpoint, 'm' ) ) {
		padding-left: 1em;
		padding-right: 1em;
	}

	p {
		margin-bottom: 1em;

		&:last-child {
			margin-bottom: 0;
		}

		.button {
			width: 100%;
		}

	}

	> p {
		margin: 0;
	}

	select,
	input[type="text"] {
		width: 100%;
	}

}

.cart-empty {

	&-container {
		max-width: var(--layout_width_entry_content);
		margin-left: auto;
		margin-right: auto;
		text-align: center;

		.woocommerce-info {
			display: block;

			&:last-child {
				margin-bottom: 1em;
			}

		}

	}

}

.return-to-shop {
	margin-top: 1em;

	.button::before {
		content: '\21A9\00a0'; // leftwards arrow with hook + &nbsp;
	}

}
