/* Mini Cart Header Buttons Wrapper */
.elelevi-header-buttons-wrapper {
    display: flex !important;
    align-items: center;
    gap: 12px;
    margin-left: 16px;
    position: relative;
    z-index: 998; /* Below mobile menu toggle button */
}

/* Hide header buttons below 1616px - they will be in hamburger menu instead */
/* Use same header and hamburger menu from mobile viewport to 1615px */
@media (max-width: 1615px) {
    .elelevi-header-buttons-wrapper {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        transition: opacity 0.3s ease, visibility 0.3s ease !important;
    }
    
    /* Ensure buttons don't appear during menu closing animation */
    body:not(.mega-menu-creativesplanet-top) .cspt-navbar > div.active ~ * .elelevi-header-buttons-wrapper,
    body:not(.mega-menu-creativesplanet-top) .cspt-navbar > div.active + * .elelevi-header-buttons-wrapper,
    body:not(.mega-menu-creativesplanet-top) .active .elelevi-header-buttons-wrapper {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
    
    /* Hide buttons when menu is closing (has active class but transitioning) */
    .cspt-navbar > div:not(.active) ~ * .elelevi-header-buttons-wrapper,
    body:not(.mega-menu-creativesplanet-top):not(:has(.cspt-navbar > div.active)) .elelevi-header-buttons-wrapper {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
}

/* Show buttons on screens 1616px and above (desktop) */
@media (min-width: 1616px) {
    .elelevi-header-buttons-wrapper {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Shop Link Button (E-poodi valima) */
.elelevi-shop-link-btn {
    display: flex !important;
    align-items: center;
    background: #237f52 !important;
    color: white !important;
    border: none !important;
    border-radius: 32px;
    padding: 14px 24px;
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 160%;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none !important;
    white-space: nowrap;
    box-shadow: 0 0 23px 2px rgba(35, 127, 82, 0.3);
    visibility: visible !important;
    opacity: 1 !important;
}

.elelevi-shop-link-btn:hover {
    background-color: #4CB486 !important;
    box-shadow: 0 4px 12px rgba(35, 127, 82, 0.3);
    color: white !important;
}

.elelevi-shop-link-btn__text {
    color: white;
}

/* Mini Cart Header Button (Cart Icon) */
.elelevi-mini-cart-header-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: #237f52 !important;
    color: white !important;
    border: none !important;
    border-radius: 32px;
    padding: 14px 16px;
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 160%;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    white-space: nowrap;
    box-shadow: 0 0 23px 2px rgba(35, 127, 82, 0.3);
    visibility: visible !important;
    opacity: 1 !important;
    width: 56px;
    height: 50px;
}

.elelevi-mini-cart-header-btn:hover {
    background-color: #4CB486 !important;
    box-shadow: 0 4px 12px rgba(35, 127, 82, 0.3);
}

.cspt-header-style-6 .cspt-header-button2 a{
    background-color: transparent!important;
    padding: 12px 22px!important;
    border: 1px solid #237f52!important;
    color: #237f52!important;
}

.cspt-header-style-6 .cspt-header-button2 a:hover{
    color: #fff!important;
}

.elelevi-mini-cart-header-btn:active {
    transform: translateY(0);
}

.elelevi-mini-cart-header-btn__text {
    color: white;
}

.elelevi-mini-cart-header-btn__icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.elelevi-mini-cart-header-btn__count {
    position: absolute;
    top: -8px;
    right: -8px;
    background: white;
    color: #237f52;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    border: 2px solid #237f52;
}

/* Responsive styles */

/* Medium screens (1616px to 1800px) - slightly smaller buttons */
@media (min-width: 1616px) and (max-width: 1800px) {
    .elelevi-header-buttons-wrapper {
        gap: 10px;
        margin-left: 12px;
    }
    
    .elelevi-shop-link-btn {
        padding: 12px 20px;
        font-size: 14px;
    }
    
    .elelevi-mini-cart-header-btn {
        width: 50px;
        height: 48px;
        padding: 12px 14px;
    }
}

/* Footer Mini Cart Button Styles */
@media (min-width: 768px) {
    .cspt-footer-widget-area .col-md-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

.mini-cart-trigger{
    cursor: pointer;
}

.cspt-footer-widget-area .widget.e-poodi-footer-widget{
    margin-top: 42%;
}

.elelevi-mini-cart-footer-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    color: #237f52;
    border: none;
    border-radius: 32px;
    padding: 14px 40px;
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 160%;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    white-space: nowrap;
    text-transform: uppercase;
    width: 100%;
    max-width: 200px;
    margin: 0 auto;
    text-decoration: none;
}

.elelevi-mini-cart-footer-btn:hover {
    background: #f0f0f0;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.elelevi-mini-cart-footer-btn:active {
    transform: translateY(0);
}

.elelevi-mini-cart-footer-btn__text {
    color: #000;
}

.elelevi-mini-cart-footer-btn__count {
    position: absolute;
    top: -8px;
    right: -8px;
    background: #237f52;
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    border: 2px solid white;
}

/* Footer widget styling */
.cspt-footer-widget-col-4 .widget-title {
    color: white;
    margin-bottom: 15px;
}

.cspt-footer-widget-col-4 .textwidget {
    display: flex;
    justify-content: flex-start;
}

@media (max-width: 768px) {
    .elelevi-mini-cart-footer-btn {
        padding: 12px 30px;
        font-size: 14px;
        max-width: 100%;
    }
    
    .cspt-footer-widget-col-4 .textwidget {
        justify-content: center;
    }
}

/* Mobile Menu Buttons (shown only below 1616px - same as mobile menu breakpoint) */
.elelevi-mobile-menu-buttons {
    flex-direction: column;
    gap: 12px;
    padding: 20px 15px 30px 15px; /* Extra padding at bottom */
    border-top: 1px solid #e0e0e0;
    margin-top: 0px; /* Remove top margin */
    margin-bottom: 20px; /* Add bottom margin for scroll space */
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    position: relative;
    z-index: 1;
    display: flex !important;
}

/* Show mobile menu buttons up to 1615px (same as mobile menu breakpoint) */
@media (max-width: 1615px) {
    /* Show mobile menu buttons */
    .elelevi-mobile-menu-buttons {
        display: flex !important;
    }
    
    /* Ensure buttons are visible in mobile menu */
    .cspt-navbar > div.active .elelevi-mobile-menu-buttons,
    .menu-main-menu-container.active .elelevi-mobile-menu-buttons {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Ensure mobile menu has proper width and overflow */
    .navigation-top .wrap,
    #site-navigation,
    .main-navigation,
    .cspt-navbar,
    .menu-main-menu-container {
        overflow: visible !important;
    }
    
    /* Make sure mobile menu container is wide enough */
    .navigation-top .wrap nav,
    #site-navigation,
    .cspt-navbar > div,
    .menu-main-menu-container {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Force show buttons in mobile menu */
    .menu-main-menu-container .elelevi-mobile-menu-buttons,
    .cspt-navbar .elelevi-mobile-menu-buttons,
    #site-navigation .elelevi-mobile-menu-buttons {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Hide mobile menu buttons on larger screens (desktop) */
@media (min-width: 1616px) {
    .menu-main-menu-container .elelevi-mobile-menu-buttons,
    .cspt-navbar .elelevi-mobile-menu-buttons,
    #site-navigation .elelevi-mobile-menu-buttons {
        display: none !important;
    }
}

/* Mobile menu button styles */
.elelevi-mobile-menu-buttons .elelevi-shop-link-btn,
.elelevi-mobile-menu-buttons .elelevi-mini-cart-header-btn {
    width: 100%;
    justify-content: center;
    margin: 0;
    box-sizing: border-box;
    visibility: visible !important;
    opacity: 1 !important;
}

.elelevi-mobile-menu-buttons .elelevi-shop-link-btn {
    padding: 14px 24px;
    display: flex !important;
    align-items: center;
    background: #237f52 !important;
    color: white !important;
    border-radius: 32px;
    text-decoration: none !important;
}

.elelevi-mobile-menu-buttons .elelevi-mini-cart-header-btn {
    width: 100%;
    height: auto;
    padding: 14px 24px;
    display: flex !important;
    align-items: center;
    gap: 8px;
    position: relative;
    background: #237f52 !important;
    color: white !important;
    border: none !important;
    border-radius: 32px;
    cursor: pointer;
}

.elelevi-mobile-menu-buttons .elelevi-mini-cart-header-btn svg {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

.elelevi-mobile-menu-buttons .elelevi-mini-cart-header-btn__text-mobile {
    color: white;
    font-weight: 700;
    font-size: 15px;
}