:root {
	--wd-hb-opt-h: 50px;
	--wd-text-font: "Montserrat", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(0,0,0);
	--wd-text-font-size: 17px;
	--wd-title-font: "Montserrat", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 600;
	--wd-title-color: rgb(0,0,0);
	--wd-entities-title-font: "Montserrat", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: rgb(0,0,0);
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Montserrat", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Montserrat", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 600;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: rgb(0,0,0);
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Montserrat", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 700;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 13px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(92,92,92);
	--wd-alternative-color: rgb(92,92,92);
	--btn-default-bgcolor: #f7f7f7;
	--btn-default-bgcolor-hover: #efefef;
	--btn-accented-bgcolor: rgb(22,8,0);
	--btn-accented-bgcolor-hover: rgb(12,0,0);
	--wd-form-brd-width: 2px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: rgb(0,0,0);
	--wd-link-color-hover: #242424;
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: rgb(0,0,0);
	background-image: none;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
.wd-hb {
	background-color: rgb(0,0,0);
	background-image: none;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: #ffffff;
	background-image: none;
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}

@media (max-width: 1024px) {
	:root {
		--wd-hb-opt-h: 60px;
	}

}
:root{
--wd-container-w: 1222px;
--wd-form-brd-radius: 0px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 0px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-default-box-shadow-active: none;
--btn-default-bottom: 0px;
--btn-accented-bottom-active: -1px;
--btn-accented-brd-radius: 0px;
--btn-accented-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .15);
--btn-accented-box-shadow-hover: inset 0 -2px 0 rgba(0, 0, 0, .15);
--wd-brd-radius: 12px;
}

@media (min-width: 1222px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: #0a0a0a;
}

/* Fully hide the Magnific Popup overlay and container */
.mfp-container,
.mfp-bg,
html.mfp-open,
body.mfp-open {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: none !important;
}

.wd-price-unit, .woocommerce-product-details__short-description, .product_title  {
  color: #5c5c5c;
}
.divider-1, .divider-2, .divider-3, .divider-4, .divider-5, .aloe-vera-gel-divider {
    position: relative;
    border-top: 2px dashed #7d7d7d !important; /* Apply the color to the border */
    z-index: 40;
    width: 120px !important;
}
.aloe-vera-gel-divider {
    height: 0px;
    display: inline-block;
    margin-top: 65px;
    margin-left: auto;
    margin-right: auto;
    position: relative; /* Ensure the position aligns with the parent, if needed */
    left: 18%;
    transform: translateX(-50%) rotate(90deg);
}

.divider-1::after,
.divider-2::after,
.divider-3::after,
.divider-4::after,
.divider-5::after,
.aloe-vera-gel-divider::after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background-color: #7d7d7d;
    border-radius: 50%;
    right: 0px;  /* Adjusted to place the dot right at the edge */
    top: 0%;       /* Keep it vertically centered */
    transform: translateY(-50%);
/* 	    transform: translateX(0%); */
}

/* --- Spa Ceylon Style Cart Progress Bar (Final Fix) --- */

