/*
Theme Name: Theme wordpress giá rẻ
Description: This is a child theme for Flatsome Theme
Author: Trường Phong
Template: flatsome
Version: 3.0
*/

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

@font-face {

    font-family: 'utm_avo';
    src: url('fonts/UTM Avo.eot');
    src: local('â˜º'), url('fonts/UTM Avo.woff') format('woff'),
                     url('fonts/UTM Avo.ttf') format('truetype'),
                     url('fonts/UTM Avo.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'UTMAvoBold';
    font-style: normal;
    font-weight: normal;
    src: local('UTMAvoBold'), url('fonts/utm-avobold.woff') format('woff');
}
h1.product-title{
        color: #0061A0;
        margin-top: 10px;
}
.gia-form-tu-van .gia-chuan{
    font-weight: bold;
    color: #E74C3C;
}
.lich-dang-ky {
    font-size: 120%;
        border-bottom: 1px solid #e6e7e7;
    margin-bottom: 8px;
}
.lich-dang-ky i{
      color: #ff9729;
    font-size: 18px;
}
.product-small .box-text i{
    color: #ff9729;
    font-size: 18px;
}

i.fa{
    padding-right: 3px;
}

p.p-nho{
        font-size: 20px;
    color: #fe7e01;
    margin-bottom: 0px;
}
h2.title-home{
        color: #000000;
    font-size: 40px;
}
.div-no-padding{
    padding-bottom: 0px !important;
}
.div-image-bottom  .img-inner{
        margin: -120px 0px 0px 0px;
}


h3.title-home{
        text-transform: uppercase;
    font-size: 30px;
    color: #f99b1c;
    font-weight: 400;
    text-align: center;
}
.div-dat-phong {
    padding: 0px 10px;
}
.entry-content{
    padding-top: 0px;
}
.lightbox-by-id{
    padding:30px !important;
}
.p-dat-phong {
    text-transform: uppercase;
    background: #fe7e01;
    color: white;
    padding: 5px !important;
    margin-bottom: 10px !important;
}
.related h3.product-section-title {
        color: #faab3b;
    margin-left: 0px;
    font-size: 26px;
}
.footer .widget-title{
    display: block;
    font-size: 19px;
    /* padding-bottom: 20px; */
    color: #faab3b;
    margin-bottom: 14px;
}
.product-small .box-text{
        background: white;
}
.a-dat-tour{
        display: block;
    width: 100%;
    background: #e74c3c;
    text-align: center;
    text-transform: uppercase;
    color: white;
    text-transform: uppercase;
    padding: 10px;
    margin: 16px 0px;
}
.a-dat-tour:hover{
    color: white;
}
.price-wrapper{
    display: none;
}
.tour,.tour .row{
    margin-left: 0px !important;
    margin-right: 0px !important
}

.box-title h3:before {
    content: '';
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-right: 5px solid #b94300;
    left: -5px;
    position: absolute;
}
.box-title h3:after {
    content: '';
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-left: 5px solid #b94300;
    right: -5px;
    position: absolute;
}
 .box-title h3 {
    font-weight: 700 !important;
    display: inline-block;
    position: relative;
    color: #222;
    font-size: 16px;
    text-transform: uppercase;
    height: 42px;
    padding: 0 15px;
    line-height: 42px;
    background-color: #ff5c00;
    color: #fff;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}
.row-tien{
    margin-left: 0px !important;
    margin-right: 0px !important;
}
.xem-them-ux-product:hover{
    color: white;   
}
.stars a{
    font-family: 'fl-icons' !important;
}
.product-small .box-text .product-title{
    min-height: 40px ;
    font-weight: bold
}
.woocommerce-tabs .tab-panels{
        border: 1px solid #ddd;
    padding: 15px;
}
.product-small .box-text{
    padding-left: 10px;
    padding-right: 10px;
}
/*Menu */
.title-comm {
    color: #fff;
    font-size: 18px;
    position: relative;
    margin-top: 0px;
    margin-bottom: 10px;
    font-weight: 700;
    background-color: #fff;
    text-align: center;
}

h3.title-comm:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin-top: 0;
    border-top: 2px solid #d0d2d3;
    z-index: 1;
    display: block;
}

.title-comm .title-holder {
   
    height: 45px;
    background-color: #56bbe7;
    height: auto;
    line-height: 45px;
    padding: 0px 20px;
    position: relative;
    z-index: 2;
    text-align: center;
    display: inline-block;
    min-width: 188px;
}

.title-holder:before {
    content: "";
    position: absolute;
    right: -15px;
    border-width: 0px;
    bottom: 0px;
    border-style: solid;
    border-color: #5c9efe transparent;
    display: block;
    width: 0;
    height: 0;
    border-top: 23px solid transparent;
    border-bottom: 22px solid transparent;
    border-left: 15px solid #56bbe7;
}

.title-holder:after {
    content: "";
    position: absolute;
    left: -15px;
    border-width: 0px;
    bottom: 0px;
    border-style: solid;
    border-color: #5c9efe transparent;
    display: block;
    width: 0;
    height: 0;
    border-top: 23px solid transparent;
    border-bottom: 22px solid transparent;
    border-right: 15px solid #56bbe7;
}
/*end Menu*/
.category_box ul li::before {
    font-family: FontAwesome;
    content: "\f041";
    padding-right: 5px;
    color: #1D9E74;

}
.footer .textwidget p{
    margin-bottom: 0px;
}
.news_letter_bg {
    width: 229px;
    height: 208px;
    background: url(images/email_bg.png) center center;
    position: absolute;
    top: -189px;
    right: -68px;
    z-index: 9;
}
.row-dang-ky  {
    padding: 23px;
    background: #32B3CC;
    margin-bottom: 30px;
}
.news_letter_title,.news_letter_description{
    color: white;
}
.news_letter_title{
    font-size: 25px;
    color: white;
    font-family: 'Pacifico', cursive

}
.row-dang-ky .wpcf7-email{

    float: left;
    width: 68%;
}
.row-dang-ky .wpcf7-submit{
    background: #FF9729!important;
    float: right;
}
.footer .textwidget .p-hotline-footer{
    font-weight: bold;
    color: #FFFF15;
    margin-bottom: 0px;
}
.back-to-top{
    bottom: 57px !important
}
.copyright-footer{
    color: white
}
.post-item .box-text .post-title {
    min-height: 42px;
}
.category-page-row .product-small .product-small {
    border-bottom: solid 1px #ddd;
}
.box-overlay .box-image{
    border-radius: 10px;
}
.box-overlay .box-text{
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
.product-small .box-image img{
     
}
.hotline-header{
        font-size: 15px;
    color: #ff9729;
    border: solid 2px #ff9729;
    border-radius: 3px;

    margin-top: 15px;

    line-height: -11px;
    padding: 9px;
}
.header-block-block-1 .icon-box-img{
    margin-bottom: 10px;
}
.header-block-block-1 .p-header{
    color: #32B3CC
}
.header-block-block-1 .col{
    padding-bottom: 0px;
}
.div-san-pham-list .box-vertical{
    border-bottom: solid 1px #ddd;
    padding: 5px 0px;
}

.div-san-pham-list{
    line-height: 1.1 !important
}
b, strong{
    font-weight: bold !important;
}
.post-sidebar{
    padding-left: 5px !important;
    padding-right: 5px !important;
}
.post-sidebar #text-4{
    background: #fe7e01;
    padding: 10px;
}
.post-sidebar #text-4 p{
    color: white !important;
}
.div-san-pham-list .col{
    padding-bottom: 0px !important
}
.gia-giam-ux-product{
        color: #00a1c0;
    font-size: 16px;
    font-weight: bold;
}
.gia-goc-ux-product{
text-decoration: line-through;
}
.xem-them-ux-product{
    
text-transform: uppercase;
    line-height: 16px !important;
    color: #fff;
    background-color: #d58512;
    padding: 8px 17px;
    border-radius: 5px

}
.box-overlay .box-text{
        background: rgba(0, 0, 0, 0.35);
}
.gia-overlay{
      padding-left: 10px;
    color: #ff9729 !important;

    border-radius: 5px;
    /* text-align: center; */
    /* margin: 0px 15px; */
    font-size: 16px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 600;
    /* float: right; */
    /* padding: 0px 31px; */

}
.div-khuyen-mai{
    z-index: 1;
        content: "";
    position: absolute;
    width: 120px;
    height: 120px;
    background: url(images/label_khuyenmai.png) no-repeat center center;
    left: -6px;
    top: -6px;
    background-size: 100%;
}
.badge-container{
    display: none
}
ul.so-sao .star .active {
    color: #f1c40f;
}
.product-small ul.so-sao .star span {
    font-size: 17px !important
}
ul.so-sao .star span {
    font-size: 20px;
}
ul.so-sao{
    margin-bottom: 0px;
}
.form-tu-van .form-goi-lai p{
    font-size: 14px;
    color: white !important;
}
.form-goi-lai p{
    padding: 5px 0px;
    color: black !important
}
.form-goi-lai .wpcf7-submit{
    width: 100%;
    background: #ff9729 !important;
    color: #fff;
}
.form-tu-van .wpcf7-response-output{
    padding: 10px;
    color: white;
        border: 2px solid #ff9729 !important;
}
.tour_box_gif {
 position: absolute;
    right: 22px;
    width: 30px;
    height: 30px;
    background: url(images/gift-icon.png) no-repeat center center;
    /* float: right; */
    /* margin-bottom: 25px; */
    top: 0px;
}
.WOOF_Widget{
    text-align: center;
        width: 100%;
    border: solid 2px #d0c9c7;
    border-radius: 5px;
    margin-top: 30px;
    padding: 12px;
    margin-bottom: 15px;
}
.chosen-container {
    width: 100% !important;
}
.woof_sid_widget {
    text-align: left !important; 
    padding-top: 10px;
}
span.amount {
    white-space: nowrap;
    color: #00c0c0;
    font-weight: bold;
}
.div-san-pham-list .product-title{
    font-weight: bold;
    color: #333
}

