
.header.sticky{
    background:#fff;
}
.header .container-fluid .row{
    align-items:center;
}
.header__logo > a{
    display:flex;
    align-items:center;
}
.header__logo > a img{
    max-width:120px;
}
.header__logo p{
    margin:0;
        font-size: 18px;
    text-transform: uppercase;
    color: #fff;
    margin-left: 1rem;
}
.header.sticky .header__logo p{
    color:#000;
}
.header__menu  ul  li a{
    color:#000;
    padding:0 10px;
    font-weight:500;
    display:block;
}
.header.sticky .header__menu ul li a{
    color:#000;
}
.header__menu ul li a,
.header__menu ul li.active a{
    position:relative;
}
.header__menu ul li{
    position:relative;
}
.header__menu > ul > li.active > a:after,
.header__menu > ul > li:hover > a:after{
        content: "";
    height: 5px;
    width: 100%;
    position: absolute;
    bottom: -15px;
    background: #fff;
    left: 0;
    border-radius: 5px;
    transition:all .5s
}
.header__menu ul{
    transition:all .5s;
}
.header__menu ul li.has-child > a{
    display:flex;
    align-items:center;
    
}
.header__menu > ul > li a{
 padding:0.5rem   
}
.header__menu ul li.has-child.lv-2 > a{
        justify-content: space-between;
}
.header__menu ul li.has-child.lv-2 > a svg{
    margin:0;
    transform: rotate(-90deg);
}
.header__menu ul li.has-child > ul{
    margin-top:0;
    padding:0;
}
.header__menu ul li.has-child > a svg {
    width:20px;
    height:20px;
    margin-left:5px;
}
@media (min-width:992px){
    .header__menu ul li.has-child:hover > ul{
        display: block;
        background: #a20e20;
    min-width: 300px;
    }
    .header__menu ul li.has-child.lv-2:hover > ul{
        left:100%;
        top:0;
    }
}
.header__menu ul li.has-child > a svg path{
    fill:#fff
}
.header__menu > ul{
    display:flex;
    justify-content: center;
}
.header__menu > ul > li:not(:last-child){
    margin-right:1.5rem;
}
.header__right{
    display:flex;
    align-items:center;
    justify-content: right;
}
.header__search-form{
 border-radius:30px;
     min-width: 300px;
}
.header__search-form button svg path{
    fill:#fff
}
.header__search-form input{
    border:none;
     background: #a20e2033; 
         border-top-left-radius: 30px !important;
    border-bottom-left-radius: 30px !important;
        font-size: 14px;
    font-style: italic;
    padding-left:1rem;
    color:#fff;
    height:40px;
}
.header__search-form input::-webkit-input-placeholder {
    color: #fff; /* Chrome, Safari */
}

.header__search-form input::-moz-placeholder {
    color: #fff; /* Firefox */
}

.header__search-form input:-ms-input-placeholder {
    color: #fff; /* Internet Explorer */
}
.header__search-form button{
     background: #a20e2033; 
     border-radius:0 30px 30px 0;
}
.header.sticky .header__search-form input,
.header.sticky .header__search-form button{
    background:var(--mainColor);
}

.header__search-form input::placeholder {
    color: #fff; /* Thay đổi mã màu theo ý bạn */
    opacity: 1; /* Đảm bảo độ mờ của placeholder */
}
.header__search-form input::-webkit-input-placeholder { /* Chrome, Safari, Opera */
    color: #fff;
}

.header__search-form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #fff;
}

