body.modal-open .vs-header,
body.modal-open .sticky-wrapper,
body.modal-open .sticky-active {
    z-index: 2 !important;
}
ul, ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

.vs-logo img
{
    height:80px;
    }
    
  body
  {
      }
      
      
     .brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.color-fff
{
    color:#fff !important;
    }

/* Desktop – dùng scale chuẩn */
.brand-sub {
    font-size: var(--fs-h3, 20px);
    color: #000;
    font-weight: 500;
    margin-bottom: 5px;
}

.brand-main {
    font-size: var(--fs-h2, 24px);
    font-weight: 700;
    color: #d70000;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

/* Tablet */
@media (max-width: 1199.98px) {
    .brand-sub { font-size: var(--fs-h4, 18px); margin-bottom: 3px; }
    .brand-main { font-size: var(--fs-h3, 20px); }
}

/* Mobile */
@media (max-width: 575.98px) {
    .brand-sub { font-size: var(--fs-h5, 16px); margin-bottom: 2px; }
    .brand-main { font-size: var(--fs-h4, 18px); letter-spacing: 0.2px; }
}


.btn-booking {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 999px;
    background: linear-gradient(135deg, #dc3545, #dc3545);
    color: #fff;
    font-weight: 500;
    font-size: var(--fs-btn, 16px);
    text-decoration: none;
    /* box-shadow: 0 6px 18px rgb(145 0 21 / 35%); */
    transition: all 0.25s ease;
}

.btn-booking:hover {
    background: linear-gradient(135deg, #0CAE74, #0CAE74);
    color: #fff;
    transform: translateY(-1px);
    /* box-shadow: 0 8px 22px rgba(255, 152, 0, 0.4); */
    background: linear-gradient(135deg, #ffbf00, #ffbf00);
}

/* ===== Desktop & Tablet ===== */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: linear-gradient(180deg, #eaf7f1, #ffffff);
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #0CAE74, #00913f);
    border-radius: 12px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #00913f, #0CAE74);
}

/* ===== Mobile: Ẩn scrollbar ===== */
@media (max-width: 767px) {
    * {
        -ms-overflow-style: none; /* IE, Edge */
        scrollbar-width: none;    /* Firefox */
    }

    *::-webkit-scrollbar {
        display: none;            /* Chrome, Safari */
    }
}



.emergency-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    border-radius: 30px;
    font-weight: 500;
    font-size: var(--fs-small, 14px);
    text-decoration: none;
    /* box-shadow: 0 6px 20px rgba(216, 5, 5, 0.35); */
    transition: all 0.3s ease;
    background: #0CAE74;
    color: #ffffff;
}

.emergency-btn i {
    font-size: var(--fs-icon, 18px);
    animation: emergency-ring 1.2s infinite;
    color: #ffbf00;
}

.emergency-btn:hover {
   background: #0CAE74;
    color: #ffffff;
}

/* rung nhẹ icon điện thoại */
@keyframes emergency-ring {
    0% { transform: rotate(0); }
    20% { transform: rotate(-15deg); }
    40% { transform: rotate(15deg); }
    60% { transform: rotate(-10deg); }
    80% { transform: rotate(10deg); }
    100% { transform: rotate(0); }
}

.booking-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    color: #017A48;
    text-decoration: none;
    transition: all 0.25s ease;
}

.booking-link i {
    font-size: var(--fs-icon, 18px);
}

.booking-link:hover {
    color: #00913f;
}

.booking-link:hover i {
    transform: scale(1.1);
}




/* ===== Social icons ===== */
.social-icons {
    display: flex;
    align-items: center;
    gap: 12px;
}

.social-link {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #0CAE74;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--fs-small, 14px);
    transition: all .3s ease;
}

.social-link:hover {
    background: #feae3b;
    color: #000;
}

/* Zalo text icon */
.social-link.zalo {
    font-size: var(--fs-caption, 12px);
    font-weight: 700;
    text-transform: uppercase;
}
/* Search button */
.hos-search-wrap .btn {
    width: 42px;
    height: 42px;
    background: #0CAE74;
    border: none;
}

.hos-search-wrap .btn:hover {
    background: #00913f;
}

/* Modal input */
#hosSearchModal .form-control {
    border-radius: 14px;
    border: 2px solid #e5e7eb;
}

#hosSearchModal .form-control:focus {
    border-color: #0CAE74;
    box-shadow: 0 0 0 3px rgba(1,122,72,.15);
}

