/*
Theme Name: Flatsome Child Theme
Theme URI: http://flatsome.uxthemes.com/
Description: This is a child theme for Flatsome
Author: UX Themes
Author URI: http: //www.uxthemes.com/
Template: flatsome
Version: 2.6
*/


/* =========================================
   1. BACKGROUNDS & BASICS
   ========================================= */
.header-bg-image {
    background-size: cover;
}

/* =========================================
   2. GLOBAL BUTTON STYLE: PILLS EVERYWHERE
   ========================================= */
.button, 
button, 
input[type="submit"], 
input[type="reset"], 
input[type="button"] {
    border-radius: 99px !important; /* Forces the Pill Shape */
}
/* Stop Shouting: Allow Lowercase/Normal Text in Buttons */
.button, 
button, 
input[type="submit"], 
input[type="reset"], 
input[type="button"] {
    text-transform: none !important; 
}

/* =========================================
   3. EXCEPTIONS: KEEP THESE SQUARE (Boxy)
   ========================================= */
/* A. STANDARD WOOCOMMERCE BUTTONS */
.add_to_cart_button,               
.single_add_to_cart_button,        
.woocommerce-cart .button,         
.product-gallery .button,
.widget .button,                   
.widget_shopping_cart .button,     
.price_slider_amount .button {     
    border-radius: 4px !important; 
}
/* B. THE "BUY NOW" FIX */
.product-info .cart button,
.product-info .cart .button,
.product-summary .cart button,
.product-summary .cart .button,
.entry-summary .button,
.entry-summary button {
    border-radius: 4px !important; 
}
/* C. STRIPE / APPLE PAY / GOOGLE PAY */
#wc-stripe-payment-request-button,
.wc-stripe-cp-btn {
    border-radius: 4px !important;
}
/* D. SEARCH BAR */
.search-submit {
    border-radius: 0 99px 99px 0 !important; 
}

/* =========================================
   4. UNIFIED HEADER BUTTONS (Store, Donate, Cart, Account)
   ========================================= */
/* --- A. MASTER STRUCTURE --- */
.header-nav .shop-btn > a,
.header-nav .donate-btn > a,
.header-nav .cart-item > a,        
.header-nav .account-item > a { 
    display: inline-flex !important;
    align-items: center !important;     
    justify-content: center !important; 
    line-height: 1 !important;          
    margin-top: auto;
    margin-bottom: auto;
    border: none;
    border-radius: 99px !important;
    font-weight: 700;
    transition: all 0.3s ease;          
}

/* --- B. HOVER ANIMATIONS --- */
.header-nav .shop-btn > a:hover,
.header-nav .donate-btn > a:hover,
.header-nav .cart-item > a:hover,
.header-nav .account-item > a:hover {
    transform: translateY(-3px);            
    box-shadow: 0 6px 12px rgba(0,0,0,0.2); 
    opacity: 0.9;
}
.donate-btn > a:hover {
    filter: brightness(1.15);      
    opacity: 1 !important;
}

/* --- C. COLORS & SIZES --- */
.shop-btn > a,
.header-nav .cart-item > a,
.header-nav .account-item > a {
    background-color: var(--primary-color) !important; 
    color: white !important;
    height: 38px !important;            
    padding: 0 20px !important;  
}
.donate-btn > a {
    background-color: #702F4E !important; 
    color: white !important;
    height: 38px !important;
    padding: 0 25px !important;
    letter-spacing: 0.5px;
}

/* --- D. STICKY STATE --- */
.header-main.stuck .shop-btn > a,
.header-main.stuck .donate-btn > a,
.header-main.stuck .cart-item > a,
.header-main.stuck .account-item > a {
    height: 32px !important;            
    font-size: 13px !important;         
    padding: 0 15px !important;         
}

/* --- E. ICON FIXES --- */
.shop-btn > a i,
.cart-item > a i,
.account-item > a i {
    font-size: 16px !important;
    line-height: 1 !important;
    margin-bottom: 0 !important;
    position: relative;
    top: -1px; 
}
html:not([dir="rtl"]) .shop-btn > a i, 
html:not([dir="rtl"]) .cart-item > a i,
html:not([dir="rtl"]) .account-item > a i { margin-right: 8px !important; }

html[dir="rtl"] .shop-btn > a i, 
html[dir="rtl"] .cart-item > a i,
html[dir="rtl"] .account-item > a i { margin-left: 8px !important; margin-right: 0 !important; }

.header-main.stuck .shop-btn > a i,
.header-main.stuck .cart-item > a i,
.header-main.stuck .account-item > a i {
    font-size: 14px !important;
}

