:root {
        --color-primary-vibrant: #FF6B6B;
        --color-secondary-vibrant: #4ECDC4;
        --color-accent-vibrant: #FFCD3C;
        --color-dark-text: #333333;
        --color-light-text: #F8F8F8;
        --color-background-light: #F4F4F4;
    }

    /* Custom Product Styles */
    .product-inner {
        margin: 5px; /* Add some margin around products */
        padding: 10px; /* Add internal padding */
        border-radius: 10px; /* Rounded corners for a softer look */
        overflow: hidden;
        position: relative;
        transform-style: preserve-3d;
        transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); /* Smooth transition for all properties */
       background-color: #ffffff;
    }

    .product-inner:hover {
        transform: translateY(-8px) rotateX(2deg) rotateY(2deg); /* Subtle 3D lift and rotation */
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2); /* More pronounced shadow */
        background-color: #ffffff; /* White background on hover */
    }

    .product-thumbnail {
        margin-bottom: 10px;
    }

    .product-details {
        padding: 10px 0;
    }

    .product__title a {
        color: var(--color-dark-text); /* Use dark text color for titles */
        font-weight: 600;
    }

    .product__title a:hover {
        color: var(--color-primary-vibrant); /* Vibrant color on title hover */
    }

    .product-price ins {
        color: var(--color-primary-vibrant); /* Vibrant color for sale price */
        font-size: 1.5em;
    }

    .product-price del {
        color: var(--color-dark-text); /* Dark text for original price */
        opacity: 0.7;
    }

    .product-inner .product-thumbnail .product-loop__buttons {
        opacity: 0;
        position: absolute;
        right: 0;
        top: 0;
        visibility: hidden !important; /* Force hide */
        transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
        display: block !important; /* Ensure it's block so transitions can work */
    }
.product-inner .product-thumbnail .product-loop__buttons:hover{
  opacity: 0;
  display: block;
}

    /* Override any default display:none for product-bottom-box buttons on desktop */
    @media (min-width: 992px) {
        .product-inner .product-bottom-box .product-loop__buttons {
            display: none; /* Keep it hidden if it's not the primary button area */
        }
    }

    /* Product Hover Effects (for full screen) */
    @media (min-width: 992px) {
        .product-inner:hover .product-loop__buttons {
            opacity: 1 !important;
            z-index: 1;
            visibility: visible !important; /* Force show */
            display: block !important; /* Explicitly ensure it's displayed */
        }
    }

    .product-loop__buttons .product-loop_button {
        margin-bottom: 10px;
    }

    .product-loop__buttons .product-loop_button a {
        background-color: var(--color-secondary-vibrant);
        color: var(--color-light-text);
        border-radius: 5px;
        padding: 8px 12px;
        transition: all 0.3s ease;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .product-loop__buttons .product-loop_button a:hover {
        background-color: var(--color-accent-vibrant);
        transform: scale(1.05);
    }

    .product-loop__buttons .product-loop_button a .svg-icon {
        margin-right: 5px;
    }

    /* Enhancements for image hover */
    .product-thumbnail__img {
        transition: transform 0.5s ease-in-out;
    }

    .product-inner:hover .product-thumbnail__img {
        transform: scale(1.1); /* Zoom effect on image hover */
    }







    /* Add a subtle rotation for ribbons/labels */
    .ribbons .ribbon {
        transform: rotate(-5deg);
        transition: transform 0.3s ease-in-out;
    }

    .product-inner:hover .ribbons .ribbon {
        transform: rotate(0deg) scale(1.05);
    }




.header .header-top .header-info>ul>li .language-dropdown-active, .header .header-top .header-info>ul>li a:hover {
    color: blue;
}

























































.header .header-middle .header-wrapper .header-items.header__center .form--quick-search .product-category-label .text {
                color: black !important;
            }

            /* Ensure Search Icon is black */
            .header .header-middle .header-wrapper .header-items.header__center .form--quick-search .btn .svg-icon svg {
                color: black !important;
            }




























   .menu--product-categories .menu__toggle .menu__toggle-title {
        color: #fff !important;
    }



.footer-payments img {
    max-height: 30px;
    width: 400px;
    height: 80px;
}






    /* Make grandchild category names in the mega menu black */
    .mega-menu__list li a {
        color: #fff !important;
    }

    /* Ensure text color is black on hover for all menu items within the dropdown */
    .menu--dropdown li a:hover span.ms-1,
    .mega-menu a:hover h4,
    .mega-menu__list li a:hover {
        color: #000 !important;
    }









    .header-middle .form--quick-search .btn .svg-icon svg {
        color: black !important;
    }

    /* Ensure Category dropdown items text is black */
    .menu--product-categories .menu__content .menu--dropdown li a {
        color: black !important;
    }


.header .header-middle .header__right .header__extra .svg-icon, .header .header-middle .header__right .header__extra i {
    color: white;
}


.header .header-item-counter {
    color: white;

}



.header .header-middle .header__right .header__extra .cart-text .cart-title {
    color: white;
    font-weight:600;
}




.header .header-middle .header__right .header__extra .cart-text .cart-price-total .cart-amount {
    color: white;
  
}



.header .header-top .header-info>ul>li .language-dropdown-active, .header .header-top .header-info>ul>li a{
  color: white;
}

.header .header-top .header-info>ul>li .language-dropdown-active, .header .header-top .header-info>ul>li a:hover{
  color: blue;
}

















#footer h2, #footer h3, #footer h4, #footer h5, #footer h6 {
    color: white;
    font-size: 17px;
}





