.navigation-wrapper {position: sticky;position: -webkit-sticky;top: 0;width: 100%;box-shadow: 0 0 10px 0 rgba(var(--black-rgb), 0.1);padding: 20px 0;background-color: var(--white);z-index: 1040;}
.navigation-wrapper .container-wrapper {display: flex;align-items: center;flex-wrap: wrap;gap: 16px;}

.site-logo {display: flex;}
.site-logo a {display: inline-flex;align-items: center;gap: 10px;}
site-logo a img {height: 30px;}

.nav-action {padding-left: 30px;margin-left: 15px;border-left: 1px solid var(--grey);}
.nav-action .navigation-links {display: flex;flex-wrap: wrap;align-items: center;gap: 16px 26px;margin: 0;}
.nav-action .navigation-links>li {display: inline-flex;}
.nav-action .navigation-links>li>a {display: inline-flex;align-items: center;gap: 14px;color: var(--black6);font-size: var(--fs-14);font-weight: var(--fw-400);}
.nav-action .navigation-links>li>a svg {display: inline-flex;align-items: center;}

.nav-action .navigation-links>li>a:hover,.nav-action .navigation-links>li>a.active,.nav-action .navigation-links>li.active>a {color: var(--themeOrange);}

.nav-right-block {margin-left: auto;display: flex;align-items: center;flex-wrap: wrap;gap: 16px;}

.navigation-wrapper .searchbar-block {position: relative;min-width: 265px;}
.navigation-wrapper .searchbar-block .field-control {border-radius: 8px;background: rgba(var(--dark-rgb), 0.05);padding: 10px 40px 10px 10px;color: var(--dark);font-size: var(--fs-14);font-weight: var(--fw-400);line-height: normal;box-shadow: none;border: 0;width: 100%;}
.navigation-wrapper .searchbar-block .search-btn {display: inline-flex;align-items: center;justify-content: center;width: 20px;height: 20px;position: absolute;right: 10px;top: 50%;margin-top: -10px;}

.search-icon-xs {display: none;}

.navigation-wrapper .list-action {min-width: 30px;}
.navigation-wrapper .list-action ul {display: flex;flex-wrap: wrap;align-items: center;gap: 27px;margin: 0;}
.navigation-wrapper .list-action ul > li {line-height: 1;}
.navigation-wrapper .list-action ul>li>a {position: relative;display: inline-flex;color: var(--black6);}
.navigation-wrapper .list-action ul>li>a.notification-info :hover {color: var(--themeOrange);}
.navigation-wrapper .list-action ul>li>a .count {display: inline-flex;align-items: center;justify-content: center;text-align: center;background-color: var(--red);color: var(--white);border: 1px solid var(--white);border-radius: 45px;font-size: var(--fs-8);font-weight: var(--fw-600);min-width: 20px;position: absolute;right: -10px;top: -3px;}

.total-progress-info {display: flex;flex-wrap: wrap;align-items: center;gap: 7px;}
.total-progress-info .progress-chart {width: 37px;}
.total-progress-info span {flex: 1 0 0;}

.navigation-wrapper .navbar-toggler-icon {background: transparent;border: 0;padding: 0;margin: 0;display: none;position: relative;width: 24px;height: 24px;}
.navigation-wrapper .navbar-toggler-icon i,.navigation-wrapper .navbar-toggler-icon i:after,.navigation-wrapper .navbar-toggler-icon i:before {background-color: var(--black);position: absolute;width: 22px;height: 2px;transition-timing-function: ease;transition-duration: 0.3s;transition-property: transform;border-radius: 24px;left: 0;right: 0;margin: auto;}
.navigation-wrapper .navbar-toggler-icon i {transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);transition-duration: 300ms;left: 0;top: 50%;display: block;margin-top: 0;}
.navigation-wrapper .navbar-toggler-icon i:after,.navigation-wrapper .navbar-toggler-icon i:before {display: block;content: "";}
.navigation-wrapper .navbar-toggler-icon i:before {top: -7px;transition: top 300ms ease 0.15s, opacity 300ms ease;}
.navigation-wrapper .navbar-toggler-icon i:after {bottom: -7px;transition: bottom 300ms ease 0.15s,transform 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19);}

