
         :root {  
            --hovercolor: #FE5722; 
            --bg_dark: ; 
            --font-weight: 600;  
			
        }body{
            font-family: "Open Sans", sans-serif;
            font-size: 14px;
            color: #666666;
        }.pos_title h2,.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{
            font-family: "Open Sans", sans-serif;
            color: #253237;
            text-transform: capitalize;
			font-weight: 600;
        }.pos_title h2{
            font-size: 24px;
        }.pos-title{
            font-family: "Open Sans", sans-serif;
        }.pos-title-column h4{   
            font-size: 20px;
        }#header .sticky-inner.scroll-menu{  
            background-color: #ffffff;   
        }.js-product-miniature .product_desc .product_name{
            color: #253237;
            font-size: 14px;
            text-transform: none;
        }.js-product-miniature .product_desc .product_name:hover{
            color: #4fb68d;
        }.product-price-and-shipping .price{
            color:#555555;
            font-size: 15px;
        }.h1.namne_details, .product_name_h1{
            color: #253237;
            font-size: 24px;
            text-transform: none;
        }.product-prices .price, .product-prices .current-price span:first-child{
            color:#555555;
            font-size: 22px;
        }#product.showcase-body #header,.showcase-inner,#product.showcase-body .page-title-wrapper{
            background-color: ;
        }/* =========================================================
   NEPALL / ECOLIFE
   CLEAN PREMIUM CUSTOM CSS
   =========================================================

   Main Colors
   Blue   #0d85f7
   Orange #fd541e
   Green  #005b05
   Dark   #26343d

   ========================================================= */


/* =========================================================
   1. HEADER BASE
   ========================================================= */

body #header .elementor-4010000 .elementor-element.elementor-element-hqmntjt[data-id="hqmntjt"] {
    background: #ffffff !important;
}

body #header .elementor-4010000 .elementor-element.elementor-element-hqmntjt[data-id="hqmntjt"] a {
    color: #222222 !important;
}

#header .elementor-element-hqmntjt {
    padding: 25px 25px 25px 20px !important;
}


/* =========================================================
   2. BLUE SEARCH SECTION
   ========================================================= */

#header .elementor-element-nianpep,
.elementor-4010000 .elementor-element.elementor-element-nianpep {
    background: #2196f3 !important;
}

#header .elementor-element-nianpep {
    padding: 15px !important;
}


/* =========================================================
   3. VERTICAL CATEGORY HEADER
   ========================================================= */

.elementor-4010000
.elementor-element.elementor-element-guphsox
.pos-menu-vertical
.title_vertical {
    fill: #253237 !important;
    color: #ffffff !important;
    background: #fe5722 !important;
}


/* =========================================================
   4. STICKY HEADER
   ========================================================= */

#header.use-sticky
.elementor-element-ynroewy
li.home.menu-item.active > a {
    background: transparent !important;
    background-color: transparent !important;
    color: #000000 !important;
}

#header.use-sticky
.elementor-element-ynroewy
.pos-menu-horizontal
ul.menu-content
> li.menu-item.active > a,

#header.use-sticky
.elementor-element-ynroewy
.pos-menu-horizontal
ul.menu-content
> li.menu-item:hover > a,

#header.use-sticky
.elementor-element-ynroewy
.pos-menu-horizontal
ul.menu-content
> li.menu-item.active:hover > a {
    background: #2196f3 !important;
    background-color: #2196f3 !important;
    color: #ffffff !important;
    border-color: transparent !important;
}


/* =========================================================
   5. HIDE DEFAULT ANNOUNCEMENT
   ========================================================= */

.nn-announce {
    display: none !important;
}


/* =========================================================
   6. PREMIUM TOP GREEN BAR — FIXED
   ========================================================= */

#header .elementor-element.elementor-element-hctgrcr,
#header .elementor-element-hctgrcr[data-id="hctgrcr"] {
    background: #005b05 !important;
    background-color: #005b05 !important;
    min-height: 42px !important;
    height: 42px !important;
    position: relative !important;
    z-index: 10000 !important;
    overflow: visible !important;
    border: 0 !important;
}

#header .elementor-element-hctgrcr > .elementor-container {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    height: 42px !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 0 18px !important;
    box-sizing: border-box !important;
    background: transparent !important;
}

/* =========================================================
   7. TOP BAR COLUMNS
   ========================================================= */

#header .elementor-element-hctgrcr .elementor-column {
    display: flex !important;
    align-items: center !important;
    min-height: 42px !important;
    background: transparent !important;
}

#header .elementor-element-hctgrcr .elementor-container > .elementor-column:first-child {
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

#header .elementor-element-hctgrcr .elementor-container > .elementor-column:not(:first-child) {
    flex: 0 0 auto !important;
    margin-left: auto !important;
}