/* ==========================================================================
   Modern Single Product Tabs, Reviews & Related Products Redesign
   ========================================================================== */

/* 1. WooCommerce Tabs Container & Navigation */
.woocommerce-tabs.tabbed-content {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
}

.woocommerce-tabs ul.product-tabs,
.woocommerce-tabs ul.nav-line {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #f8fafc !important;
    padding: 8px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
    margin-bottom: 24px !important;
    list-style: none !important;
    border-bottom: none !important;
}

.woocommerce-tabs ul.product-tabs li,
.woocommerce-tabs ul.nav-line > li {
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-tabs ul.product-tabs li a,
.woocommerce-tabs ul.nav-line > li > a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 24px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    background: transparent !important;
    border: none !important;
    border-radius: 10px !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    text-transform: capitalize !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
}

.woocommerce-tabs ul.product-tabs li a:hover,
.woocommerce-tabs ul.nav-line > li > a:hover {
    color: #0c4999 !important;
    background: #eff6ff !important;
}

.woocommerce-tabs ul.product-tabs li.active a,
.woocommerce-tabs ul.nav-line > li.active > a {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0c4999 0%, #1e5cb3 100%) !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 14px rgba(12, 73, 153, 0.25) !important;
}

.woocommerce-tabs ul.nav-line > li > a:before {
    display: none !important;
}

/* 2. Tab Panels Shell & Content */
.woocommerce-tabs .tab-panels {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 18px !important;
    padding: 32px !important;
    box-shadow: 0 6px 24px rgba(15, 23, 42, 0.05) !important;
}

.woocommerce-Tabs-panel--description,
.woocommerce-Tabs-panel--reviews {
    font-size: 15px !important;
    line-height: 1.75 !important;
    color: #334155 !important;
}

/* Styled Paragraphs & Itinerary Lists in Description */
.woocommerce-Tabs-panel--description p {
    margin-bottom: 12px !important;
    font-size: 15px !important;
    color: #334155 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 16px !important;
    background: #f8fafc !important;
    border-radius: 10px !important;
    border: 1px solid #f1f5f9 !important;
}

.woocommerce-Tabs-panel--description p::before {
    content: "✓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: #eff6ff;
    color: #0c4999;
    font-weight: 800;
    font-size: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* 3. Reviews & Rating Form */
#reviews .woocommerce-Reviews-title {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 16px !important;
    border-bottom: 2px solid #f1f5f9 !important;
    padding-bottom: 10px !important;
}

.woocommerce-noreviews {
    color: #64748b !important;
    font-style: italic !important;
    margin-bottom: 24px !important;
}

.review-form-inner.has-border {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 24px !important;
    margin-top: 20px !important;
}

.comment-reply-title {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin-bottom: 16px !important;
}

.comment-form-rating label,
.comment-form-comment label,
.comment-form-author label,
.comment-form-email label {
    display: block !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin-bottom: 6px !important;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form textarea {
    width: 100% !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    color: #0f172a !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form textarea:focus {
    border-color: #0c4999 !important;
    box-shadow: 0 0 0 3px rgba(12, 73, 153, 0.15) !important;
    outline: none !important;
}

.comment-form .stars span a {
    color: #f59e0b !important;
    font-size: 18px !important;
}

.form-submit input[type="submit"] {
    background: linear-gradient(135deg, #0c4999 0%, #1e5cb3 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 10px 24px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 12px rgba(12, 73, 153, 0.2) !important;
}

.form-submit input[type="submit"]:hover {
    background: linear-gradient(135deg, #ff6b35 0%, #ea580c 100%) !important;
    box-shadow: 0 6px 16px rgba(255, 107, 53, 0.3) !important;
    transform: translateY(-1.5px) !important;
}

/* 4. Related Products / Similar Tours Section */
.wg-related-tours-section {
    margin-top: 50px !important;
    padding: 36px 30px 40px 30px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 20px !important;
    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.04) !important;
    position: relative !important;
    overflow: hidden !important;
}

.wg-related-tours-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #0c4999 0%, #ff6b35 100%);
}

.wg-related-header {
    margin-bottom: 24px !important;
    text-align: left !important;
}

.wg-related-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: #0c4999 !important;
    background: #eff6ff !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    margin-bottom: 10px !important;
}

.wg-related-title {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 0 6px 0 !important;
    letter-spacing: -0.4px !important;
    line-height: 1.3 !important;
}

.wg-related-subtitle {
    font-size: 14px !important;
    color: #64748b !important;
    margin: 0 !important;
}