/* */

.bg-12
{
    
       background-image: radial-gradient(rgba(1,122,72,0.05) 1px, transparent 1px);

        position: relative;
    padding: 60px 0;
    background: linear-gradient(135deg, #f7fdfb, #e9f7f1);
    overflow: hidden;
}
.testimonial-style4::before {
    width: 320px;
    height: 320px;
    top: -140px;
    left: -140px;
}

.ctestimonial-style4::before, .testimonial-style4::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(1, 122, 72, 0.08);
    z-index: 0;
}

.bg-ter-1
{
    
background-image: url(/assets/img/testimonial/Map.png);
    
padding-bottom: 106px !important;
    
background-position: center center !important;
    
background-repeat: no-repeat !important;
    
position: relative !important;
    
overflow: hidden !important;
    
background-color:#f4fcf9 !important;
    
padding: 60px 0px 20px 0px !important;
    }
    
    
    .bg-ter-2
    {
        background-image: url(/assets/img/testimonial/patern.png) !important;
        /* background-color: #fff8eb !important; */
        background-color: #f1fbf9;
    }
    
    .bg-ter-3
    {
            background-color: #fff !important;
    }
        .bg-ter-4
    {
        
            background-image: url(/assets/img/testimonial/Cloud-bg.png) !important;
    background-color: #f4fcf9 !important;
    
    
    }
    
    
    .trv-yl-shedow-left
    {
        
            position: absolute;
    width: 600px;
    height: 550px;
    left: -300px;
    top: 50%;
    background: rgba(255, 170, 13, 0.1);
    filter: blur(100px);
        }
        
        
        
        .trv-yl-shedow-right {
    position: absolute;
    width: 600px;
    height: 500px;
    right: -300px;
    top: 50%;
    background: rgba(41, 137, 145, 0.1);
    filter: blur(100px);
}


.trv-bl-shedow-top {
    position: absolute;
    width: 600px;
    height: 550px;
    left: 50%;
    transform: translateX(-50%);
    top: -200px;
    background: rgba(255, 170, 13, 0.1);
    filter: blur(100px);
}




.features-title a
{
    color:#017A48 !important;
    
    }
    
    
.features-title a:hover
{
    color:#fff !important;
    
    }
    
    
    .features-style3:hover a
{
    color:#fff !important;
    
    }
    
    
    .features-content:hover a
    {
        color:#fff !important;
        }.breadcrumb-hos {
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: var(--fs-small, 14px);
}

.breadcrumb-hos .breadcrumb-item + .breadcrumb-item::before {
    content: "›";
    color: #017A48;
    font-weight: 500;
    padding: 0 6px;
}

.breadcrumb-home {
    color: #017A48;
    font-weight: 500;
    text-decoration: none;
}

.breadcrumb-home:hover {
    text-decoration: underline;
}

