/* MatthiesDigitalSuite 1.0.21: sichere Kategorienzeile ohne DOM-Umbau */

@media (min-width: 992px) {
    /* Der NOVA-Header bleibt strukturell unveraendert. Lediglich der bereits
       vorhandene Menuebereich liegt absolut im reservierten unteren Teil. */
    #jtl-nav-wrapper {
        padding-bottom: 58px !important;
    }

    #jtl-nav-wrapper #mainNavigation.nav-scrollbar {
        position: absolute !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        top: auto !important;
        z-index: 2;
        display: flex !important;
        align-items: center;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: 58px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border-top: 1px solid var(--md-border, #dce6f2);
        background: rgba(255, 255, 255, .98);
    }

    #jtl-nav-wrapper #mainNavigation .nav-mobile-body {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    #jtl-nav-wrapper #mainNavigation .nav-scrollbar-inner,
    #jtl-nav-wrapper #mainNavigation .navbar-nav {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: stretch;
        justify-content: center;
        gap: .2rem;
        width: 100% !important;
        max-width: 1280px !important;
        margin: 0 auto !important;
        padding: .3rem 1rem !important;
        overflow: visible !important;
    }

    #jtl-nav-wrapper #mainNavigation .navbar-nav > .nav-item {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    #jtl-nav-wrapper #mainNavigation .navbar-nav > .nav-item > .nav-link {
        display: flex;
        align-items: center;
        min-height: 48px;
        padding: .65rem 1.15rem;
    }

    #jtl-nav-wrapper #mainNavigation .nav-scrollbar-arrow,
    #jtl-nav-wrapper #mainNavigation > .nav-scrollbar-arrow,
    #jtl-nav-wrapper .navbar > .nav-scrollbar-arrow {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    #jtl-nav-wrapper #mainNavigation .navbar-nav > .nav-item > .nav-link {
        padding-right: .75rem;
        padding-left: .75rem;
    }
}