.wg-related-grid-wrap .row {
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.wg-related-grid-wrap .col {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* 5. Booking Lightbox Modals & Form Styling (#dattour, #datks) */
.lightbox-by-id {
    background: #ffffff !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2) !important;
    padding: 30px !important;
    max-width: 850px !important;
}

.p-dat-phong {
    background: linear-gradient(135deg, #0c4999 0%, #1e5cb3 100%) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 8px 16px !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 14px !important;
}

.div-dat-phong label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #334155 !important;
}

.div-dat-phong input[type="text"],
.div-dat-phong input[type="email"],
.div-dat-phong input[type="tel"],
.div-dat-phong input[type="date"] {
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    padding: 9px 12px !important;
    font-size: 14px !important;
    color: #0f172a !important;
    width: 100% !important;
}

.nut-gui input[type="submit"] {
    background: linear-gradient(135deg, #ff6b35 0%, #ea580c 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 12px 30px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 14px rgba(255, 107, 53, 0.3) !important;
    width: 100% !important;
}

.nut-gui input[type="submit"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(255, 107, 53, 0.4) !important;
}

/*Hết phần css tab chi tiết sản phẩm*/
.a-dat-phong{
      padding: 7px 18px;
    color: #fff;
    background-color: #FEBE13;
    border-color: #985f0d;
    border-radius: 5px;
}
.a-dat-phong:hover{
       color: #fff;
    background-color: #FEBE13;
    border-color: #985f0d;

}
.tour .gia-goc{
        text-decoration: line-through;
}
.tour .gia-giam{
        font-weight: bold;
    color: #00c0c0;
    font-size: 20px;
}
.flex-right ul li a{
	text-transform: initial !important;
	font-size: 16px;
}

/*Màu sắc button*/
.social-button, .social-icons .button.icon:not(.is-outline), .social-icons .button.icon:hover {
    background-color: currentColor !important;
    border-color: currentColor !important;
}
.button.facebook,.button.facebook:not(.is-outline), .button.facebook:hover {
color: #fff;
    background-color: #446084;
    border-color: #446084;
}
.button.twitter,.button.twitter:not(.is-outline), .button.twitter:hover {
	color: white !important;
   background : #2478ba !important;
    border-color: #2478ba;
}
.button.email,.button.email:not(.is-outline), .button.email:hover {
    color: #fff;
    background-color: black !important;
    border-color: black !important;
}
.button.pinterest,.button.pinterest:not(.is-outline), .button.pinterest:hover {
color: #fff !important;
    background-color: #cb2320  !important;
    border-color: #cb2320  !important;
}

.button.google-plus,.button.google-plus:not(.is-outline), .button.google-plus:hover {
color: #fff !important;
    background-color: #dd4e31 !important;
    border-color: #dd4e31  !important;
}
.button.linkedin,.button.linkedin:not(.is-outline), .button.linkedin:hover {
color: #fff !important;
    background-color: #0072b7 !important;
    border-color: #0072b7     !important;
}

.single-date{
        border-bottom: 1px dashed #ededed;
}
h1.entry-title{
    font-size: 24px !important;
}
/*Kết thúc màu sắc*/



footer.entry-meta {

    border-top: none !important;
    border-bottom: 1px dashed #ececec !important;
    
}

.entry-content:not(.product-info):not(.woocommerce-tabs) p img {
	max-width: 100%;
	height: auto;
}
.duong-line {
    background: rgba(0,0,0,0) url(images/line.png) repeat scroll 0 0;
    height: 12px;
    margin-top: 5px;
    overflow: hidden;
}
.related-post h7{
	font-weight: bold;
	    font-size: 18px;
    float: left;
    margin: -8px 20px 0 0;
}


.home_product_box_title {
    height: 48px;
    background: #eeeeee;
    line-height: 48px;
    margin-bottom: 20px;
    padding-left: 13px;
}
.home_product_box_title_left {
    padding: 0px 15px;
    color: #fff;
    font-size: 20px;
    background: #00a1c0;
    box-shadow: 0px 0px 5px 1px #ddd;
    float: left;
    font-family: "Pacifico-Regular";
    position: relative;
}
.home_product_box_title_left:before {
    content: "";
    position: absolute;
    width: 34px;
    height: 59px;
    background: url(images/title_before.png) no-repeat;
    top: -1px;
    left: -24px;
}
.dia-chi-cat,.p-cat{
    font-size: 14px;
}
.category-nut-dat{
    float: right;
}
.category-nut-dat a{
padding: 7px 18px;
    color: #fff;
    background-color: #d58512;
    border-color: #985f0d;
    border-radius: 5px;
}
.home_product_box_title_left a {
    
        font-family: 'Pacifico', cursive;
    color: #fff;
    text-decoration: none;
}
.home_product_box_title_left a br{
    display: none
}
.home_product_box_title_right br{
    display: none
}
.home_product_box_title_left:after {
    content: "";
    position: absolute;
    width: 34px;
    height: 59px;
    background: url(images/title_after.png) no-repeat;
    top: -10px;
    right: -24px;
}
.home_product_box_title_right {
    float: right;
    padding-right: 20px;
}

.single-product .price-wrapper{
    display: none
}
.is-divider{
    display: none
}
.thong-tin-chung .tour{
    margin-left: 0px  !important;
    margin-right: 0px !important;
}
.thong-tin-chung .tour p{
    margin-bottom: 5px;
}
.row-divided>.col+.col:not(.large-12){
    border-left: none;
}
.form-tu-van .row{
    margin-left: 0px !important;
    margin-right: 0px !important;
}
.form-tu-van{
     border: 1px solid #e6e7e7;
    padding: 15px 15px 0px 15px;
    border-radius: 5px;
}
.form-tu-van h3{
    font-family: 'Pacifico', cursive;
    text-align: center;
    color: white;
    font-size: 24px;
}
.thong-tin-chung .product-info{
        padding: 10px 0px;
    padding-bottom: 10px;

}
.thong-tin-chung .product-info h1{
        color: #0ba5c2;
}
.row-box-shadow-1 .col-inner {
    box-shadow: 0 4px 18px 0 rgb(194 200 213 / 30%);
}
.product-title a{
   font-size: 19px;
    color: #fe7e01;
}
.product-small.box .box-image {
    border-radius: 5px 5px 0px 0px;
}
.box {
    overflow: hidden;
    border-radius: 5px;
}
.header-sp {
    text-align: left;
    height: 50px;
    margin-top: 3px;
    color: #333;
    position: relative;
    padding-left: 40px;
}
.header-sp h4 {
    font-size: 15px;
    margin: 0;
    color: #faab3b;
    font-size: 19px;
}
.header-sp h3 {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
}
.header-sp:before {
    content: "\f095";
    font: normal normal normal 14px/1 FontAwesome;
    background: #faab3b;
    height: 30px;
    width: 30px;
    display: inline-block;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    line-height: 30px;
    font-size: 20px;
    position: absolute;
    left: 0px;
    top: 8px;
}
.gia-form-tu-van{
    

   
    text-align: center;
    margin: 10px auto;
    font-size: 25px;
    border: solid 1px #ddd;  

}
.form-tu-van p{
    margin-bottom: 4px !important;
}
@media(max-width: 1025px){
.html_topbar_left{
    display: none !important
}
}
@media(min-width: 1023px){
   
    .row-dang-ky .wpcf7{
            margin-top: 58px;
    }
}
@media(max-width: 321px){
    .row-dang-ky .wpcf7-email{
        width: 100% !important;

    }
    .row-dang-ky .wpcf7-submit{
        float: none !important;
    }

}
@media(min-width: 321px) and (max-width: 481px){
    .div-san-pham-list .product-small{
        border-radius: 10px;
    border: 1px solid #ededed !important;
    padding: 10px !important;
    margin-bottom: 10px !important;
    }
 .row-dang-ky .wpcf7-email{
        width: 59% !important;

    }
   

}
@media(max-width: 855px){
    .section-tim-kiem .ux-search-box{
            font-size: 1.2em;
    }
    .section-tim-kiem{
        min-height: 450px !important;
    }
    .mfp-container{
        padding: 15px;
    }
    .row-dat-phong input{
        margin-bottom: 2px;
    }
}
}

/* ==========================================================================
   Comprehensive Single Product Page Layout & Symmetry Redesign
   ========================================================================== */

/* Global Product Page Shell */
.product-container {
    max-width: 1240px !important;
    margin: 30px auto !important;
    padding: 0 20px !important;
}

.product-main {
    margin-bottom: 40px !important;
}

/* Product Gallery Frame & Hover Zoom */
.product-gallery {
    padding-right: 25px !important;
}

.product-gallery .woocommerce-product-gallery__image,
.product-gallery .main-image {
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08) !important;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
}

.product-gallery img,
.woocommerce-product-gallery img {
    border-radius: 20px !important;
    object-fit: cover !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    transition: transform 0.4s ease !important;
}

.product-gallery .product-thumbnails {
    display: flex !important;
    gap: 10px !important;
    margin-top: 14px !important;
}

.product-gallery .product-thumbnails img,
.product-gallery .col.is-nav-selected img {
    border-radius: 10px !important;
    border: 2px solid transparent !important;
    transition: all 0.2s ease !important;
}

.product-gallery .col.is-nav-selected img {
    border-color: #0c4999 !important;
    box-shadow: 0 4px 12px rgba(12, 73, 153, 0.2) !important;
}

/* Single Product Title & Price Layout */
.product-info.summary {
    padding-left: 10px !important;
}

h1.product-title {
    font-size: 28px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    line-height: 1.3 !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    letter-spacing: -0.4px !important;
}

.product-info.summary .price {
    display: flex !important;
    align-items: baseline !important;
    gap: 10px !important;
    margin-bottom: 18px !important;
    padding-bottom: 16px !important;
    border-bottom: 1px dashed #e2e8f0 !important;
}

.product-info.summary .price del .amount {
    font-size: 16px !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
    font-weight: 500 !important;
}

.product-info.summary .price ins .amount,
.product-info.summary .price > .amount {
    font-size: 30px !important;
    font-weight: 800 !important;
    color: #ff6b35 !important;
    letter-spacing: -0.8px !important;
}

/* Hide empty/narrow product sidebar column if present to ensure 2-column symmetry */
#product-sidebar:empty,
#product-sidebar.product-sidebar-small {
    display: none !important;
}

/* ==========================================================================
   Modern Travel UI Enhancements (Tour Cards, Badges, Quick Facts)
   ========================================================================== */

/* ==========================================================================
   Modern Tour Card Component Redesign
   ========================================================================== */

/* ==========================================================================
   Klook Exact Card Component Redesign
   ========================================================================== */

/* Card Container Equal Height */
.klook-tours-grid.row .col,
.equalize-box .col {
    display: flex !important;
    flex-direction: column !important;
}

.product-small.box {
    background: #ffffff !important;
    border: 1px solid #eaedef !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    flex: 1 1 auto !important;
}

.product-small.box:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08) !important;
    border-color: #cbd5e1 !important;
}