.breadcrumb-hos .breadcrumb-item.active {
    color: #495057;
    font-weight: 400;
}
/* CONTAINER - float buttons kiểu vuông xếp sát, nền màu từng nút */
.float-social {
    position: fixed;
    right: 10px;
    bottom: 25px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

/* Nút scroll to top - cố định bên trái màn hình, ẩn mặc định, hiện khi scroll (class .show từ main.js) */
.float-scroll-top {
    position: fixed;
    left: 10px;
    bottom: 25px;
    z-index: 9999;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #198754;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    transition: opacity 0.2s, visibility 0.2s;
    opacity: 0;
    visibility: hidden;
    background: var(--theme-color);
}
.float-scroll-top.show {
    opacity: 1;
    visibility: visible;
}
.float-scroll-top:hover {
    opacity: 0.9;
    color: #fff;
}
.float-scroll-top i {
    font-size: 18px;
}

/* BUTTON CHUNG - vuông bo góc, xếp sát, nền màu solid */
.float-btn {
    position: relative;
    width: 52px;
    height: 48px;
    margin: 0;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: opacity 0.2s;
}

.float-btn:hover {
    opacity: 0.9;
}

/* Nút đầu tiên bo góc trên */
.float-social .float-btn:first-child {
    border-radius: 12px 12px 0 0;
}

/* Nút cuối bo góc dưới */
.float-social .float-btn:last-child {
    border-radius: 0 0 12px 12px;
}

/* Chỉ 1 nút thì bo hết */
.float-social .float-btn:only-child {
    border-radius: 12px;
}

/* Màu nền: 3 nút trên cùng xanh dương, nút cuối xám đậm */
.float-btn.booking,
.float-btn.zalo,
.float-btn.messenger {
    background: #f9b200;
}

.float-btn.call {
    background: #0CAE74;
    background: #f9ba19;
    background: #f9b200;
}

.float-btn.scrollTop {
    background: #198754;
}

/* ICON (scroll top) - trắng */
.float-btn i {
    color: #fff;
    font-size: var(--fs-icon, 18px);
    z-index: 2;
}

/* Ảnh icon - trắng trên nền màu (filter) */
.float-btn.zalo img,
.float-btn.messenger img,
.float-btn.booking img,
.float-btn.call img {
    width: 40px;
    height: 40px;
    /* object-fit: contain; */
    /* filter: brightness(0) invert(1); */
}

.float-btn.booking img {
    width: 40px;
    height: 40px;
}

/* Bỏ viền nét đứt xoay */
.float-btn::before {
    display: none;
}

.icon-m i
{
    font-size: var(--fs-h4, 18px);
    color: #017A48;
    }
    
    
    
    #ctl00_cphHome_Home1_Booking1_dtmBirthDate_dateInput_text,
    #ctl00_cphHome_Home1_Booking1_dtmDate_dateInput_text {
        font-size: var(--fs-body, 16px) !important;
    }
        #ctl00_cphHome_Home1_Booking1_dtmBirthDate_dateInput_text
        {
            color: #000 !important;
            }
            
            
            
            
            .footer-wrapper .widget
            {
                
                box-shadow: none !important;
                }

/* Phân trang: nút trang hiện tại (class active đặt trên li) */
.vs-pagination li.active a {
    color: var(--white-color) !important;
    background-color: var(--theme-color) !important;
    border-color: var(--theme-color);
    box-shadow: none;
}


.trv-icon-title
{
    font-family: var(--body-font) !important;
    }
    
    

    
    @media (max-width: 991px) {
  .notice-banner .title-area {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    /* text-align: center; */
}
}




@media (max-width: 767px) {
    .sec-title {
        font-size: 20px;
        text-align: center;
        display: flex;
        justify-content: center;
    }
    
    
    .yt-rss-wrap .sec-title a {
    color: inherit;
    text-decoration: none;
    font-size: 15px;
}
}

.widget_title::before {
    content: "";
    height: 2px;
    border-radius: 50px;
    background-color: var(--theme-color);
    position: absolute;
    bottom: 0px;
   
    background-color: #f9b200 !important;
}

/* Ẩn nút scroll to top trên giao diện điện thoại */
@media (max-width: 991px) {
    .float-scroll-top {
        display: none !important;
    }
    
    
    .testi-style3 .testi-icon {
            position: absolute;
            bottom: -30px;
            right: 50px;
}
}





/* =========================
   HEADER BASE STYLE
========================= */




/* =========================
   HEADER RESPONSIVE
========================= */

@media (max-width: 1536px) {
    .header-layout4 .header-top__left {
        padding: 11px 0 11px 5px !important;
    }
}

@media (max-width: 1500px) {
    .header-layout4 .header-top__left {
        padding: 11px 0 11px 10px !important;
    }
}

@media (max-width: 1396px) {
    .header-layout4 .header-top__left {
        padding: 11px 0px 11px 10px !important;
    }
}


/* =========================
   HEADER 1280px BREAKPOINT
========================= */

