/* Gemeinsame Suchzeile für den Header des Plugins pv_carton_finder.
 * Entspricht dessen Umbruch bei 1300px; die mobile Ansicht endet bei 992px.
 * Der Header-ID-Selektor hält diese Regeln auch vor dem Plugin-CSS wirksam.
 */
@media (min-width: 992px) and (max-width: 1299.98px) {
    #jtl-nav-wrapper .pv-cf-navbar {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        grid-template-areas:
            ". logo logo icons"
            "finder finder search search";
        align-items: center;
        gap: 1rem 1.5rem;
        padding: .75rem 1rem .5rem;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .nav-logo-wrapper {
        grid-area: logo;
        min-width: 0;
        max-width: 100%;
        margin: 0;
        padding: 0;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .nav-logo-wrapper .toggler-logo-wrapper {
        width: 100%;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .nav-logo-wrapper .navbar-brand {
        display: flex;
        justify-content: center;
        margin: 0;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .nav-logo-wrapper .navbar-brand img {
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 3.5rem;
        object-fit: contain;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .nav-icons-wrapper {
        grid-area: icons;
        justify-self: end;
        padding: 0;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .pv-cf-header {
        grid-area: finder;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .main-search-wrapper {
        grid-area: search;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .pv-cf-header,
    #jtl-nav-wrapper .pv-cf-navbar > .main-search-wrapper {
        width: 100%;
        min-width: 0;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .pv-cf-header .pv-cf-form {
        max-width: none;
        margin: 0;
    }

    #jtl-nav-wrapper .pv-cf-navbar > .main-search-wrapper #search {
        margin: 0;
    }
}