/* Image Container */
.product-small.box .box-image,
.card-img {
    position: relative !important;
    border-radius: 16px 16px 0 0 !important;
    overflow: hidden !important;
    background-color: #f8fafc !important;
    width: 100% !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}

.product-small.box .box-image div,
.product-small.box .box-image a {
    width: 100% !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
}

.product-small.box .box-image img,
.klook-image-bg {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 16px 16px 0 0 !important;
    display: block !important;
    margin: 0 !important;
    padding-bottom: 0 !important;
    transition: transform 0.4s ease !important;
    image-rendering: -webkit-optimize-contrast !important;
    image-rendering: crisp-edges !important;
    backface-visibility: hidden !important;
    transform: translateZ(0) !important;
}

.product-small.box:hover .box-image img,
.product-small.box:hover .klook-image-bg {
    transform: none !important;
}

.image-view-hydrated,
.image-box-lazy,
.klook-image-bg {
    padding-bottom: 0 !important;
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    image-rendering: -webkit-optimize-contrast !important;
}

/* Text Container */
.product-small.box .box-text {
    padding: 14px 16px 16px 16px !important;
    text-align: left !important;
    background: #ffffff !important;
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

.klook-card-content,
.card-info {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

/* Line 1: Category & Location Subtitle */
.klook-card-subcat {
    font-size: 12px !important;
    color: #757575 !important;
    margin-bottom: 4px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-height: 18px !important;
}

/* Line 2: Product Title */
.product-small.box .box-text .product-title,
.product-small.box .box-text .name {
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.product-small.box .box-text .product-title a,
.product-small.box .box-text .name a {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #212121 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
}

.product-small.box:hover .box-text .product-title a,
.product-small.box:hover .box-text .name a {
    color: #c59b27 !important;
}

/* Line 3: Instant Confirmation Tags */
.klook-card-tags,
.general-tag {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin-bottom: 8px !important;
    min-height: 24px !important;
}

.klook-tag-instant,
.atomic-basic-tag {
    display: inline-block !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #555555 !important;
    background: #f7f7f7 !important;
    padding: 2px 7px !important;
    border-radius: 4px !important;
}

.klook-tag-info {
    display: inline-block !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #8c6b16 !important;
    background: #fff9e6 !important;
    padding: 2px 7px !important;
    border-radius: 4px !important;
}

/* Line 4: Rating & Booked Count */
.klook-card-rating,
.atomic-minimal-rating {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 10px !important;
    font-size: 12px !important;
    min-height: 18px !important;
}

.klook-star-score,
.review-star {
    font-weight: 800 !important;
    color: #d4af37 !important;
}

.klook-reviews-count,
.review-number,
.review-booked {
    color: #757575 !important;
}

/* Line 5: Price Row */
.klook-card-price-row,
.card-info-bottom {
    margin-top: auto !important;
    margin-bottom: 6px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.klook-price-wrap,
.atomic-price-info,
.sell-price {
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

.klook-price-regular {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #8c8c8c !important;
    text-decoration: line-through !important;
    margin-right: 2px !important;
    line-height: 1.2 !important;
}

.klook-price-amount {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #111111 !important;
    letter-spacing: -0.4px !important;
    line-height: 1.2 !important;
}

/* Line 6: Promo Badges */
.klook-card-promo-badges,
.card-price-tag-list {
    display: flex !important;
    gap: 6px !important;
}

.klook-badge-sale,
.special-vertical-promo-tag {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #8c6b16 !important;
    background: #fef9e7 !important;
    border: 1px solid #f4e3b5 !important;
    padding: 1px 7px !important;
    border-radius: 4px !important;
}

/* Hide Default WooCommerce / Flatsome Duplicate Price */
.product-small.box .box-text .price-wrapper,
.product-small.box .box-text > .price {
    display: none !important;
}

/* Badges / Chips Row */
.wg-tour-badges-wrap {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin: 6px 0 14px 0 !important;
    align-items: center !important;
}

.wg-tour-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    padding: 5px 10px !important;
    border-radius: 6px !important;
    white-space: nowrap !important;
}

.wg-chip-departure {
    background: #fff7ed !important;
    color: #c2410c !important;
}
.wg-chip-departure svg {
    color: #ea580c !important;
}

.wg-chip-duration {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
}
.wg-chip-duration svg {
    color: #2563eb !important;
}

.wg-chip-date {
    background: #f8fafc !important;
    color: #475569 !important;
    border: 1px solid #e2e8f0 !important;
}
.wg-chip-date svg {
    color: #64748b !important;
}

/* Card Bottom: Price + CTA Button */
.wg-tour-card-bottom {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: auto !important;
    padding-top: 14px !important;
    border-top: 1px dashed #e2e8f0 !important;
    width: 100% !important;
}

.wg-price-box {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.wg-price-prefix {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: #94a3b8 !important;
    line-height: 1 !important;
}

.wg-price-values {
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
}

.wg-regular-price {
    font-size: 12px !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
}

.wg-sale-price {
    font-size: 19px !important;
    font-weight: 800 !important;
    color: #ff6b35 !important;
    line-height: 1 !important;
    letter-spacing: -0.5px !important;
}

.wg-btn-view-tour {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 16px !important;
    background: linear-gradient(135deg, #0c4999 0%, #1e5cb3 100%) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 2px 8px rgba(12, 73, 153, 0.2) !important;
}

.wg-btn-view-tour:hover {
    background: linear-gradient(135deg, #ff6b35 0%, #ff8552 100%) !important;
    box-shadow: 0 4px 14px rgba(255, 107, 53, 0.35) !important;
    transform: translateY(-1.5px) !important;
    color: #ffffff !important;
}

/* Tour Quick Facts Sidebar Card */
.wg-single-tour-sidebar-wrap {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.wg-tour-quickfacts-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    box-shadow: 0 4px 16px rgba(12, 73, 153, 0.06);
    padding: 18px;
    margin-bottom: 20px;
}
.wg-quickfacts-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 800;
    color: #0c4999;
    margin: 0 0 14px 0;
    padding-bottom: 10px;
    border-bottom: 1px dashed #e2e8f0;
}
.wg-quickfacts-title svg {
    color: #ff6b35;
}
.wg-quickfacts-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}
.wg-quickfact-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #f1f5f9;
}
.wg-qf-full {
    grid-column: span 2;
}
.wg-qf-icon {
    font-size: 18px;
    line-height: 1;
    margin-top: 2px;
}
.wg-qf-content {
    display: flex;
    flex-direction: column;
}
.wg-qf-label {
    font-size: 11px;
    color: #64748b;
    margin-bottom: 1px;
}
.wg-qf-value {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
}
/* ==========================================================================
   Modern Travel Footer Component
   ========================================================================== */

.wg-main-footer {
    background-color: #0d0d0d;
    color: #999999;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    position: relative;
    overflow: hidden;
    border-top: 2px solid #262014;
}

.wg-footer-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 1. Newsletter Section */
.wg-footer-newsletter-section {
    padding-top: 40px;
    margin-bottom: -30px;
    position: relative;
    z-index: 10;
}

.wg-newsletter-card {
    background: linear-gradient(135deg, #161410 0%, #292314 100%);
    border-radius: 20px;
    padding: 36px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(212, 175, 55, 0.25);
}

.wg-newsletter-content {
    max-width: 540px;
}

.wg-newsletter-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #e5c158;
    background: rgba(197, 155, 39, 0.18);
    backdrop-filter: blur(4px);
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 12px;
    border: 1px solid rgba(229, 193, 88, 0.3);
}

.wg-newsletter-title {
    font-size: 24px;
    font-weight: 800;
    color: #ffffff;
    margin: 0 0 8px 0;
    line-height: 1.25;
}

.wg-newsletter-subtitle {
    font-size: 14px;
    color: #d8d3c5;
    margin: 0;
    line-height: 1.5;
}

.wg-newsletter-form-wrap {
    flex: 1;
    max-width: 460px;
}

.wg-newsletter-form {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 480px !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

.wg-newsletter-input-wrap {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    background: #ffffff !important;
    border: 2px solid #d4af37 !important;
    border-radius: 50px !important;
    padding: 4px 4px 4px 18px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
}

.wg-newsletter-input-wrap:focus-within {
    border-color: #e5c158 !important;
    box-shadow: 0 6px 24px rgba(212, 175, 55, 0.4) !important;
}

.wg-newsletter-input-wrap input,
.wg-newsletter-input {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: #111111 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 8px 10px 8px 0 !important;
    margin: 0 !important;
    height: auto !important;
}

.wg-newsletter-input-wrap input::placeholder,
.wg-newsletter-input::placeholder {
    color: #888888 !important;
    font-weight: 400 !important;
}

.wg-newsletter-input-wrap button,
.wg-newsletter-btn {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%) !important;
    color: #111111 !important;
    border: none !important;
    border-radius: 40px !important;
    padding: 12px 24px !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.3px !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    box-shadow: 0 4px 12px rgba(197, 155, 39, 0.3) !important;
    transition: all 0.25s ease !important;
}

.wg-newsletter-input-wrap button:hover,
.wg-newsletter-btn:hover {
    background: linear-gradient(135deg, #e5c158 0%, #d4af37 100%) !important;
    transform: translateY(-1.5px) !important;
    box-shadow: 0 6px 18px rgba(197, 155, 39, 0.45) !important;
}

/* 2. Main Footer Body */
.wg-footer-body {
    padding: 80px 0 50px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.wg-footer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr 1.2fr;
    gap: 40px;
}

.wg-footer-logo {
    font-size: 22px;
    font-weight: 900;
    color: #ffffff;
    text-decoration: none;
    letter-spacing: 0.5px;
}

.wg-logo-accent {
    color: #c59b27;
}

.wg-footer-about {
    font-size: 13.5px;
    line-height: 1.6;
    color: #a3a3a3;
    margin: 14px 0 18px 0;
}

.wg-footer-contact-list {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.wg-footer-contact-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #d4cebe;
}

.wg-footer-contact-list svg {
    color: #c59b27;
    flex-shrink: 0;
}

.wg-footer-contact-list strong {
    color: #ffffff;
}

.wg-footer-socials {
    display: flex;
    align-items: center;
    gap: 10px;
}

.wg-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: 8px;
    color: #d4cebe !important;
    font-size: 15px;
    transition: all 0.25s ease;
    text-decoration: none !important;
}

.wg-social-link:hover {
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%);
    color: #111111 !important;
    border-color: #c59b27;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(197, 155, 39, 0.35);
}

.wg-footer-heading {
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #ffffff;
    margin: 0 0 20px 0;
    position: relative;
    padding-bottom: 10px;
}

.wg-footer-heading::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 32px;
    height: 2px;
    background: #c59b27;
    border-radius: 2px;
}

.wg-footer-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.wg-footer-menu li a {
    font-size: 13.5px;
    color: #a3a3a3;
    text-decoration: none;
    transition: all 0.2s ease;
    display: inline-block;
}

.wg-footer-menu li a:hover {
    color: #e5c158;
    transform: translateX(4px);
}

/* Trust List in Footer */
.wg-footer-trust-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.wg-trust-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(212, 175, 55, 0.15);
    border-radius: 10px;
}

.wg-trust-item svg {
    color: #c59b27;
    margin-top: 2px;
    flex-shrink: 0;
}

.wg-trust-item div {
    display: flex;
    flex-direction: column;
}

.wg-trust-item strong {
    font-size: 13px;
    color: #ffffff;
}

.wg-trust-item span {
    font-size: 11.5px;
    color: #888888;
}

/* 3. Footer Bottom Bar */
.wg-footer-bottom {
    background: #060606;
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.wg-footer-bottom-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    font-size: 13px;
    color: #777777;
}

.wg-footer-copyright strong {
    color: #e5c158;
}

.wg-footer-legal-links {
    display: flex;
    align-items: center;
    gap: 10px;
}

.wg-footer-legal-links a {
    color: #777777;
    text-decoration: none;
    transition: color 0.2s ease;
}

.wg-footer-legal-links a:hover {
    color: #e5c158;
}

.wg-dot-sep {
    color: #334155;
}

/* Responsive Footer */
@media only screen and (max-width: 64em) {
    .wg-newsletter-card {
        flex-direction: column;
        align-items: flex-start;
    }
    .wg-newsletter-form-wrap {
        width: 100%;
        max-width: 100%;
    }
    .wg-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
}

@media only screen and (max-width: 40em) {
    .wg-footer-grid {
        grid-template-columns: 1fr;
    }
    .wg-newsletter-form {
        flex-direction: column;
        padding: 12px;
    }
    .wg-newsletter-btn {
        width: 100%;
        justify-content: center;
    }
    .wg-footer-bottom-flex {
        flex-direction: column;
        text-align: center;
    }
}

/* ==========================================================================
   Modern Homepage UI Design System (Trust Bar, Destinations, Testimonials)
   ========================================================================== */

/* 1. Global Homepage Section Headers */
.wg-home-section-header {
    margin-bottom: 32px;
}

.wg-home-section-header.text-center {
    text-align: center;
}

.wg-section-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #ff6b35;
    background: #fff7ed;
    padding: 4px 14px;
    border-radius: 20px;
    border: 1px solid #ffedd5;
    margin-bottom: 8px;
}