@media (max-width: 1280px) {

    /* Brand text */
    .header-layout4 .brand-sub {
        font-size: clamp(10px, 1.2vw + 10px, 13px);
        margin-bottom: 3px;
    }

    .header-layout4 .brand-main {
        font-size: clamp(11px, 1.35vw + 11px, 14px);
        letter-spacing: 0.2px;
    }

    /* Logo */
    .header-layout4 .vs-logo img {
        height: clamp(50px, 8vw, 72px);
    }

    /* Menu */
    .header-layout4 .menu-style1 > ul > li > a {
        font-size: clamp(10px, 1.1vw + 10px, 11px) !important;
    }

    .header-layout4 .menu-style1 > ul > li {
        margin: 0 8px;
        padding: 20px 0;
    }

    /* Header contact */
    .header-layout4 .header-contact,
    .header-layout4 .header-contact a,
    .header-layout4 .header-links > ul > li > a {
        font-size: clamp(9px, 1vw + 10px, 11px) !important;
    }

    /* Buttons */
    .header-layout4 .emergency-btn,
    .header-layout4 .btn-booking {
        font-size: clamp(10px, 1vw + 10px, 11px) !important;
        padding: 5px 5px;
    }

    /* Language selector */
    #ctl00_Header1_Language1_curTextLg {
        font-size: clamp(10px, 1.1vw + 10px, 11px) !important;
    }

    /* Sub menu */
    .main-menu ul.sub-menu a {
        font-size: clamp(10px, 1.1vw + 10px, 11px) !important;
    }
    
    .social-link 
    {
        
            width: 20px !important;
    height: 20px !important;}
    
    .emergency-btn i
    {font-size: 11px !important;
        }
}


@media (max-width: 1400px) {

/* Brand text */
.header-layout4 .brand-sub {
    font-size: clamp(11px, 1.2vw + 11px, 14px);
    margin-bottom: 3px;
}

.header-layout4 .brand-main {
    font-size: clamp(12px, 1.35vw + 12px, 15px);
    letter-spacing: 0.2px;
}

/* Logo */
.header-layout4 .vs-logo img {
    height: clamp(51px, 8vw, 73px);
}

/* Menu */
.header-layout4 .menu-style1 > ul > li > a {
    font-size: clamp(11px, 1.1vw + 11px, 12px) !important;
}

.header-layout4 .menu-style1 > ul > li {
    margin: 0 8px;
    padding: 21px 0;
}

/* Header contact */
.header-layout4 .header-contact,
.header-layout4 .header-contact a,
.header-layout4 .header-links > ul > li > a {
    font-size: clamp(10px, 1vw + 11px, 12px) !important;
}

/* Buttons */
.header-layout4 .emergency-btn,
.header-layout4 .btn-booking {
    font-size: clamp(11px, 1vw + 11px, 12px) !important;
    padding: 6px 6px;
}

/* Language selector */
#ctl00_Header1_Language1_curTextLg {
    font-size: clamp(11px, 1.1vw + 11px, 12px) !important;
}

/* Sub menu */
.main-menu ul.sub-menu a {
    font-size: clamp(11px, 1.1vw + 11px, 12px) !important;
}

.social-link {
    width: 21px !important;
    height: 21px !important;
}

.emergency-btn i {
    font-size: 12px !important;
}

}




@media (max-width: 1025px) {


/* Brand text */
.header-layout4 .brand-sub {
    font-size: clamp(9px, 1.2vw + 9px, 12px);
    margin-bottom: 3px;
}

.header-layout4 .brand-main {
    font-size: clamp(10px, 1.35vw + 10px, 13px);
    letter-spacing: 0.2px;
}

/* Logo */
.header-layout4 .vs-logo img {
    height: clamp(49px, 8vw, 71px);
}

/* Menu */
.header-layout4 .menu-style1 > ul > li > a {
    font-size: clamp(9px, 1.1vw + 9px, 10px) !important;
}

.header-layout4 .menu-style1 > ul > li {
    margin: 0 8px;
    padding: 19px 0;
}

/* Header contact */
.header-layout4 .header-contact,
.header-layout4 .header-contact a,
.header-layout4 .header-links > ul > li > a {
    font-size: clamp(8px, 1vw + 9px, 10px) !important;
}

/* Buttons */
.header-layout4 .emergency-btn,
.header-layout4 .btn-booking {
    font-size: clamp(9px, 1vw + 9px, 10px) !important;
    padding: 4px 4px;
}

/* Language selector */
#ctl00_Header1_Language1_curTextLg {
    font-size: clamp(9px, 1.1vw + 9px, 10px) !important;
}

/* Sub menu */
.main-menu ul.sub-menu a {
    font-size: clamp(9px, 1.1vw + 9px, 10px) !important;
}

.social-link {
    width: 19px !important;
    height: 19px !important;
}

.emergency-btn i {
    font-size: 10px !important;}

.hos-search-wrap .btn
{
    
    }
    
    .fal 
    {
        font-size: 10px !important;
        }
}