/* =========================================================
   8. TOP BAR DELIVERY MESSAGE
   ========================================================= */

#header .elementor-element-hctgrcr .elementor-widget-text-editor,
#header .elementor-element-hctgrcr .elementor-widget-text-editor p {
    margin: 0 !important;
    padding: 0 !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow: visible !important;
    background: transparent !important;
}

#header .elementor-element-hctgrcr .elementor-widget-text-editor {
    width: auto !important;
    max-width: 100% !important;
}

/* =========================================================
   9. TOP BAR ACCOUNT AREA
   ========================================================= */

#header .elementor-element-hctgrcr .pos-account {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin-left: 25px !important;
    padding: 0 !important;
    white-space: nowrap !important;
    background: transparent !important;
}

/* =========================================================
   10. TOP BAR ACCOUNT LINKS
   ========================================================= */

#header .elementor-element-hctgrcr .pos-account > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 15px !important;
    margin: 0 !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    line-height: 1 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

/* =========================================================
   11. SIGN IN
   ========================================================= */

#header .elementor-element-hctgrcr .pos-account > a.account-login {
    color: #ffffff !important;
    background: rgba(255,255,255,.06) !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    box-shadow: none !important;
}

#header .elementor-element-hctgrcr .pos-account > a.account-login:hover,
#header .elementor-element-hctgrcr .pos-account > a.account-login:focus {
    color: #ffffff !important;
    background: rgba(255,255,255,.16) !important;
    border-color: rgba(255,255,255,.75) !important;
    box-shadow: 0 3px 10px rgba(0,0,0,.18) !important;
    transform: translateY(-1px) !important;
}

/* =========================================================
   12. CUSTOMER SIGNUP
   ========================================================= */

#header .elementor-element-hctgrcr .pos-account > a.kbb2b-customer-signup-link {
    color: #ffffff !important;
    background: #8bc62a !important;
    border: 1px solid #8bc62a !important;
    box-shadow: 0 2px 7px rgba(0,0,0,.14) !important;
}

#header .elementor-element-hctgrcr .pos-account > a.kbb2b-customer-signup-link:hover,
#header .elementor-element-hctgrcr .pos-account > a.kbb2b-customer-signup-link:focus {
    color: #ffffff !important;
    background: #76ad20 !important;
    border-color: #76ad20 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.20) !important;
    transform: translateY(-1px) !important;
}

/* =========================================================
   13. BUSINESS ACCOUNT SIGNUP
   ========================================================= */

#header .elementor-element-hctgrcr .pos-account > a.kbb2b-signup-link {
    color: #26343d !important;
    background: #ffffff !important;
    border: 1px solid #ffffff !important;
    box-shadow: 0 2px 7px rgba(0,0,0,.14) !important;
}

/* Dark green hover — removes white hover background */
#header .elementor-element-hctgrcr .pos-account > a.kbb2b-signup-link:hover,
#header .elementor-element-hctgrcr .pos-account > a.kbb2b-signup-link:focus {
    color: #ffffff !important;
    background: #064a08 !important;
    border-color: #8bc62a !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.22) !important;
    transform: translateY(-1px) !important;
}

#header .elementor-element-hctgrcr .pos-account > a.kbb2b-signup-link:hover i,
#header .elementor-element-hctgrcr .pos-account > a.kbb2b-signup-link:hover .material-icons {
    color: #ffffff !important;
}

/* =========================================================
   14. TOP BAR ICONS
   ========================================================= */

#header .elementor-element-hctgrcr .pos-account .material-icons,
#header .elementor-element-hctgrcr .pos-account i {
    font-size: 16px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}

/* =========================================================
   15. TOP BAR BUTTON FONT + BACKGROUND PROTECTION
   ========================================================= */

#header .elementor-element-hctgrcr .pos-account > a span {
    white-space: nowrap !important;
}

#header .elementor-element-hctgrcr:hover,
#header .elementor-element-hctgrcr:focus,
#header .elementor-element-hctgrcr.elementor-sticky--effects {
    background: #005b05 !important;
    background-color: #005b05 !important;
}

#header .elementor-element-hctgrcr .elementor-container,
#header .elementor-element-hctgrcr .elementor-column,
#header .elementor-element-hctgrcr .elementor-widget-wrap {
    background: transparent !important;
}


/* =========================================================
   16. MAIN NAVIGATION
   ========================================================= */

.pos-menu-horizontal {
    position: relative !important;

    z-index: 1000 !important;

    white-space: nowrap !important;

    overflow: visible !important;
}


/* Navigation list */

.pos-menu-horizontal ul.menu-content {
    display: flex !important;

    flex-direction: row !important;

    flex-wrap: nowrap !important;

    align-items: center !important;

    width: max-content !important;

    max-width: none !important;

    white-space: nowrap !important;

    margin: 0 !important;
}


