@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "woodmart-font";
	src: url("//lupitools.com/wp-content/themes/woodmart/fonts/woodmart-font-2-400.woff2?v=8.4.1") format("woff2");
}

@font-face {
	font-family: "star";
	font-weight: 400;
	font-style: normal;
	src: url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/star.eot?#iefix") format("embedded-opentype"), url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/star.woff") format("woff"), url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/star.ttf") format("truetype"), url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/star.svg#star") format("svg");
}

@font-face {
	font-family: "WooCommerce";
	font-weight: 400;
	font-style: normal;
	src: url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.eot?#iefix") format("embedded-opentype"), url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.woff") format("woff"), url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.ttf") format("truetype"), url("//lupitools.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.svg#WooCommerce") format("svg");
}

:root {
	--wd-hb-opt-h: 48px;
	--wd-cat-brd-radius: 8px;
	--wd-text-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: #727272;
	--wd-text-font-size: 14px;
	--wd-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 500;
	--wd-title-transform: none;
	--wd-title-color: rgb(16,16,16);
	--wd-entities-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-transform: none;
	--wd-entities-title-color: rgb(16,16,16);
	--wd-entities-title-color-hover: rgb(114, 114, 114);
	--wd-alternative-font: var(--wd-text-font);
	--wd-widget-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 500;
	--wd-widget-title-transform: none;
	--wd-widget-title-color: rgb(16,16,16);
	--wd-widget-title-font-size: 14px;
	--wd-header-el-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 500;
	--wd-header-el-transform: none;
	--wd-header-el-font-size: 14px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(255,95,0);
	--wd-alternative-color: rgb(252,239,214);
	--btn-default-font-family: "Poppins", Arial, Helvetica, sans-serif;
	--btn-default-font-weight: 500;
	--btn-default-bgcolor: rgb(255,237,211);
	--btn-default-bgcolor-hover: rgb(255,216,165);
	--btn-default-color: rgb(70,20,4);
	--btn-default-color-hover: rgb(70,20,4);
	--btn-accented-bgcolor: rgb(255,118,10);
	--btn-accented-bgcolor-hover: rgb(255,118,10);
	--btn-accented-color: rgb(255,255,255);
	--btn-accented-color-hover: rgb(255,255,255);
	--btn-font-family: "Poppins", Arial, Helvetica, sans-serif;
	--btn-font-weight: 500;
	--btn-transform: none;
	--btn-font-size: 14px;
	--wd-form-brd-width: 1px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: #333333;
	--wd-link-color-hover: #242424;
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: #111111;
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
: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;
}
html .wd-nav-mobile > li > a {
	text-transform: capitalize;
}
html .post.wd-post:not(.blog-design-small) .wd-entities-title {
	font-size: 18px;
}
.page :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,247,236);
	background-image: none;
}
.woodmart-archive-shop:not(.single-product) :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.single-product :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.woodmart-archive-blog :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.single-post :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
html .btn.wd-buy-now-btn {
	font-size: 14px;
	background: rgb(255,118,10);
}
html .btn.wd-buy-now-btn:hover {
	background: FF5F00;
}
body, [class*=color-scheme-light], [class*=color-scheme-dark], .wd-search-form[class*="wd-header-search-form"] form.searchform, .wd-el-search .searchform {
	--wd-form-bg: rgb(255,255,255);
}
.wd-nav-arrows.wd-pos-sep:not(:where(.wd-custom-style)) {
	--wd-arrow-size: 48px;
	--wd-arrow-icon-size: 24px;
	--wd-arrow-offset-h: 8px;
	--wd-arrow-offset-v: 0px;
	--wd-arrow-bg: rgb(255,255,255);
	--wd-arrow-radius: 300px;
	--wd-arrow-brd-color: rgb(212,212,212);
	--wd-arrow-brd-color-hover: rgb(212,212,212);
	--wd-arrow-brd-color-dis: rgb(229,229,229);
	--wd-arrow-brd: 1px solid;
}
.wd-nav-arrows.wd-pos-together:not(:where(.wd-custom-style)) {
	--wd-arrow-gap: 8px;
	--wd-arrow-size: 48px;
	--wd-arrow-icon-size: 16px;
	--wd-arrow-offset-h: 0px;
	--wd-arrow-offset-v: 0px;
	--wd-arrow-color: rgb(0,0,0);
	--wd-arrow-color-hover: rgb(0,0,0);
	--wd-arrow-color-dis: rgb(211,211,211);
	--wd-arrow-bg: rgb(255,255,255);
	--wd-arrow-radius: 300px;
	--wd-arrow-brd-color: rgb(212,212,212);
	--wd-arrow-brd-color-hover: rgb(212,212,212);
	--wd-arrow-brd-color-dis: rgb(229,229,229);
	--wd-arrow-brd: 1px solid;
}
.wd-nav-pagin-wrap:not(.wd-custom-style) {
	--wd-pagin-bg: rgb(255,255,255);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
.woocommerce-product-gallery {
	--wd-gallery-gap: 40px;
}

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

}
:root{
--wd-container-w: 1440px;
--wd-form-brd-radius: 5px;
--btn-default-brd-radius: 5px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-brd-radius: 5px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
--wd-brd-radius: 8px;
}

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