.wg-section-title {
    font-size: 30px;
    font-weight: 800;
    color: #0f172a;
    margin: 6px 0 8px 0;
    letter-spacing: -0.5px;
    line-height: 1.3;
}

.wg-section-subtitle {
    font-size: 15px;
    color: #64748b;
    margin: 0;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* 2. Trust Features Bar */
.wg-trust-features-wrap {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 26px 30px;
    box-shadow: 0 6px 24px rgba(15, 23, 42, 0.04);
    margin: 30px 0 45px 0;
}

.wg-trust-features-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.wg-tf-item {
    display: flex;
    align-items: center;
    gap: 14px;
}

.wg-tf-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    flex-shrink: 0;
}

.wg-tf-icon-amber { background: #fff7ed; color: #d97706; }
.wg-tf-icon-blue  { background: #eff6ff; color: #2563eb; }
.wg-tf-icon-green { background: #ecfdf5; color: #059669; }
.wg-tf-icon-orange{ background: #fef2f2; color: #dc2626; }

.wg-tf-title {
    font-size: 15px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 2px 0;
    line-height: 1.3;
}

.wg-tf-desc {
    font-size: 12px;
    color: #64748b;
    margin: 0;
    line-height: 1.4;
}

/* 3. Popular Destinations Section */
.wg-destinations-section {
    margin: 50px 0;
}

.wg-destinations-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.wg-dest-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
}

.wg-dest-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 36px rgba(12, 73, 153, 0.14);
}

.wg-dest-img-wrap {
    position: relative;
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    overflow: hidden;
    background: #f8fafc;
}

.wg-dest-img-wrap img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    transition: transform 0.5s ease;
    image-rendering: -webkit-optimize-contrast !important;
    image-rendering: crisp-edges !important;
    backface-visibility: hidden !important;
    transform: translateZ(0) !important;
}

.wg-dest-card:hover .wg-dest-img-wrap img {
    transform: none !important;
}

.wg-dest-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(4px);
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 20px;
    z-index: 2;
}