/* =========================================================
   17. MAIN MENU ITEMS
   ========================================================= */

.pos-menu-horizontal
ul.menu-content
> li {
    display: flex !important;

    flex: 0 0 auto !important;

    float: none !important;

    position: relative !important;

    margin: 0 2px 0 0 !important;

    padding: 0 !important;

    white-space: nowrap !important;
}


/* Remove final spacing */

.pos-menu-horizontal
ul.menu-content
> li:last-child {
    margin-right: 0 !important;
}


/* =========================================================
   18. LOGO → HOME SPACING
   ========================================================= */

/*
   IMPORTANT:
   Only the FIRST menu item gets the large gap.
   This prevents the logo from touching HOME
   while keeping the other menu items compact.
*/

@media (min-width: 1200px) {

    .pos-menu-horizontal
    ul.menu-content
    > li:first-child {
        margin-left: 42px !important;
    }

}


/* =========================================================
   19. MAIN MENU LINKS
   ========================================================= */

.pos-menu-horizontal
ul.menu-content
> li
> a {
    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    white-space: nowrap !important;

    padding: 0 4px !important;

    font-size: 14px !important;

    font-weight: 500 !important;

    line-height: 1.2 !important;

    color: #222222 !important;

    transition:
        color .2s ease,
        background-color .2s ease !important;
}


/* =========================================================
   20. HOME BUTTON
   ========================================================= */

.pos-menu-horizontal
ul.menu-content
> li.active
> a,

.pos-menu-horizontal
ul.menu-content
> li.current
> a,

.pos-menu-horizontal
ul.menu-content
> li.current-menu-item
> a,

.pos-menu-horizontal
ul.menu-content
> li.current_page_item
> a {
    background: #0d85f7 !important;

    color: #ffffff !important;

    padding-left: 17px !important;

    padding-right: 17px !important;

    min-height: 54px !important;

    border-radius: 7px !important;
}


/* =========================================================
   21. MENU HOVER
   ========================================================= */

.pos-menu-horizontal
ul.menu-content
> li:hover
> a {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;
    color: #ffffff !important;
    border-radius: 7px !important;
}


/* =========================================================
   22. COMMUNITY MENU
   ========================================================= */

.pos-menu-horizontal
ul.menu-content
> li.menu-item8 {
    display: flex !important;

    flex: 0 0 auto !important;

    position: relative !important;

    z-index: 9999 !important;

    white-space: nowrap !important;
}

.pos-menu-horizontal
ul.menu-content
> li.menu-item8
> a {
    white-space: nowrap !important;
}


/* =========================================================
   23. COMMUNITY DROPDOWN — PREMIUM
   ========================================================= */

.pos-sub-menu-dropdown.kbn-community-drop {
    width: 235px !important;

    min-width: 235px !important;

    max-width: 235px !important;

    margin-top: 4px !important;

    padding: 7px 0 !important;

    background: #ffffff !important;

    border: 1px solid #edf0f3 !important;

    border-radius: 8px !important;

    box-shadow:
        0 12px 35px rgba(20,35,50,.13) !important;

    overflow: hidden !important;

    z-index: 99999 !important;
}


/* Dropdown items */

.kbn-community-drop
.submenu-item {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;
}


/* Dropdown links */

.kbn-community-drop
.submenu-item
> a {
    display: flex !important;

    align-items: center !important;

    width: 100% !important;

    min-height: 40px !important;

    padding: 9px 18px !important;

    box-sizing: border-box !important;

    font-size: 13px !important;

    font-weight: 400 !important;

    line-height: 1.3 !important;

    color: #26343d !important;

    background: #ffffff !important;

    text-decoration: none !important;

    text-transform: none !important;

    transition:
        color .2s ease,
        background-color .2s ease,
        padding-left .2s ease !important;
}


/* Dropdown hover */

.kbn-community-drop
.submenu-item
> a:hover {
    color: #0d85f7 !important;

    background: #f5f9ff !important;

    padding-left: 22px !important;
}


/* Active dropdown item */

.kbn-community-drop
.submenu-item.active
> a {
    color: #0d85f7 !important;

    background: #f5f9ff !important;
}


/* Dropdown stacking */

.pos-menu-horizontal
ul.menu-content
> li:hover
.pos-sub-menu-dropdown,

.pos-menu-horizontal
ul.menu-content
> li:hover
> .pos-sub-menu {
    z-index: 99999 !important;
}


/* =========================================================
   24. SEARCH / CATEGORY SECTION
   ========================================================= */

.pos-search,
.search-row,
.header-search-row {
    display: flex !important;

    align-items: center !important;

    gap: 14px !important;
}


/* =========================================================
   25. CATEGORY MENU — PREMIUM
   ========================================================= */

