[data-bs-theme='dark'] {
    .navbar-brand-autodark {
        @media screen and (min-width: 992px) {
            background-color: rgba(var(--bb-gray-800-rgb), 1);
        }

        .navbar-brand-image {
            filter: unset;
        }
    }

    &.navbar-vertical {
        background-color: rgba(var(--bb-gray-800-rgb), 0.9);

        @media screen and (min-width: 992px) {
            position: absolute !important;
        }
    }
}

.navbar-nav {
    > .container-3xl {
        display: flex;
        flex-wrap: inherit;
        align-items: center;
        justify-content: space-between;
    }

    .dropdown-toggle {
        &:after {
            color: var(--bb-icon-color);
        }
    }

    .nav-item {
        &.dropdown {
            .dropdown-toggle {
                .nav-link-icon {
                    color: var(--bb-icon-color);
                }
            }

            .dropdown-menu {
                .dropdown {
                    .dropdown-toggle {
                        &:after {
                            margin-inline-start: auto;
                        }
                    }

                    .dropdown-menu {
                        position: relative !important;
                        box-shadow: none;
                        border-radius: 0;
                        border: 0;

                        .dropdown-item {
                            padding-inline-start: 2rem;
                            font-size: 0.8rem;
                        }
                    }
                }
            }
        }

        &:last-child {
            &> .dropdown-toggle:after {
                display: none;
            }
        }

        &.active {
            .badge {
                background-color: var(--bb-white) !important;
                color: var(--bb-primary) !important;
            }
        }
    }

}

.navbar-collapse {
    .navbar-nav {
        .nav-link {
            .badge {
                position: unset !important;
                margin-inline-start: 4px;
                transform: none !important;
            }
        }
    }
}

.navbar-vertical {
    overflow: auto !important;

    .navbar-collapse {
        .nav-item {
            .dropdown-toggle {
                &:after {
                    transition: transform 0.15s ease-out;
                }

                &.show:after {
                    transform: rotate(135deg);
                    color: var(--bb-navbar-active-color);
                }
            }

            &.active {
                .nav-link {
                    background-color: var(--bb-primary);
                    border-radius: 0;

                    .nav-link-icon {
                        color: var(--bb-navbar-active-color)!important;
                    }
                }

                &:after {
                    border: none;
                }
            }

            .dropdown-menu {
                .dropdown-item {
                    &.active {
                        background-color: rgba(var(--bb-secondary-rgb), 0.08) !important;
                    }
                }
            }
        }
    }
}

@media (max-width: 768px) {
    .navbar-vertical {
        overflow: inherit !important;
    }
}

@media (min-width: 768px) {
    .animate {
        animation-duration: 0.3s;
        -webkit-animation-duration: 0.3s;
        animation-fill-mode: both;
        -webkit-animation-fill-mode: both;
    }
}

@keyframes slideIn {
    0% {
        transform: translateY(1rem);
        opacity: 0;
    }

    100% {
        transform: translateY(0rem);
        opacity: 1;
    }

    0% {
        transform: translateY(1rem);
        opacity: 0;
    }
}

@-webkit-keyframes slideIn {
    0% {
        -webkit-transform: transform;
        -webkit-opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        -webkit-opacity: 1;
    }

    0% {
        -webkit-transform: translateY(1rem);
        -webkit-opacity: 0;
    }
}

.slideIn {
    -webkit-animation-name: slideIn;
    animation-name: slideIn;
}