.header__search-form input::-ms-input-placeholder { /* Microsoft Edge */
    color: #fff;
}
.header__language{
    margin-left:40px;
}
.header__language ul{
        display: flex
}
.header__language ul li.devi{
    padding:0 5px;
    color:#fff;
}
.header__language ul li a{
    color:#fff;
}
.header.sticky .header__language ul li a,
.header.sticky .header__language ul li.devi{
    color:#000;
}
.header__language ul li.active a{
    color:var(--mainColor);
    font-weight:bold;
    position:relative;
}
.header__language ul li.active a:after{
        content: "";
    position: absolute;
    bottom: -1rem;
    height: 5px;
    width: 100%;
    background: var(--mainColor);
    left: 0;
    border-radius: 5px;
}
@media (min-width:1500px){
     .header > .container-fluid > .row > .col-lg-3{
        flex: 0 0 23%;
        max-width: 23%;
    }
    .header > .container-fluid > .row > .col-lg-4{
                   flex: 0 0 40.333333%;
        max-width: 40.333333%;
    }
    .header > .container-fluid > .row > .col-lg-5{
                   flex: 0 0 36.666667%;
        max-width: 36.666667%;
    }
}
@media (min-width:992px) and (max-width:1199px){
    .header > .container-fluid > .row > .col-lg-3{
                flex: 0 0 16%;
        max-width: 16%;
    }
    .header > .container-fluid > .row > .col-lg-4{
                   flex: 0 0 47.333333%;
        max-width: 47.333333%;
    }
    .header > .container-fluid > .row > .col-lg-5{
                   flex: 0 0 36.666667%;
        max-width: 36.666667%;
    }
    .header__menu > ul > li:not(:last-child) {
        margin-right: 0.5rem;
    }
    .header__language{
        margin-left:1rem;
    }
    .header__menu ul li a{
        font-size:14px;
    }
}
@media (min-width:992px) and (max-width:1499px){
    .header__logo > a{
        display:block;
    }
    .header__logo p{
        margin-left:0;
                margin-top: 10px;
        font-size: 14px;
    }
    .header__search-form{
        min-width:220px;
    }
}
@media (min-width:1200px) and (max-width:1499px){
    .header > .container-fluid > .row > .col-lg-3{
                flex: 0 0 15%;
        max-width: 15%;
    }
    .header > .container-fluid > .row > .col-lg-4{
               flex: 0 0 46.333333%;
        max-width: 46.333333%;
    }
    .header > .container-fluid > .row > .col-lg-5{
                     flex: 0 0 38.666667%;
        max-width: 38.666667%;
    }
    .header__menu > ul > li:not(:last-child){
        margin-right:1rem;
    }
    
}
@media (max-width:991px){
   
    .menu-bar .header__logo {
        margin-bottom:2rem;
    }
    .header__logo > a{
        display:block;
    }
    .header__logo p{
        display:none;
    }
    .header__logo img{
        width:90px;
    }
    .header__mobile  svg{
        width:25px;
        height:25px;
    }
    .header__bar svg{
        width:30px;
        height:30px;
    }
    .header__bar svg path{
        fill:#000
    }
    .header.sticky .header__bar svg path{
        fill:#000
    }
    .header__language{
        margin:0;
        margin-bottom:5px;
    }
    .header__language ul {
        justify-content: center;
    }
    .header__language ul li a{
        color:#fff;
    }
    .header__language ul li.active a:after{
        display:none;
    }
    .header__language ul li.devi{
        padding:0 1rem;
    }
    .header__right{
        display:block;
        padding:0.5rem 0
    }
    .header__menu svg{
        width:20px;
        height:20px;
    }
    .header__menu > ul{
        display:block;
    }
    .header__menu > ul > li:not(:last-child){
        margin:0;
        margin-bottom:1rem;
    }
    .header__menu ul li a{
        color:#000;
        font-size:20px;
        padding:0;
    }
    .header__menu ul li.has-child > div{
        display:flex;
        align-items:center;
            justify-content: space-between;
    }
    .header__menu ul li.has-child > div.open > svg{
            transform: rotate(180deg);
    }
    .header__menu ul li.has-child > ul.active{
         display: block;
    position: relative;
    width: 100%;
    border: none;
    padding:0.5rem 1rem;
    background: #a20e20;
    }
    
    .header__menu ul li.lv-3:not(:last-child){
        margin-bottom:0.5rem;
    }
    
    .header__menu ul li.has-child ul li a{
        color:#fff;
    }
       
    .header__menu ul li.has-child > a svg path{
        fill:#000
    }
    .header__menu ul li.has-child ul li svg path{
         fill:#fff
    }
    .header__mobile {
            display: flex;
    align-items: center;
            justify-content: space-between;
    }
    .header__search-form input{
         background: #a20e20; 
         border:none !important;
        height: 33px;
    }
    .header__search-form input::-webkit-input-placeholder {
        color: #fff; /* Chrome, Safari */
    }
    
    .header__search-form input::-moz-placeholder {
        color: #fff; /* Firefox */
    }
    
    .header__search-form input:-ms-input-placeholder {
        color: #fff; /* Internet Explorer */
    }
    .header__search-form button{
         background: #a20e20; 
    }
   .header .header__search {
        position: fixed;
        visibility: hidden;
        width: 100%;
        height: 100%;
            background: rgba(0, 0, 0, 0.5);
        left: 0px;
        top: 0 !important;
        z-index: 99999;
    }
    .header__search-icon .cls-1{
        stroke:#000
    }
    .header.sticky .header__search-icon .cls-1{
        stroke:#000
    }
    .close-search {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
}
    .header .header__search.active {
        visibility: visible;
    }
    .header .header__search .header__search-form {
    height: 100px;
    width: 100%;
    padding: 0 16px;
    background: #a20e2033;
    display: flex;
    border-radius:0;
    justify-content: center;
    transform: translateY(-100%);
    align-items: center;
    transition: all 0.3s;
    box-shadow: 0 0 5px 1px rgba(0, 0, 0, .4);
}
.header .header__search.active .header__search-form {
    transform: translateY(0);
}
.header__search-form button{
        padding: 0;
    height: 33px;
    width: 33px;
}
.menu-bar{
    background: #fff;
    transition: transform 1s;
    left: 0;
    top: 0;
    position: fixed;
    transform: translateX(-100%);
    z-index:99999;
    height:100vh;
    width:100%;
}
.menu-bar .menu-bar__inner{
     position:relative;
     height: 100vh;
     overflow:auto;
     padding-top:80px;
}
.menu-bar.show{
    transform: translateX(0);
}
.menu-bar .btn-close{
        position: absolute;
    top: 1rem;
    right: 1rem;
    padding: 0;
}
.menu-bar .btn-close svg{
    width: 25px;
    height: 25px;
}
.menu-bar__body{
    padding:1rem;
}
}
