﻿/*.productCategory {
    min-height: 100px;
    background: -webkit-linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
    background: linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
}*/

/* ==== Category Glow ==== */
@keyframes popIn { 0% { opacity: 0; transform: scale(0.85); } 100% { opacity: 1; transform: scale(1); }}
@keyframes softGlow {
    0% { box-shadow: 0 2px 6px rgba(34, 160, 114, 0.06); }
    50% { box-shadow: 0 2px 10px rgba(34, 160, 114, 0.57); }
    100% { box-shadow: 0 2px 6px rgba(34, 160, 114, 0.05); }}
.cats { opacity: 0; transform: scale(0.96); animation: popIn 0.6s ease-out forwards, softGlow 6s infinite ease-in-out 0.6s; transition: all 0.3s ease; }
.cats:hover { animation: popIn 0.6s ease-out forwards, softGlow 6s infinite ease-in-out 0.6s !important; box-shadow: 0 4px 12px rgba(4, 83, 54, 0.25) !important; transform: scale(1.02) translateY(-2px) !important; }



/* ==== productSlider1 effect ==== */
[id*="productSlider1"] .owl-item { position: relative; overflow: hidden; }
[id*="productSlider1"] .owl-item::after { content: ""; position: absolute; top: 0; left: 0; width: 50%; height: 100%; background: linear-gradient( 90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 50%, rgba(255, 255, 255, 0) 100% ); animation: lightStreak 4s ease-in-out infinite; z-index: 2; pointer-events: none; }
/* Keyframes (unchanged) */
@keyframes lightStreak { 
    0% { transform: translateX(-100%) skew(-20deg); opacity: 0; }
    10% { opacity: 0.6; }
    20% { transform: translateX(100%) skew(-20deg); opacity: 0; }
    100% { opacity: 0; }}
/* Hover effect */
[id*="productSlider1"] .owl-item:hover img { transform: scale(1.03); transition: transform 0.4s ease; }