.wg-dest-body {
    padding: 18px;
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: space-between;
}

.wg-dest-title {
    font-size: 18px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 4px 0;
}

.wg-dest-sub {
    font-size: 12.5px;
    color: #64748b;
    margin: 0 0 14px 0;
    line-height: 1.4;
}

.wg-dest-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    background: #eff6ff;
    color: #0c4999 !important;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.wg-dest-btn:hover {
    background: #0c4999;
    color: #ffffff !important;
}

/* 4. Testimonials Section */
.wg-testimonials-section {
    margin: 50px 0;
}

.wg-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.wg-testimonial-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.04);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform 0.3s ease;
}

.wg-testimonial-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(12, 73, 153, 0.1);
}

.wg-tm-stars {
    display: flex;
    gap: 4px;
    margin-bottom: 14px;
}

.wg-tm-quote {
    font-size: 14px;
    line-height: 1.6;
    color: #334155;
    font-style: italic;
    margin: 0 0 20px 0;
}

.wg-tm-author-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    border-top: 1px dashed #e2e8f0;
    padding-top: 14px;
}

.wg-tm-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0c4999 0%, #1e5cb3 100%);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 800;
    flex-shrink: 0;
}

.wg-tm-info {
    display: flex;
    flex-direction: column;
}

.wg-tm-name {
    font-size: 14px;
    font-weight: 700;
    color: #0f172a;
}

.wg-tm-location {
    font-size: 11.5px;
    color: #64748b;
}

/* Responsive Grid Adjustments */
@media only screen and (max-width: 64em) {
    .wg-trust-features-grid,
    .wg-destinations-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .wg-testimonials-grid {
        grid-template-columns: 1fr;
    }
}

@media only screen and (max-width: 40em) {
    .wg-trust-features-grid,
    .wg-destinations-grid {
        grid-template-columns: 1fr;
    }
    .wg-section-title {
        font-size: 24px;
    }
}

/* ==========================================================================
   Klook-Style Travel UI Components (Highlights, Inclusions, Itinerary)
   ========================================================================== */

.klook-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 16px 0;
    padding-bottom: 10px;
    border-bottom: 1px dashed #e2e8f0;
}

/* 1. Highlights Box */
.klook-highlights-box {
    background: #fff7ed;
    border: 1px solid #ffedd5;
    border-radius: 16px;
    padding: 22px;
    margin-bottom: 24px;
}

.klook-highlights-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.klook-highlights-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14.5px;
    color: #1e293b;
    line-height: 1.5;
}

.klook-check-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #ff6b35;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
}

/* 2. Inclusions & Exclusions Card */
.klook-inclusions-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 22px;
    margin-bottom: 24px;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}

.klook-inc-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 14px 0;
}

.klook-inc-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.klook-inc-list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13.5px;
    color: #334155;
    line-height: 1.45;
}

.klook-badge-yes {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: #ecfdf5;
    color: #10b981;
    font-size: 11px;
    font-weight: 800;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
}

.klook-badge-no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: #fef2f2;
    color: #ef4444;
    font-size: 11px;
    font-weight: 800;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
}

/* 3. Timeline Itinerary Box */
.klook-itinerary-box {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}

.klook-timeline {
    position: relative;
    padding-left: 24px;
}

.klook-timeline::before {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 7px;
    width: 2px;
    background: #e2e8f0;
}

.klook-timeline-item {
    position: relative;
    margin-bottom: 20px;
}

.klook-timeline-item:last-child {
    margin-bottom: 0;
}

.klook-timeline-marker {
    position: absolute;
    left: -24px;
    top: 4px;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
}

.klook-dot {
    width: 10px;
    height: 10px;
    background: #0c4999;
    border: 2px solid #ffffff;
    box-shadow: 0 0 0 2px #0c4999;
    border-radius: 50%;
}

.klook-time-badge {
    display: inline-block;
    font-size: 11.5px;
    font-weight: 700;
    color: #0c4999;
    background: #eff6ff;
    padding: 3px 10px;
    border-radius: 6px;
    margin-bottom: 4px;
}

.klook-timeline-text {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    line-height: 1.5;
}

/* ==========================================================================
   Klook Homepage Main Layout (Hero, Search Widget & CTA Banner)
   ========================================================================== */

.klook-main-wrapper {
    background-color: #f8fafc;
}

.klook-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 1. Hero Banner & Search Bar */
.klook-hero-section {
    background: linear-gradient(135deg, #111111 0%, #1e1a12 50%, #2b2314 100%);
    padding: 60px 20px 80px 20px;
    position: relative;
    overflow: hidden;
    border-bottom: 2px solid #332b1a;
}

.klook-hero-container {
    max-width: 1140px;
    margin: 78px auto 0 auto;
}

.klook-hero-content {
    max-width: 720px;
    margin-bottom: 32px;
}

.klook-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #e5c158;
    background: rgba(197, 155, 39, 0.16);
    backdrop-filter: blur(6px);
    padding: 5px 14px;
    border-radius: 20px;
    margin-bottom: 14px;
    border: 1px solid rgba(229, 193, 88, 0.35);
}

.klook-hero-title {
    font-size: 38px;
    font-weight: 900;
    color: #ffffff;
    line-height: 1.2;
    margin: 0 0 12px 0;
    letter-spacing: -0.6px;
}

.klook-hero-subtitle {
    font-size: 16px;
    color: #d4cebe;
    line-height: 1.6;
    margin: 0;
}

/* Klook Search Bar Widget */
.klook-search-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 20px 24px;
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.25);
    border: 1px solid #e2e8f0;
}

.klook-search-form {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 0.9fr;
    gap: 16px;
    align-items: flex-start;
}

.klook-search-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.klook-search-field label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #64748b;
    margin: 0;
    line-height: 1.2;
}

.klook-label-spacer {
    visibility: hidden;
    pointer-events: none;
}

.klook-search-field label svg {
    color: #c59b27;
}

.klook-search-field input[type="text"],
.klook-search-field input[type="date"],
.klook-search-field select {
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    padding: 11px 14px !important;
    font-size: 14px !important;
    color: #0f172a !important;
    background: #f8fafc !important;
    outline: none !important;
    height: 46px !important;
    margin: 0 !important;
    transition: all 0.2s ease !important;
}

