.elementor-403 .elementor-element.elementor-element-8e261e9{--display:flex;--padding-top:100px;--padding-bottom:100px;--padding-left:40px;--padding-right:40px;}.elementor-403 .elementor-element.elementor-element-8e261e9:not(.elementor-motion-effects-element-type-background), .elementor-403 .elementor-element.elementor-element-8e261e9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://kamalherbs.com/wp-content/uploads/2026/09/ChatGPT-Image-Sep-21-2026-05_09_28-PM.png");}.elementor-403 .elementor-element.elementor-element-a765375 .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-403 .elementor-element.elementor-element-f69f09e{--display:flex;}.elementor-403 .elementor-element.elementor-element-6d84fd5.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-403 .elementor-element.elementor-element-6d84fd5.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1024px){.elementor-403 .elementor-element.elementor-element-6d84fd5.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-403 .elementor-element.elementor-element-6d84fd5.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for wc-archive-products, class: .elementor-element-6d84fd5 *//* =========================================================
   Kamal Herbs — Shop ARCHIVE page (data-elementor-type="product-archive")
   Widget: elementor-element-6d84fd5
   Wrapping section: elementor-element-f69f09e
   ========================================================= */

/* --- Green background section wrapper, 40px on all sides,
   matching the other Shop page treatment --- */
.elementor-element-f69f09e{
  position: relative;
  background-color: #f4f8f5 !important;
  background-image:
    radial-gradient(circle at 100% 0%, rgba(28,107,58,0.10), transparent 45%),
    radial-gradient(circle at 0% 100%, rgba(28,107,58,0.08), transparent 40%) !important;
  padding: 40px !important;
  overflow: hidden;
}
.elementor-element-f69f09e::before{
  content: "";
  position: absolute;
  top: -40px; right: -40px;
  width: 260px; height: 260px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c6b3a' stroke-width='0.6'%3E%3Cpath d='M12 2C7 6 4 10 4 14a8 8 0 0 0 16 0c0-4-3-8-8-12z'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.06;
  pointer-events: none;
  transform: rotate(15deg);
}
.elementor-element-f69f09e::after{
  content: "";
  position: absolute;
  bottom: -30px; left: -30px;
  width: 200px; height: 200px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c6b3a' stroke-width='0.6'%3E%3Cpath d='M12 2C7 6 4 10 4 14a8 8 0 0 0 16 0c0-4-3-8-8-12z'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.06;
  pointer-events: none;
  transform: rotate(-25deg);
}
.elementor-element-f69f09e .e-con-inner{
  position: relative;
  z-index: 2;
}

/* --- Result count + sort dropdown row --- */
.elementor-element-6d84fd5 .woocommerce-result-count{
  font-family: 'Poppins', sans-serif !important;
  color: #5c6b62 !important;
  font-size: 0.9rem !important;
  margin: 0 0 18px !important;
}
.elementor-element-6d84fd5 .woocommerce-ordering{
  margin: 0 0 28px !important;
}
.elementor-element-6d84fd5 .woocommerce-ordering select.orderby{
  font-family: 'Poppins', sans-serif !important;
  font-size: 0.88rem !important;
  color: #14251a !important;
  background: #ffffff !important;
  border: 1.5px solid #d9e2dc !important;
  border-radius: 30px !important;
  padding: 9px 18px !important;
  cursor: pointer;
}

/* --- Product grid --- */
.elementor-element-6d84fd5 ul.products{
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 22px !important;
  list-style: none !important;
}
.elementor-element-6d84fd5 ul.products li.product{
  position: relative;
  background: #ffffff !important;
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  transition: transform .25s ease, box-shadow .25s ease;
  padding: 0 !important;
  margin: 0 !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
}
.elementor-element-6d84fd5 ul.products li.product:hover{
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(0,0,0,0.12);
}

.elementor-element-6d84fd5 .woocommerce-loop-product__link{
  display: block; position: relative; width: 100%; overflow: hidden;
}
.elementor-element-6d84fd5 .woocommerce-loop-product__link img{
  width: 100% !important;
  aspect-ratio: 1 / 1;
  object-fit: cover !important;
  display: block;
  transition: transform .35s ease;
}
.elementor-element-6d84fd5 li.product:hover img{ transform: scale(1.05); }

