/* JoyToy category pictos inside the KIDZ mega menu. */
.joytoy-menu-category-icon{
    display:none!important;
}

/* Dedicated 2x transparent menu artwork supplied by this plugin. */
#header #menu-mega-menu>li>a .joytoy-menu-main-icon{
    display:block!important;
    width:64px!important;
    height:64px!important;
    margin:0 auto!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    object-fit:contain!important;
}

/* Keep the main navigation black and readable on the JoyToy yellow header. */
#header #menu-mega-menu>li>a{
    border-radius:8px;
    transition:background-color .18s ease,color .18s ease;
}

#header #menu-mega-menu>li.current-menu-item>a,
#header #menu-mega-menu>li.current-menu-parent>a,
#header #menu-mega-menu>li.current-menu-ancestor>a{
    background:transparent!important;
    color:#151515!important;
}

/* Desktop main-menu hover: JoyToy red behind the picto, black label. */
@media(min-width:768px){
    #header #menu-mega-menu>li:hover>a,
    #header #menu-mega-menu>li:focus-within>a,
    #header #menu-mega-menu>li.open>a,
    #header #menu-mega-menu>li.active>a{
        background:#ed1f25!important;
        color:#151515!important;
    }
}

#header #menu-mega-menu>li:hover>a>span,
#header #menu-mega-menu>li:focus-within>a>span,
#header #menu-mega-menu>li.open>a>span,
#header #menu-mega-menu>li.active>a>span,
#header #menu-mega-menu>li.current-menu-item>a>span,
#header #menu-mega-menu>li.current-menu-parent>a>span,
#header #menu-mega-menu>li.current-menu-ancestor>a>span{
    color:#151515!important;
}

/* White menu surface: the products and pictos provide the colour. */
#header #menu-mega-menu>li>.sub-menu{
    border:1px solid rgba(21,21,21,.08)!important;
    border-radius:10px!important;
    background:#f5f1e8!important;
    box-shadow:0 16px 38px rgba(21,21,21,.18)!important;
    color:#151515!important;
}

#header #menu-mega-menu>li>.sub-menu a{
    color:#151515!important;
}

/* Reset the theme's former red panels on every inner list. */
#header #menu-mega-menu>li>.sub-menu>li>.sub-menu,
#header #menu-mega-menu>li>.sub-menu>li>.sub-menu>li{
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

/* A one-column dropdown sizes itself to its content, within sensible limits. */
#header #menu-mega-menu>li:not([class*="menu-col-"])>.sub-menu{
    width:max-content!important;
    min-width:240px!important;
    max-width:320px!important;
}

#header #menu-mega-menu>li:not([class*="menu-col-"])>.sub-menu>li{
    width:auto!important;
    min-width:200px!important;
}

/* Only actual WooCommerce category columns receive the picto-above-title layout. */
#header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item>a:first-of-type{
    display:flex!important;
    min-height:0!important;
    height:auto!important;
    padding:8px 10px!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px;
    box-sizing:border-box;
    border-radius:8px;
    color:#151515!important;
    opacity:1!important;
    text-align:center!important;
    transition:background-color .18s ease,color .18s ease;
}

#header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item:hover>a:first-of-type,
#header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item:focus-within>a:first-of-type,
#header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item.current-menu-item>a:first-of-type,
#header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item.current-product_cat-parent>a:first-of-type,
#header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item.current-menu-ancestor>a:first-of-type{
    background:#ed1f25!important;
    color:#fff!important;
}

/* Bare, larger category artwork: no tile, frame, padding or shadow. */
#header #menu-mega-menu .joytoy-menu-category-icon{
    display:block!important;
    width:76px!important;
    height:62px!important;
    min-width:0!important;
    flex:0 0 62px!important;
    margin:0 auto!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    object-fit:contain!important;
    background:transparent!important;
}

#header #menu-mega-menu .joytoy-menu-category-label{
    display:block;
    width:100%;
    min-width:0;
    margin:0!important;
    padding:0!important;
    color:inherit!important;
    font-weight:700;
    line-height:1.22;
    text-align:center!important;
}

/* Child links stay quiet and readable; their hover uses the same JoyToy red. */
#header #menu-mega-menu>li>.sub-menu>li>.sub-menu a{
    display:block!important;
    padding:5px 11px!important;
    box-sizing:border-box!important;
    border-radius:6px;
    background:transparent!important;
    color:#5f5b55!important;
    transition:background-color .18s ease,color .18s ease;
}

#header #menu-mega-menu>li>.sub-menu>li>.sub-menu li:hover>a,
#header #menu-mega-menu>li>.sub-menu>li>.sub-menu li:focus-within>a,
#header #menu-mega-menu>li>.sub-menu>li>.sub-menu li.current-menu-item>a{
    background:#ed1f25!important;
    color:#fff!important;
}

