@import 'partials/globals';
@import 'partials/mixins';
@import 'partials/variables';

#wpsc-cart-notification {
	position: fixed;
	top: 10%;
	left: 50%;
	margin-left: -364px;
	width: 728px;
	height: 450px;
	z-index: 160000;
	border: $cart_border;
	background: #fff;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 20px;
	overflow: hidden;

	.wpsc-form-actions {
		@include wpsc-cart-item();
		text-align: right;
		button {
			font-size: .8em;
		}

		.wpsc-close-modal {
			float: left;
		}
	}
}

.wpsc-cart-set-height {
	.wpsc-cart-notification-inner, .wpsc-cart-table, .wpsc-cart-what-was-added, .wpsc-cart-body {
		height: 100%;
		overflow: hidden;
	}
}

.wpsc-overflow {
	.wpsc-cart-body {
		overflow: scroll;
	}
}

.wpsc-cart-notification-inner {
	@extend .wpsc-clearfix;

	// .wpsc-cart-item-description {
	// 	width: 50%;
	// 	float: right;
	// }

	.wpsc-cart-cell.image {
		width: 50%;
		float: left;
		img {
			max-height: 100%;
			max-width: 90%;
			width: auto;
			height: auto;
			margin-right: 10%;
		}
	}

	.wpsc-cart-item {
		// padding: 0;
		// border: 0;
		// padding-bottom: 0;

		&:first-child {
			padding-top: 15px;
		}
		&.wpsc-cart-no-thumb {
			.wpsc-cart-cell.items {
				width: 100%;
			}
		}
	}

	.wpsc-cart-item-row-actions {
			line-height: initial;
		.wpsc-button {
			display: inline-block;
		}
	}

	.wpsc-cart-view-toggle {
		float: right;
		i {
			cursor: pointer;
		}
	}
}

.wpsc-modal-normal-view {
	&.wpsc-cart-notification-inner {
		.wpsc-cart-cell.image {
			display: none;
		}
	}

	.wpsc-cart-cell.items {
		width: 100%;
		.wpsc-cart-quantity, .wpsc-cart-item-total, .wpsc-cart-item-row-actions {
			display: inline;
		}
		.wpsc-cart-quantity, .wpsc-cart-item-total {
			&:after {
				content: ', ';
			}
		}
		.wpsc-cart-item-details {
			display: none;
		}
	}


	.wpsc-cart-label, .wpsc-cart-item-details {
		display: none;
	}

	.wpsc-cart-item-row-actions {

		.wpsc-button {
			display: inline;
			span {
				display: none;
			}
		}
	}
}

.wpsc-close-modal {

	cursor: pointer;

	&.wpsc-icon-remove {

		color: transparent;
		width: 1.8em;
		height: 1.8em;
		display: block;
		text-align: center;
		position: absolute;
		top: 0;
		right: 0;
		line-height: 1.8em;
		font-size: 16px;
		overflow: hidden;

		&:before {
			color: initial;
		}
	}
}

.wpsc-cart-what-was-added {
	display: block;
	position: relative;
	// overflow: scroll;
	width: 40%;
	float: left;
	padding: 0 20px 0 0;
}

.wpsc-confirmation-message {
	.wpsc-cart-action-icon {
		line-height: 0em;
		font-size: 1.4em;
		padding-right: 7px;
	}
}

.wpsc-confirmation-totals {
	width: 60%;
	float: right;
	padding: 0 0 0;
}

.wpsc-cart-status {
	font-weight: bold;
}

.wpsc-totals-table {
	@include wpsc-cart-item();
	@extend .wpsc-clearfix;

	.wpsc-totals-row-label {
		width: 68%;
		float: left;
		padding-right: 2%;
		clear: both;
		text-align: left;
	}

	.wpsc-totals-row-total {
		width: 30%;
		float: left;
	}
}

// TODO: figure out why these rules exist:
// .wpsc-grid .wpsc-field-quantity, .wpsc-grid .wpsc-field {
//    display: none;
// }
.wpsc-cart-item-edit-wrap {
	.wpsc-field-quantity {
		display: block;
		&.wpsc-hide {
			display: none;
		}
	}

}

#wpsc-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	min-height: 360px;
	background: #000;
	opacity: 0.5;
	z-index: 159900;
}

// TODO -- possibly more opinionated style.
#wpsc-view-cart-button {
	font-size: 1.2em;
	position: fixed;
	bottom: 25%;
	right: 0;
	border-top-left-radius: 100%;
	border-bottom-left-radius: 100%;
	box-shadow: none;
	width: 3em;
	height: 3em;
	line-height: 1.5em;
}