/* 1. Reset the main wrapper so it doesn't look like a grey box */
div.wd-free-progress-bar,
div.woodmart-free-progress-bar {
    background-color: transparent !important;
    height: auto !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* 2. Style the Text */
.wd-free-progress-bar .wd-free-shipping-text,
.wd-free-progress-bar .wd-progress-info,
.wd-free-progress-bar p {
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    letter-spacing: 0.5px !important;
    color: #555555 !important;
    margin-bottom: 12px !important;
    display: block !important;
    white-space: normal !important; 
    line-height: 1.4 !important;
    background: transparent !important; /* Removes the grey box behind the text */
}

/* 3. Bold the monetary amount */
.wd-free-progress-bar strong,
.wd-free-progress-bar .amount {
    color: #000000 !important;
    font-weight: 800 !important;
}

/* 4. Build the actual background track */
.wd-free-progress-bar .wd-progress-bar,
.woodmart-free-progress-bar .progress-area {
    height: 12px !important;
    border-radius: 12px !important;
    background-color: #ececec !important;
    width: 100% !important;
    position: relative !important;
    overflow: visible !important; /* Allows the dot to pop outside the bar */
}

/* 5. Apply the Spa Ceylon Yellow/Gold to the progress fill */
.wd-free-progress-bar .wd-progress,
.woodmart-free-progress-bar .progress-bar {
    background-color: #e5b324 !important; 
    border-radius: 12px !important;
    height: 12px !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
}

/* 6. Add the milestone "node" (circle) at the end of the progress bar */
.wd-free-progress-bar .wd-progress::after,
.woodmart-free-progress-bar .progress-bar::after {
    content: '';
    position: absolute;
    right: -6px; /* Centers the dot on the end of the fill */
    top: 50%;
    transform: translateY(-50%);
    height: 18px;
    width: 18px;
    background-color: #e5b324 !important;
    border-radius: 50%;
    box-shadow: 0px 2px 4px rgba(0,0,0,0.3);
}

/* --- Move Progress Bar to the Top of the Mini Cart --- */

/* 1. Create empty space at the top of the cart to hold the bar */
.cart-widget-side .widget_shopping_cart_content {
    position: relative !important;
    padding-top: 110px !important; 
}

/* 2. Rip the bar out of the footer and pin it to the top */
.cart-widget-side .wd-free-progress-bar,
.cart-widget-side .woodmart-free-progress-bar {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background-color: #ffffff !important;
    z-index: 999 !important;
    padding: 20px 20px 10px 20px !important;
    margin: 0 !important;
    border-bottom: 1px solid #f2f2f2 !important; /* Adds a nice separator line */
}

.header-banner-close { display: none !important; }

/* ==============================================================
   CLEAN UP MINI-CART UPSELLS (SPA CEYLON LUXURY LOOK)
   ============================================================== */

/* 1. Hide Koko, Mintpay, Star Ratings & Overlays */
.custom-cart-upsells .star-rating,
.custom-cart-upsells .wd-star-rating,
.custom-cart-upsells [class*="koko"],
.custom-cart-upsells [class*="mintpay"],
.custom-cart-upsells div[class*="koko"],
.custom-cart-upsells div[class*="mintpay"],
.custom-cart-upsells span[class*="koko"],
.custom-cart-upsells span[class*="mintpay"],
.custom-cart-upsells .koko-installment,
.custom-cart-upsells .mintpay-installment,
.custom-cart-upsells .badge,
.custom-cart-upsells .product-labels {
    display: none !important;
}

/* 2. Format Card Container */
.custom-cart-upsells .product-grid-item {
    background: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
    border-radius: 8px !important;
    padding: 8px !important;
    box-sizing: border-box !important;
    margin-bottom: 10px !important;
}

/* 3. Neaten Product Titles (Clamped to 2 clean lines) */
.custom-cart-upsells .wd-entities-title,
.custom-cart-upsells .product-title,
.custom-cart-upsells .woocommerce-loop-product__title,
.custom-cart-upsells h3 {
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    line-height: 1.3 !important;
    margin: 8px 0 4px 0 !important;
    height: 28px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    text-align: center !important;
}

/* 4. Highlight the Price */
.custom-cart-upsells .price,
.custom-cart-upsells .price .amount {
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #111111 !important;
    margin-bottom: 8px !important;
    display: block !important;
    text-align: center !important;
}

/* 5. Sleek Black "+ ADD" Button */
.custom-cart-upsells .wd-add-btn,
.custom-cart-upsells .add_to_cart_button,
.custom-cart-upsells .button {
    background-color: #000000 !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-radius: 4px !important;
    padding: 7px 12px !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-shadow: none !important;
}

.custom-cart-upsells .wd-add-btn:hover,
.custom-cart-upsells .add_to_cart_button:hover {
    background-color: #333333 !important;
}

/* ==============================================================
   MINI-CART SCROLLBAR & IMAGE BACKGROUND FIX
   ============================================================== */

/* 1. Pull the scrollbar away from the browser edge */
.cart-widget-side .wd-scroll-content {
    margin-right: 15px !important; /* Physically moves the scroll track left */
    padding-right: 10px !important; /* Adds breathing room for the text */
}

/* 2. Style the scrollbar so it is clearly visible */
.cart-widget-side .wd-scroll-content::-webkit-scrollbar {
    width: 6px !important;
}

.cart-widget-side .wd-scroll-content::-webkit-scrollbar-thumb {
    background-color: #a0a0a0 !important;
    border-radius: 10px !important;
}

/* 3. Ensure the product images have a clean transparent background */
.custom-cart-upsells .product-element-top {
    background: transparent !important;
}

/* ==============================================================
   MINI-CART: THE ULTIMATE RESET & CLEANUP
   ============================================================== */

/* 1. Stop Layout Stretching (Fixes the giant Add to Cart buttons) */
.custom-cart-upsells .product-element-bottom,
.custom-cart-upsells .product-information {
    display: block !important;
    text-align: center !important;
}

/* 2. Deflate and Style the Add to Cart Button */
.custom-cart-upsells .wd-bottom-actions,
.custom-cart-upsells .wd-add-btn {
    display: block !important;
    height: auto !important;
    margin-top: 8px !important;
}

.custom-cart-upsells .add_to_cart_button {
    display: inline-block !important; /* Stops the button from stretching vertically */
    width: 100% !important;
    background-color: #000000 !important;
    color: #ffffff !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important; /* Removes massive default heights */
    line-height: 1.2 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
    box-sizing: border-box !important;
}

/* 3. Annihilate Gateways injected inside the Price HTML */
.custom-cart-upsells .price,
.custom-cart-upsells .wrap-price {
    font-size: 0 !important; /* Vaporizes any raw text injected by plugins */
    display: block !important;
    margin-bottom: 8px !important;
}

.custom-cart-upsells .price > *:not(.amount):not(ins):not(del) {
    display: none !important; /* Hides any plugin divs injected inside the price */
}

.custom-cart-upsells .price .amount {
    font-size: 12px !important; /* Resurrects ONLY the exact price numbers */
    font-weight: 800 !important;
    color: #111111 !important;
}

/* 4. Annihilate Gateways injected outside the Price */
.custom-cart-upsells .product-element-bottom > *:not(.wd-entities-title):not(.product-title):not(.price):not(.wrap-price):not(.wd-bottom-actions):not(.wd-add-btn) {
    display: none !important;
}

/* 5. Fix the Image Background and Size */
.custom-cart-upsells .product-element-top {
    background-color: #ffffff !important;
    padding: 5px !important;
}

.custom-cart-upsells .product-element-top img {
    background-color: transparent !important;
    height: 120px !important;
    width: 100% !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* ==============================================================
   MINI-CART: FORCE IMAGE CENTERING
   ============================================================== */

.custom-cart-upsells .product-element-top,
.custom-cart-upsells .product-image-link {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
}

.custom-cart-upsells .product-element-top img {
    margin: 0 auto !important;
    object-position: center !important; /* Forces the internal image content to the middle */
    display: block !important;
}

/* ==============================================================
   SPA CEYLON FREE SHIPPING BAR (MINIMAL PAINT JOB)
   ============================================================== */

/* 1. Add bottom padding to make room for the custom text */
.wd-free-shipping-bar {
    padding-bottom: 25px !important;
}

/* 2. Format the main message */
.wd-free-shipping-bar .free-shipping-message {
    font-family: "Times New Roman", Times, serif !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #444444 !important;
    text-align: center !important;
    margin-bottom: 12px !important;
}

/* 3. The 6px Black Track */
.wd-free-shipping-bar .wd-progress-bar {
    height: 6px !important;
    background-color: #000000 !important;
    border-radius: 10px !important;
    border: none !important;
    position: relative !important;
    overflow: visible !important;
}

/* 4. The Gold Fill */
.wd-free-shipping-bar .progress-bar-value {
    height: 6px !important;
    background-color: #d9a000 !important;
    background-image: none !important; /* Removes default WoodMart stripes */
    border-radius: 10px !important;
}

/* 5. The Milestone Circle (Anchored to the end of the Black Track) */
.wd-free-shipping-bar .wd-progress-bar::after {
    content: "\f0d1" !important; /* Shipping Truck Icon */
    font-family: "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    position: absolute !important;
    right: -10px !important; 
    top: -12px !important; /* Centers the 30px circle perfectly on the 6px track */
    width: 30px !important;
    height: 30px !important;
    background-color: #000000 !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    z-index: 10 !important;
    background-image: none !important;
    animation: none !important;
}

/* 6. The "FREE SHIPPING!" Text (Anchored directly under the circle) */
.wd-free-shipping-bar .wd-progress-bar::before {
    content: "FREE SHIPPING!" !important;
    position: absolute !important;
    right: -25px !important; 
    top: 22px !important; /* Pushes it perfectly below the track */
    font-family: "Times New Roman", Times, serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #555555 !important;
    width: 60px !important;
    text-align: center !important;
    line-height: 1.2 !important;
    z-index: 10 !important;
    background: transparent !important;
}@media (min-width: 1025px) {
	.divider-1 {
    transform: rotate(60deg);
    height: 0px;
		width: 10px;
		margin-left: 140px;
}

.divider-2 {
    transform: rotate(-235deg);
    height: 0px;
    display: inline-block;
		margin-top: 0px;
		margin-left: 20px;
}

.divider-3 {
    transform: rotate(55deg);
    height: 0px;
    display: inline-block;	
		margin-left: 190px;
		margin-top: 50px;
		margin-bottom: -200px;
}

.divider-4 {
    transform: rotate(90deg);
    height: 0px;
		margin-left: -35px;
		margin-top: 50px;
    display: inline-block;
}

.divider-5 {
    transform: rotate(120deg);
    height: 0px;
    display: inline-block;
		margin-top: 65px;
		margin-right: 200px;
	 	margin-left: -75px;
}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.divider-1 {
    transform: rotate(60deg);
    height: 0px;
		width: 10px;
		margin-left: 140px;
}

.divider-2 {
    transform: rotate(-235deg);
    height: 0px;
    display: inline-block;
		margin-top: 0px;
		margin-left: 20px;
}

.divider-3 {
    transform: rotate(55deg);
    height: 0px;
    display: inline-block;	
		margin-left: 190px;
		margin-top: 50px;
		margin-bottom: -200px;
}

.divider-4 {
    transform: rotate(90deg);
    height: 0px;
		margin-left: -35px;
		margin-top: 50px;
    display: inline-block;
}
.aloe-vera-gel-divider {
    left: 14%;
}

.divider-5 {
    transform: rotate(120deg);
    height: 0px;
    display: inline-block;
		margin-top: 65px;
		margin-right: 200px;
	 	margin-left: -75px;
}
}

@media (min-width: 577px) and (max-width: 767px) {
	.divider-1 {
    transform: rotate(60deg);
    height: 0px;
		width: 10px;
		margin-left: 140px;
}

.divider-2 {
    transform: rotate(-235deg);
    height: 0px;
    display: inline-block;
		margin-top: 0px;
		margin-left: 20px;
}

.divider-3 {
    transform: rotate(55deg);
    height: 0px;
    display: inline-block;	
		margin-left: 120px;
		margin-top: 50px;
		margin-bottom: -200px;
}

.divider-4 {
    transform: rotate(90deg);
    height: 0px;
		margin-left: -35px;
		margin-top: 50px;
    display: inline-block;
}
.aloe-vera-gel-divider {
    left: 14%;
}

.divider-5 {
    transform: rotate(120deg);
    height: 0px;
    display: inline-block;
		margin-top: 65px;
		margin-right: 200px;
	 	margin-left: -75px;
}
}

@media (max-width: 576px) {
	.divider-1, .divider-2, .divider-3, .divider-4, .divider-5, .aloe-vera-gel-divider {
    width: 110px !important;
}


.divider-1 {
    transform: rotate(60deg);
    height: 0px;
		width: 10px;
		margin-left: 50px;
}

.divider-2 {
    transform: rotate(-235deg);
    display: inline-block;
}

.divider-3 {
    transform: rotate(55deg);
    height: 0px;
    display: inline-block;	
		margin-left: 0px;
		margin-top: 50px;
		margin-bottom: -200px;
}

.divider-4 {
    transform: rotate(90deg);
    height: 0px;
		margin-left: -15px;
		margin-top: 50px;
    display: inline-block;
}
.aloe-vera-gel-divider {
    left: 14%;
}

.divider-5 {
    transform: rotate(120deg);
    height: 0px;
    display: inline-block;
		margin-top: 65px;
		margin-right: 200px;
	 	margin-left: -30px;
}
}