.pos-categories,
.all-categories {
    width: 300px !important;

    max-width: 300px !important;

    position: relative !important;

    z-index: 9999 !important;
}


/* Category title */

.pos-categories .category-title,
.pos-categories .cat-title,
.all-categories .category-title,
.all-categories > a,
.category-title {
    height: 58px !important;

    min-height: 58px !important;

    display: flex !important;

    align-items: center !important;

    background: #fd541e !important;

    color: #ffffff !important;

    padding: 0 22px !important;

    border-radius: 8px 8px 0 0 !important;

    font-size: 16px !important;

    font-weight: 600 !important;

    box-sizing: border-box !important;
}


/* Category header hover */

.pos-categories .category-title:hover,
.all-categories .category-title:hover,
.category-title:hover {
    background: #e94717 !important;
}


/* Hamburger */

.pos-categories .category-title i,
.pos-categories .category-title .icon,
.all-categories .category-title i {
    font-size: 20px !important;

    margin-right: 14px !important;
}


/* =========================================================
   26. CATEGORY DROPDOWN PANEL
   ========================================================= */

.pos-categories .category-content,
.pos-categories .categories-menu,
.pos-categories .category-menu,
.all-categories .category-content,
.all-categories .categories-menu {
    width: 300px !important;

    max-width: 300px !important;

    background: #ffffff !important;

    border: 1px solid #e9edf1 !important;

    border-top: 0 !important;

    border-radius: 0 0 8px 8px !important;

    box-shadow:
        0 10px 30px rgba(20,35,50,.10) !important;

    overflow: hidden !important;
}


/* =========================================================
   27. CATEGORY LIST
   ========================================================= */

.pos-categories ul,
.all-categories ul {
    margin: 0 !important;

    padding: 0 !important;

    list-style: none !important;
}


/* Category item */

.pos-categories li,
.all-categories li {
    margin: 0 !important;

    padding: 0 !important;

    border-bottom: 1px solid #edf0f2 !important;

    background: #ffffff !important;
}


/* Last item */

.pos-categories li:last-child,
.all-categories li:last-child {
    border-bottom: 0 !important;
}


/* =========================================================
   28. CATEGORY LINKS
   ========================================================= */

.pos-categories li > a,
.all-categories li > a {
    min-height: 52px !important;

    height: 52px !important;

    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    padding: 0 18px !important;

    color: #26343d !important;

    background: #ffffff !important;

    font-size: 15px !important;

    font-weight: 400 !important;

    line-height: 1.2 !important;

    text-decoration: none !important;

    transition:
        color .2s ease,
        background-color .2s ease,
        padding-left .2s ease !important;

    box-sizing: border-box !important;
}


/* Category hover */

.pos-categories li > a:hover,
.all-categories li > a:hover {
    color: #087a18 !important;

    background: #f5faf6 !important;

    padding-left: 22px !important;
}


/* Category arrows */

.pos-categories li > a .arrow,
.pos-categories li > a i,
.all-categories li > a .arrow,
.all-categories li > a i {
    color: #7c8790 !important;

    font-size: 13px !important;
}


/* =========================================================
   29. SEARCH WRAPPER
   ========================================================= */

.search-widget,
.header-search {
    flex: 1 1 auto !important;

    min-width: 0 !important;
}


/* =========================================================
   30. SEARCH INPUT
   ========================================================= */

.search-widget input,
.header-search input {
    height: 58px !important;

    border: 0 !important;

    background: #ffffff !important;

    border-radius: 8px !important;

    padding: 0 20px !important;

    font-size: 15px !important;

    color: #26343d !important;

    box-shadow: none !important;

    outline: none !important;
}


/* Placeholder */

.search-widget input::placeholder,
.header-search input::placeholder {
    color: #89939b !important;
}


/* =========================================================
   31. SEARCH BUTTON
   ========================================================= */

.search-widget button,
.header-search button,
.pos-search__submit {
    height: 58px !important;

    width: 78px !important;

    background: #fd541e !important;

    border: 0 !important;

    border-color: #fd541e !important;

    border-radius: 0 8px 8px 0 !important;

    color: #ffffff !important;
}


/* Search hover */

.search-widget button:hover,
.header-search button:hover,
.pos-search__submit:hover {
    background: #e94717 !important;

    border-color: #e94717 !important;
}


/* =========================================================
   32. SEARCH SECTION BLUE BORDER
   ========================================================= */

.search-widget,
.header-search {
    border-color: #0d85f7 !important;
}


/* =========================================================
   33. CATEGORY ORANGE
   ========================================================= */

.pos-categories,
.all-categories {
    background: transparent !important;
}


/* =========================================================
   34. BADGES
   ========================================================= */

.compare-top-count,
.wishlist-top-count,
.cart-products-count,
.header-cart .count,
.cart-products-count,
.wishlist-count,
.compare-count {
    background: #fd541e !important;

    color: #ffffff !important;
}


