 /* @import url("https://ejkb.dev.fam-aerts.nl/wp-content/my-settings/megamenu-prot.css");  */

.menu-section {
    padding-top: var(--brxp-header-height);
    background-color: var(--bg-test-color);
    position: relative;
    z-index: 9999;
    
    .menu-container {
        border: 3px solid var(--brxp-surface-l-1);
        border-radius: var(--brxw-radius-s);
        padding: var(--brxw-space-fluid-l);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
        background-color: var(--megamenu-bg);
        box-shadow: var(--popup-shadow);

        &:hover {
            background-color: var(--megamenu-bg-hover);
            border-color: var(--brxp-primary-d-8);
            box-shadow: var(--popup-shadow-hover);
        }

        .mega-col-logo {
            width:15rem;
            height: auto;
            justify-content: center;
            margin:0;
            margin-right: var(--brxw-space-fluid-l);

            img {
                width: 75%;
            }
        }

        .mega-block {
            padding-right: 3rem;
            width: 100%;
            
            .mega-col-title {
                width: 100%;
                padding-bottom: var(--brxw-space-fluid-3xs);
                color: var(--brxp-secondary-d-3);
                font-size: var(--brxw-text-fluid-m);
                font-weight: 600;
                border-bottom: 2px solid var(--brxp-secondary-d-7);
            }
            
            .leeftijden-grid {
                width: 40rem;
            }
        }        
    }
}

button.ejk-menu-butn {
    padding-right: 5rem;
}


/*
.menu-nav-ejk,
.mega-groepen-block {
    width: 20rem;
    padding-left: 0;

    .bricks-nav-menu {
        gap:0;
        
        .menu-item {
            color: var(--brxp-surface-l-10);
            letter-spacing: 1px;
            padding: 0.2em ;

            > a {
                display: flex;
                align-items: center;
                white-space: nowrap;
                padding: 0.3em 0.8em;
                font-family: "Montserrat", sans-serif;
                font-weight: 500;
                font-size: var(--brxw-text-fluid-s);
                line-height: var(--brxw-line-height-body);
                border-radius: var(--brxw-radius-2xs);
                background: linear-gradient(rgba(255, 255, 0, 0.5), rgba(255, 255, 0, 0.5)) center / 0 0 no-repeat;
                transition:
                    background-size 0.3s cubic-bezier(.58, .3, .005, 1),
                    box-shadow 0.3s cubic-bezier(.58, .3, .005, 1);

                &::before,
                &::after {
                    content: "";
                    display: block;
                    flex-grow: 0;
                    transition: flex-grow 0.3s ease;
                }

                &:hover {
                    background-size: 100% 100%;
                    box-shadow: 4px 4px 4px 0 #0000005c;
                    font-weight: 600;
                    transition:
                        background-size 0.6s ease-in-out,
                        box-shadow 0.6s ease-in-out 0.6s;

                    &::before,
                    &::after {
                        flex-grow: 1;
                        transition: flex-grow 0.5s ease-out 0.1s;
                    }
                }
            }
        }
    }
}
*/
