body.modal-open .vs-header,
body.modal-open .sticky-wrapper,
body.modal-open .sticky-active {
    z-index: 2 !important;
}

/* Fix mobile: language dropdown bị đè bởi header (z-index-common: 3) */
.header-layout4 .header-top {
    z-index: 10;
}

/* Khi mở modal (Bootstrap), giữ header/topbar nằm dưới modal */
body.modal-open .header-layout4 .header-top {
    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: 600;
    margin-bottom: 5px;
    font-family: var(--title-font);
}

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

/* 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: 10px;
    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 */
        /* color: #fff; */
    }

    *::-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: #feae3b;
    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;
    font-weight: 600;
    }
    
    
.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;
    content: "›";
}

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

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

.breadcrumb-hos .breadcrumb-item.active {
    color: #495057;
    font-weight: 600;
    color: #017A48;
}

/* ===== Mobile Bottom Nav (.hos-mbn) – chỉ hiện trên mobile ===== */
.hos-mbn {
    display: none;
}

@media (max-width: 767px) {
    .hos-mbn {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9998;
        background: #fff;
        box-shadow: 0 -2px 12px rgba(0,0,0,.08);
        padding: 8px 0 calc(8px + env(safe-area-inset-bottom, 0));
        justify-content: space-around;
        align-items: center;
        gap: 4px;
        transform: translateY(0);
        transition: transform 0.3s ease, visibility 0.3s ease;
    }
    /* Ẩn khi scroll lên (lên top) */
    .hos-mbn.hos-mbn--hidden {
        transform: translateY(100%);
        visibility: hidden;
    }
    .hos-mbn__item {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 6px 4px;
        color: #017A48;
        text-decoration: none;
        font-size: var(--fs-caption, 12px);
        font-weight: 500;
        transition: color .2s ease;
    }
    .hos-mbn__item i {
        font-size: var(--fs-h4, 18px);
    }
    .hos-mbn__item:hover,
    .hos-mbn__item:focus {
        color: #00913f;
    }
    .hos-mbn__item--booking {
        color: #fff;
        background: linear-gradient(135deg, #0CAE74, #00913f);
        border-radius: 999px;
        margin: 0 4px;
        background: linear-gradient(135deg, #dc3545, #dc3545);
        border-radius: 900px;
        /* border-radius: 10px; */
    }
    .hos-mbn__item--booking:hover,
    .hos-mbn__item--booking:focus {
        color: #fff;
        opacity: .95;
    }
    /* Active state cho 4 nút (Trang chủ, Liên hệ, Bác sĩ, Tin tức) — không áp dụng cho Đặt lịch */
    .hos-mbn__item.is-active,
    .hos-mbn__dropup-trigger.is-active {
        color: #ebaf12 !important;
    }
    .hos-mbn__item.is-active i,
    .hos-mbn__dropup-trigger.is-active i {
        color: #ebaf12 !important;
    }
    /* Ẩn float social khi xem trên Ä‘iện thoại để không đè lên bottom nav */
    .float-social {
        display: none !important;
    }
}

.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;
            }
            
            
            
             #loading{position:fixed;inset:0;z-index:99999;background:#fff;display:flex;align-items:center;justify-content:center}
    #loading .logo-loader{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:28px;width:200px}
    #loading .ring{position:absolute;top:50%;left:50%;width:180px;height:180px;border:4px solid rgba(1,122,72,.15);border-top-color:#0CAE74;border-radius:50%;animation:ls 1.4s linear infinite;pointer-events:none;transform:translate(-50%,-50%) rotate(0deg);will-change:transform;backface-visibility:hidden}
    @keyframes ls{to{transform:translate(-50%,-50%) rotate(360deg)}}
    #loading .loader-logo{position:relative;z-index:1;display:block;margin-bottom:10px;width:60px;height:60px;backface-visibility:hidden;transform:translateZ(0)}
    #loading .loader-text{position:relative;z-index:1;backface-visibility:hidden;transform:translateZ(0)}
    #loading .loader-text .line-sub{font-size:13px;color:#666;line-height:1.3}
    #loading .loader-text .line-main{font-size:17px;font-weight:600;color:#c41e3a;line-height:1.3}