/* =========================================================
   35. NAVIGATION VISIBILITY
   ========================================================= */

.pos-menu-horizontal,
.pos-menu-horizontal ul,
.pos-menu-horizontal ul.menu-content,
.pos-menu-horizontal ul.menu-content > li {
    visibility: visible !important;
}


/* =========================================================
   36. LARGE DESKTOP
   ========================================================= */

@media (min-width: 1200px) {

    /* Logo → Home */

    .pos-menu-horizontal
    ul.menu-content
    > li:first-child {
        margin-left: 42px !important;
    }


    /* Compact menu spacing */

    .pos-menu-horizontal
    ul.menu-content
    > li {
        margin-right: 2px !important;
    }


    /* Menu font */

    .pos-menu-horizontal
    ul.menu-content
    > li
    > a {
        font-size: 14px !important;

        padding-left: 4px !important;

        padding-right: 4px !important;
    }


    /* Home */

    .pos-menu-horizontal
    ul.menu-content
    > li.active
    > a,

    .pos-menu-horizontal
    ul.menu-content
    > li.current
    > a,

    .pos-menu-horizontal
    ul.menu-content
    > li.current-menu-item
    > a,

    .pos-menu-horizontal
    ul.menu-content
    > li.current_page_item
    > a {
        padding-left: 17px !important;

        padding-right: 17px !important;
    }


    /* Category */

    .pos-categories,
    .all-categories {
        width: 300px !important;

        max-width: 300px !important;
    }


    .pos-categories .category-content,
    .pos-categories .categories-menu,
    .all-categories .category-content,
    .all-categories .categories-menu {
        width: 300px !important;

        max-width: 300px !important;
    }


    /* Top bar */

    #header .elementor-element-hctgrcr
    .pos-account {
        gap: 8px !important;
    }


    #header .elementor-element-hctgrcr
    .pos-account > a {
        padding-left: 14px !important;

        padding-right: 14px !important;
    }

}


/* =========================================================
   37. MEDIUM DESKTOP / TABLET
   ========================================================= */

@media (min-width: 992px) and (max-width: 1199px) {

    /* Logo → Home */

    .pos-menu-horizontal
    ul.menu-content
    > li:first-child {
        margin-left: 28px !important;
    }


    /* Compact menu */

    .pos-menu-horizontal
    ul.menu-content
    > li {
        margin-right: 1px !important;
    }


    .pos-menu-horizontal
    ul.menu-content
    > li
    > a {
        font-size: 13px !important;

        padding-left: 3px !important;

        padding-right: 3px !important;
    }


    /* Home */

    .pos-menu-horizontal
    ul.menu-content
    > li:first-child
    > a {
        padding-left: 14px !important;

        padding-right: 14px !important;
    }


    /* Category */

    .pos-categories,
    .all-categories {
        width: 270px !important;

        max-width: 270px !important;
    }


    .pos-categories .category-content,
    .pos-categories .categories-menu,
    .all-categories .category-content,
    .all-categories .categories-menu {
        width: 270px !important;

        max-width: 270px !important;
    }


    /* Category links */

    .pos-categories li > a,
    .all-categories li > a {
        font-size: 14px !important;

        min-height: 48px !important;

        height: 48px !important;
    }


    /* Top bar */

    #header .elementor-element-hctgrcr
    .pos-account {
        gap: 5px !important;
    }


    #header .elementor-element-hctgrcr
    .pos-account > a {
        padding-left: 10px !important;

        padding-right: 10px !important;

        font-size: 12px !important;
    }


    #header .elementor-element-hctgrcr
    .elementor-widget-text-editor p {
        font-size: 14px !important;
    }

}


/* =========================================================
   38. TOP BAR — 992px+
   ========================================================= */

@media (min-width: 992px) {

    #header .elementor-element-hctgrcr,
    #header .elementor-element-hctgrcr .elementor-container {
        white-space: nowrap !important;
    }


    #header .elementor-element-hctgrcr
    .elementor-widget-text-editor p {
        white-space: nowrap !important;
    }


    #header .elementor-element-hctgrcr
    a,
    #header .elementor-element-hctgrcr
    button {
        white-space: nowrap !important;
    }

}


/* =========================================================
   39. MOBILE / TABLET MENU
   ========================================================= */

