/*
Theme Name: Salient Child
Template: salient
Text Domain: salient-child
*/

:root {
	--color-primair: #b19328;
	--color-secundair: #3c4a54;
	--color-accent: #868989;
	--color-accent-light: #efefef;
	--color-text: #121616;
}

#page-header-bg {
	.subheader {
		display: flex;
		margin-top: 32px;
		margin-bottom: 0;
	}
}

nav {
	.sf-menu {
		& > li {
			.sub-menu {
				.menu-column {
					.sub-menu {
						li {
							&.no-overlay {
								a {
									.color-overlay {
										display: none;
									}
								}
							}
							&.fullwidth-item {
								a {
									width: 100%;
									.image-layer-outer {
										aspect-ratio: 1 / 1.25;
									}
								}
							}
						}
					}
				}
			}
			&.megamenu__global-section {
				& > .nectar-global-section {
					padding-top: 32px;
					padding-bottom: 32px;
					background-color: #fff!important;
				}
			}
		}
	}
}

/*****************************
WOOCOMMERCE GENERAL STYLING
*****************************/
#page-header-bg h1, body h1, body .row .col.section-title h1, .full-width-content .nectar-recent-posts-slider .recent-post-container .inner-wrap h2, body #error-404 h1, [data-inherit-heading-family="h1"] {
	font-family: 'Work Sans'!important;
}

.single-product div.product h1.product_title, .nectar-shop-header .page-title {
	@media screen and (min-width: 768px) {
		font-size: 42px;
	}
}

.cart-menu-wrap {
	display: flex;
	align-items: center;
}

.nectar_quick_view {
	display: flex!important;
	align-items: center;
    justify-content: center;
}

.qib-button-wrapper {
	.qib-button {
		display: none!important;
	}
}

.qty {
	height: auto!important;
}

.product {
	.product-wrap {
		.product-image-wrap {
			.product-add-to-cart {
				form.cart {
					transition: opacity 0.4s cubic-bezier(.2,.75,.5,1);
					opacity: 0;
					display: flex;
					align-items: center;
					justify-content: space-between;
					width: 100%;

					.flex-break {
						display: none!important;
					}

					button[type='submit'] {
						margin-top: 0;
					}
				
					.quantity {
						transition: 0s!important;
						.qty {
							height: auto;
						}
					}
				}
			}
		}
		.product-meta {
			.product-main-meta {
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				.price {
					width: 100%;
					order: -1;
				}
			}
		}
	}
	&:hover {
		.product-wrap {
			.product-image-wrap {
				.product-add-to-cart {
					pointer-events: visible;
					form.cart {
						opacity: 1;
					}
				}
			}
		}
	}
	&.is-bundle {
		.product-wrap {
			.product-image-wrap {
				.product-add-to-cart {
					form.cart {
						display: none!important;
					}
				}
			}
			.product-meta {
				.product-main-meta {
					display: flex;
					flex-wrap: wrap;
					justify-content: center;
					.price {
						width: 100%;
						order: -1;
					}
				}
			}
		}
	}
	&.classic {
		.product-wrap {
			.product-add-to-cart {
				.wesdev-loop-add-to-cart {
					display: flex;
					align-items: center;
					justify-content: center;
					flex-wrap: wrap;
					gap: 16px 32px;
					margin-top: 16px;

					a.button {
						position: relative!important;
						transform: translateY(0)!important;
						width: 50px;
						height: 50px;
						box-shadow: 0 0 10px rgb(0 0 0 / 0%);
						transition: all .15s ease-in-out;
						display: flex;
						align-items: center;
						justify-content: center;
						border-radius: 50%;
						i {
							margin-right: 0;
						}
						span {
							display: none;
						}
					}

					.wesdev-loop-add-to-cart__quantity {
						.quantity {
							display: flex;
							padding: 0;
							height: 32px;
							border-radius: 200px;
							border: 1px solid #0a0a0a;
							transition: border .15s ease-in-out;
							overflow: hidden;
							.plus, .minus {
								color: #000;
								background-color: #fff;
								width: 32px;
							}
							.qty {
								border: none;
								box-shadow: none;
								width: 32px;
								padding: 0;
							}
							&:hover {
								border: 1px solid #000;
							}
						}
					}
				}
			}
		}
	}
}


