/*
Theme Name: hotel
Description: Website hotel
Author: 123Web.vn
Author URI: https://123web.vn/
Template: flatsome
Version: 1.0.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

#header-contact li a{    text-transform: none;
    letter-spacing: 0;
    font-size: 14px;
    color: #353535;}
.header-button-1 .header-button{
	background: var(--primary-color)!important;
	background-color: var(--primary-color)!important;
}
.header-button-1 .header-button a{background: var(--primary-color)!important;
	background-color: var(--primary-color)!important;
    border-radius: 0px !important;
    height: 85px;
    line-height: 85px;}


.header-button-1 .header-button a:hover{background:gray}.nav-spacing-large>li {
    margin: 0 17px;
}.header-main {
    box-shadow: 2px 2px 20px #00000017;
}.section-title-center span:after {
content: "";
    display: table;
    clear: both;
    background: url(/wp-content/uploads/2019/11/line2.png);
    width: 100%;
    height: 35px;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: bottom;
    padding-top: 0;
    background-size: 250px;
}
.nav-dropdown-default{padding:0; border:none }
.nav-dropdown-default li a{font-size: 14px;
    color: #252525;}
.nav-dropdown-default li a:hover{color:#a99246}
.section-title b {
    background: transparent;
}.section-title-container {
    margin-bottom: 0;
}
.gioi-thieu-section img{border-radius:5px}
.single-product .product-info .product-short-description{font-size:14px}
.single-product .product-info .product-title{margin-bottom: 0;}.product-info {
    padding-top: 20px;
}
.is-well {
    background: white;
    border-radius: 10px;
    box-shadow: 2px 2px 20px #00000014;padding: 20px;
}
.single-product .product-info .price span.amount{color: #a99246;}
.star-rating span:before{color:#ffc107}
.stuck .header-button-1 .header-button a {
    height: 55px;
    line-height: 50px;
}
.stsv_woocommerce_price_suffix{font-size: 17px;
    font-weight: normal;
    color: #a99246;}
.price-wrapper .price {margin:0;
    margin-bottom: 15px;
}
.single-product .product-info .share-icons a{min-width: 23px; border:none; margin-bottom:0}
.single-product .product_meta{display:none}
.mvvwb_wrap input{margin-bottom:0; border-radius:5px}.flatpickr-input[readonly]{border-radius:5px}.mvvwb_date_row, .mvvwb_persons_row {
    margin: 0 0 8px 0;
}
label, legend {
    margin-bottom: 4px;
}
form{margin-bottom:0}
.single_add_to_cart_button{border-radius:5px; margin-bottom:0;     font-size: 15px;
    letter-spacing: 0;
    text-transform: none;
    font-weight: bold;
    background: #a99246 !important;
    opacity: 1 !important;
    width: 100%;}
.single-product .slider-nav-circle .flickity-prev-next-button svg{    border: 0px solid currentColor;
    background: black;}
.mvvwb_summary {
    margin: 10px 0;
    position: relative;
}
.thong-bao {
  background: #fff8e5;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 0;
    font-size: 14px;
    color: #3a3a3a;
    margin-top: 8px;
    border-left: 4px solid #ffb900;
}.thong-bao ul {
    margin-bottom: 0;
}
.thong-tin-chi-tiet{font-size:14px; display:inline-block; clear:both; width:100%}
.thong-tin-chi-tiet .cot1{    width: 49% !important;
    margin-right: 10px;
    display: inline-block;
    float: left;
    padding: 0;
    border-radius: 5px;    border: 1px solid #dedede;}
.thong-tin-chi-tiet .cot2{    border: 1px solid #dedede;
    width: 49% !important;
        display: inline-block;
    float: right;
    border-radius: 5px;
}.product-footer .woocommerce-tabs {
    padding: 0;
    border-top: 0;
}
.product-footer{margin-top:15px !important}
.single-product .product-info .col{padding-bottom:10px}
.thong-tin-chi-tiet h2{    color: #2d2d2d;
    font-size: 17px;
    background: #d4d4d4;
    padding: 9px 15px;
    margin-bottom: 0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;}
.thong-tin-chi-tiet .row-info{display: flex;
    width: 100%;
    clear: both;
    border-top: 1px dashed #dedede;
    padding: 7px 0;
    background-image: url(/wp-content/uploads/2019/11/dot.jpg);
    background-repeat: no-repeat;
    background-position-y: 11px;
    padding-left: 25px;
    background-position-x: 10px;
    padding-right: 10px;}

.thong-tin-chi-tiet .row-info .left{font-weight:bold; width:35%; padding-right:10px; display:inline-block; float:left}
.thong-tin-chi-tiet .row-info .right{width:65%; padding-left:10px; display:inline-block; float:left}
.product-small.box .product-title{font-size: 18px;
    margin-bottom: 10px;}
.product-small.box .price, .product-small.box .price span.amount{color:#ff5722; font-weight:normal; font-size:19px}
.thong-tin-chi-tiet .row-info:nth-child(odd){background-color:whitesmoke}.woocommerce-tabs ul li a {
    text-transform: none;
    font-size: 17px; letter-spacing:0
}
.single-product .tab-panels h2{font-size:18px}
.single-product .tab-panels h3{font-size:17px}
.single-product .tab-panels h4{font-size:16px}
.single-product .tab-panels h5{font-size:15px}.nav-tabs+.tab-panels {
    border: 1px solid #dedede;
    background-color: #fff;
    padding: 30px;
    border-radius: 5px;
    border-top-left-radius: 0;
}div#reviews.woocommerce-Reviews, .devvn_prod_cmt{max-width:100%}
.product-small.box .stsv_woocommerce_price_suffix{color:#ff5722}.product-small.box .price{margin-top:10px}
.product-small.box {    box-shadow: 2px 2px 15px #00000017;background:white; border-radius:5px}.product-small.box .box-image{border-top-left-radius:5px; border-top-right-radius:5px}.list-sp .col-inner{border-bottom-left-radius:5px; border-bottom-right-radius:5px}
.list-sp .col-inner:hover{    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.09);}.post-item .box-image:hover::before{
-webkit-animation:shine .75s;
animation:shine .75s}
@-webkit-keyframes shine{
100%{left:125%}
}
@keyframes shine{
100%{left:125%}
}
.post-item .box-image::before{
position:absolute;
top:0;
left:-75%;
z-index:2;
display:block;
content:'';
width:50%;
height:100%;
background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
-webkit-transform:skewX(-25deg);transform:skewX(-25deg)
}.product-small .box-image:hover::before{
-webkit-animation:shine .75s;animation:shine .75s
}
@-webkit-keyframes shine{
100%{left:125%}
}
@keyframes shine{
100%{left:125%}
}
.product-small .box-image::before{
position:absolute;
top:0;
left:-75%;
z-index:2;
display:block;
content:'';
width:50%;
height:100%;
background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
-webkit-transform:skewX(-25deg);transform:skewX(-25deg)
}
.danh-sach-phong .col{padding-bottom:0}
.related h3{margin: 0;
    text-transform: none;
    letter-spacing: 0;}
a.back-to-top{background:gray !important; color:white; border:none !important}
.nut-xem-them{font-weight:normal; letter-spacing:0}
.list-post .post-item .box-text{padding:0; padding-top:10px}
.box-blog-post .is-divider{display:none}
.list-post .post-item a:hover{color:black}
.list-post .post-item .post-title{margin-bottom:7px;font-size:17px}
.dich-vu-khac .col{padding-bottom:0}.footer-secondary {
    padding: 0;
}
.footer-secondary{text-align:right}
.absolute-footer{color:white!important}
h1.entry-title.mb {
    margin-bottom: 20px;
    text-transform: none;
    letter-spacing: 0;
    font-size: 23px;
}.blog-archive h1.page-title {
    text-transform: none;
    letter-spacing: 0;
    font-size: 23px;
}#breadcrumbs {
    margin-bottom: 10px;
    font-size: 15px;
}.blog-archive .archive-page-header .large-12 {
    text-align: left;
    padding-bottom: 0px;
}.blog-archive {
    background: #f7f7f7;
}.blog-archive .post-item .box-text {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding: 10px 10px 20px 10px;
    background: white;
}.blog-archive .post-item .box-image {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}.blog-archive .post-item .box-text {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding: 10px 10px 20px 10px;
    background: white;
}.blog-archive .post-item .post-title {
    font-size: 15px;
    margin-bottom: 10px;
    height: 39px;
    overflow: hidden;
}.blog-archive .post-item .from_the_blog_excerpt {
    height: 40px;
    overflow: hidden;
}

.archive .post-item .from_the_blog_comments{display:none} .archive .badge{display:none}
.archive .shop-page-title{display:none}
.archive .category-page-row .large-12{padding-bottom:10px}
.archive .large-12{padding-bottom:0}.blog-single .entry-header .entry-meta {
    font-size: 14px !important;
    letter-spacing: 0;
    text-transform: none;
    color: gray !important;
    background: none;
    border-top: none !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
}.is-divider {
    display: none;
}.mr-half .badge-inner {
    border-radius: 99%;
}.recent-blog-posts a {
    font-size: 15px;
    margin-bottom: 0;
}.product_list_widget, .flatsome_recent_posts ul {
    border: 1px solid #ececec;
    border-radius: 5px;
    padding: 10px;
    box-shadow: 2px 2px 10px #0000001a;
}span.widget-title {
    font-size: 19px;

    text-transform: none;
    letter-spacing: 0;
    display: block;
    margin-bottom: 10px;
    color: #383838;
}.blog-single .large-3 {
    padding-left: 0;
}.xem-them .tieu-de-xem-them {
    font-weight: 700;
    display: block;
    margin-bottom: 10px;
    font-size: 17px;
    color: black;
}.xem-them ul li {
    margin-bottom: 3px;
}.xem-them ul li a {
    font-weight: 700;
    font-size: 15px;
}.blog-single .blog-share {
    text-align: left;
}.blog-single .entry-meta {
    text-transform: none;
    font-size: 14px;
    letter-spacing: 0;
    color: gray;
    border-top: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
    padding: 10px;
    background: #f9f9f9;
}.danh-muc {
    margin-bottom: 15px;
}.danh-muc span.title, .the-tim-kiem span.title {
    border-radius: 4px;
    background: #a99246;
    padding: 4px 10px;
    color: white;
    margin-right: 5px;
}.danh-muc a, .the-tim-kiem a {
    border-radius: 4px;
    margin-bottom: 10px;
    padding: 4px 10px;
    background: #dedede;
    color: #464646;
}.danh-muc a:hover, .the-tim-kiem a:hover {
    background: #9E9E9E;
    color: white;
}.bai-viet-lien-quan {
    margin-top: 15px;
}.bai-viet-lien-quan h3 {
    font-size: 18px;
    color: black;
}.bai-viet-lien-quan ul {
    margin-bottom: 0;
    display: inline-block;
    width: 100%;
}.bai-viet-lien-quan ul li {
    list-style: none;
    width: 25%;
    color: graytext;
    float: left;
    padding-left: 4px;
    padding-right: 5px;
}.bai-viet-lien-quan ul li .box-image img {
    height: 120px;
    border-radius: 4px;
    object-fit: cover;
    object-position: center;
}.bai-viet-lien-quan h4 {
    font-size: 14px;
    color: black;
    line-height: 19px;
    padding-top: 7px;
    height: 64px;
    overflow: hidden;
}p.form-row-first, p.form-row-last{width:100%}
.woocommerce-billing-fields input, textarea{border-radius:4px; box-shadow:none}
.book-now{background: white;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 2px 2px 20px #00000012;text-align:center}
.book-now p.des{margin-bottom:20px}
.row-form{display:inline-block; width:100%}
.row-form .cot1{display:inline-block; width:33.33%; padding-right:10px; float: left}
.row-form .cot2{display:inline-block; width:33.33%; padding-left:10px; float:left; padding-right:10px}
.row-form .cot3{text-align:left !important; display:inline-block; width:33.33%; padding-left:10px; float:left; }
.book-now label{text-align:left}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
.blog-single .large-3 {
    padding-left: 15px;
}.header-top{display:None}.off-canvas:not(.off-canvas-center) .nav-vertical li>a {
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 15px;
    text-transform: none;
    color: #2b2b2b;
}.off-canvas:not(.off-canvas-center) .nav-vertical li ul{padding-bottom:0}
.off-canvas:not(.off-canvas-center) .nav-vertical li ul li a{padding-top:6px; padding-bottom:6px}.danh-sach-phong .col, .archive .col.product-small{flex-basis:100%; max-width:100%; padding-bottom:15px}
.dich-vu-khac .col.post-item{flex-basis:50%; max-width:50%}.list-post .post-item .post-title {

    font-size: 14px;
}
.list-post .post-item .from_the_blog_excerpt {font-size:13px}
.footer-secondary{text-align:center;padding-bottom:15px }.is-well {
    padding: 10px;
}.thong-tin-chi-tiet .cot1, .thong-tin-chi-tiet .cot2{width:100% !important; margin-bottom:15px !important}.nav-tabs+.tab-panels{padding:10px}
.blog-archive .post-item .post-title {
    font-size: 18px;height:auto;
}.bai-viet-lien-quan ul li{width:50%}.bai-viet-lien-quan ul li .box-image img{height:100px}

}

/* FIX TRIỆT ĐỂ LỖI CLS (LAYOUT SHIFT) TRÊN DESKTOP */
.mt-hotel-layout-flex {
    display: flex !important;
    gap: 20px !important;
    align-items: flex-start !important;
    contain: layout style; /* Cố định luồng render của trình duyệt */
}

