.elementor-222 .elementor-element.elementor-element-985bd42{--display:flex;--min-height:40vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-222 .elementor-element.elementor-element-985bd42:not(.elementor-motion-effects-element-type-background), .elementor-222 .elementor-element.elementor-element-985bd42 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://himvedas.com/wp-content/uploads/2026/04/ChatGPT-Image-Apr-23-2026-09_03_27-PM.png");background-repeat:no-repeat;background-size:cover;}.elementor-222 .elementor-element.elementor-element-af9beea .woocommerce-breadcrumb{color:#FFFFFF;font-size:14px;text-align:center;}.elementor-222 .elementor-element.elementor-element-af9beea .woocommerce-breadcrumb > a{color:#EFEFEF;}.elementor-222 .elementor-element.elementor-element-f85a5e8{text-align:center;}.elementor-222 .elementor-element.elementor-element-f85a5e8 .elementor-heading-title{color:#FFFFFF;}.elementor-222 .elementor-element.elementor-element-e3c7c4f{margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:center;color:#FFFFFF;}.elementor-222 .elementor-element.elementor-element-787fffc0{--display:flex;--padding-top:48px;--padding-bottom:80px;--padding-left:20px;--padding-right:20px;}.elementor-222 .elementor-element.elementor-element-787fffc0:not(.elementor-motion-effects-element-type-background), .elementor-222 .elementor-element.elementor-element-787fffc0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-222 .elementor-element.elementor-element-74918ce.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-222 .elementor-element.elementor-element-74918ce.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-222 .elementor-element.elementor-element-347975fb{--display:flex;--padding-top:28px;--padding-bottom:28px;--padding-left:20px;--padding-right:20px;}.elementor-222 .elementor-element.elementor-element-347975fb:not(.elementor-motion-effects-element-type-background), .elementor-222 .elementor-element.elementor-element-347975fb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F8FBF5;}@media(min-width:1025px){.elementor-222 .elementor-element.elementor-element-985bd42:not(.elementor-motion-effects-element-type-background), .elementor-222 .elementor-element.elementor-element-985bd42 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}@media(max-width:1024px){.elementor-222 .elementor-element.elementor-element-74918ce.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-222 .elementor-element.elementor-element-74918ce.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for wc-archive-products, class: .elementor-element-74918ce *//* ============================================================
   HIMVEDA — WooCommerce Product Grid Custom CSS
   Paste in: Elementor > Site Settings > Custom CSS
   OR: Appearance > Customize > Additional CSS
   OR: WPCode > Add Snippet > CSS Snippet
   ============================================================ */

/* --- Google Fonts Import --- */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Poppins:wght@300;400;500;600&display=swap');

/* ============================================================
   1. PRODUCT GRID LAYOUT
   ============================================================ */

.woocommerce ul.products,
.woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    float: none !important;
    width: 100% !important;
}

