/* nhatdx-header-styles */

.header-bottom .nav > li > a,
.header-main .nav > li > a {
    position: relative;
    padding-top: 14px !important; padding-bottom: 14px !important;
    transition: color .18s;
}
.header-bottom .nav > li > a::after,
.header-main .nav > li > a::after {
    content: ""; position: absolute; left: 50%; bottom: 8px;
    width: 0; height: 2px; border-radius: 2px;
    background: currentColor; opacity: .9;
    transform: translateX(-50%);
    transition: width .22s ease;
}
.header-bottom .nav > li > a:hover::after,
.header-main .nav > li > a:hover::after { width: calc(100% - 4px); }

.header-bottom .nav > li.current-menu-item > a,
.header-bottom .nav > li.current-menu-parent > a,
.header-bottom .nav > li.current-menu-ancestor > a,
.header-main .nav > li.current-menu-item > a,
.header-main .nav > li.current-menu-parent > a {
    background: none !important; border-radius: 0 !important;
}
.header-bottom .nav > li.current-menu-item > a::after,
.header-bottom .nav > li.current-menu-parent > a::after,
.header-bottom .nav > li.current-menu-ancestor > a::after,
.header-main .nav > li.current-menu-item > a::after { width: calc(100% - 4px) !important; }

.header .nav-dropdown li a,
.header-bottom-nav > li:hover .nav-dropdown a,
.header-bottom-nav > li:hover .nav-column a {
    background: transparent !important;
    color: #333 !important;
}
.header .nav-dropdown li a:hover,
.header .nav-dropdown li.current-menu-item > a {
    background: #FBF9F6 !important;
    color: var(--nhatdx-primary, #C67930) !important;
}

.header .nav-dropdown.nav-dropdown-has-arrow,
.header .nav-dropdown {
    display: flex !important; flex-wrap: wrap; align-items: flex-start;
    padding: 14px 10px !important;
}
.header .nav-dropdown > li {
    flex: 1 1 0 !important; min-width: 168px !important; max-width: 280px !important;
    margin: 0 !important; padding: 0 8px !important;
}

.header .nav-dropdown > li > a {
    padding: 6px 10px 10px !important; margin-bottom: 6px !important;
    border-bottom: 1px solid #F4F2EF !important;
    font-size: 13px !important; font-weight: 800 !important;
    color: var(--nhatdx-ink, #342A22) !important; text-transform: uppercase !important;
    letter-spacing: .02em !important; white-space: normal !important;
}
.header .nav-dropdown > li > a:hover { background: transparent !important; }

.header .nav-dropdown ul.sub-menu,
.header .nav-dropdown ul.nav-column-ul { margin: 0 !important; padding: 0 !important; }
.header .nav-dropdown ul li a {
    padding: 7px 10px !important; border: 0 !important;
    font-size: 13.5px !important; font-weight: 400 !important;
    text-transform: none !important; letter-spacing: normal !important; white-space: normal !important;
}

.header .nav-dropdown {
    border-radius: 12px !important; padding: 10px 0 !important;
    box-shadow: 0 12px 34px rgba(35,27,21,.16) !important; border: 0 !important;
}
.header .nav-dropdown:not(.nav-dropdown-has-arrow) > li:not(.menu-item-has-children) > a,
.header .nav-dropdown > li:not(.menu-item-has-children):not(.nav-dropdown-col) > a {
    padding: 9px 18px !important;
    font-size: 13.5px !important; transition: background .15s, padding-left .15s;
}
.header .nav-dropdown > li > a:hover { background: rgba(198,121,48,.08) !important; padding-left: 22px !important; }

@media (min-width: 700px) and (max-width: 1100px) {
    .header-bottom .nav,
    .header-main .header-nav .nav {
        flex-wrap: nowrap !important;
        overflow-x: auto; overflow-y: hidden;
        scrollbar-width: none; -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
    }
    .header-bottom .nav::-webkit-scrollbar,
    .header-main .header-nav .nav::-webkit-scrollbar { height: 0; width: 0; display: none; }
    .header-bottom .nav > li,
    .header-main .header-nav .nav > li { flex: 0 0 auto; scroll-snap-align: start; }
    .header-bottom .nav > li > a { white-space: nowrap; }


    .nhatdx-nav-scroller { position: relative; }
    .nhatdx-nav-scroller::before,
    .nhatdx-nav-scroller::after {
        content: ""; position: absolute; top: 0; bottom: 0; width: 26px; pointer-events: none; z-index: 2;
        opacity: 0; transition: opacity .2s;
    }
    .nhatdx-nav-scroller::before { left: 0;  background: linear-gradient(90deg, rgba(0,0,0,.18), transparent); }
    .nhatdx-nav-scroller::after  { right: 0; background: linear-gradient(270deg, rgba(0,0,0,.18), transparent); }
    .nhatdx-nav-scroller.can-left::before  { opacity: 1; }
    .nhatdx-nav-scroller.can-right::after { opacity: 1; }
}

@media (max-width: 849px) {
    .header-main .icon-box,
    .header-main li.html .icon-box,
    .header .nhatdx-header-features { display: none !important; }
}

.header .searchform-wrapper input[type="search"],
.header .searchform-wrapper input[type="text"],
.header .search-form input.search-field {
    height: 44px !important; border: 0 !important; border-radius: 999px !important;
    padding-left: 18px !important; background: #fff !important;
    box-shadow: 0 2px 10px rgba(35,27,21,.10) !important;
    font-size: 14px !important;
}
.header .searchform-wrapper .button.icon,
.header .searchform-wrapper button[type="submit"] {
    border-radius: 999px !important; height: 38px !important; min-height: 0 !important;
    margin-right: 3px !important;
}
.header .searchform-wrapper input:focus {
    box-shadow: 0 0 0 3px rgba(198,121,48,.22) !important;
}
@media (max-width: 849px) {
    .header .searchform-wrapper input[type="search"],
    .header .search-form input.search-field { height: 40px !important; font-size: 13.5px !important; }
}