/* Đảm bảo cột nội dung chính cố định chiều rộng ban đầu */
.mt-column-content {
    flex: 2 1 0% !important;
    min-width: 300px !important;
    box-sizing: border-box !important;
}

/* Khóa kích thước cố định cho Form Sticky để không bị nhảy khung khi cuộn */
.mt-column-sticky-form {
    flex: 1 1 340px !important;
    width: 340px !important;
    min-width: 320px !important;
    max-width: 380px !important;
    box-sizing: border-box !important;
    min-height: 520px; /* Dành sẵn khoảng trống cho Form trước khi CSS tải xong */
}

/* Giữ nguyên vị trí ảnh đại diện không bị nảy layout */
.hotel-featured-image {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #f0f0f0;
}

.hotel-featured-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* ==========================================================================
   FIX CHUYÊN SÂU LỖI CLS = 1.049 VÀ TỐI ƯU KHUNG DỰNG HÌNH (CRITICAL CSS)
   ========================================================================== */

/* 1. KHÓA TRIỆT ĐỂ LỖI ĐẨY KHUNG CỦA SECTION BACKGROUND FOOTER (CHIẾM 1.000 CLS) */
footer#footer section#section_1590777699,
footer#footer .section-bg {
    contain: layout size;
    min-height: 250px !important; /* Dành sẵn khung trống cho background nạp sau */
    background-color: #111111; /* Màu nền dự phòng chống xô xệch */
}