/* 4 columns on large screens */
@media (min-width: 1200px) {
    .woocommerce ul.products.columns-4,
    .woocommerce-page ul.products.columns-4 {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* 2 columns on tablet */
@media (max-width: 900px) {
    .woocommerce ul.products,
    .woocommerce-page ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* 1 column on mobile */
@media (max-width: 540px) {
    .woocommerce ul.products,
    .woocommerce-page ul.products {
        grid-template-columns: 1fr !important;
    }
}

/* ============================================================
   2. PRODUCT CARD BASE
   ============================================================ */

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background: #FFFFFF !important;
    border: 1px solid #E8F0E3 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 14px rgba(30, 77, 7, 0.06) !important;
    transition: transform 0.35s ease, box-shadow 0.35s ease !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 16px 48px rgba(30, 77, 7, 0.15) !important;
}

/* ============================================================
   3. PRODUCT IMAGE AREA
   ============================================================ */

.woocommerce ul.products li.product a.woocommerce-loop-product__link,
.woocommerce-page ul.products li.product a.woocommerce-loop-product__link {
    display: block !important;
    text-decoration: none !important;
}

.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
    background: linear-gradient(135deg, #F0F7EB, #E8F5E0) !important;
    width: 100% !important;
    height: 240px !important;
    object-fit: contain !important;
    padding: 20px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    transition: transform 0.4s ease !important;
    display: block !important;
}

.woocommerce ul.products li.product:hover img,
.woocommerce-page ul.products li.product:hover img {
    transform: scale(1.05) !important;
}

/* Image wrapper overflow for zoom */
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce-page ul.products li.product .woocommerce-loop-product__link {
    overflow: hidden !important;
    border-radius: 18px 18px 0 0 !important;
}

/* ============================================================
   4. SALE BADGE
   ============================================================ */

.woocommerce ul.products li.product .onsale,
.woocommerce-page ul.products li.product .onsale {
    background: #1E4D07 !important;
    color: #FFFFFF !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    padding: 5px 14px !important;
    border-radius: 14px !important;
    top: 14px !important;
    left: 14px !important;
    right: auto !important;
    min-height: auto !important;
    min-width: auto !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

/* ============================================================
   5. PRODUCT CARD BODY (title, price, button area)
   ============================================================ */

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce-page ul.products li.product h2 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #111111 !important;
    margin: 0 0 8px !important;
    padding: 20px 20px 0 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
}

/* ============================================================
   6. PRICE STYLING
   ============================================================ */

.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1E4D07 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 20px 0 !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

/* Regular/sale price */
.woocommerce ul.products li.product .price ins,
.woocommerce-page ul.products li.product .price ins {
    text-decoration: none !important;
    font-weight: 700 !important;
    color: #1E4D07 !important;
}

/* Original crossed price */
.woocommerce ul.products li.product .price del,
.woocommerce-page ul.products li.product .price del {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #BBBBBB !important;
    opacity: 1 !important;
}

/* ============================================================
   7. ADD TO CART BUTTON
   ============================================================ */

.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button,
.woocommerce ul.products li.product a.button,
.woocommerce-page ul.products li.product a.button {
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #FFFFFF !important;
    background: #1E4D07 !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 11px 22px !important;
    margin: 16px 20px 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background 0.3s ease, transform 0.2s ease !important;
    width: calc(100% - 40px) !important;
    justify-content: center !important;
    letter-spacing: 0.2px !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce-page ul.products li.product .button:hover,
.woocommerce ul.products li.product a.button:hover,
.woocommerce-page ul.products li.product a.button:hover {
    background: #3A8A0E !important;
    color: #FFFFFF !important;
    transform: translateY(-1px) !important;
}

/* Added to cart state */
.woocommerce ul.products li.product a.added_to_cart,
.woocommerce-page ul.products li.product a.added_to_cart {
    font-family: 'Poppins', sans-serif !important;
    font-size: 12px !important;
    color: #1E4D07 !important;
    text-decoration: none !important;
    display: block !important;
    text-align: center !important;
    padding: 0 20px 4px !important;
    font-weight: 500 !important;
}

/* ============================================================
   8. STAR RATINGS
   ============================================================ */

.woocommerce ul.products li.product .star-rating,
.woocommerce-page ul.products li.product .star-rating {
    color: #F4A300 !important;
    font-size: 13px !important;
    margin: 8px 0 0 20px !important;
    float: none !important;
    display: block !important;
}

.woocommerce ul.products li.product .star-rating::before,
.woocommerce ul.products li.product .star-rating span::before {
    color: #F4A300 !important;
}

/* ============================================================
   9. CATEGORY TAG ABOVE TITLE
   (Requires WPCode snippet below to inject the tag)
   ============================================================ */

.hv-cat-tag {
    display: inline-block !important;
    background: rgba(30, 77, 7, 0.08) !important;
    color: #1E4D07 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    padding: 3px 12px !important;
    border-radius: 10px !important;
    margin: 16px 20px 0 !important;
    display: block !important;
    width: fit-content !important;
}

/* ============================================================
   10. WISHLIST BUTTON (if WooCommerce Wishlist plugin added)
   ============================================================ */

.woocommerce ul.products li.product .yith-wcwl-add-to-wishlist,
.woocommerce-page ul.products li.product .yith-wcwl-add-to-wishlist {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 2 !important;
}

.woocommerce ul.products li.product .yith-wcwl-add-button a,
.woocommerce-page ul.products li.product .yith-wcwl-add-button a {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(6px) !important;
    border: 1px solid rgba(30, 77, 7, 0.15) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important;
    transition: all 0.3s !important;
}

.woocommerce ul.products li.product .yith-wcwl-add-button a:hover {
    background: #1E4D07 !important;
}

/* ============================================================
   11. SHORT DESCRIPTION UNDER TITLE
   ============================================================ */

.woocommerce ul.products li.product .woocommerce-product-details__short-description,
.woocommerce-page ul.products li.product .woocommerce-product-details__short-description {
    font-family: 'Poppins', sans-serif !important;
    font-size: 12px !important;
    color: #777777 !important;
    line-height: 1.6 !important;
    padding: 6px 20px 0 !important;
    margin: 0 !important;
}

/* ============================================================
   12. PAGINATION
   ============================================================ */

.woocommerce nav.woocommerce-pagination ul {
    border: none !important;
    display: flex !important;
    gap: 8px !important;
    justify-content: center !important;
    margin-top: 48px !important;
}

.woocommerce nav.woocommerce-pagination ul li {
    border: none !important;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #1E4D07 !important;
    border: 1.5px solid #E0EDD8 !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s !important;
    padding: 0 !important;
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
    background: #1E4D07 !important;
    color: #FFFFFF !important;
    border-color: #1E4D07 !important;
}

/* ============================================================
   13. WOOCOMMERCE NOTICES & RESULT COUNT
   ============================================================ */

.woocommerce-result-count {
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px !important;
    color: #888888 !important;
}

.woocommerce-ordering select {
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px !important;
    color: #333333 !important;
    border: 1.5px solid #E0EDD8 !important;
    border-radius: 20px !important;
    padding: 8px 16px !important;
    outline: none !important;
    background: #FFFFFF !important;
}

/* ============================================================
   14. SINGLE PRODUCT PAGE — BASE STYLES
   ============================================================ */

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    color: #555 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #1E4D07 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    border-color: #1E4D07 !important;
}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    font-family: 'Poppins', sans-serif !important;
    border-radius: 25px !important;
}

/* Related products heading */
.woocommerce .related h2,
.woocommerce .upsells h2 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #111111 !important;
    margin-bottom: 28px !important;
}

/* ============================================================
   15. CART & CHECKOUT BUTTON OVERRIDES
   ============================================================ */

.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background: #1E4D07 !important;
    color: #FFFFFF !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    border-radius: 30px !important;
    padding: 14px 32px !important;
    transition: background 0.3s !important;
}

.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
    background: #3A8A0E !important;
}

/* ============================================================
   16. LOADING / AJAX SPINNER COLOUR
   ============================================================ */

.woocommerce .blockUI.blockOverlay::before,
.woocommerce .loader::before {
    border-top-color: #1E4D07 !important;
}/* End custom CSS */