/*
 * Copyright (c) Active Informatics Ltd 2019.
 * Style customisations specific to woocommerce pages.
 */

/* Get rid of sidebar and expand content to 100% width */
.woocommerce #page-container #left-area {
	width: 100% !important;
	margin-right: 0 !important;
	float: none !important;
}

/* Disable sage pay on account menu */
.woocommerce li.woocommerce-MyAccount-navigation-link--mytransactionId {
	display: none;
}
.woocommerce #main-content {
	margin-bottom: 100px;
}

/*
 * Order page
 */
.woocommerce .woocommerce-notice {
	margin-bottom: 30px;
}

 /* 
  * Descripton on left, date, time and location on right on product page. 
  */
@media screen and (min-width: 769px)
{
	.woocommerce div.product div.images, .woocommerce div.product div.summary
	{
		width: calc(50% - 5px) !important;
	}
	.woocommerce div.left-two-thirds
	{
		float: left;
		width: calc(70% - 10px);
	}
	.woocommerce div.right-one-third
	{
		float: right;
		width: calc(30% - 10px);
	}	
}
@media screen and (max-width: 768px)
{
	.woocommerce div.right-one-third
	{
		padding-top: 10px;
	}
}

/*
 * Map area 
 */
.woocommerce div#google_map 
{
	height: 400px;
	margin-top: 16px;
/*	margin-bottom: 16px;	*/
}
/*
@media screen and (max-width: 768px)
{
	height: 300px;
}
*/

/*
 * Basket Page and other buttons
 */
.woocommerce #eu_vat_number_radio_field > span input {
	display: inline;
	margin-right: 5px;
}
.woocommerce #eu_vat_number_radio_field > span label {
	display: inline;
	margin-right: 25px;
}
.woocommerce .activemw-disabled-field {
	background-color: #e6e6e6;
	border-color: #bbb !important;
}

.woocommerce div.product form.cart table.variations td {
	padding-bottom: 0 !important;
}

.woocommerce div.product form.cart table.variations .label {
	font-family: 'DIN 2014 Bold';
	color: #666;
}

.woocommerce .woocommerce-variation.single_variation {
	margin-bottom: 18px;
}

.woocommerce .button.checkout-button.alt.wc-forward,
.woocommerce #place_order.button[name="woocommerce_checkout_place_order"],
.woocommerce .button[name="apply_coupon"],
.woocommerce .button[name="update_cart"],
.woocommerce .button[name="add-to-cart"],
.woocommerce .button.single_add_to_cart_button,
.woocommerce .return-to-shop a.wc-backward,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled] {
	background-color: #6c2c69 !important;
	color: #fff !important;
	border-radius: 0 !important;
	height: 42px !important;
}

.woocommerce .button.checkout-button.alt.wc-forward:hover,
.woocommerce #place_order.button[name="woocommerce_checkout_place_order"]:hover,
.woocommerce .button[name="apply_coupon"]:hover,
.woocommerce .button[name="update_cart"]:hover,
.woocommerce .button[name="add-to-cart"]:hover,
.woocommerce .button.single_add_to_cart_button:hover,
.woocommerce .return-to-shop a.wc-backward:hover,
.woocommerce button.button:disabled:hover,
.woocommerce button.button:disabled[disabled]:hover {
	background-color: #542252 !important;
	color: #fff !important;
}

.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce-cart table.cart td.actions .coupon .input-text::placeholder,
.woocommerce-page .quantity input.qty,
.woocommerce-page .quantity input.qty::placeholder {
	background-color: #fff !important;
	color: #6c2c69 !important;
	border: 1px solid #6c2c69 !important;
	border-radius: 0 !important;
	box-sizing: border-box;
	line-height: 1.7em;
	font-size: 18px !important;
	height: 42px;
}

