nav.navbar {
    min-height: 62px;
    border-bottom: 1px solid var(--bs-gray);
}

.nav-menu .hr span {
    color: var(--bs-muted) !important;
}
.nav-menu {
    font-family: var(--bs-font-nav);
    color: var(--bs-dark);
    padding-bottom: 0.2rem;
    padding-top: 0.1rem;
    font-size: 1rem;
}
.navbar-nav .nav-link {
    color: var(--bs-dark);
}
.navbar .nav-item .nav-link:hover,
.navbar .nav-item .nav-link:focus,
.navbar .nav-item .nav-link:active {
    color: var(--bs-dark);
}
/* notification */
.noti-dropdown.dropdown-toggle::after {
    content: unset;
}
.noti-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 7px;
    height: 7px;
    font-size: small;
    top: 5%;
    right: 10%;
}
.noti-dropdown-box {
    margin-top: 0.6rem !important;
    right: -60px;
    min-width: 300px;
    width: 80%;
    left: unset !important;
    overflow: hidden;
}
.noti-body {
    overflow-y: scroll;
    max-height: 300px;
    overflow-x: hidden;
    border-radius: 15px;
}

.dropdown-menu.dropdown-knowledge-map,
.dropdown-menu.dropdown-external-url {
    border-radius: 15px;
}

/* notification card list */
.dropdown-action::after {
    content: unset !important;
}

.card-noti:hover {
    background: #e3f6fb;
}

.noti-small {
    font-size: 0.9rem;
}

.noti-smaller {
    font-size: 0.8rem;
}

.noti-smallest {
    font-size: 0.7rem;
}

.noti-dot {
    font-size: 0.5rem;
}

/* dropdown profile lg */
.dropdown-menu.dropdown-profile-lg {
    border-radius: 15px;
    left: -120px !important;
    min-width: 15rem !important;
}
/* dropdown profile mobile */
.dropdown-toggle.dropdown-profile-m::after {
    content: unset;
}

ul.dropdown-profile-m > li:not(:last-child) {
    margin-bottom: 10px;
}

ul.dropdown-profile-m li a.dropdown-item {
    padding-left: 0;
    padding-right: 0;
}
.dropdown-profile-m.show div i {
    rotate: 180deg;
    transition: 0.5s;
}

.nav-link.dropdown-toggle::after {
    content: unset;
}
.nav-link.dropdown-toggle.show div i {
    rotate: 180deg;
    transition: 0.5s;
}
/* Hamburger menu button start  */
.ham-btn,
.ham-btn.collapsed {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    padding: 10px;
    /* margin-right: 20px; */
}
.ham-btn span,
.ham-btn.collapsed span {
    width: 30px;
    height: 3px;
    background-color: #333;
    margin-bottom: 5px;
    transition: all 0.3s ease-in-out;
}

.ham-btn.collapsed span:nth-child(1) {
    transform: unset;
}
.ham-btn.collapsed span:nth-child(2) {
    opacity: 1;
}
.ham-btn.collapsed span:nth-child(3) {
    transform: unset;
}

/* Hamburger menu button animation */

.ham-btn span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}

.ham-btn span:nth-child(2) {
    opacity: 0;
}

.ham-btn span:nth-child(3) {
    transform: translateY(-10px) rotate(-45deg);
}
/* Hamburger menu button end  */

@media (max-width: 1199px) {
    .nav-menu .hr {
        display: none;
    }
}

/* fast search */
.card-search-result {
    border-radius: 15px;
}
.card-search-result:hover {
    background: #e3f6fb;
}

#searchNav {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 250px;
    position: fixed;
    top: -250px;
    z-index: 1000;
    transition: top 0.5s ease;
}
#searchNav.active {
    top: 50px;
}
@keyframes mymove {
    from {
        top: 0px;
    }
    to {
        top: 200px;
        background-color: blue;
    }
}

.nav-search-wrapper {
    width: 500px;
}
@media (max-width: 550px) {
    .nav-search-wrapper {
        width: 100%;
        padding: 0 10px;
    }
}

.form-control.form_search_nav {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    background: url(../img/search-g.svg);
    background-position: 10px 10px;
    background-repeat: no-repeat;
    padding: 10px 20px 10px 40px;
    background-color: #ffffff;
    border: 1px solid #efefef;
    border-radius: 25px !important;
    z-index: 99;
    position: relative;
}

#search_result_nav {
    border-radius: 0 0 25px 25px;
    z-index: 98;
    padding-top: 20px;
    margin-top: -20px;
    width: 100%;
    overflow: hidden;
}

.btn-close-search {
    position: absolute;
    bottom: -5%;
    border: 1px solid var(--bs-muted);
    background: #ffffff;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 8px;
}
.modal-login-icon {
    font-size: 2.5rem;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}