/* ÖGKM navigation refinement: desktop layout, dropdown hover bridge, custom carets */

@media (min-width: 1200px) {
    .oegkm-site-header,
    .site-header,
    header.site-header,
    header.oegkm-header {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        z-index: 50;
        background: transparent;
    }

    body.admin-bar .oegkm-site-header,
    body.admin-bar .site-header,
    body.admin-bar header.site-header,
    body.admin-bar header.oegkm-header {
        top: 32px;
    }

    .navbar,
    .oegkm-header-bar {
        align-items: center;
    }

    .navbar .navbar-collapse {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        flex-basis: auto;
        width: auto !important;
    }

    .navbar .navbar-nav {
        display: flex !important;
        flex-direction: row !important;
        align-items: center;
        gap: 2rem;
        width: auto !important;
        margin: 0;
    }

    .navbar .navbar-nav > .menu-item,
    .navbar .navbar-nav > .nav-item {
        position: relative;
        display: flex;
        align-items: center;
        padding-bottom: 0.5rem; /* invisible hover bridge to dropdown */
        margin-bottom: -1.2rem;
    }

    .navbar .navbar-nav > .menu-item > a,
    .navbar .navbar-nav > .nav-item > a {
        display: inline-flex;
        align-items: center;
        gap: .45rem;
        white-space: nowrap;
    }

    .navbar .navbar-nav .dropdown-menu,
    .navbar .navbar-nav .sub-menu {
        margin-top: 0 !important;
        top: calc(100% - .05rem) !important;
        border: 0;
        border-radius: 24px;
        padding: 1.25rem 1.55rem;
        min-width: 280px;
        box-shadow: 0 24px 60px rgba(0,0,0,.08);
    }

    .navbar .navbar-nav .dropdown-menu::before,
    .navbar .navbar-nav .sub-menu::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -1.2rem;
        height: 1.2rem;
        background: transparent;
    }

    .navbar .dropdown:hover > .dropdown-menu,
    .navbar .menu-item-has-children:hover > .sub-menu,
    .navbar .dropdown:focus-within > .dropdown-menu,
    .navbar .menu-item-has-children:focus-within > .sub-menu {
        display: block;
    }
}

/* Replace Bootstrap caret with a clean ÖGKM down-chevron */
.navbar .dropdown-toggle::after,
.navbar .menu-item-has-children > a::after {
    content: "";
    display: inline-block;
    width: .48rem;
    height: .48rem;
    margin-left: .38rem;
    border: 0 !important;
    border-right: 1.8px solid currentColor !important;
    border-bottom: 1.8px solid currentColor !important;
    transform: translateY(-.12rem) rotate(45deg);
    vertical-align: middle;
    background: transparent !important;
}

/* Avoid double/odd arrows from previous patches or icon fonts */
.navbar .dropdown-toggle > .dropdown-toggle::after,
.navbar .menu-item-has-children > a > .dropdown-toggle::after {
    display: none !important;
}

/* Mobile keeps Bootstrap collapse, but with the same caret style */
@media (max-width: 1199.98px) {
    .navbar-collapse {
        background: #fff;
        border-radius: 24px;
        margin-top: 1rem;
        padding: 1.5rem;
        box-shadow: 0 24px 60px rgba(0,0,0,.08);
    }

    .navbar-nav {
        gap: 1rem;
    }

    .navbar-nav .dropdown-menu,
    .navbar-nav .sub-menu {
        border: 0;
        padding-left: 1rem;
        background: transparent;
        box-shadow: none;
    }

    .navbar .navbar-nav .dropdown-toggle,
    .navbar .navbar-nav .menu-item-has-children > a {
        position: relative;
        padding-right: 2rem;
    }

    .navbar .navbar-nav .dropdown-toggle::after,
    .navbar .navbar-nav .menu-item-has-children > a::after {
        position: absolute !important;
        right: .1rem !important;
        top: 50% !important;
        width: .55rem !important;
        height: .55rem !important;
        margin: 0 !important;
        transform: translateY(-60%) rotate(45deg) !important;
    }

    .navbar .navbar-nav .dropdown-toggle.show::after,
    .navbar .navbar-nav .menu-item-has-children > a.show::after {
        transform: translateY(-35%) rotate(-135deg) !important;
    }
}