.woocommerce table.order-review tfoot td, .woocommerce table.order-review tfoot th, .woocommerce table.order-review th, .woocommerce-page table.order-review th, .woocommerce-page table.shop_table tfoot td, .woocommerce-page table.shop_table tfoot th {
	font-family: 'Work Sans';
}

/****************************************** 
WOOCOMMERCE BUNDLE PRODUCTS IN CART STYLING 
******************************************/
body .nectar-slide-in-cart.style_slide_in_click .widget_shopping_cart a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: var(--color-accent-light)!important;
	border: 1px solid var(--color-text)!important;
	color: var(--color-text)!important;
	border-radius: 4px!important;
	opacity: 1!important;
	transition: all 0.15s ease-in-out;
	&:hover {
		background-color: var(--color-text)!important;
		color: var(--color-accent-light)!important;
	}
	&.checkout {
		background-color: var(--color-primair)!important;
		border-color: var(--color-primair)!important;
		color: var(--color-accent-light)!important;
		&:hover {
			background-color: var(--color-text)!important;
			border-color: var(--color-text)!important;
		}
	}
}

.widget_shopping_cart {
	.widget_shopping_cart_content {
		.woocommerce-mini-cart {
			.woocommerce-mini-cart-item {
				border-bottom: 1px solid var(--color-accent-light);
				padding-right: 20px!important;
				&:last-child {
					border-bottom: none;
				}
				& > a {
					position: absolute;
					top: 20px;
					left: 0;
				}
				.product-meta {
					.product-details {
						align-self: flex-start;
						margin-top: 95px;
						& > a {
							font-family: 'Work Sans'!important;
							font-size: 18px!important;
							@media screen and (max-width: 768px) {
								font-size: 12px !important;
                            	line-height: 14px !important;
							}
						}
						.variation {
							dd:not(.variation-Totaalaantalm), dt:not(.variation-Totaalaantalm) {
								display: none!important;
							}
							dt, dd {
								font-size: 18px!important;
							}
						}
					}
					.quantity {

						.modify {
							.qib-button-wrapper {
								.qib-button {
									display: none;
								}
							}
						}
						.quantity {
							backdrop-filter: blur(12px);
							transition: 0s!important;
							.qty {
								height: auto;
							}
						}
						.product-price {
							& > .woocommerce-Price-amount  {
								margin-bottom: 16px;
								text-align: right;
								bdi {
									font-size: 24px!important;
									padding: 8px 16px;
									background-color: var(--color-accent-light);
									display: inline-block;
									border-radius: 4px;
									border: 1px solid var(--color-text)!important;
									span {
										font-size: inherit;
									}

									@media screen and (max-width: 768px) {
										font-size: 18px!important;
									}
								}
							}
							.dbp-mini-line-subtotal {
								margin: -12px 0 16px;
							}
							.bundel-wrapper {
								& > span {
									display: flex;
									font-size: 16px;
									margin-bottom: 8px;
									padding-bottom: 8px;
									border-bottom: 1px solid var(--color-accent-light);
								}
								.bundled-price {
									.price-bundle {
										display: flex;
										width: 100%;
										justify-content: flex-start;
										align-items: center;
										margin-bottom: 8px;
										& > .ammount-wrapper {
											display: flex;
											white-space: nowrap;
											margin-right: 8px;
										}
										& > a {
											font-size: 12px;
											line-height: 120%;
											margin-bottom: 0;
										}
										.woocommerce-Price-amount {
											margin-left: auto;
										}
									}
								}
							}
							.remove_from_cart_button {
								font-family: 'Work Sans';
								padding: 4px 8px !important;
								margin: 0 !important;
								display: flex;
								align-items: center;
								justify-content: center;
								height: 35px;
								background-color: var(--color-accent-light)!important;
								border: 1px solid var(--color-text)!important;
								color: var(--color-text)!important;
								border-radius: 4px;
								opacity: 1!important;
								transition: all 0.15s ease-in-out;
								&:hover {
									background-color: var(--color-text)!important;
									color: var(--color-accent-light)!important;
								}
							}
						}
					}
					& > .dbp-unit {
						display: none;
					}
				}
				&.dbp-mini-cart-item {
					.product-meta {
						.quantity {
							.modify {
								display: none;
							}
							.product-price {
								.woocommerce-Price-amount {
									display: flex;
									justify-content: flex-end;
								}
							}
						}
					}
				}
			}
		}
	}
}