/* 2. CỐ ĐỊNH KHUNG CHỨA ẢNH ĐẠI DIỆN BÀI VIẾT VÀ KHỬ LAZY-LOAD GIẬT MÀN HÌNH */
.hotel-featured-image {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 1020 / 959 !important; /* Tỉ lệ chuẩn theo đúng file ảnh 1020x959px trong báo cáo */
    background-color: #f5f5f5 !important;
    overflow: hidden !important;
    border-radius: 8px;
}

.hotel-featured-image img,
.hotel-featured-image img.lazy-load {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* 3. ĐÍNH KÈM SẴN PHÔNG CHỮ GIÚP DỰNG KHUNG MẠNH MẼ KHÔNG BỊ NHẢY CHỮ (FOUT) */
@supports (font-display: swap) {
    @font-face {
        font-family: inherit;
        font-display: swap;
    }
}

/* Cố định chiều cao sẵn cho Khung Tóm Tắt Thông Tin Khách Sạn */
.mt-hotel-summary-info {
    min-height: 210px !important;
    box-sizing: border-box !important;
}

/* 4. FIX BĂNG THÔNG LOGO HEADER TRÊN MOBILE */
.header_logo img,
img[src*="logo-seeyou"] {
    max-width: 234px !important;
    height: auto !important;
    aspect-ratio: 1024 / 444 !important;
}
/* FIX TRIỆT ĐỂ LỖI SECTION FOOTER CHÍNH XÁC THEO INSIGHTS REPORT */
section#section_155014189,
footer#footer section[id*="section_"],
footer#footer .section-bg {
    contain: layout size style !important;
    min-height: 200px !important;
    background-color: #111111 !important;
}