/* --- F. MOBILE DRAWER --- */
.off-canvas .shop-btn > a,
.off-canvas .donate-btn > a,
.off-canvas .cart-item > a,
.off-canvas .account-item > a {
    display: block !important;
    height: auto !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    margin: 10px 20px !important;
    text-align: center;
    background-color: var(--primary-color) !important;
    color: white !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.off-canvas .donate-btn > a { 
    background-color: #702F4E !important;
    box-shadow: 0 4px 10px rgba(112, 47, 78, 0.2); 
}

/* --- G. ACTIVE STATE --- */
.shop-btn.current-menu-item > a, 
.shop-btn.current_page_item > a,
.account-item.current-menu-item > a {
    background-color: var(--primary-color) !important;
    color: white !important;
    opacity: 1 !important;
}
.donate-btn.current-menu-item > a {
    background-color: #702F4E !important;
    color: white !important;
}

/* =========================================
   5. SHOP SIDEBAR STYLES
   ========================================= */
.widget_product_categories .current-cat > a {
    color: var(--primary-color) !important; 
    font-weight: 800 !important;            
    position: relative;
}
.widget_product_categories .current-cat > a:before {
    content: "►"; 
    font-size: 10px;
    margin-right: 5px; 
    opacity: 0.6;
}

/* =========================================
   6. GLOBAL SUB-MENU FIX
   ========================================= */
.header-nav .nav-dropdown {
    min-width: 260px !important;  
    width: auto !important;        
}
.header-nav .nav-dropdown > li > a {
    white-space: nowrap !important; 
    width: auto !important;
    font-size: 14px !important; 
    padding: 10px 20px !important; 
}

/* =========================================
   7. MASTER SPACING LOGIC
   ========================================= */
@media (min-width: 1501px) {
    .header-nav > li > a {
        padding-left: 15px !important;  
        padding-right: 15px !important;
        font-size: 15px !important;     
    }
    .header-nav .shop-btn > a,
    .header-nav .donate-btn > a,
    .header-nav .cart-item > a,
    .header-nav .account-item > a {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
}
@media (max-width: 1500px) {
    .header-nav > li > a {
        padding-left: 7px !important;   
        padding-right: 7px !important;
        font-size: 14px !important;     
    }
    .header-nav .shop-btn > a,
    .header-nav .donate-btn > a,
    .header-nav .cart-item > a,
    .header-nav .account-item > a {
        padding-left: 15px !important;
        padding-right: 15px !important;
        margin-left: 4px !important;    
        margin-right: 4px !important;
    }
    .header-logo img {
        max-height: 80px !important; 
        width: auto !important;
    }
}

/* =========================================
   8. STICKY LOGO SHRINK
   ========================================= */
.header-main.stuck .header-logo img {
    max-height: 40px !important;
    width: auto !important;
    transition: max-height 0.3s ease;
}

/* =========================================
   9. STORE DESIGN: "CARD" STYLE
   ========================================= */
.woocommerce ul.products li.product .col-inner {
    background-color: #ffffff;   
    border-radius: 12px;         
    box-shadow: 0 4px 12px rgba(0,0,0,0.05); 
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;            
    padding-bottom: 15px;        
    border: 1px solid rgba(0,0,0,0.03); 
}
.woocommerce ul.products li.product:hover .col-inner {
    transform: translateY(-5px); 
    box-shadow: 0 12px 24px rgba(0,0,0,0.12); 
}
.woocommerce ul.products li.product .box-image {
    margin-bottom: 15px !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #333;                  
    padding: 0 15px;              
    min-height: 2.4em;            
    line-height: 1.2;
}
.woocommerce ul.products li.product .price {
    color: var(--primary-color); 
    font-weight: 700;
    font-size: 1.1rem;
    display: block;
    margin-bottom: 15px;
    opacity: 0.9;
}
.woocommerce ul.products li.product .button {
    background-color: var(--primary-color); 
    color: white !important;
    border-radius: 4px !important; 
    padding: 8px 20px;
    font-weight: 700;
    font-size: 0.9rem;
    margin-bottom: 10px;
}
.woocommerce ul.products li.product .button:hover {
    background-color: #333;       
    box-shadow: none;             
}

/* =========================================
   10. QUICK VIEW & CATEGORIES
   ========================================= */
#product-quick-view .row, 
.product-quick-view .row,
.product-lightbox .row {
    display: flex !important;       
    align-items: center !important; 
    flex-wrap: wrap !important;     
}
#product-quick-view .col, 
.product-quick-view .col,
.product-lightbox .col {
    float: none !important;    
    display: block !important; 
    margin-bottom: 0 !important; 
}
#product-quick-view .product-info,
.product-quick-view .product-info {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}
@media (max-width: 849px) {
    #product-quick-view .row, 
    .product-quick-view .row {
        display: block !important; 
    }
}
/* Category Cards */
.product-category .col-inner .box,
.product-category .box {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    position: relative !important;
    min-height: 200px !important;
}
.product-category .box-image {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0 !important;
    border-radius: 12px !important;
    margin: 0 !important;
}
.product-category .box-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
.product-category .box-text {
    position: relative !important;
    z-index: 10 !important;
    width: 100% !important;
    height: 100% !important; 
    margin-top: 0 !important;
    padding: 20px !important;
    background: linear-gradient(to bottom, rgb(93, 131, 67) 0%, rgba(93, 131, 67, 0.8) 100%) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; 
    align-items: center !important;     
    text-align: center;
    border-radius: 12px !important;
}
.product-category .box-text h5 {
    color: white !important;
    font-family: "Noto Sans Hebrew", sans-serif !important; 
    text-transform: uppercase !important;
    font-weight: 700;
    font-size: 1.0rem;
    letter-spacing: 1px;
    line-height: 1.2;
    text-shadow: 0 1px 3px rgba(0,0,0,0.3);
    margin-top: 0 !important;
    margin-bottom: 6px !important; 
}
.product-category .count {
    color: white !important;
    opacity: 0.9;
    font-family: "Noto Sans Hebrew", sans-serif !important;
    font-weight: 400;
    font-size: 0.85rem;
    background: none !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
    margin-bottom: 0 !important; 
    margin-top: 0 !important;
}
.product-category .col-inner {
    background-color: #f0f0f0;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    overflow: hidden;
    height: 100%;
}
.product-category .col-inner:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.15);
}
@media (max-width: 849px) {
    .product-category .box-text h5 {
        font-size: 0.85rem !important;      
        line-height: 1.2 !important;        
        white-space: normal !important;     
        word-wrap: break-word !important;   
        margin: 0 !important;
        width: 100% !important;
        padding: 0 2px !important;
    }
    .product-category .box-text {
        padding: 5px !important;
        width: 100% !important;
        height: 100% !important;
        justify-content: center !important; 
        background: linear-gradient(to bottom, rgb(93, 131, 67) 0%, rgba(93, 131, 67, 0.85) 100%) !important;
    }
    .product-category .count {
        display: none !important; 
    }
    .product-category .col-inner,
    .product-category .box-image, 
    .product-category .box-text {
        border-radius: 6px !important;
    }
    .product-category .row {
        margin-left: -5px !important;
        margin-right: -5px !important;
        width: calc(100% + 10px) !important;
    }
    .product-category .col {
        padding: 4px !important;
    }
}