.mobile-aside-open .navigation-wrapper .navbar-toggler-icon i {transition-delay: 0.12s;transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}
.mobile-aside-open .navigation-wrapper .navbar-toggler-icon i:before {top: 0;transition: top 300ms ease, opacity 300ms ease 0.15s;opacity: 0;}
.mobile-aside-open .navigation-wrapper .navbar-toggler-icon i:after {bottom: 0;transition: bottom 300ms ease, transform 300ms cubic-bezier(0.215, 0.61, 0.355, 1) 0.15s;transform: rotate(-90deg);}

.profile-head {position: relative;display: flex;align-items: center;flex-wrap: wrap;gap: 8px;}
.profile-head .avatar {display: inline-flex;align-items: center;justify-content: center;background: var(--white);border: 1px solid var(--black6);width: 36px;height: 36px;border-radius: 100%;box-shadow: 0px 0px 20px 0px rgba(var(--black-rgb), 0.1);}
.profile-head .user-content {flex: 1 0 0;}

.bell-notification {margin-right: 27px; position: relative;}
.bell-notification > a {position: relative;}
.bell-notification > a:hover svg * {stroke: var(--themeOrange);}

.profile-head .dropdown-toggle {padding: 0;gap: 8px;}
.profile-head .dropdown-toggle::after {display: none;}
.profile-head .dropdown-menu {border: 1px solid var(--lightBorder2);box-shadow: 0px 0px 10px 1px rgba(var(--black-rgb), 0.05);right: 0 !important;left: auto !important;padding: 0;overflow: hidden;min-width: 150px;margin-top: 10px !important;}
.profile-head .dropdown-menu .dropdown-item {color: var(--black3);font-size: var(--fs-14);font-weight: var(--fw-400);display: block;padding: 8px 15px;border-bottom: 1px solid var(--lightBorder2);line-height: 1.5;}
.profile-head .dropdown-menu .dropdown-item:hover {background-color: var(--themeOrange); color: var(--white);}
.profile-head .dropdown-menu .dropdown-item > a:hover {color: var(--white);}

/*----*/

@media (min-width: 1024px) {
    .nav-action {display: flex !important;}
}

@media (min-width: 768px) {
    .navigation-wrapper .searchbar-block {display: flex !important;}
}

@media (max-width: 1199px) {
    .nav-action {padding-left: 0;}
    .nav-action .navigation-links {gap: 16px;}
}

@media (max-width: 1023px) {
    .navbar-toggler-icon {display: flex;}
    .nav-action {display: none;position: absolute;top: 100%;left: 0;right: 0;padding: 15px 0;background-color: var(--white);z-index: 1020;height: calc(100vh - 78px);overflow-y: auto;border-top: 1px solid var(--lightBorder);margin: 0;border-left: 0;}
    .nav-action .navigation-links {flex-direction: column;align-items: stretch;}
    .nav-action .navigation-links>li {display: block;border-bottom: 1px solid var(--lightBorder);padding: 0 15px 15px;}
    .navigation-wrapper .list-action ul {gap: 15px;}
    .profile-head .avatar {width: 28px;height: 28px;padding: 5px;}
}

@media (max-width: 991px) {
    .navigation-wrapper .list-action {min-width: auto;margin-right: 5px;}
}

@media (max-width: 767px) {
    .search-icon-xs {display: inline-flex;}
    .search-icon-xs .search-toggler img {height: 18px;filter: brightness(0);}
    .navigation-wrapper .searchbar-block {display: none;position: absolute;top: 100%;right: 50px;}
}

@media (max-width: 575px) {}

@media (max-width: 479px) {
    .total-progress-info .progress-chart {width: 30px;}
    .total-progress-info span {display: none;}
    .navigation-wrapper .searchbar-block {left: 0;right: 0;width: 100%;}
    .navigation-wrapper .searchbar-block .field-control {border-radius: 0;}
    .nav-action {height: calc(100vh - 70px);}
}