/* Đảm bảo ảnh đại diện bài viết không tạo ra biến động bố cục (0.050 CLS) */
.hotel-featured-image {
    aspect-ratio: 1020 / 959 !important;
    min-height: 250px !important;
    background: #f0f0f0 !important;
    overflow: hidden !important;
}

/* Tăng độ tương phản màu sắc đạt chuẩn Accessibility 100 điểm */
#mt-quick-booking-form-sticky label {
    color: #000000 !important;
    font-weight: 700 !important;
}
/* ==========================================================================
   FIX TRIỆT ĐỂ LỖI ICON SVG ĐEN PHÓNG TO KHỔNG LỒ TRÊN MOBILE
   ========================================================================== */

/* 1. Khóa kích thước cố định cho tất cả Icon SVG trong các khối Icon Box */
.icon-box img,
.icon-box svg,
.icon-box-img,
.icon-box-img img,
.icon-box-img svg,
.img-inner img,
.img-inner svg {
    max-width: 48px !important;
    width: 48px !important;
    height: 48px !important;
    object-fit: contain !important;
    display: inline-block !important;
}

/* 2. Ép màu icon SVG về tông vàng/xám nguyên bản thay vì dính màu đen nguyên khối */
.icon-box-img svg path,
.icon-box-img img {
    fill: currentColor;
}

/* 3. Sắp xếp lại khung 3 khối tính năng trên Mobile gọn gàng */
@media (max-width: 767px) {
    .icon-box {
        display: flex !important;
        align-items: center !important;
        text-align: left !important;
        gap: 15px !important;
        margin-bottom: 15px !important;
        background: #ffffff !important;
        padding: 15px !important;
        border-radius: 10px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
    }

    .icon-box-img {
        width: 50px !important;
        flex-shrink: 0 !important;
        margin: 0 !important;
    }

    .icon-box-text {
        flex: 1 !important;
    }

    .icon-box-text h3,
    .icon-box-text h4 {
        font-size: 15px !important;
        margin: 0 0 4px 0 !important;
    }

    .icon-box-text p {
        font-size: 13px !important;
        margin: 0 !important;
        line-height: 1.4 !important;
    }
}