#footer ul {
    list-style-type: none;
    font-size: 14px;
  margin: 0;
  padding: 0;
   
}












#footer .subscribe-form{
  width: 400px;
}





#footer .subscribe-form button {
    background: linear-gradient(135deg, #6C63FF, #42A5F5); /* সুন্দর গ্র্যাডিয়েন্ট */
    border: none;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    min-width: 140px;
    padding: 12px 20px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    text-transform: uppercase;
    letter-spacing: 1px;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

#footer .subscribe-form button::before {
    content: '';
    position: absolute;
    left: -100%;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.15);
    transition: all 0.5s ease;
    z-index: 0;
}

#footer .subscribe-form button:hover::before {
    left: 100%;
}

#footer .subscribe-form button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}




.svg-icon svg {
    color: black;
}

.btn-primary:active, .btn-primary:focus, .btn-primary {
    background-color: lightcyan;
    color: #1b16e9;
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    background-color: blue;
    color: white;
}





.countdown-wrapper .header-countdown {
    background-color: #2ce9fa;
}




.product-price ins {
    color: #545c66;
}




.ribbons .ribbon.featured {
    background-color: #2d64a5;
}






p {
    color: peachpuff;
    font-size: 16px;
}






.header .header-top .header-info>ul>li .language-dropdown-active, .header .header-top .header-info>ul>li a:hover {
    color: blue;
}


p {
    color: black;
    font-size: 16px;
}




/* Initial fade-in animation for img and svg */
img, svg {
  opacity: 0;
  transform: translateY(20px) scale(0.98);
  animation: fadeIn 1.2s ease-out forwards;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  border-radius: 10px;
}

/* Hover effect with zoom and glow */
img:hover, svg:hover {
  transform: scale(1.05) translateY(0);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25), 0 0 20px rgba(0, 123, 255, 0.3);
}

/* FadeIn animation keyframes */
@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}








.img-fluid-eq .img-fluid-eq__wrap img {
  opacity: 0;
  transform: translateY(20px) scale(0.98);
  animation: fadeIn 1.2s ease-out forwards;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  border-radius: 10px;
}


.img-fluid-eq .img-fluid-eq__wrap img:hover {
  transform: scale(1.05) translateY(0);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25), 0 0 20px rgba(0, 123, 255, 0.3);
}



@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}





.header .header-top .header-info>ul>li .language-dropdown-active, .header .header-top .header-info>ul>li a:hover{
    color: blue;
}



.star-rating-wrapper .star-rating .rating-stars .svg-icon svg{
    color: red;
}





.site-info__item .site-info__title {
    color: #20262e;
}





.product-button .quantity .decrease, .product-button .quantity .increase {
    align-items: center;
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px;
    color: black;
    background-color: black;



}






.header .header-top .header-info>ul>li>a:hover {
    color:blue;
}








 .header-top .header-info ul li a:hover {
 color: blue !important;
}



.header_items .header_right > a{
    color: white;
}




.header .header-middle .header__right .header__extra.header-wishlist .svg-icon svg{
    color: white;
}

.header .header-middle .header__right .header__extra .btn-shopping-cart .svg-icon svg{
  
  	color:white;
}


#footer .svg-icon svg{
    color: white;
}




.cart--mini .mini-cart-content .mini-cart__buttons .btn.checkout {
    border-color: transparent;
    color: black;
}






.header .header-top .header-info>ul>li .language-dropdown-active, .header .header-top .header-info>ul>li a :hover {
    color: white;
    box-sizing: border-box;
}







.product-button .quantity .decrease, .product-button .quantity .increase {

    color: #1a0202;
    background-color: #276acf3d;
}



.site-info__item .site-info__title {
    color: #F4B63D;
}



#back2top:hover {
    background-color: #c98012;

}

#back2top {
    background-color: #F4B63D;
  
}




.header .header-top .header-info > ul > li .language-dropdown-active:hover,
.header .header-top .header-info > ul > li a:hover {
    color: #F4B63D;
}




@media (max-width: 1199px) {
    .header-mobile {
        background-color: #367588;
        
    }
    img {
        width: 200px;
    }
}







.header .header-item-counter {
    background-color: red;
}



.top_header_menu:hover{
    color: yellow;

}