/* edge rejects the :placeholder selector and it's own special -ms one won't work on it's own so apply same style again */
.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce-cart table.cart td.actions .coupon .input-text::-ms-input-placeholder,
.woocommerce-page .quantity input.qty,
.woocommerce-page .quantity input.qty::-ms-input-placeholder {
	background-color: #fff !important;
	color: #6c2c69 !important;
	border: 1px solid #6c2c69 !important;
	border-radius: 0 !important;
	box-sizing: border-box;
	line-height: 1.7em;
	font-size: 18px !important;
	height: 42px;
}

.woocommerce-cart table.cart td.actions .coupon .input-text::placeholder,
.woocommerce-page .quantity input.qty::placeholder {
	border: 0 !important;
}

.woocommerce .hide-optional span.optional {
	display: none;
}

/*
 * Button colours - want purple.
 */
.et_pb_contact_submit,.et_password_protected_form .et_submit_button,.et_pb_bg_layout_light .et_pb_newsletter_button,.comment-reply-link,.form-submit .et_pb_button,.et_pb_bg_layout_light .et_pb_promo_button,.et_pb_bg_layout_light .et_pb_more_button,.woocommerce a.button.alt,.woocommerce-page a.button.alt,.woocommerce button.button.alt,.woocommerce-page button.button.alt,.woocommerce input.button.alt,.woocommerce-page input.button.alt,.woocommerce #respond input#submit.alt,.woocommerce-page #respond input#submit.alt,.woocommerce #content input.button.alt,.woocommerce-page #content input.button.alt,.woocommerce a.button,.woocommerce-page a.button,.woocommerce button.button,.woocommerce-page button.button,.woocommerce input.button,.woocommerce-page input.button,.et_pb_contact p input[type="checkbox"]:checked+label i:before,.et_pb_bg_layout_light.et_pb_module.et_pb_button {
    color: #6c2c69;
}
#et_search_icon:hover,#top-menu li.current-menu-ancestor>a,#top-menu li.current-menu-item>a,.bottom-nav li.current-menu-item>a,.comment-reply-link,.entry-summary p.price ins,.et-social-icon a:hover,.et_password_protected_form .et_submit_button,.footer-widget h4,.form-submit .et_pb_button,.mobile_menu_bar:after,.mobile_menu_bar:before,.nav-single a,.posted_in a,.woocommerce #content div.product p.price,.woocommerce #content div.product span.price,.woocommerce #content input.button,.woocommerce #content input.button.alt,.woocommerce #content input.button.alt:hover,.woocommerce #content input.button:hover,.woocommerce #respond input#submit,.woocommerce #respond input#submit.alt,.woocommerce #respond input#submit.alt:hover,.woocommerce #respond input#submit:hover,.woocommerce .star-rating span:before,.woocommerce a.button,.woocommerce a.button.alt,.woocommerce a.button.alt:hover,.woocommerce a.button:hover,.woocommerce button.button,.woocommerce button.button.alt,.woocommerce button.button.alt:hover,.woocommerce div.product p.price,.woocommerce div.product span.price,.woocommerce input.button,.woocommerce input.button.alt,.woocommerce input.button.alt:hover,.woocommerce input.button:hover,.woocommerce-page #content div.product p.price,.woocommerce-page #content div.product span.price,.woocommerce-page #content input.button,.woocommerce-page #content input.button.alt,.woocommerce-page #content input.button.alt:hover,.woocommerce-page #respond input#submit,.woocommerce-page #respond input#submit.alt,.woocommerce-page #respond input#submit.alt:hover,.woocommerce-page #respond input#submit:hover,.woocommerce-page .star-rating span:before,.woocommerce-page a.button,.woocommerce-page a.button.alt,.woocommerce-page a.button.alt:hover,.woocommerce-page a.button:hover,.woocommerce-page button.button,.woocommerce-page button.button.alt,.woocommerce-page button.button.alt:hover,.woocommerce-page button.button:hover,.woocommerce-page div.product p.price,.woocommerce-page div.product span.price,.woocommerce-page input.button,.woocommerce-page input.button.alt,.woocommerce-page input.button.alt:hover,.woocommerce-page input.button:hover,.wp-pagenavi a:hover,.wp-pagenavi span.current {
    color: #6c2c69;
}