.wd-page-title {
background-color: rgb(255,255,255);
}

/* =========================================================
   LupiTools Global Layout — Container Inline Padding
   ========================================================= */

/* =========================================================
   1. Base Container Spacing
   ---------------------------------------------------------
   Overrides the default WoodMart container inline padding.
   This controls the left and right inner spacing for the
   global `.container` and `.container-fluid` wrappers.
   ========================================================= */

.container,
.container-fluid {
  padding-inline: 48px !important;
}

/* =========================================================
   2. Tablet
   ---------------------------------------------------------
   Reduces the global container spacing for tablet-sized
   viewports to keep content comfortably aligned without
   feeling too constrained.
   ========================================================= */

@media (max-width: 1024px) {
  .container,
  .container-fluid {
    padding-inline: 24px !important;
  }
}

/* =========================================================
   3. Mobile
   ---------------------------------------------------------
   Applies a tighter inline spacing on mobile so content
   remains readable and proportionate on smaller screens.
   ========================================================= */

@media (max-width: 767px) {
  .container,
  .container-fluid {
    padding-inline: 16px !important;
  }
}





/* =========================================================
   LupiTools Header —  WoodMart Search Suggestions — Overrides
   ========================================================= */

/* =========================================================
   1. Suggestions Grid
   ---------------------------------------------------------
   Forces search suggestion groups into a single column on
   all breakpoints.
   ========================================================= */

.wd-suggestions-group {
  grid-template-columns: 1fr !important;
}




/* =========================================================
   LupiTools Header — Login Drawer Overrides
   ========================================================= */

/* =========================================================
   1. Create Account Visual
   ---------------------------------------------------------
   Replaces the default WoodMart account icon with the
   custom LupiTools create account SVG.
   ========================================================= */

/* 1.1 Create Account Icon
   ---------------------------------------------------------
   Displays the custom create account visual above the
   create account CTA.
   --------------------------------------------------------- */