.woocommerce-checkout-review-order {
	.woocommerce-checkout-review-order-table {
		.product-container {
			.dbp-cart-item--bundle {
				.product-info {
					flex-direction: column;
					align-items: flex-end;
					.bundel-wrapper {
						.bundel-toggle {
							justify-content: flex-end;
							gap: 16px;
						}
					}
				}
			}
		}
	}
}

/** bundelwrapper global styling for collapse **/
.bundel-wrapper {
	margin-top: 32px;
	.bundel-toggle {
		display: flex;
		justify-content: space-between;
		align-items: center;
		cursor: pointer;
		span {
			font-size: 16px!important;
			font-weight: 500;
		}
		svg {
			width: 12px;
			height: 12px;
			transform: rotate(0deg) scale(1);
			transform-origin: center;
			transition: all 0.15s ease-in-out;
		}
		&:hover {
			svg {
				transform: rotate(0deg) scale(1.5);
			}
		}
		&.opened {
			svg {
				transform: rotate(180deg);
			}
			&:hover {
				svg {
					transform: rotate(180deg) scale(1.5);
				}
			}
		}
	}
	.bundled-price {
		display: grid;
		grid-template-rows: 0fr;
		transition: grid-template-rows 0.15s ease-in-out;
		opacity: 0;
		transition: grid-template-rows 0.15s ease-in-out, opacity 0.15s ease-in-out;

		.bundled-price__inner {
			overflow: hidden;
			min-height: 0;
		}

		&.opened {
			grid-template-rows: 1fr;
			opacity: 1;
		}
	}
}


/***************************** 
WESDEV BUNDLE PRODUCTS STYLING 
******************************/

.nectar-social {
	display: none!important;
}

.dbp-container {
	width: 100%;
	.form-row-holder {
		.form-row-heading {
			margin-top: 15px;
		}
		.form-row-fields {
			margin-top: 15px;
			border-top: 1px solid #ebebeb;
			padding-top: 15px;
			.form-row {
				width: 100%!important;
				.fancy-select-wrap {
					position: relative;
					padding-top: 0;
					.select2 {
						width: 100%!important;
					}
					.select2-selection {
						border: 1px solid #000!important;
						width: 100%!important;
					}
					label {
						color: #000!important;
					}
				}
			}
		}
	}
	.calc-components {
		.calc-body {
			.calc-row {
				.calc-col {
					width: calc(50% - (69px + 15px));
					display: flex;
					@media screen and (min-width: 768px) {
						width: calc(50% - (93px + 15px));
					}
					&.product-name {
						width: 100%;
					}
					&.product-thumb {
						width: 20%;
						max-width: 62px;
						img {
							width: auto;
							height: 62px;
						}
					}
					&.product-ammount {
						width: 20%;
						max-width: 124px;
						input {
							height: 62px;
						}
					}
				}
			}
		}
	}
	#dbp-calc {
		height: 50px;
		border: 2px solid var(--color-text);
		background-color: var(--color-accent-light);
		color: var(--color-text);
		transition: all 0.15s ease-in-out;
		border-radius: 4px!important;
		&:hover {
			background-color: var(--color-accent);
			color: var(--color-accent-light);
		}
	}

	@media screen and (min-width: 768px) {
		flex-direction: row;
		gap: 60px;
		.form-row-holder {
			.form-row-fields {
				display: flex;
				flex-wrap: wrap;
				position: sticky;
				top: 0;
				gap: 30px;
				.form-row {
					width: calc(50% - 15px)!important;
					input {
						height: 67.5px;
					}
				}
			}
		}
	}
}

.user-not-logged-in {
	#header-space, #header-outer, .nectar-global-section.before-footer {
		display: none!important;
	}
}

.user-not-logged-in {
	.container-wrap {
		background-color: #000!important;
		box-shadow: none!important;
	}
	.my-account-column {
		.wpb_text_column {
			position: relative;
			display: inline-block;
			left: 50%;
			top: 50%;
			transform: translate(-50%, 25%);
			background-color: #fff;
			padding: 30px;
			width: 100%;
			border-radius: 30px;
			@media screen and (min-width: 768px) {
				width: 50%;
			}
		}
	}
}