@media (max-width: 991px) {

    .pos-menu-horizontal {
        margin-left: 0 !important;

        white-space: normal !important;
    }


    .pos-menu-horizontal
    ul.menu-content {
        width: auto !important;

        max-width: 100% !important;

        flex-wrap: wrap !important;
    }


    .pos-menu-horizontal
    ul.menu-content
    > li {
        margin-left: 0 !important;

        margin-right: 0 !important;
    }


    .pos-menu-horizontal
    ul.menu-content
    > li:first-child {
        margin-left: 0 !important;
    }


    .pos-menu-horizontal
    ul.menu-content
    > li
    > a {
        white-space: normal !important;

        font-size: 14px !important;
    }


    /* Top bar */

    #header .elementor-element-hctgrcr {
        height: auto !important;

        min-height: 42px !important;
    }


    #header .elementor-element-hctgrcr
    > .elementor-container {
        height: auto !important;

        min-height: 42px !important;

        flex-wrap: wrap !important;

        padding: 5px 12px !important;
    }


    #header .elementor-element-hctgrcr
    .elementor-widget-text-editor p {
        white-space: normal !important;

        font-size: 13px !important;
    }

}


/* =========================================================
   40. MOBILE CATEGORY
   ========================================================= */

@media (max-width: 767px) {

    .pos-categories,
    .all-categories {
        width: 100% !important;

        max-width: 100% !important;
    }


    .pos-categories .category-content,
    .pos-categories .categories-menu,
    .pos-categories .category-menu,
    .all-categories .category-content,
    .all-categories .categories-menu {
        width: 100% !important;

        max-width: 100% !important;
    }


    .pos-categories .category-title,
    .category-title {
        height: 52px !important;

        min-height: 52px !important;
    }


    .pos-categories li > a,
    .all-categories li > a {
        min-height: 48px !important;

        height: 48px !important;

        font-size: 14px !important;
    }


    /* Search */

    .pos-search,
    .search-row,
    .header-search-row {
        gap: 8px !important;
    }


    .search-widget input,
    .header-search input {
        height: 52px !important;

        padding: 0 14px !important;
    }


    .search-widget button,
    .header-search button,
    .pos-search__submit {
        height: 52px !important;

        width: 58px !important;
    }

}


/* =========================================================
   41. SMALL MOBILE
   ========================================================= */

@media (max-width: 575px) {

    #header .elementor-element-hctgrcr
    .pos-account {
        gap: 4px !important;

        flex-wrap: wrap !important;
    }


    #header .elementor-element-hctgrcr
    .pos-account > a {
        height: 30px !important;

        min-height: 30px !important;

        padding-left: 9px !important;

        padding-right: 9px !important;

        font-size: 11px !important;
    }


    .kbn-community-drop {
        width: 210px !important;

        min-width: 210px !important;

        max-width: 210px !important;
    }

}


/* =========================================================
   42. FINAL STACKING FIX
   ========================================================= */

#header,
#header .elementor-element-hctgrcr,
#header .pos-menu-horizontal,
#header .pos-categories {
    position: relative !important;
}

#header .elementor-element-hctgrcr {
    z-index: 10000 !important;
}

#header .pos-menu-horizontal {
    z-index: 5000 !important;
}

#header .pos-categories {
    z-index: 9999 !important;
}


/* =========================================================
   FINAL TOP BAR COLOR OVERRIDE
   ========================================================= */

#header .elementor-element-hctgrcr,
#header .elementor-element-hctgrcr[data-id="hctgrcr"] {
    background: #005b05 !important;
    background-color: #005b05 !important;
}

@media (max-width: 991px) {
    #header .elementor-element-hctgrcr,
    #header .elementor-element-hctgrcr[data-id="hctgrcr"] {
        background: #005b05 !important;
        background-color: #005b05 !important;
    }
}


/* =========================================================
   END
   ========================================================= */


/* =========================================================
   NAV MENU — ACTIVE = HOVER
   ========================================================= */

/* Normal menu links */
.pos-menu-horizontal ul.menu-content > li > a {
    background: transparent !important;
    color: #26343d !important;
    transition: background-color .2s ease, color .2s ease !important;
}

/* Hover — BLUE */
.pos-menu-horizontal ul.menu-content > li > a:hover {
    background: #0d85f7 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
}

/* Active — EXACT SAME BLUE AS HOVER */
.pos-menu-horizontal ul.menu-content > li.active > a,
.pos-menu-horizontal ul.menu-content > li.current > a,
.pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
.pos-menu-horizontal ul.menu-content > li.current_page_item > a {
    background: #0d85f7 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
}

/* Active + hover stays exactly the same */
.pos-menu-horizontal ul.menu-content > li.active > a:hover,
.pos-menu-horizontal ul.menu-content > li.current > a:hover,
.pos-menu-horizontal ul.menu-content > li.current-menu-item > a:hover,
.pos-menu-horizontal ul.menu-content > li.current_page_item > a:hover {
    background: #0d85f7 !important;
    color: #ffffff !important;
}

/* Remove theme-generated white/other active backgrounds */
.pos-menu-horizontal ul.menu-content > li.active > a::before,
.pos-menu-horizontal ul.menu-content > li.active > a::after {
    background: transparent !important;
}