.login-form-side .create-account-question::before {
  content: "" !important;
  display: block;
  width: 80px;
  height: 80px;
  margin: 0 auto 15px;
  background-image: url("https://lupitools.com/wp-content/uploads/2026/04/cart-drawer-create-account-visual-80.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 80px 80px;
  font-family: initial !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}

/* 1.2 Create Account Text
   ---------------------------------------------------------
   Adjusts the supporting text above the create account CTA.
   --------------------------------------------------------- */

.login-form-side .create-account-question p {
  font-weight: 500;
  margin-bottom: 4px;
}

/* 1.3 Create Account Button
   ---------------------------------------------------------
   Adjusts the create account CTA color, border and typography.
   --------------------------------------------------------- */

.login-form-side .create-account-question .btn {
  --btn-color: #EA580C;
  --btn-color-hover: #EA580C;
  --btn-brd-color: #EA580C;
	--btn-brd-width: 1px;

  color: #EA580C;
  border-color: #EA580C;
  font-size: 14px;
  font-weight: 500;
}

















/* =========================================================
   LupiTools Header — Mini Cart Drawer Overrides
   ========================================================= */

/* =========================================================
   1. Empty State
   ---------------------------------------------------------
   Replaces the default WoodMart mini cart icon with the
   custom LupiTools empty cart SVG.
   ========================================================= */

/* 1.1 Empty Cart Icon
   ---------------------------------------------------------
   Displays the custom empty cart state icon.
   --------------------------------------------------------- */

.wd-empty-mini-cart:before {
  content: "" !important;
  display: block;
  width: 96px;
  height: 96px;
  margin: 0 auto 20px;
  background-image: url("https://lupitools.com/wp-content/uploads/2026/04/cart-empty-state-96.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 96px 96px;
  font-family: initial !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}

/* =========================================================
   2. Cart Item Layout
   ---------------------------------------------------------
   Adjusts the internal layout of each mini cart item:
   - Product title
   - SKU
   - Quantity selector
   - Line price
   ========================================================= */

/* 2.1 Cart Info Grid
   ---------------------------------------------------------
   Creates a two-column layout for quantity controls and
   line price on desktop.
   --------------------------------------------------------- */

@media (min-width: 1025px) {
  .cart-widget-side .woocommerce-mini-cart-item .cart-info {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 16px;
    row-gap: 8px;
  }

  .cart-widget-side .woocommerce-mini-cart-item .cart-info > .wd-entities-title,
  .cart-widget-side .woocommerce-mini-cart-item .cart-info > .wd-product-detail {
    grid-column: 1 / -1;
  }

  .cart-widget-side .woocommerce-mini-cart-item .cart-info > div.quantity {
    grid-column: 1;
    margin: 0;
  }

  .cart-widget-side .woocommerce-mini-cart-item .cart-info > span.quantity {
    grid-column: 2;
    justify-self: end;
		align-self: end;
    white-space: nowrap;
    margin: 0;
  }
}

/* 2.2 Product Title
   ---------------------------------------------------------
   Limits cart drawer product titles to a maximum of 2 lines.
   --------------------------------------------------------- */

.cart-widget-side .woocommerce-mini-cart-item .cart-info .wd-entities-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 2.3 Product Title Spacing
   ---------------------------------------------------------
   Neutralizes the default WoodMart margin below cart item
   product titles on desktop.
   --------------------------------------------------------- */

@media (min-width: 1025px) {
  .cart-widget-side .product_list_widget > li .wd-entities-title {
    margin-bottom: 0;
  }
}

/* 2.4 Cart Item Typography
   ---------------------------------------------------------
   Sets consistent typography for cart item title, SKU,
   quantity amount and line price.
   --------------------------------------------------------- */

.cart-widget-side .woocommerce-mini-cart-item .cart-info .wd-entities-title {
  font-size: 14px;
  font-weight: 500;
}

.cart-widget-side .woocommerce-mini-cart-item .cart-info .wd-product-detail.wd-product-sku,
.cart-widget-side .woocommerce-mini-cart-item .cart-info .wd-product-detail.wd-product-sku .wd-label,
.cart-widget-side .woocommerce-mini-cart-item .cart-info .wd-product-detail.wd-product-sku .wd-sku {
  font-size: 14px;
  font-weight: 500;
}

/* 2.5 Cart Item Quantity Summary
   ---------------------------------------------------------
   Styles the quantity summary below each cart item:
   - Quantity amount: regular
   - Line price: medium
   --------------------------------------------------------- */

.cart-widget-side .woocommerce-mini-cart-item .cart-info > span.quantity {
  font-size: 14px;
  font-weight: 400;
}

.cart-widget-side .woocommerce-mini-cart-item .cart-info > span.quantity .woocommerce-Price-amount.amount {
  font-size: 14px;
  font-weight: 500;
}

/* 2.6 Remove Button
   ---------------------------------------------------------
   Adjusts the default WoodMart remove icon size inside
   mini cart items.
   --------------------------------------------------------- */

.cart-widget-side .woocommerce-mini-cart .remove::after {
  font-size: 14px;
}

/* =========================================================
   3. Cart Drawer Prices
   ---------------------------------------------------------
   Controls all WooCommerce price amounts inside the
   WoodMart cart drawer.
   ========================================================= */

/* 3.1 Price Amounts
   ---------------------------------------------------------
   Sets cart drawer prices to the LupiTools text color and
   medium font weight.
   --------------------------------------------------------- */

.cart-widget-side .woocommerce-Price-amount.amount {
  color: #101010;
  font-weight: 500;
}

/* =========================================================
   4. Cart Drawer Footer
   ---------------------------------------------------------
   Controls subtotal label styling inside the WoodMart
   cart drawer footer.
   ========================================================= */

/* 4.1 Subtotal Label
   ---------------------------------------------------------
   Reduces the default bold weight of the subtotal label.
   --------------------------------------------------------- */

.cart-widget-side .shopping-cart-widget-footer .woocommerce-mini-cart__total.total strong {
  font-weight: 500;
}








/* =========================================================
   LupiTools Product Cards — Overrides
   ========================================================= */

/* =========================================================
   1. Product Thumbnail
   ---------------------------------------------------------
   Controls thumbnail-specific elements inside custom
   LupiTools product cards.
   ========================================================= */

/* 1.1 Grid Slider Pagination
   ---------------------------------------------------------
   Hides the default WoodMart product image slider pagination.
   --------------------------------------------------------- */

.lupi-product-card__thumbnail .wd-product-grid-slider-pagin {
  display: none !important;
}

/* =========================================================
   2. SKU
   ---------------------------------------------------------
   Controls the SKU row styling inside custom LupiTools
   product cards.
   ========================================================= */

/* 2.1 SKU Wrapper
   ---------------------------------------------------------
   Forces compact line-height for the full SKU wrapper.
   --------------------------------------------------------- */

.lupi-product-card__sku {
  line-height: 1 !important;
}

/* 2.2 SKU Label
   ---------------------------------------------------------
   Reduces the default WoodMart SKU label weight.
   --------------------------------------------------------- */

.lupi-product-card__sku .wd-label {
  font-weight: 500 !important;
}

/* =========================================================
   3. Product Title
   ---------------------------------------------------------
   Controls title spacing inside custom LupiTools product cards.
   ========================================================= */


.lupi-product-card__title,
.lupi-product-card__title a {
  line-height: 1.4em;
}

.lupi-product-card__title {
  min-height: calc(1.4em * 3);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 3.1 Title Wrapper
   ---------------------------------------------------------
   Adds spacing above the product title.
   --------------------------------------------------------- */

.lupi-product-card__title {
  margin-top: 4px;
}

/* 3.2 Title Truncation
   ---------------------------------------------------------
   Limits product titles to 3 lines and shows an ellipsis
   when the title overflows.
   --------------------------------------------------------- */

.lupi-product-card__title {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* =========================================================
   4. Product Stock Indicator
   ---------------------------------------------------------
   Controls spacing, typography and status indicator styling
   inside custom LupiTools product cards.
   ========================================================= */

/* 4.1 Stock Wrapper
   ---------------------------------------------------------
   Adds spacing above the stock indicator.
   --------------------------------------------------------- */

.lupi-product-card__stock {
  margin-top: 8px;
}

/* 4.2 Stock Label
   ---------------------------------------------------------
   Aligns the stock label with the custom status indicator.
   --------------------------------------------------------- */

.lupi-product-card__stock .wd-product-stock {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding-left: 24px;
  font-size: 16px;
  font-weight: 500;
  line-height: 16px;
  min-height: 16px;
}

/* 4.3 Stock Indicator Ring
   ---------------------------------------------------------
   Replaces the default WoodMart stock icon with a custom
   circular status ring.
   --------------------------------------------------------- */

.lupi-product-card__stock .wd-product-stock.wd-style-default::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border: 1px solid #E5E5E5;
  border-radius: 50%;
  box-sizing: border-box;
  margin: 0;
  font-size: 0;
  color: transparent;
  font-family: inherit;
}

/* 4.4 Stock Indicator Dot
   ---------------------------------------------------------
   Adds the inner status dot used for stock states.
   --------------------------------------------------------- */

.lupi-product-card__stock .wd-product-stock::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

/* 4.5 In Stock State
   ---------------------------------------------------------
   Defines the text and dot color for in-stock products.
   --------------------------------------------------------- */

.lupi-product-card__stock .wd-product-stock.in-stock {
  color: #052E16 !important;
}

.lupi-product-card__stock .wd-product-stock.in-stock::after {
  background-color: #22C55E !important;
}

/* 4.6 Out of Stock State
   ---------------------------------------------------------
   Defines the text and dot color for out-of-stock products.
   --------------------------------------------------------- */

.lupi-product-card__stock .wd-product-stock.out-of-stock {
  color: #450A0A !important;
}

.lupi-product-card__stock .wd-product-stock.out-of-stock::after {
  background-color: #DC2626 !important;
}

/* =========================================================
   5. Price
   ---------------------------------------------------------
   Controls price spacing inside custom LupiTools product cards.
   ========================================================= */

/* 5.1 Price Wrapper
   ---------------------------------------------------------
   Adds spacing above the product price.
   --------------------------------------------------------- */

.lupi-product-card__price {
  margin-top: 8px;
}

/* =========================================================
   6. Add to Cart
   ---------------------------------------------------------
   Controls spacing, quantity selector styling and the
   add-to-cart button icon inside custom LupiTools product cards.
   ========================================================= */

/* 6.1 Add to Cart Wrapper
   ---------------------------------------------------------
   Adds spacing above the add-to-cart area.
   --------------------------------------------------------- */

.lupi-product-card__cart {
  margin-top: 8px;
}

/* 6.2 Quantity Selector
   ---------------------------------------------------------
   Adjusts the plus/minus button typography.
   --------------------------------------------------------- */

.lupi-product-card__cart .quantity input.minus,
.lupi-product-card__cart .quantity input.plus {
  font-weight: 100;
  font-size: 16px;
}

/* 6.3 Add to Cart Icon
   ---------------------------------------------------------
   Replaces the default WoodMart icon font with the custom
   LupiTools cart SVG.
   --------------------------------------------------------- */

/* When .wd-add-btn-replace is inside the cart wrapper */
.lupi-product-card__cart .wd-add-btn-replace > a::before {
  content: "" !important;
  background-image: url("https://lupitools.com/wp-content/uploads/2026/04/cart-white-24.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  font-family: initial !important;
}

/* When .lupi-product-card__cart and .wd-add-btn-replace are on the same element */
.lupi-product-card__cart.wd-add-btn-replace > a::before {
  content: "" !important;
  background-image: url("https://lupitools.com/wp-content/uploads/2026/04/cart-white-24.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  font-family: initial !important;
}






/* =========================================================
   LupiTools Cart Overview — Tax Row Overrides
   ========================================================= */

/* =========================================================
   1. Adjacent Row Border Cleanup
   ---------------------------------------------------------
   Removes the border from the row directly above the VAT row.
   ========================================================= */

.cart_totals .shop_table tr:has(+ tr.tax-total) th,
.cart_totals .shop_table tr:has(+ tr.tax-total) td {
  border-bottom: 0 !important;
}

/* =========================================================
   2. Tax Row Container
   ---------------------------------------------------------
   Keeps the row itself transparent so cell border-radius
   remains visible.
   ========================================================= */

.cart_totals .shop_table tr.tax-total {
  background-color: transparent !important;
}

/* =========================================================
   3. Tax Row Cells
   ---------------------------------------------------------
   Styles the VAT row as a subtle highlighted block.
   ========================================================= */

.cart_totals .shop_table tr.tax-total th,
.cart_totals .shop_table tr.tax-total td {
  padding: 16px !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  background-color: #F5F5F5 !important;
}

.cart_totals .shop_table tr.tax-total th {
  border-radius: 8px 0 0 8px !important;
}

.cart_totals .shop_table tr.tax-total td {
  border-radius: 0 8px 8px 0 !important;
}

/* =========================================================
   4. Tax Label
   ---------------------------------------------------------
   Styles the VAT label.
   ========================================================= */

.cart_totals .shop_table tr.tax-total th {
  color: #101010 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-transform: none !important;
}

/* =========================================================
   5. Tax Amount
   ---------------------------------------------------------
   Styles the VAT amount.
   ========================================================= */

.cart_totals .shop_table tr.tax-total td,
.cart_totals .shop_table tr.tax-total .woocommerce-Price-amount.amount,
.cart_totals .shop_table tr.tax-total .woocommerce-Price-currencySymbol {
  color: #727272 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}


/* =========================================================
   LupiTools Checkout — Tax Row Overrides
   ========================================================= */

/* =========================================================
   1. Table Rendering
   ---------------------------------------------------------
   Allows the VAT row border-radius to render correctly inside
   the checkout order review table.
   ========================================================= */

.lupi-checkout-order-review .woocommerce-checkout-review-order-table {
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
}

/* =========================================================
   2. Adjacent Row Border Cleanup
   ---------------------------------------------------------
   Removes borders directly above and below the VAT row.
   ========================================================= */

/* Row directly above VAT */
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr:has(+ tr.tax-total),
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr:has(+ tr.tax-total) th,
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr:has(+ tr.tax-total) td {
  border-bottom: 0 !important;
}

/* Row directly below VAT */
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total + tr,
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total + tr th,
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total + tr td {
  border-top: 0 !important;
}

/* =========================================================
   3. Tax Row Container
   ---------------------------------------------------------
   Keeps the row itself transparent so cell border-radius
   remains visible.
   ========================================================= */

.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total {
  background-color: transparent !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* =========================================================
   4. Tax Row Cells
   ---------------------------------------------------------
   Styles the VAT row as a subtle highlighted block.
   ========================================================= */

.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total th,
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total td {
  padding: 16px !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  background-color: #F5F5F5 !important;
  box-shadow: none !important;
}

.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total th {
  border-radius: 8px 0 0 8px !important;
}

.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total td {
  border-radius: 0 8px 8px 0 !important;
}

/* =========================================================
   5. Tax Label
   ---------------------------------------------------------
   Styles the VAT label.
   ========================================================= */

.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total th {
  color: #101010 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-transform: none !important;
}

/* =========================================================
   6. Tax Amount
   ---------------------------------------------------------
   Styles the VAT amount.
   ========================================================= */

.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total td,
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total .woocommerce-Price-amount.amount,
.lupi-checkout-order-review .woocommerce-checkout-review-order-table tfoot tr.tax-total .woocommerce-Price-currencySymbol {
  color: #727272 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}





/* =========================================================
   LupiTools Contact Page — Contact Form 7 Overrides
   ========================================================= */

/* =========================================================
   1. Required Field Indicator
   ---------------------------------------------------------
   Styles the required field asterisk used in the Contact
   Form 7 form on the contact page.
   ========================================================= */

/* 1.1 Label Text Layout
   ---------------------------------------------------------
   Aligns the label text and required asterisk neatly on the
   same baseline with consistent spacing.
   --------------------------------------------------------- */

.wpcf7 .cf7-label-text {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
}

/* 1.2 Required Asterisk
   ---------------------------------------------------------
   Applies the LupiTools accent color and slightly stronger
   weight to the required field asterisk.
   --------------------------------------------------------- */

.wpcf7 .cf7-required {
  color: #FF760A;
  font-weight: 600;
  line-height: 1;
}








/* =========================================================
   LupiTools Wishlist — Empty State Overrides
   ========================================================= */

/* =========================================================
   1. Empty Wishlist Visual
   ---------------------------------------------------------
   Replaces the default WoodMart empty wishlist icon with the
   custom LupiTools wishlist empty state SVG.
   
   Applies to the wishlist empty state on both the wishlist
   page and the My Account dashboard wishlist section.
   ========================================================= */

/* 1.1 Empty Wishlist Icon
   ---------------------------------------------------------
   Displays the custom wishlist empty state visual above the
   empty wishlist title.
   --------------------------------------------------------- */

.wd-empty-wishlist .wd-empty-block-title::before {
  content: "" !important;
  display: block;
  width: 80px;
  height: 80px;
  margin: 0 auto 20px;
  background-image: url("https://lupitools.com/wp-content/uploads/2026/05/wishlist-empty-state-80.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 80px 80px;
  font-family: initial !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}










/* =========================================================
   LupiTools PDP — Tiered Price Table Overrides
   ========================================================= */

/* =========================================================
   1. Table Base
   ---------------------------------------------------------
   Resets default B2BKing table styling and controls base
   typography.
   ========================================================= */

form.cart table.b2bking_tiered_price_table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

form.cart table.b2bking_tiered_price_table th,
form.cart table.b2bking_tiered_price_table td {
  padding: 16px !important;
  background: transparent;
  background-color: transparent;
  font-size: 16px;
  font-family: "Poppins", Arial, Helvetica, sans-serif;
  font-weight: 500;
}

/* 1.1 Table Spacing
   ---------------------------------------------------------
   Removes the default top margin from the B2BKing tiered
   price table.
   --------------------------------------------------------- */

form.cart table.b2bking_tiered_price_table {
  margin-top: 0 !important;
}

/* =========================================================
   2. Table Header
   ---------------------------------------------------------
   Styles tiered price table headings.
   ========================================================= */

form.cart table.b2bking_tiered_price_table thead th {
  border-bottom: 1px solid #E6E6E6;
  color: #101010;
  text-transform: capitalize;
}

/* =========================================================
   3. Table Rows
   ---------------------------------------------------------
   Styles tiered price table body rows.
   ========================================================= */

form.cart table.b2bking_tiered_price_table tbody td {
  border-bottom: 1px solid #E6E6E6;
  color: #727272;
}

/* 3.1 Price Amounts
   ---------------------------------------------------------
   Keeps price values darker than regular row text.
   --------------------------------------------------------- */

form.cart table.b2bking_tiered_price_table tbody .woocommerce-Price-amount.amount,
form.cart table.b2bking_tiered_price_table tbody .woocommerce-Price-currencySymbol {
  color: #101010;
  font-size: 16px;
  font-weight: 500;
}

/* =========================================================
   4. Active Tier Row
   ---------------------------------------------------------
   Replaces B2BKing active tier blue background with the
   LupiTools orange and makes all row text white.
   ========================================================= */

form.cart table.b2bking_tiered_price_table tbody tr:has(td.b2bking_has_color) td {
  background: #FF760A !important;
  background-color: #FF760A !important;
  color: #FFFFFF !important;
}

form.cart table.b2bking_tiered_price_table tbody tr:has(td.b2bking_has_color) .woocommerce-Price-amount.amount,
form.cart table.b2bking_tiered_price_table tbody tr:has(td.b2bking_has_color) .woocommerce-Price-currencySymbol {
  color: #FFFFFF !important;
}@media (min-width: 1025px) {
	/* =========================================================
   LupiTools Header — Primary Header Overrides
   ========================================================= */


/* =========================================================
   LupiTools Header Mega Menu — Hover Bridge
   ========================================================= */

/* =========================================================
   1. Mega Dropdown Hover Bridge
   ---------------------------------------------------------
   Adds an invisible hover-safe area between the top-level
   menu item and the mega dropdown, preventing the dropdown
   from closing too early.
   ========================================================= */

#menu-header-menu-lupitools > .menu-item.menu-mega-dropdown {
  position: relative;
}

/* Invisible bridge below the menu item */
#menu-header-menu-lupitools > .menu-item.menu-mega-dropdown::after {
  content: "";
  position: absolute;
  left: -20px;
  right: -20px;
  top: 100%;
  height: 24px;
  background: transparent;
  pointer-events: auto;
  z-index: 999;
}

/* =========================================================
   1. Contact Methods
   ---------------------------------------------------------
   Shared styling for contact blocks such as:
   - Email
   - Phone
   ========================================================= */

/* Outer icon wrapper */
.contact-method .box-icon-wrapper.box-with-icon.box-icon-with-border {
    width: 2.5rem;
    height: 2.5rem;
    max-width: 2.5rem;
    max-height: 2.5rem;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Icon container */
.contact-method .info-box-icon {
    width: 2.5rem;
    height: 2.5rem;
    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Icon border */
.contact-method .box-icon-with-border .info-box-icon {
    border: 0.0625rem solid #D4D4D4 !important;
}

/* SVG wrapper inside icon container */
.contact-method .info-box-icon .info-svg-wrapper {
    width: 1.5rem !important;
    height: 1.5rem !important;
    flex: 0 0 1.5rem;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* Actual icon image */
.contact-method .info-box-icon .info-svg-wrapper img {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
}


/* =========================================================
   2. All Categories Button
   ---------------------------------------------------------
   Prevent custom icon from fading on hover.
   ========================================================= */

.wd-tools-custom-icon:hover .wd-custom-icon {
    opacity: 1 !important;
}


/* =========================================================
   3. Sticky Navigation
   ---------------------------------------------------------
   Desktop slide-in category drawer triggered by
   the All Categories button.
   ========================================================= */

@media (min-width: 1025px) {

    /* Remove reserved left spacing */
    .wd-sticky-nav-enabled {
        margin-left: 0 !important;
        --wd-sticky-nav-w: 0 !important;
    }

    /* Closed state */
    .wd-sticky-nav.wd-hide-md {
        position: fixed;
        inset-block: 0;
        left: 0;
        z-index: 393;
        display: flex !important;
        flex-direction: column;
        width: 275px !important;
        border-right: 1px solid rgba(118, 118, 118, 0.12);
        background-color: var(--bgcolor-white);

        transform: translateX(-100%) !important;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transition:
            transform 0.5s cubic-bezier(0.19, 1, 0.22, 1),
            opacity 0.3s ease,
            visibility 0s linear 0.5s !important;
    }

    /* Open or hover state */
    .wd-sticky-nav.wd-hide-md:is(:hover, .wd-opened) {
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;

        transition:
            transform 0.5s cubic-bezier(0.19, 1, 0.22, 1),
            opacity 0.3s ease !important;
    }
}

/* =========================================================
   Dropdown Inner Container
   ---------------------------------------------------------
   Removes the default WoodMart container inline padding
   inside sticky navigation mega dropdowns.
   ========================================================= */

.wd-sticky-nav .wd-dropdown-inner > .container.wd-entry-content {
  padding-inline: 0 !important;
}

/* =========================================================
   2. Sticky Navigation Chevron
   ---------------------------------------------------------
   Uses a chevron-right icon for dropdown items in the sticky
   vertical navigation.
   ========================================================= */

@media (min-width: 1025px) {
  #menu-sticky-navigation-lupitools > li:is(.wd-has-children, .menu-item-has-children) > a::after {
    content: "" !important;
    display: inline-block;
    order: 3;
    margin-inline-start: auto;
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    background-image: url("https://lupitools.com/wp-content/uploads/2026/04/chevron-right-black-16.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    font-size: 0 !important;
    line-height: 1;
  }
}




/* =========================================================
   LupiTools — Nav Chevron Custom Icon Override
   ========================================================= */

@media (min-width: 1025px) {
  #menu-header-menu-lupitools > li:is(.wd-has-children, .menu-item-has-children) > a::after {
    content: "" !important;
    display: inline-block;
    order: 3;
    margin-inline-start: 4px;
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    background-image: url("https://lupitools.com/wp-content/uploads/2026/04/chevron-down-black-16.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    font-size: 0 !important;
    line-height: 1;
  }
}







/* =========================================================
   LupiTools Header — Mini Cart Drawer Overrides
   ========================================================= */


/* =========================================================
   1. Cart Item Layout
   ---------------------------------------------------------
   Adjusts the internal layout of each mini cart item:
   - Product title
   - SKU
   - Quantity selector
   - Line price
   ========================================================= */

@media (min-width: 1025px) {
  .woocommerce-mini-cart-item .cart-info {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 16px;
    row-gap: 8px;
  }

  .woocommerce-mini-cart-item .cart-info > .wd-entities-title,
  .woocommerce-mini-cart-item .cart-info > .wd-product-detail {
    grid-column: 1 / -1;
  }

  .woocommerce-mini-cart-item .cart-info > div.quantity {
    grid-column: 1;
    margin: 0;
  }

  .woocommerce-mini-cart-item .cart-info > span.quantity {
    grid-column: 2;
    justify-self: end;
    white-space: nowrap;
    margin: 0;
  }
}







/* =========================================================
   LupiTools Checkout — Step Indicator Overrides
   ========================================================= */

/* =========================================================
   1. Base Typography
   ========================================================= */

.wd-checkout-steps {
  text-transform: none !important;
  font-size: 24px !important;
}

.wd-checkout-steps li > a,
.wd-checkout-steps li > span {
  text-transform: none !important;
}

.wd-checkout-steps .step-active > :is(a, span) {
  opacity: 1 !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-underline-offset: 0 !important;
}

/* =========================================================
   2. Inactive Step States
   ========================================================= */

.wd-checkout-steps li:not(.step-active) > :is(a, span) {
  opacity: 0.22 !important;
}

/* =========================================================
   3. Desktop Separators
   ========================================================= */

@media (min-width: 769px) {
  .wd-checkout-steps li:not(:last-child)::after {
    content: "" !important;
    display: inline-block !important;
    width: 24px !important;
    height: 24px !important;
    margin-inline: 16px !important;
    background-image: url("https://lupitools.com/wp-content/uploads/2026/04/chevron-black-right-24.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 24px 24px !important;
    font-family: initial !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    opacity: 1 !important;
    vertical-align: middle !important;
  }
	
	  .wd-checkout-steps li.step-inactive:not(:last-child)::after {
    opacity: 0.4 !important;
  }
}











}

@media (max-width: 576px) {
	/* =========================================================
   LupiTools — Sticky Toolbar Override
   ========================================================= */

.wd-toolbar {
  padding: 8px !important;
  max-height: 64px !important;
  box-shadow: none !important;
  border-top: 1px solid #D4D4D4 !important;
}







/* =========================================================
   LupiTools — Search Input Border Override
   ========================================================= */

form.searchform input.s,
.searchform input.s,
.woodmart-search-form input.s {
  border: none !important;
}
}

