.backdrop {
    display: none;
    position: fixed;
    width: 100vw;
    height: 0;
    top: 0;
    inset-inline-start: 0;
    z-index: 150;
    transition: background-color 0.5s;
}

body.scroll-hidden {
    overflow-y: hidden;
}

body.menu-open .header-logo {
    content: url("/assets/img/nat-white.svg");
}

body.menu-open .header-search.header-icon {
    content: url("/assets/img/search-white.svg") !important;
}

body.menu-open .header-container .inner-navigation .nav-item {
    color: var(--color-white) !important;
}

body.menu-open .header-menu.header-icon {
    content: url("/assets/img/times-white-icon.svg") !important;
    width: 17px;
    height: 17px;
}

body.menu-open .app-header .inner-navigation .nav-item::after {
    background-color: var(--color-white) !important;
}

body.search-open .header-search.header-icon {
    content: url("/assets/img/times-black-icon.svg");
    width: 17px;
    height: 17px;
}

@media (min-width: 1194px) {
    body.search-open .header-search.header-icon,
    body.menu-open .header-menu.header-icon {
        width: 25px;
        height: 25px;
    }
}

@media (min-width: 1500px) {
    body.search-open .header-search.header-icon,
    body.menu-open .header-menu.header-icon {
        width: 27px;
        height: 27px;
    }
}