.user-logged-in .my-account-column {
	.img-loaded {
		img {
			aspect-ratio: 5 / 1;
			height: auto!important;
			object-fit: cover;
		}
	}
	.woocommerce-MyAccount-navigation {
		ul {
			li {
				a {
					opacity: 1;
					background-color: var(--color-accent-light);
					color: var(--color-text);
					padding: 16px;
					&:before {
						color: var(--color-text);
					}
				}
				&.is-active {
					a {
						background-color: var(--color-text);
						color: var(--color-accent-light);
						&:before {
							color: var(--color-accent-light);
						}
					}
				}
			}
		}
	}
}

.wesdev-add-to-cart-notice {
	transition: all .15s ease-in-out;
}

.is-bundle .single-product-main-image {
	display: none!important;
}

.wp-block-woocommerce-cart .wc-block-cart-items__row:has(.wc-block-components-product-details__totaal-aantal-m)
  .wc-block-components-quantity-selector {
  display: none !important;
}

.woocommerce .woocommerce-checkout-review-order-table table.order-review tr td, .woocommerce .woocommerce-checkout-review-order-table table.order-review tr th {
	font-family: 'Work Sans';
	font-size: 16px;
}

.woocommerce .woocommerce-checkout-review-order-table table.order-review tr.fee {
	padding: 8px 16px;
    background-color: rgba(177, 147, 40, 40%) !important;
    margin: 0 0 16px 0;
    border-radius: 8px;
}

.woocommerce .woocommerce-checkout-review-order-table table.order-review tr.woocommerce-shipping-totals.shipping {
	flex-direction: column;

	& > td {
		margin-left: 0!important;

		ul.woocommerce-shipping-methods {
			padding: 8px 16px!important;
			background-color: rgba(0, 0, 0, 10%) !important;
			margin: 16px 0!important;
			border-radius: 8px;
			li {
				display: flex!important;
				label {
					display: flex!important;
					justify-content: space-between;
					width: 100%;
				}
			}
		}
	}
}

@media screen and (max-width: 768px) {
	body.woocommerce .nectar-shop-header .nectar-shop-header-bottom .woocommerce-result-count {
		bottom: -45px!important;
	}

	body .products[data-rm-m-hover="1"] li.product.minimal .background-color-expand, body .products[data-rm-m-hover="1"] li.product.minimal .product-add-to-cart {
		display: flex!important
	}

	form.cart {
		opacity: 1!important;
	}

	.nectar-slide-in-cart.style_slide_in_click .woocommerce-mini-cart__buttons {
		display: flex;
	}
}

.woocommerce ul.products li.product .product-add-to-cart form.cart {

	width: 100%;
	display: flex;
	justify-content: center;
	gap: 30px;
	margin-top: 15px;

	.flex-break {
		display: none;
	}

	button.single_add_to_cart_button {
		position: relative;
		text-indent: -9999px;
		white-space: nowrap;
		overflow: hidden;
		box-shadow: none !important;
		width: auto;
		min-width: 50px;
		margin-left: 0!important;
		animation: none!important;
	}
} 

/* Cart icon in het midden van de button */
.woocommerce ul.products li.product .product-add-to-cart form.cart button.single_add_to_cart_button::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%!important;
  width: 1.05em;
  height: 1.05em;
  transform: translate(-50%, -50%)!important;
  background: currentColor;
  margin-left: 0!important;

  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6 6h15l-1.5 9h-12z" fill="none" stroke="black" stroke-width="2" stroke-linejoin="round"/><path d="M6 6L4 3H1" fill="none" stroke="black" stroke-width="2" stroke-linecap="round"/><circle cx="9" cy="20" r="1" fill="black"/><circle cx="18" cy="20" r="1" fill="black"/></svg>') center / contain no-repeat;
          mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6 6h15l-1.5 9h-12z" fill="none" stroke="black" stroke-width="2" stroke-linejoin="round"/><path d="M6 6L4 3H1" fill="none" stroke="black" stroke-width="2" stroke-linecap="round"/><circle cx="9" cy="20" r="1" fill="black"/><circle cx="18" cy="20" r="1" fill="black"/></svg>') center / contain no-repeat;
}