/* =========================================
   11. LANGUAGE SWITCHER
   ========================================= */
.header-wrapper li.wpml-ls-current-language,
.header-wrapper li.wpml-ls-item-legacy-dropdown-click.wpml-ls-current-language,
.header-wrapper .lang-item.current-lang {
    display: none !important;
}
.header-wrapper .lang-item,
.header-wrapper .wpml-ls-item {
    list-style: none !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 10px !important;      
}
.header-wrapper .lang-item img,
.header-wrapper .wpml-ls-flag {
    width: 26px !important;         
    height: 26px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 2px solid #ffffff !important; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
    transition: transform 0.2s ease;
    display: block !important;
}
.header-wrapper .lang-item a:hover img,
.header-wrapper .wpml-ls-item a:hover .wpml-ls-flag {
    transform: scale(1.15); 
    box-shadow: 0 4px 8px rgba(0,0,0,0.3) !important;
}
.header-wrapper .wpml-ls-native, 
.header-wrapper .wpml-ls-display, 
.header-wrapper .lang-item a span {
    display: none !important;
}
#footer .wpml-ls-item,
#footer .lang-item {
    display: inline-block !important; 
    margin-right: 5px !important;
}
#footer .wpml-ls-current-language {
    display: inline-block !important; 
    opacity: 0.6; 
}
#footer img,
#footer .wpml-ls-flag {
    border-radius: 0 !important;   
    border: none !important;        
    box-shadow: none !important;    
    width: auto !important;         
    height: auto !important;
}
/* =========================================
   12. CHECKOUT BUTTON (FLAT & ROUND)
   ========================================= */
#payment #place_order {
    border-radius: 99px !important; /* ✅ same pill shape */
    box-shadow: none !important;
    border: none !important;
    text-shadow: none !important;
    background-image: none !important;

    background-color: #33a932 !important; /* ✅ was RED now green like all other buttons */
    color: white !important;

    padding: 15px 40px !important;
    font-weight: 700 !important;
    font-size: 1.2rem !important;
    line-height: 1 !important;

    transition: background 0.25s ease-in-out, transform 0.2s ease !important;
}

/* Hover */
#payment #place_order:hover {
    background-color: #2a8829 !important; /* ✅ darker green was red hover */
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
}


/* =========================================
   13. HIDE "COMPANY NAME" FIELD
   ========================================= */
#billing_company_field,
#shipping_company_field {
    display: none !important;
}

/* =========================================
   14. [DELETED] - FIXES HEADER GAP ISSUE
   ========================================= */