.elementor-element-6d84fd5 .onsale{
  position: absolute !important;
  top: 14px !important; left: 14px !important; right: auto !important;
  z-index: 2;
  background: #e63946 !important;
  color: #fff !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  letter-spacing: .3px;
  padding: 5px 12px !important;
  border-radius: 20px !important;
  text-transform: uppercase;
  line-height: 1 !important;
  min-height: 0 !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.elementor-element-6d84fd5 .woocommerce-loop-product__title{
  font-size: .92rem !important;
  font-weight: 700 !important;
  color: #14251a !important;
  text-transform: uppercase;
  letter-spacing: normal !important;
  word-spacing: normal !important;
  margin: 16px 16px 6px !important;
  line-height: 1.4 !important;
  min-height: calc(1.4em * 2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.elementor-element-6d84fd5 li.product .price{
  display: block !important;
  margin: 0 16px 14px !important;
  font-weight: 700;
  font-size: 1rem;
  color: #14251a !important;
}
.elementor-element-6d84fd5 li.product .price del{
  color: #b5b5b5 !important;
  font-weight: 400 !important;
  margin-right: 8px;
  text-decoration: line-through;
}
.elementor-element-6d84fd5 li.product .price ins{ text-decoration: none; }
.elementor-element-6d84fd5 li.product .price ins .amount{ color: #14251a !important; }

.elementor-element-6d84fd5 li.product > a.button,
.elementor-element-6d84fd5 li.product > a.add_to_cart_button{
  display: block !important;
  margin: auto 16px 18px !important;
  background: #ffffff !important;
  color: #14251a !important;
  border: 1.5px solid #14251a !important;
  border-radius: 4px !important;
  padding: 11px 16px !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .5px;
  text-decoration: none !important;
  transition: background .2s ease, color .2s ease;
  text-align: center;
}
.elementor-element-6d84fd5 li.product > a.button:hover,
.elementor-element-6d84fd5 li.product > a.add_to_cart_button:hover{
  background: #14251a !important;
  color: #fff !important;
}

/* --- "View cart" link (appears after a successful AJAX add) — was
   completely unstyled, letting it render with zero containment.
   Also replacing WooCommerce's icon-FONT checkmark (which shows a
   garbled fallback character if that font fails to load) with a
   robust SVG mask instead. --- */
.elementor-element-6d84fd5 li.product > a.added_to_cart.wc-forward{
  display: block !important;
  margin: 8px 16px 16px !important;
  padding: 0 !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  color: #1c6b3a !important;
  text-decoration: none !important;
  text-align: center;
}
.elementor-element-6d84fd5 li.product > a.added_to_cart.wc-forward:hover{
  text-decoration: underline !important;
}

.elementor-element-6d84fd5 li.product .button.added::after{
  content: "" !important;
  font-family: inherit !important;
  display: inline-block;
  width: 14px; height: 14px;
  flex-shrink: 0;
  margin-left: 6px;
  background-color: #14251a;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.elementor-element-6d84fd5 li.product .button.added:hover::after{
  background-color: #ffffff;
}

/* --- Pagination --- */
.elementor-element-6d84fd5 .woocommerce-pagination{
  margin-top: 40px !important;
}
.elementor-element-6d84fd5 .woocommerce-pagination ul.page-numbers{
  display: flex !important;
  justify-content: center !important;
  gap: 10px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.elementor-element-6d84fd5 .page-numbers li{ display: inline-block; }
.elementor-element-6d84fd5 .page-numbers .page-numbers{
  display: flex !important;
  align-items: center; justify-content: center;
  width: 40px; height: 40px;
  border-radius: 50% !important;
  background: #ffffff !important;
  color: #14251a !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
  border: 1.5px solid #d9e2dc !important;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.elementor-element-6d84fd5 .page-numbers .page-numbers:hover{
  background: #1c6b3a !important;
  color: #fff !important;
  border-color: #1c6b3a !important;
}
.elementor-element-6d84fd5 .page-numbers .page-numbers.current{
  background: linear-gradient(180deg, #f4cc2f, #e0a900) !important;
  color: #1a1406 !important;
  border-color: transparent !important;
}

/* ===== Responsive ===== */
@media (max-width: 980px){
  .elementor-element-6d84fd5 ul.products{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 18px !important;
  }
}
@media (max-width: 600px){
  .elementor-element-f69f09e{ padding: 20px !important; }
  .elementor-element-6d84fd5 .woocommerce-loop-product__title{
    font-size: .8rem !important;
    margin: 12px 12px 6px !important;
  }
  .elementor-element-6d84fd5 li.product .price{
    font-size: .9rem !important;
    margin: 0 12px 12px !important;
  }
  .elementor-element-6d84fd5 li.product > a.button,
  .elementor-element-6d84fd5 li.product > a.add_to_cart_button{
    margin: auto 12px 14px !important;
    padding: 9px 14px !important;
    font-size: .72rem !important;
  }
  .elementor-element-6d84fd5 li.product > a.added_to_cart.wc-forward{
    margin: 6px 12px 12px !important;
    font-size: .75rem !important;
  }
}/* End custom CSS */