/* ==========================================
Blossoms Mega Menu
Version: 2.0
========================================== */

:root{

    --bfmm-text:#222;
    --bfmm-border:#e8e8e8;
    --bfmm-primary:#d81b60;

}


/* ===============================
MAIN MEGA MENU
================================ */

#bfmm-mega-menu{

    position:fixed !important;

    display:none;

    top:130px;

    left:50%;

    transform:translateX(-50%);

    width:1200px;
    max-width:90vw;

    max-height:520px;

    overflow-y:auto;
    overflow-x:hidden;

    background:#fff;

    border-radius:16px;

    box-shadow:0 18px 40px rgba(0,0,0,.15);

    z-index:99999;

    /* Keeps scrollbar visually inside rounded card */
    clip-path:inset(0 round 16px);

}


#bfmm-mega-menu.active{

    display:block;

    animation:bfmmFade .25s ease;

}


@keyframes bfmmFade{

    from{

        opacity:0;

        transform:translateX(-50%) translateY(10px);

    }

    to{

        opacity:1;

        transform:translateX(-50%) translateY(0);

    }

}

.wp-block-navigation{

    position:relative;

}


.bfmm-wrapper{

    display:grid;

    grid-template-columns:260px 1fr;

    min-height:420px;

}


.bfmm-sidebar{

    background:#fafafa;

    border-right:1px solid var(--bfmm-border);

}


.bfmm-sidebar ul{

    margin:0;

    padding:0;

    list-style:none;

}


.bfmm-sidebar li{

    list-style:none;

    border-bottom:1px solid #eee;

}


.bfmm-sidebar a{

    display:block;

    padding:16px 22px;

    text-decoration:none;

    color:var(--bfmm-text);

    font-size:16px;

    font-weight:700;

    transition:.25s;

}


.bfmm-sidebar a:hover{

    background:#fff;

    color:var(--bfmm-primary);

}


/* ===============================
PRODUCTS
================================ */

.bfmm-products{

    padding:30px;

}


.bfmm-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:28px;

}


.bfmm-card{

    text-align:center;

    transition:.3s;

}


.bfmm-card:hover{

    transform:translateY(-5px);

}


.bfmm-image{

    position:relative;

}


.bfmm-card img{

    width:100%;

    aspect-ratio:1/1;

    object-fit:cover;

    border-radius:12px;

}


.bfmm-title{

    margin-top:12px;

    font-size:15px;

    font-weight:600;

    color:#222;

}


.bfmm-price{

    margin-top:8px;

    color:#d81b60;

    font-weight:700;

    font-size:15px;

}


/* ===============================
LOADING
================================ */

.blossoms-loading{

    padding:50px;

    text-align:center;

    color:#777;

}


/* ===============================
SCROLLBAR
================================ */

#bfmm-mega-menu::-webkit-scrollbar{

    width:8px;

}


#bfmm-mega-menu::-webkit-scrollbar-thumb{

    background:#d81b60;

    border-radius:20px;

}


#bfmm-mega-menu::-webkit-scrollbar-track{

    background:#f5f5f5;

}


/* Firefox */

#bfmm-mega-menu{

    scrollbar-width:thin;

    scrollbar-color:#d81b60 #f5f5f5;

}


/* ===============================
RESPONSIVE
================================ */

@media(max-width:1200px){

    #bfmm-mega-menu{

        width:95vw;

    }


    .bfmm-grid{

        grid-template-columns:repeat(3,1fr);

    }

}


@media(max-width:900px){

    #bfmm-mega-menu{

        width:95vw;

        max-width:95vw;

    }


    .bfmm-wrapper{

        grid-template-columns:1fr;

    }


    .bfmm-grid{

        grid-template-columns:repeat(2,1fr);

    }

}


@media(max-width:600px){

    .bfmm-grid{

        grid-template-columns:1fr;

    }

}