/* Keep menu icons/arrows white when active */
.pos-menu-horizontal ul.menu-content > li.active > a i,
.pos-menu-horizontal ul.menu-content > li.active > a .icon,
.pos-menu-horizontal ul.menu-content > li.active > a .material-icons {
    color: #ffffff !important;
}

/* =========================================================
   FINAL MAIN NAV FIX
   ACTIVE = HOVER
   ========================================================= */

#header .pos-menu-horizontal ul.menu-content > li > a {
    background: transparent !important;
    color: #222222 !important;
}

#header .pos-menu-horizontal ul.menu-content > li:hover > a,
#header .pos-menu-horizontal ul.menu-content > li.active > a,
#header .pos-menu-horizontal ul.menu-content > li.current > a,
#header .pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
#header .pos-menu-horizontal ul.menu-content > li.current_page_item > a {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;
    color: #ffffff !important;
    border-radius: 7px !important;
}

#header .pos-menu-horizontal ul.menu-content > li:hover > a::before,
#header .pos-menu-horizontal ul.menu-content > li:hover > a::after,
#header .pos-menu-horizontal ul.menu-content > li.active > a::before,
#header .pos-menu-horizontal ul.menu-content > li.active > a::after {
    background: transparent !important;
}

/* Keep active/hover padding consistent */
#header .pos-menu-horizontal ul.menu-content > li:hover > a,
#header .pos-menu-horizontal ul.menu-content > li.active > a,
#header .pos-menu-horizontal ul.menu-content > li.current > a,
#header .pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
#header .pos-menu-horizontal ul.menu-content > li.current_page_item > a {
    padding-left: 17px !important;
    padding-right: 17px !important;
    min-height: 54px !important;
}


/* =========================================================
   FINAL COMPACT NAV — SMALLER ACTIVE / HOVER
   ========================================================= */

#header .pos-menu-horizontal ul.menu-content > li > a {
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 10px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
}

#header .pos-menu-horizontal ul.menu-content > li:hover > a,
#header .pos-menu-horizontal ul.menu-content > li.active > a,
#header .pos-menu-horizontal ul.menu-content > li.current > a,
#header .pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
#header .pos-menu-horizontal ul.menu-content > li.current_page_item > a {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;
    color: #ffffff !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 14px !important;
    border-radius: 6px !important;
}

/* Keep the active/hover effect subtle and premium */
#header .pos-menu-horizontal ul.menu-content > li > a {
    transition: background-color .18s ease, color .18s ease !important;
    box-shadow: none !important;
}

/* Desktop: compact menu spacing */
@media (min-width: 1200px) {
    #header .pos-menu-horizontal ul.menu-content > li {
        margin-right: 1px !important;
    }

    #header .pos-menu-horizontal ul.menu-content > li:hover > a,
    #header .pos-menu-horizontal ul.menu-content > li.active > a,
    #header .pos-menu-horizontal ul.menu-content > li.current > a,
    #header .pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
    #header .pos-menu-horizontal ul.menu-content > li.current_page_item > a {
        padding-left: 13px !important;
        padding-right: 13px !important;
    }
}


/* =========================================================
   EXTRA SMALL NAV — FINAL SIZE
   ========================================================= */

#header .pos-menu-horizontal ul.menu-content > li > a {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 8px !important;
    border-radius: 5px !important;
    font-size: 13px !important;
    line-height: 38px !important;
}

#header .pos-menu-horizontal ul.menu-content > li:hover > a,
#header .pos-menu-horizontal ul.menu-content > li.active > a,
#header .pos-menu-horizontal ul.menu-content > li.current > a,
#header .pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
#header .pos-menu-horizontal ul.menu-content > li.current_page_item > a {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;
    color: #ffffff !important;
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 10px !important;
    border-radius: 5px !important;
    line-height: 38px !important;
}

@media (min-width: 1200px) {
    #header .pos-menu-horizontal ul.menu-content > li {
        margin-right: 0 !important;
    }

    #header .pos-menu-horizontal ul.menu-content > li:hover > a,
    #header .pos-menu-horizontal ul.menu-content > li.active > a,
    #header .pos-menu-horizontal ul.menu-content > li.current > a,
    #header .pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
    #header .pos-menu-horizontal ul.menu-content > li.current_page_item > a {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }
}

/* =========================================================
   PREMIUM TOP ACCOUNT BAR
   ========================================================= */

/* Top account area */
#header .pos-account {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

/* All account buttons */
#header .pos-account > a,
#header .pos-account > .account-login,
#header .pos-account > .kbb2b-customer-signup-link,
#header .pos-account > .kbb2b-signup-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;

    height: 40px !important;
    min-height: 40px !important;

    padding: 0 17px !important;

    border-radius: 22px !important;

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    text-decoration: none !important;
    white-space: nowrap !important;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease !important;

    box-sizing: border-box !important;
}


