/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.3
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
.header-main{background: url("http://hethongbanquan.vn/wp-content/uploads/2025/11/header-bg-web-scaled.jpg"); background-size: cover;}
.header-nav li.menu-item a{color: #fff;font-size: 16px;font-weight: normal;padding: 5px;}
.header-nav li.header-button-1{margin-left: 20px;}
.ux-menu-ban ul li{margin: 0px 20px;}
.wpcf7 form.sent .wpcf7-response-output{color: #fff!important; text-align: center!important;}
/* Ẩn tất cả các thẻ <span> là con trực tiếp của .has-filtering */
.has-filtering .row-isotope > span {display: none !important;}
.show-on-hover{display: none;}
.show-on-hover span{display: block;}
.ux-thuc-don .flickity-slider .col{padding: 0px 10px 10px!important;}
.ux-thuc-don .mon-an-featured-item{background: #fff; border-radius: 10px; overflow: hidden;}
.ux-thuc-don .mon-an-featured-item .box-text{text-align: left; padding: 15px 15px 25px;}
.ux-thuc-don .mon-an-featured-item .link-dat-ban{position: absolute; bottom: 15px; right: 15px;    border: 1px solid #E2E2E2;padding: 4px 10px;border-radius: 50px;font-size: 12px;}
.ux-thuc-don .mon-an-featured-item .link-dat-ban:hover{background: #FFB93F; border-color: #FFB93F;}
.ux-thuc-don .mon-an-featured-item .link-dat-ban i{margin-right: 2px; font-size: 9px; margin-left: 5px; color: #E2E2E2;}
.ux-thuc-don .mon-an-featured-item .link-dat-ban a{color: #222;}
.ux-thuc-don h5.mon-an-title a{font-size: 18px; color: #222222; text-transform: capitalize;}
.ux-thuc-don .row-slider .flickity-page-dots{bottom: -25px;}
.ux-single-product{padding: 60px 0px;}
.ux-single-product .product-gallery{height: 360px;overflow: hidden;border-radius: 10px;}
.ux-single-product .product-info{padding: 25px 0px; position: relative;border-bottom: 1px dashed #ccc;margin-bottom: 30px;}
.ux-single-product .product-info h1{font-size: 22px;}
.ux-single-product .product-info .single-mon-an-price{width: 40%; float: left;}
.ux-single-product .product-info .sp-dat-ban{width: 60%; float: right; text-align: right;}
.ux-single-product .product-info .sp-dat-ban a{background: #ff9933; color: #fff; width: 125px; padding: 5px 10px; border-radius: 20px;}
.ux-single-product .product-info .sp-dat-ban i{font-size: 11px; font-weight: normal; background: #fff;border-radius: 50%;padding: 5px 6px 5px 5px; color: #ff9933;}
.ux-co-so .tabbed-content{border-radius: 20px; overflow: hidden; background: #fff;}
.ux-co-so .tabbed-content .nav-left{background: #ff9933; color: #222;}
.ux-co-so .tabbed-content .nav-left a{padding: 10px 0px;font-size: 16px; border-bottom: 0.7px solid #1B4E30;}
.ux-co-so .tabbed-content .text-left{background: linear-gradient(
        to right, 
        #FF9933 0%, /* Màu #FF9933 bắt đầu từ 0%... */
        #FF9933 25%, /* ...và kết thúc tại 25% */
        white 25%,   /* Màu trắng bắt đầu chính xác từ 25%... */
        white 100%   /* ...và kéo dài đến 100% */
    );
    margin: 0px;
    padding: 30px;
    font-size: 30px;
    font-weight: 900;
}
.ux-co-so .tabbed-content .tab-panels{height: 400px;width: 100%; overflow-x: hidden; overflow-y: scroll;}
.ux-img-co-so img{border-radius: 5px;}
.ux-tt-co-so p{margin-bottom: 10px;}
.ux-tt-co-so .button{background: #F5F5F5; color: #163E26; border: none; font-size: 13px;}
.ux-tt-co-so .button:hover{background: #FF9933; color: #fff;}
.ux-co-so .nav-vertical li{border: none; margin-left: 30px!important; width: calc(100% - 30px);}
.ux-post-khuyen-mai .post-item .col-inner{background: #fff; border-radius: 10px; overflow: hidden;}
.ux-post-khuyen-mai .post-item .blog-post-inner{padding: 0px 20px;}
/* Container bao quanh dải marquee */
.marquee-wrapper {
    width: 100%;
    /* Màu nền vàng/cam tương tự như hình */
    background-color: #ff9933; 
    padding: 15px 0; /* Khoảng đệm trên dưới để làm nổi bật dải */
    box-sizing: border-box;
}

/* Container chính giữ nội dung, giới hạn và cắt phần thừa */
.marquee-container {
    width: 100%;
    overflow: hidden; /* Quan trọng: ẩn nội dung khi nó chạy ra khỏi vùng này */
    white-space: nowrap; /* Quan trọng: ngăn nội dung xuống dòng */
}

/* Container chứa nội dung (các thẻ span) */
.marquee-content {
    display: inline-block;
    /* Áp dụng animation */
    animation: marquee-scroll 20s linear infinite; /* 20s: thời gian chạy, linear: tốc độ đều, infinite: lặp vô hạn */
    will-change: transform; /* Tối ưu hóa hiệu suất */
    font-size: 40px; /* Kích thước chữ lớn */
    color: #143D25;
    font-weight: 900;
    letter-spacing: 1px;
}
.marquee-content i{margin-top: -5px;}
/* Định dạng cho văn bản */
.marquee-content span {
    font-size: 40px; /* Kích thước chữ lớn */
    font-weight: 900; /* Chữ đậm (Black hoặc Extra Bold) */
    color: #000000; /* Màu chữ đen */
    /* Khoảng cách giữa các cụm từ nếu cần */
    margin:0px 5px 0px 10px;
    letter-spacing: 1px;
}

/* Keyframes - Định nghĩa hoạt ảnh chạy chữ */
@keyframes marquee-scroll {
    0% {
        /* Bắt đầu ở vị trí 0 (bên trái) */
        transform: translateX(0%);
    }
    100% {
        /* Chuyển động sang trái một khoảng bằng độ dài nội dung được lặp lại */
        /* Giá trị -100% * số lần lặp nội dung. Ở đây -50% vì nội dung được lặp lại 2 lần */
        transform: translateX(-50%); 
    }
}
/*
TOPBAR
*/
.topbar-uudai{font-size: 20px;font-weight: bold;padding: 0px 3px;}
/*
SIDERBAR
*/
.widget_media_image img{border-radius: 10px;}
/*
FOOTER
*/
.ux-footer{padding-top: 60px!important;}
.ux-footer-col-3 a{color: #ff9933;}
.absolute-footer{display: none;}

/* 
ĐẶT BÀN
*/
/* --- WRAPPER CHUNG --- */
.ban-quan-booking-form-wrapper {
    max-width: 650px;
    margin: 40px auto;
    padding: 20px;
    box-sizing: border-box;
}

/* --- HEADER (LOGO & HOTLINE) --- */
.ban-quan-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    position: relative;
}

.ban-quan-header .logo {
    height: 50px; /* Chỉnh kích thước logo */
    width: auto;
}

.ban-quan-header .hotline {
    color: #f3c220; /* Màu vàng cam */
    font-size: 1.1em;
    position: absolute;
    right: 5px;
    bottom: 5px;
}

.ban-quan-header .hotline strong {
    color: #fff;
    font-weight: bold;
}

/* --- FORM CHÍNH --- */
.ban-quan-booking-form{background: #fff; padding: 30px; border-top: 10px solid #f3c220; border-radius: 5px;}
.ban-quan-booking-form h2 {
    color: #FF9933;
    text-align: left; /* Trong hình là căn trái, không phải căn giữa */
    font-size: 2.5em;
    font-weight: bold;
    margin-bottom: 25px;
}

.ban-quan-booking-form .form-section-title {
    font-weight: bold;
    font-size: 1.1em;
    color: #222222;
    border-left: 4px solid #f3c220; /* Đường kẻ vàng */
    padding-left: 12px;
    margin-top: 25px;
    margin-bottom: 20px;
}

/* Xóa margin mặc định của thẻ <p> do CF7 tạo ra */
.ban-quan-booking-form p {
    margin: 0 0 18px 0;
}

/* --- CÁC TRƯỜNG INPUT, SELECT, TEXTAREA --- */
.ban-quan-booking-form input[type="text"],
.ban-quan-booking-form input[type="tel"],
.ban-quan-booking-form input[type="number"],
.ban-quan-booking-form input[type="date"],
.ban-quan-booking-form select,
.ban-quan-booking-form textarea {
    width: 100%;
    padding: 0px 18px;
    margin: 0;
    border: 0.5px solid #C7C7C7;
    border-radius: 8px;
    background-color: #fff;
    color: #333;
    font-size: 1em;
    box-sizing: border-box;
    -webkit-appearance: none; /* Tắt giao diện mặc định */
    -moz-appearance: none;
    appearance: none;
}

.ban-quan-booking-form textarea {
    min-height: 100px;
    resize: vertical;
}

/* Tùy chỉnh mũi tên cho thẻ select */
.ban-quan-booking-form select {
    background-image: url('data:image/svg+xml;utf8,<svg fill="black" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 1.2em;
    padding-right: 40px; /* Thêm không gian cho mũi tên */
}

/* Tùy chỉnh icon lịch cho input date */
.ban-quan-booking-form input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0.6;
    cursor: pointer;
}

/* Tùy chỉnh placeholder */
.ban-quan-booking-form ::placeholder {
    color: #999;
    opacity: 1;
}

/* --- GRID LAYOUT (SỐ LƯỢNG, NGÀY, GIỜ) --- */
.form-row-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-bottom: 18px;
}

.form-row-grid .form-group {
    /* Xóa margin của thẻ <p> bên trong grid */
    margin: 0;
}

.form-row-grid .form-group label {
    display: block;
    margin-bottom: 8px;
    font-size: 0.9em;
    font-weight: 500;
    color: #222;
}
#guest-count{margin-top: -10px;}
/* --- NÚT SUBMIT --- */
.ban-quan-booking-form .form-submit {
    margin-top: 25px;
}

.ban-quan-booking-form input[type="submit"] {
    background-color: #f3c220; /* Màu vàng cam */
    color: #000; /* Chữ đen */
    border: none;
    padding: 15px 20px;
    width: 100%;
    font-weight: bold;
    font-size: 1.1em;
    border-radius: 8px;
    cursor: pointer;
    text-transform: uppercase;
    transition: background-color 0.3s ease;
}

.ban-quan-booking-form input[type="submit"]:hover {
    background-color: #e6a800; /* Màu đậm hơn khi hover */
}
/*
PAGE CƠ SỞ
*/
.ux-page-co-so{background: #fff; border: 1px solid #EFEFEF; border-radius: 20px;padding: 30px 25px 0px 36px;margin-bottom: 30px;}
.ux-page-co-so .ux-tt-co-so .button {font-size: 16px;}
.ux-btn-dang-mo{font-size: 13px;}
.ux-btn-dang-mo span{background: #23C346;font-size: 10px;color: #fff;padding: 5px 10px;border-radius: 11px;font-weight: bold;}
.ux-page-co-so-tt{font-size: 16px;font-weight: bold;padding-right: 5px;}
.ux-page-co-so-tt .col-inner{border-right: 1px solid #C7C7C7;}
.ux-page-co-so-tt span{font-size: 12px;font-weight: normal;}
.ux-page-co-so-hotline{font-size: 20px;}
.ux-page-co-so-hotline img{margin-top: -3px;}
/*
PAGE ƯU ĐÃI
*/
.ux-fea-box .col-inner .post-item .col-inner{background: #0F361F; color: #fff; border-radius: 20px; overflow: hidden;}
.ux-fea-box .post-item .box-text a{color: #fff;}
.post-item .box-text a.is-link{position: relative; padding-left: 24px;}
.post-item .box-text a.is-link::before{content:""; width: 14px; height: 12px; background: url("http://hethongbanquan.vn/wp-content/uploads/2025/12/rightarrow-icon-1.png"); left: 0px; top: 7px; position: absolute;}
.ux-fea-box .post-item .box-text a.is-link::before{top: 11px;}
.ux-fea-box .post-item .is-divider{display: none;}
.ux-promotion-box .post-item .col-inner{background: #fff; border-radius: 10px; overflow: hidden;}
.ux-promotion-box .post-item .col-inner .box-text{padding: 25px;}
/*
PAGE LIÊN HỆ
*/
.ux-page-lien-he{background: #fff; border: 1px solid #EFEFEF; border-radius: 20px;padding: 60px 80px 0px 80px;margin-bottom: 30px;}
.ux-page-lien-he input[type=submit]{width: 100%; border-radius: 5px; padding: 10px 0px;}
.ux-page-lien-he input[type=text], .ux-page-lien-he textarea, .ux-page-lien-he input[type="tel"], .ux-page-lien-he select{background-color: #f2f2f2;border: none;border-radius: 5px; box-shadow: none; height: 50px;}
/*
PAGE MÓN ĂN
*/
.portfolio-page-wrapper #content{background: #f8f8f8;}
.portfolio-page-wrapper .portfolio-box{background: #fff; border-radius: 10px;}
.portfolio-page-wrapper .portfolio-box .box-text{padding:0px 20px 15px; text-align: left; position: relative; margin-top: -10px;}
.portfolio-page-wrapper .portfolio-box .box-text .link-dat-ban{position: absolute; right: 20px; bottom: 10px;border: 1px solid #E2E2E2;padding: 4px 10px;border-radius: 50px;font-size: 12px;}
.portfolio-page-wrapper .portfolio-box .box-text .link-dat-ban:hover{background: #FFB93F; border-color: #FFB93F;}
.portfolio-page-wrapper .portfolio-box .box-text .link-dat-ban i{margin-right: 2px; font-size: 9px; margin-left: 5px; color: #E2E2E2;}
.portfolio-page-wrapper .portfolio-box .box-text .link-dat-ban a{color: #222;}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
#top-bar{display: none;}
.ux-dia-chi-co-so{padding: 0px 20px!important;}
.ux-co-so .tabbed-content .text-left{background:#FF9933;}
.ux-tt-co-so h4{font-size: 18px;}
.ux-chi-duong .col{padding-bottom: 0px!important;}
}