/* PANJI navbar inline SVG icon system.
 * The navbar no longer relies on Bootstrap Icons font glyph availability.
 */

.panji-navbar-icon-sprite {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    pointer-events: none;
}

.panji-navbar .panji-icon {
    width: 1.2rem;
    height: 1.2rem;
    display: block;
    flex: 0 0 1.2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.panji-navbar .panji-navbar-icon-link .panji-icon,
.panji-navbar .panji-navbar-profile-button .panji-icon,
.panji-navbar .panji-navbar-toggler .panji-icon {
    width: 1.42rem;
    height: 1.42rem;
    flex-basis: 1.42rem;
}

.panji-navbar .dropdown-item > .panji-icon {
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 1.25rem;
    color: #2e6f95;
}

.panji-navbar .dropdown-item:hover > .panji-icon,
.panji-navbar .dropdown-item:focus > .panji-icon,
.panji-navbar .dropdown-item.active > .panji-icon,
.panji-navbar .dropdown-item[aria-current="page"] > .panji-icon {
    color: #1d4963;
}

.panji-navbar .dropdown-item.text-danger > .panji-icon {
    color: #b51e2a;
}

.panji-navbar .panji-dropdown-chevron {
    width: 0.82rem;
    height: 0.82rem;
    flex-basis: 0.82rem;
    margin-left: 0.42rem;
}

.panji-navbar .panji-menu-close-icon {
    display: none;
}

.panji-navbar .panji-navbar-toggler[aria-expanded="true"] .panji-menu-open-icon {
    display: none;
}

.panji-navbar .panji-navbar-toggler[aria-expanded="true"] .panji-menu-close-icon {
    display: block;
}

@media (forced-colors: active) {
    .panji-navbar .panji-icon {
        color: ButtonText;
        forced-color-adjust: auto;
    }
}