#header #menu-mega-menu>li>.sub-menu>li>.sub-menu a.js-more{
    display:none!important;
}

@media(max-width:767px){
    #header #menu-mega-menu>li>a .joytoy-menu-main-icon{
        display:inline-block!important;
        width:34px!important;
        height:34px!important;
        margin:0 10px 0 0!important;
        vertical-align:middle!important;
    }

    /* Let the theme's native sliding mobile menu control the layout. */
    #header #menu-mega-menu>li>.sub-menu{
        border:0!important;
        border-radius:0!important;
        background:#fff!important;
        box-shadow:none!important;
        color:#151515!important;
    }

    /* Every deeper sliding panel must be opaque so levels never show through. */
    #header #menu-mega-menu#menu-mega-menu>li>.sub-menu>li>.sub-menu,
    #header #menu-mega-menu#menu-mega-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu{
        border:0!important;
        background-color:#fff!important;
        background-image:none!important;
        box-shadow:none!important;
        color:#151515!important;
        opacity:1!important;
    }

    #header #menu-mega-menu>li:not([class*="menu-col-"])>.sub-menu,
    #header #menu-mega-menu>li:not([class*="menu-col-"])>.sub-menu>li{
        width:100%!important;
        min-width:0!important;
        max-width:none!important;
    }

    #header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item>a:first-of-type{
        display:block!important;
        width:auto!important;
        min-height:0!important;
        height:auto!important;
        padding:15px 0 15px 30px!important;
        border-radius:0!important;
        background:transparent!important;
        color:#151515!important;
        text-align:left!important;
    }

    #header #menu-mega-menu .joytoy-menu-category-icon{
        display:none!important;
    }

    #header #menu-mega-menu .joytoy-menu-category-label{
        color:#151515!important;
        text-align:left!important;
    }

    #header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item:hover>a:first-of-type,
    #header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item:focus-within>a:first-of-type,
    #header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item.current-menu-item>a:first-of-type,
    #header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item.current-product_cat-parent>a:first-of-type,
    #header #menu-mega-menu>li>.sub-menu>li.joytoy-menu-category-item.current-menu-ancestor>a:first-of-type{
        background:transparent!important;
        color:#151515!important;
    }

    #header #menu-mega-menu>li>.sub-menu>li>.sub-menu a{
        display:block!important;
        width:auto!important;
        padding:15px 0 15px 30px!important;
        border-radius:0!important;
        background:transparent!important;
        color:#151515!important;
        text-align:left!important;
    }

    #header #menu-mega-menu>li>.sub-menu>li>.sub-menu li:hover>a,
    #header #menu-mega-menu>li>.sub-menu>li>.sub-menu li:focus-within>a,
    #header #menu-mega-menu>li>.sub-menu>li>.sub-menu li.current-menu-item>a{
        background:transparent!important;
        color:#151515!important;
    }

    #header #menu-mega-menu>li>.sub-menu>li>.sub-menu a.js-more{
        display:block!important;
        width:60px!important;
        padding:0!important;
    }
}
/* v1.1.40 — preserve the Kidz footer geometry while reducing only its rhythm */
#footer.footer--default .footer-sidebar{
    padding-top:60px!important;
}

#footer.footer--default .footer-sidebar__wrap{
    margin-top:-40px!important;
}

#footer.footer--default .footer-sidebar__wrap>.footer-widget{
    margin-top:40px!important;
}

#footer.footer--default .row.bottom{
    margin-top:26px!important;
    padding-top:20px!important;
    margin-bottom:26px!important;
}

/* v1.1.41 — replace the footer paragraph with a larger JoyToy mark */
#footer.footer--default .footer-logo{
    display:flex!important;
    width:auto!important;
    height:150px!important;
    padding:0!important;
    align-items:center!important;
    justify-content:flex-start!important;
}

#footer.footer--default .footer-logo img{
    width:auto!important;
    height:auto!important;
    max-width:180px!important;
    max-height:145px!important;
}

#footer.footer--default .contacts{
    display:none!important;
}

@media(max-width:600px){
    #footer.footer--default .footer-sidebar{
        padding-top:46px!important;
    }

    #footer.footer--default .footer-sidebar__wrap{
        margin-top:-26px!important;
    }

    #footer.footer--default .footer-sidebar__wrap>.footer-widget{
        margin-top:26px!important;
    }

    #footer.footer--default .row.bottom{
        margin-top:20px!important;
        padding-top:16px!important;
        margin-bottom:20px!important;
    }

    #footer.footer--default .footer-logo{
        height:125px!important;
        justify-content:center!important;
    }

    #footer.footer--default .footer-logo img{
        max-width:160px!important;
        max-height:120px!important;
    }
}