.klook-search-field input:focus,
.klook-search-field select:focus {
    border-color: #c59b27 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(197, 155, 39, 0.2) !important;
}

.klook-search-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 46px;
    width: 100%;
    padding: 0 18px;
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%);
    color: #111111;
    border: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 4px 14px rgba(197, 155, 39, 0.35);
    white-space: nowrap;
    margin: 0 !important;
}

.klook-search-btn:hover {
    transform: translateY(-1.5px);
    background: linear-gradient(135deg, #e5c158 0%, #d4af37 100%);
    box-shadow: 0 6px 20px rgba(197, 155, 39, 0.5);
}

/* 2. Trending Tours Section */
.klook-trending-section {
    margin: 40px 0 50px 0;
}

.klook-tours-grid {
    margin-top: 24px;
}

.klook-tours-grid.row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    gap: 8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.klook-tours-grid.row > .col {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.klook-see-more-wrap {
    margin-top: 36px;
    text-align: center;
}

.klook-btn-see-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 38px;
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%);
    color: #111111 !important;
    border-radius: 30px;
    font-size: 14.5px;
    font-weight: 800;
    text-decoration: none !important;
    box-shadow: 0 6px 20px rgba(197, 155, 39, 0.3);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.klook-btn-see-more:hover {
    background: linear-gradient(135deg, #e5c158 0%, #d4af37 100%);
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(197, 155, 39, 0.45);
}

@media (min-width: 1024px) {
    .klook-tours-grid.large-columns-4 .col,
    .klook-tours-grid.row > .col {
        flex: 0 0 calc((100% - 24px) / 4) !important;
        max-width: calc((100% - 24px) / 4) !important;
        width: calc((100% - 24px) / 4) !important;
    }
}

@media (min-width: 1440px) {
    .klook-tours-grid.large-columns-5 .col {
        flex: 0 0 20% !important;
        max-width: 20% !important;
    }
}

/* 3. Klook CTA Banner Section */
.klook-cta-section {
    margin: 60px 0 50px 0;
}

.klook-cta-card {
    background: linear-gradient(135deg, #141414 0%, #262014 100%);
    border-radius: 24px;
    padding: 44px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3);
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.25);
}

.klook-cta-content {
    max-width: 600px;
}

.klook-cta-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #e5c158;
    background: rgba(197, 155, 39, 0.18);
    backdrop-filter: blur(4px);
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 12px;
    border: 1px solid rgba(229, 193, 88, 0.3);
}

.klook-cta-title {
    font-size: 26px;
    font-weight: 900;
    color: #ffffff;
    margin: 0 0 10px 0;
    line-height: 1.3;
}

.klook-cta-desc {
    font-size: 14.5px;
    color: #e2dcd0;
    margin: 0;
    line-height: 1.55;
}

.klook-cta-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}

.klook-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 26px;
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%);
    color: #111111 !important;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none !important;
    transition: all 0.25s ease;
    box-shadow: 0 4px 14px rgba(197, 155, 39, 0.35);
}

.klook-btn-primary:hover {
    background: linear-gradient(135deg, #e5c158 0%, #d4af37 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(197, 155, 39, 0.5);
}

.klook-btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 22px;
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.25s ease;
    backdrop-filter: blur(4px);
}

.klook-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.22);
    transform: translateY(-1.5px);
}

/* Klook Main Responsive Breakpoints */
@media only screen and (max-width: 64em) {
    .klook-search-form {
        grid-template-columns: 1fr 1fr;
    }
    .klook-cta-card {
        flex-direction: column;
        align-items: flex-start;
        padding: 32px;
    }
}

@media only screen and (max-width: 40em) {
    .klook-hero-title {
        font-size: 28px;
    }
    .klook-search-form {
        grid-template-columns: 1fr;
    }
    .klook-cta-actions {
        flex-direction: column;
        width: 100%;
    }
    .klook-btn-primary, .klook-btn-secondary {
        width: 100%;
        justify-content: center;
    }
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/* ==========================================================================
   WooCommerce Shop Page Synchronized Styling
   ========================================================================== */

.klook-shop-hero-banner {
    margin-bottom: 0;
}

/* Shop Ordering Dropdown & Result Count */
.woocommerce-ordering select {
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 8px 12px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    background: #ffffff !important;
    outline: none !important;
}

.woocommerce-ordering select:focus {
    border-color: #c59b27 !important;
    box-shadow: 0 0 0 3px rgba(197, 155, 39, 0.2) !important;
}

/* Shop Sidebar & Filters */
.shop-sidebar .widget-title,
.sidebar-inner .widget-title {
    font-size: 15px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #111111 !important;
    margin-bottom: 14px !important;
    position: relative !important;
    padding-bottom: 8px !important;
    border-bottom: 2px solid #c59b27 !important;
}

.price_slider_wrapper .ui-slider .ui-slider-range {
    background: #c59b27 !important;
}

.price_slider_wrapper .ui-slider .ui-slider-handle {
    background: #d4af37 !important;
    border: 2px solid #111111 !important;
}

.price_slider_amount .button {
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%) !important;
    color: #111111 !important;
    font-weight: 800 !important;
    border-radius: 8px !important;
    border: none !important;
}

/* Shop Pagination Synchronized Style */
.woocommerce-pagination .page-numbers,
.nav-pagination .page-number {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    transition: all 0.2s ease !important;
    margin: 0 3px !important;
}

.woocommerce-pagination .page-numbers.current,
.nav-pagination .page-number.current {
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%) !important;
    color: #111111 !important;
    font-weight: 800 !important;
    border-color: #c59b27 !important;
    box-shadow: 0 4px 12px rgba(197, 155, 39, 0.3) !important;
}

.woocommerce-pagination .page-numbers:hover:not(.current),
.nav-pagination .page-number:hover:not(.current) {
    color: #c59b27 !important;
    border-color: #c59b27 !important;
    background: #fff9e6 !important;
}

/* Hide Shop Sidebar & Expand Main Shop Product Grid to Full Width */
.post-type-archive-product .shop-sidebar,
.tax-product_cat .shop-sidebar,
.tax-product_tag .shop-sidebar,
.woocommerce-page .shop-sidebar,
#shop-sidebar,
aside.shop-sidebar,
.post-type-archive-product .large-3.col,
.tax-product_cat .large-3.col,
.tax-product_tag .large-3.col {
    display: none !important;
}

.post-type-archive-product .large-9.col,
.tax-product_cat .large-9.col,
.tax-product_tag .large-9.col,
.woocommerce-page .large-9.col {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

/* Hide Default WooCommerce / Flatsome Page Titles on Shop & Category Pages */
.shop-page-title,
.category-page-title,
.page-title,
.page-title-inner,
.woocommerce-products-header__title {
    display: none !important;
}

/* WooCommerce Shop Archive 4-5 Column Layout */
.post-type-archive-product .products,
.tax-product_cat .products,
.tax-product_tag .products,
.woocommerce-page .products {
    display: flex !important;
    flex-wrap: wrap !important;
}

@media (min-width: 1024px) {
    .post-type-archive-product .products > .col,
    .tax-product_cat .products > .col,
    .tax-product_tag .products > .col,
    .woocommerce-page .products > .col,
    .post-type-archive-product .products > .product,
    .tax-product_cat .products > .product,
    .woocommerce-page .products > .product {
        flex: 0 0 25% !important;
        max-width: 25% !important;
        width: 25% !important;
    }
}

@media (min-width: 1440px) {
    .post-type-archive-product .products > .col,
    .tax-product_cat .products > .col,
    .tax-product_tag .products > .col,
    .woocommerce-page .products > .col,
    .post-type-archive-product .products > .product,
    .tax-product_cat .products > .product,
    .woocommerce-page .products > .product {
        flex: 0 0 20% !important;
        max-width: 20% !important;
        width: 20% !important;
    }
}

/* ==========================================================================
   Global Synchronized Site Header Design System (Hanoi Rider Tour)
   ========================================================================== */

#header,
.header,
.header-wrapper,
.header-main,
.header-bottom {
    background-color: #111111 !important;
    background: #111111 !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* Header Top Bar */
.header-top,
.top-bar {
    background-color: #060606 !important;
    color: #d4cebe !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.15) !important;
}

.header-top a,
.top-bar a {
    color: #d4cebe !important;
    transition: color 0.2s ease !important;
}

.header-top a:hover,
.top-bar a:hover {
    color: #e5c158 !important;
}

/* Header Logo & Title */
.header-main .logo a,
.header-title a,
.header-wrapper .logo a {
    color: #ffffff !important;
}

.header-main .logo img,
.header-wrapper .logo img {
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5));
}