.woocommerce table.variations select#member-status {
	font-family:"DIN 2014 Regular", Arial !important;
	font-size: 16px;
    max-width: 100%;
	padding: 5px 10px;
    box-sizing: border-box;
    border: 1px solid #6c2c69;
	border-radius: 0;
	background-color: #fff;
    box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	-moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%236c2c69%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
    background-size: .65em auto, 100%;
}
.woocommerce table.variations select#member-status::-ms-expand {
    display: none;
}

/*
 * Product page:
 * - ensure always a gap under the product image.
 * - ensure always a gap below the map regardless of width.
 */
.woocommerce h1.product_title {
	font-size: 50px;
}
.woocommerce.single-product #main-content > .container {
	padding-top: 0;	
}
.woocommerce.single-product .woocommerce-notices-wrapper .woocommerce-message[role="alert"] {
	margin: 18px 0;
}
body.product-template-default div.woocommerce-product-gallery__image img.wp-post-image
{
	margin-bottom: 16px;
}
body.product-template-default div#left-area
{
	padding-bottom: 23px !important;
}
.woocommerce .stock {
	/*display: none;*/
}
@media (max-width: 1080px) {
	.woocommerce .summary.entry-summary h1.product_title.entry-title {
		font-size: 50px;
	}
}
.woocommerce #eu_vat_number_text,
.woocommerce #sage-payment-data input[type="text"],
.woocommerce #sage-payment-data input[type="tel"],
.woocommerce input.input-text {
	transition: 0.3s ease-out all;
}

/*
 *  Sagepay
 */
.woocommerce #sage-payment-data input[type="text"],
.woocommerce #sage-payment-data input[type="tel"] {
	padding: 15px;
	border-radius: 3px;
	font-size: 14px;
	width: 100%;
	max-width: 200px;
}
.woocommerce #sage-payment-data input[type="text"]:focus,
.woocommerce #sage-payment-data input[type="tel"]:focus {
	border-color: #2d3940;
}
.woocommerce #sage-payment-data .form-row {
	position: relative;
}
.woocommerce #sage-payment-data .form-row label {
	color: rgba(0,0,0,0);
}
.woocommerce #sage-payment-data .form-row label:after {
	position: absolute;
	display: inline-block;
	left: 1em;
	color: #515151;
}
.woocommerce #sage-payment-data .form-row:nth-child(1) label:after {content: "Cardholder name";}
.woocommerce #sage-payment-data .form-row:nth-child(2) label:after {content: "Card number";}
.woocommerce #sage-payment-data .form-row:nth-child(3) label:after {content: "Expiry date (MMYY)";}
.woocommerce #sage-payment-data .form-row:nth-child(4) label:after {content: "Card code (CVC)";}

/*
 * Profile page.
 */
div.woocommerce h3 {
	padding-top: 10px;
}
 
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style-type: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul > li {
	padding: 15px 0 15px 25px;
	margin-right: 25px;
	border-top: 1px solid #999;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul > li:nth-child(3) {
	display: none;
}

@media only screen and (max-width: 770px) {
	.woocommerce-account .woocommerce-MyAccount-navigation ul > li {
		text-align: center;
		padding: 15px 25px;
	}
}

.woocommerce-account .woocommerce-MyAccount-navigation ul > li:hover {
	background-color: rgba(204, 204, 204, 0.5);
}

.woocommerce-account .woocommerce-MyAccount-content {
	margin-bottom: 75px;
}

.woocommerce-account form .form-row select.auto-width {
	width: auto;
}

/* CUSTOM CHECKMARKS AND RADIOS - disabled for now */

/* CHECKMARK */

.fs-fieldset {
	margin-bottom: 20px;
}

.woocommerce-account .woocommerce-MyAccount-content .checkbox-container {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 10px;
}

.woocommerce-account .woocommerce-MyAccount-content .form-row {
	width: 100%;
}