/* =========================================
   15. THANK YOU PAGE (Final Polish)
   ========================================= */
.woocommerce-thankyou-order-received {
    display: block !important;
    text-align: center !important;
    line-height: 1.4 !important;
    margin-bottom: 30px !important;
}

/* Top Title (Green & Big) */
.ty-title {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--primary-color);
    display: block;
    margin-bottom: 10px;
}

/* Subtitle (Black & Normal) */
.ty-sub {
    font-size: 1.2rem;
    color: #333;
    font-weight: normal;
}

/* Footer Message */
.thank-you-footer-msg {
    text-align: center;
    font-size: 1.3rem;
    font-weight: 700;
    color: #333;
    margin-top: 40px;
    margin-bottom: 40px;
}

/* Order Box Styling */
ul.order_details {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0;
    padding: 20px;
    background: #f9f9f9;
    border-radius: 12px;
    list-style: none;
    margin-bottom: 40px;
}

ul.order_details li {
    border: none !important;
    margin: 0 !important;
    text-align: center;
    padding: 0 20px;
    border-left: 1px solid #ddd !important;
}

ul.order_details li:last-child {
    border-left: none !important;
}

ul.order_details strong {
    color: var(--primary-color);
    display: block;
    margin-top: 5px;
    font-size: 1.1rem;
}

/* Hide duplicate checkmarks */
.woocommerce-order-overview__status .icon-box {
    display: none !important;
}
/* =========================================
   17. HIGHLIGHT CHECKOUT COUPON TEXT
   ========================================= */

/* Target the overall box and text */
.woocommerce-form-coupon-toggle .woocommerce-info {
    color: var(--primary-color) !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;

    /* Steve changes below: align text + button */
    display: flex !important;
    align-items: center !important; /* ✅ FIX: Perfect vertical alignment */
    gap: 12px;
}

/* Target the clickable link specifically */
/* (This section is kept for your comment structure,
   but the button styling below overrides the text styles) */
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon {
    color: var(--primary-color) !important;
    font-weight: 800 !important;
    text-decoration: underline !important;
}

/* Optional: Make the text pulse slightly on hover so they know it's clickable */
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon:hover {
    opacity: 0.8;
}

/* Steve changes below */

/* Turn the coupon link into a button */
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon {
    display: inline-flex !important;
    align-items: center !important; /* ✅ centers icon + text */
    gap: 8px;

    background-color: #33a932; /* ✅ was RED now green BUTTON */
    color: #fff !important;

    padding: 10px 20px !important; /* ✅ matches input height */
    height: 45px !important;       /* ✅ exact height of coupon input */
    line-height: 1 !important;

    border-radius: 99px !important; /* ✅ same pill shape as other buttons */
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.2s ease-in-out;
}

/* Hover effect */
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon:hover {
    background-color: #2a8829 !important; /* ✅ darker green was red hover */
    opacity: 1 !important;
}

/* Add the coupon icon before the text */
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon::before {
    content: "🏷️";
    font-size: 1.1em;
}


/* =========================================
   18. CHECKOUT COUPON FORM (Input & Button)
   ========================================= */

/* The box that drops down */
form.checkout_coupon {
    border-radius: 12px !important;
    border: 1px solid #ddd !important;
    padding: 20px !important;
    background-color: #f9f9f9 !important;
    margin-bottom: 30px !important;
}

/* The text input field */
form.checkout_coupon .input-text {
    border-radius: 99px !important; /* ✅ matches buttons */
    border: 1px solid #ccc !important;
    padding: 10px 20px !important;
    height: 45px !important; /* ✅ same height as toggle */
    box-shadow: none !important;
    width: 100% !important;
}

/* The "Apply Coupon" Button — aligned correctly */
form.checkout_coupon .button {
    border-radius: 99px !important;
    background-color: #33a932 !important; /* ✅ was RED now green */
    color: white !important;

    padding: 0 30px !important;
    height: 45px !important;  /* ✅ matches input height */
    font-weight: 700 !important;
    text-transform: none !important;
    transition: all 0.3s ease !important;

    margin-top: 0 !important; /* ✅ FIX: button no longer too low */
    width: 100% !important;
}

form.checkout_coupon .button:hover {
    background-color: #2a8829 !important; /* ✅ darker green was red */
    transform: translateY(-2px);
}



/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 549px){
    
    /* FORCE Mobile Menu Styles */
    body .off-canvas .nav-vertical > li > a {
        text-transform: uppercase !important;
        font-size: 15px !important;
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    body .off-canvas .nav-vertical > li {
        border-bottom: 1px solid rgba(0,0,0,0.1);
    }

    body .off-canvas .nav-vertical .children li a {
        text-transform: none !important;
        padding-top: 12px !important;
        padding-bottom: 12px !important;
    }
}