/* Navigation Links Across All Pages */
.header-nav > li > a,
.nav > li > a,
.main-menu > li > a,
.header-bottom .nav > li > a {
    color: #e2dcd0 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.2s ease !important;
}

.header-nav > li:hover > a,
.header-nav > li.active > a,
.header-nav > li.current-menu-item > a,
.nav > li:hover > a,
.nav > li.active > a,
.nav > li.current-menu-item > a,
.main-menu > li:hover > a,
.main-menu > li.active > a {
    color: #d4af37 !important;
    background: transparent !important;
}

/* Header Icons (Search, Cart, User, Mobile Menu) */
.header-nav .header-search-icon,
.header-nav .cart-link,
.header-nav .account-login-link,
.header-nav svg,
.header-main svg,
.header-button a,
.mobile-nav-trigger {
    color: #d4af37 !important;
}

.cart-icon strong,
.cart-badge,
.image-icon .cart-icon strong {
    background: linear-gradient(135deg, #d4af37 0%, #c59b27 100%) !important;
    color: #111111 !important;
    font-weight: 800 !important;
    border-radius: 50% !important;
}

/* Header Search Form */
.header-search input[type="search"],
.header-search input[type="text"],
.searchform input[type="text"] {
    background: #1a1a1a !important;
    border: 1px solid #332b1a !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    font-size: 13px !important;
}

.header-search input::placeholder,
.searchform input::placeholder {
    color: #888888 !important;
}

.header-search input:focus,
.searchform input:focus {
    border-color: #c59b27 !important;
    box-shadow: 0 0 0 2px rgba(197, 155, 39, 0.2) !important;
}

.header-search button,
.searchform button {
    color: #c59b27 !important;
    background: transparent !important;
}

/* Dropdown & Mega Menus */
.nav-dropdown,
.sub-menu,
.header-nav .nav-dropdown {
    background-color: #141414 !important;
    border: 1px solid #332b1a !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
    border-radius: 10px !important;
    padding: 10px 0 !important;
}

.nav-dropdown li a,
.sub-menu li a {
    color: #cccccc !important;
    font-size: 13px !important;
    padding: 8px 18px !important;
    transition: all 0.2s ease !important;
}

.nav-dropdown li:hover > a,
.nav-dropdown li.active > a,
.sub-menu li:hover > a {
    color: #e5c158 !important;
    background-color: rgba(197, 155, 39, 0.12) !important;
}

/* Mobile Sidebar Menu */
.mobile-sidebar,
.off-canvas {
    background-color: #111111 !important;
    color: #ffffff !important;
}

.mobile-sidebar .nav > li > a {
    color: #e2dcd0 !important;
    border-bottom: 1px solid #222222 !important;
}

.mobile-sidebar .nav > li:hover > a,
.mobile-sidebar .nav > li.active > a {
    color: #d4af37 !important;
}

/* Spacing on category page row & shop container below hero banner */
.category-page-row,
.row.category-page-row,
.shop-container .category-page-row {
    padding-top: 32px !important;
    margin-top: 0 !important;
}

/* ==========================================================================
   Hanoi Rider Tour - Contact Page Design System
   ========================================================================== */

.klook-contact-hero-banner {
    padding-bottom: 50px !important;
}

.wg-contact-quick-pills {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 32px;
}

.wg-contact-pill {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.07);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(212, 175, 55, 0.25);
    padding: 10px 20px;
    border-radius: 30px;
    color: #e2dcd0;
    font-size: 14px;
}

.wg-contact-pill svg {
    color: #d4af37;
}

.wg-contact-pill strong {
    color: #ffffff;
}

.wg-contact-page-wrapper {
    background-color: #f8fafc;
    padding: 60px 0 80px 0;
}

.wg-contact-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.wg-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 48px;
    align-items: start;
    margin-bottom: 60px;
}

.wg-contact-section-heading {
    margin-bottom: 32px;
}

.wg-sub-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 800;
    color: #c59b27;
    letter-spacing: 1px;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.wg-contact-heading {
    font-size: 32px;
    font-weight: 900;
    color: #0f172a;
    line-height: 1.25;
    margin: 0 0 12px 0;
}

.wg-contact-desc {
    font-size: 15px;
    color: #475569;
    line-height: 1.6;
    margin: 0;
}

.wg-contact-cards-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.wg-contact-card {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    background: #ffffff;
    padding: 22px 24px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    transition: all 0.25s ease;
}

.wg-contact-card:hover {
    transform: translateY(-3px);
    border-color: #c59b27;
    box-shadow: 0 10px 25px rgba(197, 155, 39, 0.12);
}

.wg-contact-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, #111111 0%, #262014 100%);
    color: #d4af37;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.wg-contact-card-text h4 {
    font-size: 16px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 4px 0;
}

.wg-contact-card-text p {
    font-size: 14px;
    color: #64748b;
    margin: 0 0 2px 0;
    line-height: 1.5;
}

.wg-contact-form-card {
    background: #ffffff;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.wg-form-title {
    font-size: 24px;
    font-weight: 900;
    color: #0f172a;
    margin: 0 0 6px 0;
}

.wg-form-subtitle {
    font-size: 14px;
    color: #64748b;
    margin: 0 0 28px 0;
}

.wg-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.wg-form-group {
    margin-bottom: 20px;
}

.wg-form-group label {
    display: block;
    font-size: 13.5px;
    font-weight: 700;
    color: #334155;
    margin-bottom: 8px;
}

.wg-form-group label .required {
    color: #ef4444;
}

.wg-form-group input,
.wg-form-group select,
.wg-form-group textarea {
    width: 100%;
    padding: 12px 16px;
    font-size: 14px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #f8fafc;
    color: #0f172a;
    outline: none;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.wg-form-group input:focus,
.wg-form-group select:focus,
.wg-form-group textarea:focus {
    border-color: #c59b27;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(197, 155, 39, 0.15);
}

.wg-contact-submit-btn {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(135deg, #111111 0%, #2b2314 100%);
    color: #d4af37;
    border: 1px solid #c59b27;
    padding: 15px 28px;
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.25s ease;
}

.wg-contact-submit-btn:hover {
    background: linear-gradient(135deg, #c59b27 0%, #e5c158 100%);
    color: #111111;
    box-shadow: 0 8px 20px rgba(197, 155, 39, 0.3);
    transform: translateY(-2px);
}

.wg-contact-map-section {
    background: #ffffff;
    padding: 32px;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.wg-map-header {
    margin-bottom: 20px;
}

.wg-map-header h3 {
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 4px 0;
}

.wg-map-header p {
    font-size: 14px;
    color: #64748b;
    margin: 0;
}

.wg-map-frame {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #cbd5e1;
}

@media (max-width: 868px) {
    .wg-contact-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .wg-form-row {
        grid-template-columns: 1fr;
    }
    .wg-contact-form-card {
        padding: 24px;
    }
}