.woocommerce-account .woocommerce-MyAccount-content .form-row p {
	width: 100%;
}

.woocommerce-account .woocommerce-MyAccount-content .form-row label:first-of-type {
	font-size: 22px;
	font-weight: bold;
}

.woocommerce-account .woocommerce-MyAccount-content .checkbox-container > div {
	margin: 15px 0;
	margin-right: 15px;
}

.woocommerce-account .woocommerce-MyAccount-content .checkbox-container > div > label {
	position: relative;
	padding: 12px 25px;
	z-index: 999;
	cursor: pointer;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="checkbox"] {
	z-index: 999;
	position: absolute;
	opacity: 0;				/* turn checkbox visibility on/off for testing*/
}

.woocommerce-account .woocommerce-MyAccount-content .custom-checkmark {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 100px;
	border: 2px solid #999;
	z-index: -1;
	transition: 0.2s ease-in;
}

.woocommerce-account .woocommerce-MyAccount-content span {
	color: #999;
	white-space: nowrap;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="checkbox"]:checked ~ span {
	color: white;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="checkbox"]:checked ~ .custom-checkmark {
	background-color: #6c2c69;
	color: white;
	border: 2px solid #6c2c69;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="checkbox"]:disabled ~ span {
	color: white;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="checkbox"]:disabled ~ .custom-checkmark {
	background-color: #aaa;
	color: white;
	border: 2px solid #999;
}

.woocommerce-account .woocommerce-MyAccount-content button[name="save_account_details"] {
	width: 100%;
	height: 60px;
	margin: 40px 0;
	text-transform: uppercase;
	background-color: #6c2c69;
	border-radius: 5px;
	color: white;
	font-weight: bold;
	font-size: 22px;
	transition: 0.2s ease-in;
}

.woocommerce-account .woocommerce-MyAccount-content button[name="save_account_details"]:hover,
.woocommerce-account .woocommerce-MyAccount-content button[name="save_account_details"]:active {
	background-color: #853681;
}

.woocommerce .woocommerce-form-login-toggle {
	display: none;
}

/* RADIO */

.woocommerce-account .woocommerce-MyAccount-content .radio-container {
	width: 100%;
	margin-bottom: 30px;
}

.woocommerce-account .woocommerce-MyAccount-content .radio-container > div {
	position: relative;
	z-index: 999;
	margin-bottom: 8px;
}

.woocommerce-account .woocommerce-MyAccount-content .radio-container > div input[type="radio"] {
	z-index: 999;
	position: absolute;
	cursor: pointer;
	opacity: 0;				 /*turn checkbox visibility on/off for testing*/
}

.woocommerce-account .woocommerce-MyAccount-content .radio-container > div label {
	z-index: 999;
	padding-left: 30px;
	cursor: pointer;
	height: 100%;
}

.woocommerce-account .woocommerce-MyAccount-content .custom-radio {
  	position: absolute;
  	top: 0;
  	left: 0;
  	height: 25px;
  	width: 25px;
	margin-top: 2px;
  	background-color: #ddd;
  	border-radius: 50%;
	cursor: pointer;
	transition: 0.2s ease-in;
}

.woocommerce-account .woocommerce-MyAccount-content .custom-radio:after {
	content: "";
  	position: absolute;
  	display: none;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="radio"]:checked ~ .custom-radio {
	background-color: #6c2c69;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="radio"]:checked ~ .custom-radio:after {
	display: block;
}

.woocommerce-account .woocommerce-MyAccount-content .custom-radio:after {
	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
.woocommerce-account div.avatar-container::before {
	content: "For best results the image should be square, a minimum of 400 by 400 pixels and less than 100KB.";
	vertical-align: top;
}

.woocommerce-account .woocommerce-MyAccount-content input.input-text {
	font-size: 18px !important;
}

.woocommerce-account .woocommerce-MyAccount-content select {
	font-size: 18px;
	padding: 8px 15px;
}