/* =========================================================
   SIGN IN
   ========================================================= */

#header .pos-account > a.account-login {
    background: transparent !important;
    background-color: transparent !important;

    color: #ffffff !important;

    border: 1px solid rgba(255,255,255,.45) !important;

    box-shadow: none !important;
}

/* Sign in hover */
#header .pos-account > a.account-login:hover {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;

    border-color: #0d85f7 !important;

    color: #ffffff !important;

    transform: translateY(-1px) !important;
}


/* =========================================================
   CUSTOMER SIGNUP
   ========================================================= */

#header .pos-account > a.kbb2b-customer-signup-link {
    background: #80c41c !important;
    background-color: #80c41c !important;

    color: #ffffff !important;

    border: 1px solid #80c41c !important;

    box-shadow: none !important;
}

/* Customer Signup hover */
#header .pos-account > a.kbb2b-customer-signup-link:hover {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;

    border-color: #0d85f7 !important;

    color: #ffffff !important;

    transform: translateY(-1px) !important;
}


/* =========================================================
   BUSINESS ACCOUNT SIGNUP
   ========================================================= */

#header .pos-account > a.kbb2b-signup-link {
    background: #ffffff !important;
    background-color: #ffffff !important;

    color: #223043 !important;

    border: 1px solid #ffffff !important;

    box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
}

/* Business Signup hover */
#header .pos-account > a.kbb2b-signup-link:hover {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;

    border-color: #0d85f7 !important;

    color: #ffffff !important;

    transform: translateY(-1px) !important;

    box-shadow: 0 4px 12px rgba(13,133,247,.20) !important;
}


/* =========================================================
   ICONS
   ========================================================= */

#header .pos-account a i,
#header .pos-account a .material-icons {
    font-size: 16px !important;
    line-height: 1 !important;
}


/* =========================================================
   REMOVE THE THEME'S WHITE HOVER EFFECT
   ========================================================= */

#header .pos-account a:hover,
#header .pos-account a:focus,
#header .pos-account a:active {
    text-decoration: none !important;
}


/* =========================================================
   REMOVE EXTRA INLINE SPACING
   ========================================================= */

#header .pos-account .kbb2b-customer-signup-link,
#header .pos-account .kbb2b-signup-link {
    margin-left: 0 !important;
}


/* =========================================================
   MAIN NAVIGATION — SMALL PREMIUM HOVER
   ========================================================= */

#header .pos-menu-horizontal ul.menu-content > li > a {
    font-size: 13px !important;

    min-height: 38px !important;
    height: 38px !important;

    padding: 0 10px !important;

    border-radius: 5px !important;

    background: transparent !important;
    color: #222222 !important;

    transition:
        background-color .18s ease,
        color .18s ease !important;
}


/* Main menu hover */
#header .pos-menu-horizontal ul.menu-content > li:hover > a {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;

    color: #ffffff !important;

    border-radius: 5px !important;
}


/* Main menu active */
#header .pos-menu-horizontal ul.menu-content > li.active > a,
#header .pos-menu-horizontal ul.menu-content > li.current > a,
#header .pos-menu-horizontal ul.menu-content > li.current-menu-item > a,
#header .pos-menu-horizontal ul.menu-content > li.current_page_item > a {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;

    color: #ffffff !important;

    border-radius: 5px !important;
}


/* Active + hover stay identical */
#header .pos-menu-horizontal ul.menu-content > li.active:hover > a,
#header .pos-menu-horizontal ul.menu-content > li.current-menu-item:hover > a,
#header .pos-menu-horizontal ul.menu-content > li.current_page_item:hover > a {
    background: #0d85f7 !important;
    background-color: #0d85f7 !important;
    color: #ffffff !important;
}


/* =========================================================
   MAIN MENU SPACING
   ========================================================= */

@media (min-width: 1200px) {

    #header .pos-menu-horizontal ul.menu-content > li {
        margin-right: 2px !important;
    }

    #header .pos-menu-horizontal ul.menu-content > li > a {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }

}


/* =========================================================
   TOP BAR ACCOUNT SPACING
   ========================================================= */

@media (min-width: 992px) {

    #header .pos-account {
        gap: 8px !important;
    }

    #header .pos-account > a.account-login {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    #header .pos-account > a.kbb2b-customer-signup-link {
        padding-left: 17px !important;
        padding-right: 17px !important;
    }

    #header .pos-account > a.kbb2b-signup-link {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 991px) {

    #header .pos-account {
        gap: 5px !important;
    }

    #header .pos-account > a {
        height: 36px !important;
        min-height: 36px !important;

        padding-left: 11px !important;
        padding-right: 11px !important;

        font-size: 12px !important;
    }

}