/* ===== Deal Item Flash Effect ===== */
.deal-owl-carousel .card { position: relative; overflow: hidden; transition: all 0.3s ease; }
/* Light flash overlay */
.deal-owl-carousel .card::before { content: ""; position: absolute; top: 0; left: -100%; width: 60%; height: 100%; background: linear-gradient( 90deg, rgba(255, 255, 255, 0) 0%, rgba(34, 160, 114, 0.57) 50%, rgba(255, 255, 255, 0) 100% ); transform: skewX(-20deg); z-index: 2; pointer-events: none; }
/* Auto-flash when slide becomes active */
.deal-owl-carousel .owl-item.active .card::before { animation: dealFlash 3s ease-out; }
@keyframes dealFlash { 0% { left: -100%; opacity: 0; } 20% { opacity: 0.7; } 100% { left: 150%; opacity: 0; }}
/* ===== Deal Badge Effect ===== */
.deal-owl-carousel .card-footer.border-warning { position: relative; }
.deal-owl-carousel .card-footer.border-warning::after { content: "DEAL"; position: absolute; top: -8px; right: 10px; background: #ff4757; color: white; padding: 2px 8px; border-radius: 4px; font-size: 0.7rem; font-weight: bold; }
/* ===== Hover Effects ===== */
.deal-owl-carousel .card:hover { transform: translateY(-3px); box-shadow: 0 5px 15px rgba(0,0,0,0.1); }
.deal-owl-carousel .card:hover::before { animation: dealFlashHover 1.5s ease-out; }
@keyframes dealFlashHover { 0% { left: -100%; opacity: 0; } 50% { opacity: 0.5; } 100% { left: 150%; opacity: 0; }}













/* Cover Image Carousel */
/*.carousel {
    background: -webkit-linear-gradient(to bottom, #c9f7ce 0%, #fceed0 50%, #e8f3ee 85%, #ff0000ff 100%);
    background: linear-gradient(to bottom, #c9f7ce 0%, #faeecf 50%, #e8f3ee 85%, #ff0000ff 100%)
}*/

@media only screen and (min-width: 360px) and (max-width:549px) {
    #carouselCoverDark { min-height:140px }
    /*#coverImg-1 { content:url(../images/cover/sm/coverImg-1.jpg) }
    #coverImg-2 { content:url(../images/cover/sm/coverImg-2.jpg) }
    #coverImg-3 { content:url(../images/cover/sm/coverImg-3.jpg) }
    #coverImg-4 { content:url(../images/cover/sm/coverImg-4.jpg) }
    #coverImg-5 { content:url(../images/cover/sm/coverImg-5.jpg) }*/
}

@media only screen and (min-width: 550px) and (max-width:1099px) {
    #carouselCoverDark { min-height:200px }
    /*#coverImg-1 { content:url(../images/cover/md/coverImg-1.jpg) }
    #coverImg-2 { content:url(../images/cover/md/coverImg-2.jpg) }
    #coverImg-3 { content:url(../images/cover/md/coverImg-3.jpg) }
    #coverImg-4 { content:url(../images/cover/md/coverImg-4.jpg) }
    #coverImg-5 { content:url(../images/cover/md/coverImg-5.jpg) }*/
}

@media only screen and (min-width: 1100px) {
    #carouselCoverDark { min-height:250px }
    /*#coverImg-1 { content:url(../images/cover/lg/coverImg-1.jpg) }
    #coverImg-2 { content:url(../images/cover/lg/coverImg-2.jpg) }
    #coverImg-3 { content:url(../images/cover/lg/coverImg-3.jpg) }
    #coverImg-4 { content:url(../images/cover/lg/coverImg-4.jpg) }
    #coverImg-5 { content:url(../images/cover/lg/coverImg-5.jpg) }*/
}
.carousel-inner > .carousel-item {
    -webkit-transition: 0.4s ease-in-out !important;
    -moz-transition: 0.4s ease-in-out !important;
    -o-transition: 0.4s ease-in-out !important;
    transition: 0.4s ease-in-out !important;
}

/* 00000000000000000000000000000000000000000000000000000000000000000000000000000000000 */

/* 360px-TO-575px ################################################################################### */
@media only screen and (min-width: 360px) and (max-width:575px) {
    /*.custom-row { display:flex; flex-wrap:wrap; margin-left: auto; margin-right: auto; }
    .custom-col { width: 19%; margin-left:.5%; margin-right:.5%; min-height:50px;  }*/
    #cakeCoverImg { content:url(../images/Banner/BannerCake_sm.jpg) }
    #deliveryAreas { content: url(../images/bg/deliveryFooter-md-banner.jpg)  }

    .deal_img { height: 250px; background-size: cover; background-position-y: center }




    .productCategory {
        min-height: 100px;
        background-color: #ffffff69;
        margin: 0px;
        border-top: 2px solid #ffffff7e;
        border-bottom: 2px solid #ffffff7e;
        border-left: none;
    }
    
    
    
}

/* SM */
/* 576px-TO-767px ################################################################################### */
@media only screen and (min-width: 576px) and (max-width:767px) {
    /*.custom-row { display:flex; flex-wrap:wrap; margin-left: auto; margin-right: auto; }
    .custom-col { width: 19%; margin-left:.5%; margin-right:.5%; min-height:50px;  }*/
    #cakeCoverImg { content:url(../images/Banner/BannerCake_md.jpg) }
    #deliveryAreas { content: url(../images/bg/deliveryFooter-md-banner.jpg)  }

    .deal_img { height: 200px; background-size: cover; background-position-y: center }

    /* m-1 m-sm-2 mt-0 mt-sm-0   m-md-2 m-lg-3 m-xl-3 m-xxl-5  mt-md-0 mt-lg-0 mt-xl-0 mt-xxl-0      rounded-4    border border-dark border-2    shadow  */
    .productCategory {
        min-height: 100px;
        background: -webkit-linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        background: linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        margin: 8px;
        border-radius: 15px;
        border: 2px solid #000000;
    }

}

/* MD */
/* 768px-TO-991px ################################################################################### */
@media only screen and (min-width: 768px) and (max-width:991px) {
    /*.custom-row { display:flex; flex-wrap:wrap; margin-left: auto; margin-right: auto; }
    .custom-col { width:19%; margin-left:.5%; margin-right:.5%; min-height:50px;  }*/
    #productCakes { border-radius:25px }
    #cakeCoverImg { content:url(../images/Banner/BannerCake_md.jpg) }
    #deliveryAreas { content: url(../images/bg/deliveryFooter-md-banner.jpg)  }

    .deal_img { height: 170px; background-size: cover; background-position-y: center }

    /* m-1 m-sm-2 mt-0 mt-sm-0   m-md-2 m-lg-3 m-xl-3 m-xxl-5  mt-md-0 mt-lg-0 mt-xl-0 mt-xxl-0      rounded-4    border border-dark border-2    shadow  */
    .productCategory {
        min-height: 100px;
        background: -webkit-linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        background: linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        margin: 10px;
        border-radius: 15px;
        border: 2px solid #000000;
    }
}

/* LG */
/* 992px-TO-1199px ################################################################################### */
@media only screen and (min-width: 992px) and (max-width:1199px) {
    /*.custom-row { display:flex; flex-wrap:wrap; margin-left: auto; margin-right: auto; }
    .custom-col { width: 14.6%; margin-left:1%; margin-right:1%; min-height:50px;  }*/
    #productCakes { border-radius:25px }
    #cakeCoverImg { content:url(../images/Banner/BannerCake_md.jpg) }
    #deliveryAreas { content: url(../images/bg/deliveryFooter-lg-banner.jpg)  }

    .deal_img { height: 200px; background-size: cover; background-position-y: center }

    /* m-1 m-sm-2 mt-0 mt-sm-0   m-md-2 m-lg-3 m-xl-3 m-xxl-5  mt-md-0 mt-lg-0 mt-xl-0 mt-xxl-0      rounded-4    border border-dark border-2    shadow  */
    .productCategory {
        min-height: 100px;
        background: -webkit-linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        background: linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        margin: 12px;
        border-radius: 15px;
        border: 2px solid #000000;
    }
}

/* XL */
/* 1200px-TO-1399px ################################################################################### */
@media only screen and (min-width: 1200px) and (max-width:1399px) {
    /*.custom-row { display:flex; flex-wrap:wrap; margin-left: auto; margin-right: auto; }
    .custom-col { width: 11.25%; margin-left:1%; margin-right:1%; min-height:50px;  }*/
    #productCakes { border-radius:25px }
    #cakeCoverImg { content:url(../images/Banner/BannerCake_xl.jpg) }
    #deliveryAreas { content: url(../images/bg/deliveryFooter-lg-banner.jpg)  }

    .deal_img { height: 250px; background-size: cover; background-position-y: center }

    /* m-1 m-sm-2 mt-0 mt-sm-0   m-md-2 m-lg-3 m-xl-3 m-xxl-5  mt-md-0 mt-lg-0 mt-xl-0 mt-xxl-0      rounded-4    border border-dark border-2    shadow  */
    .productCategory {
        min-height: 100px;
        background: -webkit-linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        background: linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        margin: 15px;
        border-radius: 15px;
        border: 2px solid #000000;
    }
}

/* XXL */
/* 1400px-TO ################################################################################### */
@media only screen and (min-width: 1400px) {
    /*.custom-row { display:flex; flex-wrap:wrap; margin-left: auto; margin-right: auto; }
    .custom-col { width: 11.25%; margin-left:1%; margin-right:1%; min-height:50px;  }*/
    #productCakes { border-radius:25px }
    #cakeCoverImg { content:url(../images/Banner/BannerCake_lg.jpg) }
    #deliveryAreas { content: url(../images/bg/deliveryFooter-lg-banner.jpg)  }

    .deal_img { height: 210px; background-size: cover; background-position-y: center }

    .productCategory {
        min-height: 100px;
        background: -webkit-linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        background: linear-gradient(to bottom, #ffffff 0%, #b1f1d9 35%, #b1f1d9 50%, #b1f1d9 65%, #b1f1d9 85%, #ffffffff 100%);
        margin: 18px;
        border-radius: 15px;
        border: 2px solid #000000;
    }
}




/* 00000000000000000000000000000000000000000000000000000000000000000000000000000000000 */

.ProductCarousel { border-radius:9px }

.productSlider1-oc .owl-stage-outer { display:flex !important; justify-content:center !important; }
.deal-owl-carousel .owl-dots { text-align:left; margin-left:5px }

.owl-theme .owl-dots .owl-dot span { background-color:#b5b5b5 }
        .owl-theme .owl-dots .owl-dot:hover span { background-color:#d7ab00 !important }
        .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #000000;}
        .owl-theme .owl-dots .owl-dot span { width: 12px; height: 12px; margin: 5px 5px; }