.wesdev-archive-cart {
	position: fixed;
	bottom: 32px;
	right: 32px;
	z-index: 99999;
	transition: bottom .15s ease-in-out, right .15s ease-in-out;
	.cart-contents {
		padding: 16px;
        background-color: #000;
        color: #fff;
        width: 50px;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
		box-shadow: 0 0 10px rgb(0 0 0 / 0%);
		transition: width .15s ease-in-out, height .15s ease-in-out, box-shadow .15s ease-in-out;
		.cart-icon-wrap {
			.cart-wrap {
				display: flex;
				align-items: center;
				justify-content: center;
				position: absolute;
				color: #000;
				top: 0;
				right: -8px;
				transform: translate(-50%, -50%);
				background-color: #fff;
				padding: 4px;
				border-radius: 50%;
				span {
					display: flex;
					line-height: 16px;
					width: 16px;
					align-items: center;
					justify-content: center;
				}
			}
		}
	}
	&:hover {
		right: 26px;
		bottom: 26px;
		
		.cart-contents {
			width: 62px;
			height: 62px;
			box-shadow: 0 0 10px rgb(0 0 0 / 60%);
		}
	}
}

.wesdev-loop-add-to-cart__notice, .wesdev-single-add-to-cart__notice {
	width: 100%;
	padding: 8px;
	background-color: rgb(0 128  0 / 10%);
	border-radius: 16px;
	.wesdev-notice-inner {
		display: flex;
		flex-wrap: wrap;
		gap: 4px 16px;
		padding-right: 16px;
		position: relative;

		.wesdev-notice-cart-link {
			text-decoration: underline;
		}

		.wesdev-notice-close {
			position: absolute;
			z-index: 999;
			right: 0;
			top: 0;
			color: #fff;
			background-color: #000;
			cursor: pointer;
		}
	}
}

.wesdev-single-add-to-cart__notice {
	margin-bottom: 12px;
}

.wesdev-loop-add-to-cart__notice[hidden],
.wesdev-single-add-to-cart__notice[hidden] {
	display: none;
}

.wesdev-loop-add-to-cart__notice.is-visible,
.wesdev-single-add-to-cart__notice.is-visible {
	display: block;
}

.wesdev-loop-add-to-cart__notice .wesdev-notice-inner,
.wesdev-single-add-to-cart__notice .wesdev-notice-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.wesdev-loop-add-to-cart__notice .wesdev-notice-close,
.wesdev-single-add-to-cart__notice .wesdev-notice-close {
	cursor: pointer;
}

.wesdev-loop-stock-quantity {
	position: absolute;
	z-index: 9;
	left: -5px;
	right: -5px;
	top: -5px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	pointer-events: none;

	span {
		display: inline-flex;
		justify-content: center;
		align-items: center;
		padding: 2px 6px;
		border-radius: 3px;

		&.stock {
			border-radius: 50%;
			background-color: #000;
			color: #fff;
		}

		&.stock-text {
			background-color: lightgreen;

			&.sold-out {
				background-color: red;
			}

			&.back-order {
				background-color: orange;
			}
		}
	}
}

.checkout #order_review .order-review tbody tr.ch-post-calculated-shipping-notice {
	flex-direction: column;
	margin-bottom: 15px;
}

span.ch-mono-stone-combo-title-badge {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 400;
    opacity: 0.75;
}

.is-bundle {
	#dbp-main-price, .posted_in {
		text-align: right!important;
	}
}
@media screen and (max-width: 768px) {
	.woocommerce-additional-fields__field-wrapper {
		.form-row {
			width: 100%!important;
		}
	}

	.dbp-mini-cart-item--bundle {
		.product-meta {
			flex-direction: column;
			.quantity {
				width: 100%;
			}
		}
	}

	.wc-block-cart-items {
		.wc-block-cart-items__row {
			display: flex!important;
			flex-wrap: wrap;
			td {
				width: 100%;
				&.wc-block-cart-item__image {
					order: 0;
				}
				&.wc-block-cart-item__total {
					order: 1;
					display: none;
				}
				&.wc-block-cart-item__product {
					order: 2;
					.wc-block-cart-item__prices {
						font-size: 20px;
    					font-weight: 900;
					}
				}
			}
		}
	}
}
