:root {
    --app-body: light-dark(#EEF6FF, #2b3c4e);
    --neutral-900: light-dark(#121316, #FFFFFF);
    --border-neutral-light: light-dark(#D9D9D9, #D9D9D9);
    --color-gray-new: light-dark(#828282, #D9D9D9);
    --border-gray-dark: light-dark(#605D5D, #D9D9D9);
    --orange-same: light-dark(#F7941D, #F7941D);
    --neutral-700: light-dark(#2B3037, #D9D9D9);
    --neutral-100: light-dark(#DDDFE3, #DDDFE3);
    --neutral-50: light-dark(#F1F2F3, #484848);
    --border-light-blue: light-dark(#C6D7EC, #4f565e);
    --leisure-body-color: light-dark(#eef6ff, #21292b);
    --color-third: light-dark(#c6d7ec, );
}

svg.stroke-white {
    stroke: var(--color-white);
}

svg.stroke-path-white path {
    stroke: var(--color-white);
}

svg.stroke-white-same {
    stroke: var(--color-white-same);
}

/* Feature strip icons: force the hard-coded dark path strokes to white */
svg.stroke-white-same path {
    stroke: var(--color-white-same, #fff) !important;
}

svg.stroke-path-white-same path {
    stroke: var(--color-white-same);
}

svg.fill-white {
    fill: var(--color-white);
}

svg.fill-white-same {
    fill: var(--color-white-same);
}

svg.fill-path-white path {
    fill: var(--color-white);
}

svg.fill-path-white-same path {
    fill: var(--color-white-same);
}

svg.fill-path-content path {
    fill: var(--color-content);
}

svg.fill-path-content path.fill-stroke-content {
    fill: var(--color-content) !important;
}

svg.fill-path-content .path-fill-content {
    fill: var(--color-content) !important;
}

svg.fill-path-content .path-stroke-content {
    stroke: var(--color-content) !important;
}

svg .rect-fill-app-body {
    fill: var(--app-body) !important;
}

.h-56 {
    height: 56px !important;
}

.daterangepicker.dropdown-menu {
    box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.12);
    border-radius: 16px;
    border: none;
    margin-top: 0;
}

.min-w-140 {
    min-width: 140px !important;
}

svg.stroke-grey path {
    stroke: var(--color-gray-new);
}

svg.stroke-content path {
    stroke: var(--color-content);
}

svg.fill-grey path {
    fill: var(--color-gray-new);
}

svg.fill-content path {
    fill: var(--color-content);
}


.bg-app-body {
    background-color: var(--app-body) !important;
}

.bg-orange-same {
    background-color: var(--orange-same) !important;
}

.color-text-orange-same {
    color: var(--orange-same) !important;
}

.color-text-content {
    color: var(--color-content) !important;
}

.border-color-light-blue {
    border-color: var(--border-light-blue) !important;
}

.bgColor-white {
    background-color: var(--bgColor-white) !important;
}

.bg-neutral-700 {
    background-color: var(--neutral-700) !important;
}

.color-text-neutral-700 {
    color: var(--neutral-700) !important;
}

.text-color-gray-new {
    color: var(--color-gray-new) !important;
}

.border-color-gray-dark {
    border-color: var(--border-gray-dark) !important;
}

.text-neutral-900 {
    color: var(--neutral-900) !important;
}

.border-neutral-light {
    border-color: var(--border-neutral-light) !important;
}


/* ========================================
   LOAD MORE
======================================== */

.load-item {
    display: none;
}

.load-item.show {
    display: block;
    animation: fadeUp .4s ease;
}

.load-more-btn:disabled {
    opacity: .7;
    pointer-events: none;
}

.load-more-loader {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Submenu Styles */
.submenu-web {
    background: var(--color-white) !important;
    box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.12) !important;
    border-radius: 16px !important;
    margin-top: 5px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.search-field-col.guestPanel .submenu-web {
    margin-top: 20px !important;
    min-width: unset;
    left: 0;
}

.search-field-col.guestPanel .submenu-web .qty-container .qty-btn-minus,
.search-field-col.guestPanel .submenu-web .qty-container .qty-btn-plus {
    min-width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.search-field-col.guestPanel .submenu-web .child-age-boxes .row.g-2 {
    width: 100%;
}

.search-field-col.guestPanel .submenu-web .child-age-boxes .row.g-2 .col-md-6.col-12.mb-3.d-flex.align-items-center.justify-content-between {
    flex-direction: column !important;
    align-items: flex-start !important;
}

/*--Ask me anything CSS--*/
.ai-banner {background: linear-gradient(240.16deg, #f45d6b 14.48%, #ffb2b9 96.68%);}
.ai-banner-img {
    width: auto;
    height: 100px;
    overflow: hidden;
}
.ai-banner-img img {height: 100%;object-fit: contain;object-position: bottom;width: 100% !important;}
.iconSize-50 {width: 50px;height: 50px;}
.dotted-start-border {border-left: 2px dotted rgba(255, 255, 255, 0.5);}
.h-48 {
    min-height: 48px;
    height: 48px;
}

.p2px {
    padding: 1px;
}

.box-shadow1 {
    box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
}

.ask-me {
    position: fixed;
    top: auto;
    left: auto;
    right: 24px;
    bottom: 24px;
    display: flex;
    gap: 0;
    justify-content: center;
    align-items: center;
    width: fit-content;
    height: 52px;
    z-index: 9999;
    color: var(--color-blue-500);
    background: linear-gradient(var(--color-white), var(--color-white)) padding-box, linear-gradient(108deg, #2F6271 26.17%, #32C4F0 59.15%, #F45D6B 78.14%) border-box;
    background-size: 100% 100%, 300% 100%;
    background-position: 0 0, 0 0;
    border: 3px solid transparent;
    animation: borderMove 3s linear infinite;
}

@keyframes borderMove {
    0% {
        background-position: 0 0, 0% 0;
    }

    100% {
        background-position: 0 0, 100% 0;
    }
}

.ask-me-input {
    text-align: left;
    width: 160px;
    border: none !important;
    background-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
}

.ask-me-btn {
    text-align: left;
    width: 160px;
    cursor: pointer;
    border: none !important;
    background-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
}

.ask-me-img {
    min-width: 68px;
    width: 68px;
    height: 68px;
    margin-left: -3px;
}

.ask-me-img video {
    min-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    padding: 1px;
}

/* Breadcrumb Styles */
.breadcrumb-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.breadcrumb-item-custom a {
    text-decoration: none;
    transition: color 0.2s ease;
    opacity: 0.8;
}

.breadcrumb-item-custom a:hover {
    color: var(--color-second) !important;
    opacity: 1;
}

.breadcrumb-item-custom a svg {
    margin-top: -2px;
}

.breadcrumb-separator-custom {
    display: flex;
    align-items: center;
    color: var(--color-content);
}

.breadcrumb-item-custom.active span {
    cursor: default;
}

.plan-trip .plan-trip-container {
    max-width: 960px;
    margin: auto;
    border: 1px solid var(--border-neutral-light);
    background-color: var(--bgColor-white);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
}

.plan-input {
    border: 1px solid var(--border-neutral-light) !important;
    background-color: transparent !important;
    color: var(--color-black) !important;
    cursor: pointer;
}

.plan-input:focus {
    border-color: var(--color-first) !important;
    box-shadow: none !important;
}

/* Date Input Group */
.plan-input-group {
    border: 1px solid var(--border-neutral-light) !important;
    background-color: var(--bgColor-white) !important;
}

.plan-input-group:focus-within {
    border-color: var(--color-first) !important;
}


.hover-light:hover {
    background-color: var(--color-blue-light) !important;
}

.search-destination-field:focus {
    box-shadow: none !important;
}

/* Teal Radio Buttons */
.teal-radio .form-check-input {
    width: 1.5em;
    height: 1.5em;
    border-color: var(--color-gray-2);
    cursor: pointer;
    background-color: transparent !important;
}

.teal-radio .form-check-input:checked {
    background-color: transparent !important;
    border-color: var(--color-first) !important;
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2.5' fill='%232f6271'/%3e%3c/svg%3e") !important;
}

/* Choice Buttons (Available Time, Mood, Group Type) */
.radio-button-style .btn-plan-choice {
    border: 1px solid var(--color-gray-2) !important;
    background-color: transparent !important;
    color: var(--color-content) !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    transition: all 0.2s ease;
}

.radio-button-style .btn-plan-choice:hover {
    background-color: var(--color-blue-light) !important;
    border-color: var(--color-first) !important;
}

.btn-check:checked+.btn-plan-choice {
    background-color: var(--color-first) !important;
    border-color: var(--color-first) !important;
    color: var(--color-white) !important;
    box-shadow: 0 4px 12px rgba(47, 98, 113, 0.2);
    font-weight: 600 !important;
}

/* Slider Styles */
.price-range.ui-slider {
    max-width: 100% !important;
    height: 12px;
    background: var(--color-blue-light);
    border: none;
    border-radius: 10px;
}

.price-range .ui-slider-range {
    background: var(--color-second);
    height: 12px;
}


.price-range input[type="range"].range-slider {
    display: none;
}

.price-range .ui-slider-handle {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--color-white-same);
    border: 5px solid var(--color-second);
    top: -5px;
    cursor: pointer;
    outline: none;
    box-shadow: 0 1px 15px rgba(0, 0, 0, 0.40);
}

.budget-wrapper .amount-range {
    margin-top: 10px;
}

/* muti-step form styles */
.multi-step.plan-trip-form .progress .progress-bar {
    background-color: var(--color-second) !important;
}

.multi-step.plan-trip-form .multistep-buttons .buttons.is-final .btn-arrow {
    display: none !important;
}


.hero-banner-section {
    position: relative;
    width: 100%;
    /* min-height: 80vh; */
    margin-bottom: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.hero-banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    border-radius: 0 0 80px 80px;
    overflow: hidden;
}

.hero-banner-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 0 0 80px 80px;
    z-index: 2;
}

.hero-content {
    position: relative;
    z-index: 3;
    text-align: center;
    padding: 140px 0 80px;
}

.hero-content .hero-title {
    max-width: 510px;
    margin: auto;
}

.hero-container-width {width: 100%;max-width: 1100px;padding: 0 15px;}
.search-panel-container {
    position: relative;
    z-index: 4;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto -40px;
    padding: 0 15px;
}

.search-panel-container .shape-element {
    position: absolute;
    top: 16px;
    left: 15px;
    width: calc(100% - 32px);
    z-index: -1;
}

/* Tabs */
.hero-tabs {
    border-radius: var(--Radius-3xl, 50px);
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    display: inline-flex;
    align-items: center;
    padding: 4px 6px;
    gap: 6px;
    margin-left: 15px;
    position: relative;
    z-index: 1;
    max-width: 100%;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.hero-tab {
    cursor: pointer;
    color: var(--color-white-same, #fff);
    padding: 4px 6px !important;
    border-radius: 50px;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.22);
    transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

.hero-tab.active {
    text-shadow: none;
}

.hero-tab svg path {
    transition: fill 0.25s ease, stroke 0.25s ease;
}

/* Inactive hover */
.hero-tab:not(.active):hover {
    background: rgba(255, 255, 255, 0.18);
}

/* Active tab -> solid white pill connected to the panel below */
.hero-tab.active {
    background: var(--color-white-same) !important;
    color: var(--color-second, #2f6271);
    box-shadow: none;
}

.hero-tab.active svg path[fill="white"],
.hero-tab.active svg path[fill="#fff"] {
    fill: var(--color-second, #2f6271);
}

.hero-tab.active svg path[stroke="white"],
.hero-tab.active svg path[stroke="#fff"] {
    stroke: var(--color-second, #2f6271);
}

/* Tab panels */
.search-tab-panel {
    animation: fadeTabPanel 0.25s ease;
}

@keyframes fadeTabPanel {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Trip type radios (flight) */
.trip-type-row .trip-radio .form-check-input {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.trip-type-row .trip-radio .form-check-input:checked {
    background-color: var(--color-second, #2f6271);
    border-color: var(--color-second, #2f6271);
}

/* Compact selects inside search fields */
.search-field-col .form-select.search-field-input {
    background-position: right 0 center;
    padding-right: 18px !important;
    cursor: pointer;
}

/* ============ Flight / Cruise search fields (self-contained) ============ */
.fs-controls .fs-radio,
.fs-controls .fs-check {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-black);
}

.fs-controls input[type="radio"],
.fs-controls input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--color-first, #f15a6a);
    margin: 0;
}

.fs-cabin-wrap .fs-cabin {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a7a7a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0 center;
    background-size: 15px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-black);
    padding: 2px 24px 2px 4px;
    min-width: 150px;
    width: auto;
    cursor: pointer;
    box-shadow: none;
}

.fs-cabin-wrap .fs-cabin:focus {
    box-shadow: none;
    outline: none;
}

.fs-fields {
    position: relative;
}

.fs-col {
    position: relative;
}

.fs-field {
    position: relative;
    height: 100%;
}

.fs-trigger {
    padding: 10px 16px;
    min-height: 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    cursor: pointer;
}

.fs-col:not(.fs-swap-col):not(:last-child) > .fs-field::after {
    content: none;
}
.fs-col:not(.fs-swap-col):not(:first-child) > .fs-field::after {
    content: '';
    position: absolute;
    right: 0;
    top: 18%;
    height: 64%;
    width: 1px;
    background: #e4e4e4;
}
.fs-fields .col-12:last-child .fs-field::after {content: none;}

.fs-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
}

.fs-label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text-black);
}

.fs-ic {
    width: 18px;
    height: 18px;
    flex: none;
    color: var(--color-second, #2f6271);
}

.fs-chevron {
    width: 15px;
    height: 15px;
    flex: none;
    color: var(--color-text-content, #7a7a7a);
    transition: transform 0.25s ease;
}

.fs-field.open .fs-chevron {
    transform: rotate(180deg);
}

.fs-value {
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text-black);
    line-height: 1.2;
}

.fs-sub {
    font-size: 12px;
    color: var(--color-text-content, #7a7a7a);
    margin-top: 2px;
}

/* Swap button */
.fs-swap-col {
    padding: 0 2px;
    flex: 0 0 auto;
    width: auto;
}

.fs-swap {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid #dfe3e4;
    background: var(--color-white, #fff);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--color-second, #2f6271);
    transition: 0.2s ease;
}

.fs-swap:hover {
    background: var(--color-second, #2f6271);
    color: #fff;
    border-color: var(--color-second, #2f6271);
}

.fs-swap svg {
    width: 18px;
    height: 18px;
}

/* Dropdowns */
.fs-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 8px;
    min-width: 280px;
    max-width: 340px;
    background: var(--color-white, #fff);
    border-radius: 14px;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.16);
    padding: 10px;
    z-index: 1200;
    max-height: 360px;
    overflow-y: auto;
}
.fs-dropdown.fs-traveler-dd {min-width: 250px;}
.fs-field.open .fs-dropdown {
    display: block;
}

.fs-traveler-dd {
    right: 8px;
    left: auto;
    min-width: 300px;
}

/* Airport list */
.fs-airport-item,
.fs-airport-main {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 8px;
    border-radius: 10px;
    cursor: pointer;
}

.fs-airport-item:hover,
.fs-airport-main:hover,
.fs-list-item:hover {
    background: var(--neutral-50, #f4f6f6);
}

.fs-code {
    min-width: 54px;
    height: 46px;
    border-radius: 8px;
    background: #f2f4f4;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 14px;
    color: var(--color-text-black);
    flex: none;
}

.fs-ap-name {
    font-weight: 600;
    font-size: 14px;
    color: var(--color-text-black);
}

.fs-ap-city {
    color: var(--color-second, #2f6271);
}

.fs-ap-sub {
    font-size: 12px;
    color: var(--color-text-content, #7a7a7a);
}

.fs-corner {
    width: 18px;
    height: 18px;
    color: #b8bcbd;
    flex: none;
}

/* Generic list */
.fs-list-item {
    padding: 10px 12px;
    border-radius: 9px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-black);
}

/* Travelers counter */
.fs-counter-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 6px;
}

.fs-counter-row + .fs-counter-row {
    border-top: 1px solid #eee;
}

.fs-c-title {
    font-size: 15px;
    font-weight: 500;
    color: var(--color-text-black);
}

.fs-c-sub {
    font-size: 12px;
    color: var(--color-text-content, #7a7a7a);
}

.fs-stepper {
    display: flex;
    align-items: center;
    gap: 14px;
}

.fs-step {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid #dcdfe0;
    background: var(--color-white, #fff);
    font-size: 18px;
    line-height: 1;
    color: var(--color-second, #2f6271);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.fs-step:hover:not(:disabled) {
    background: var(--color-second, #2f6271);
    color: #fff;
    border-color: var(--color-second, #2f6271);
}

.fs-step:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.fs-num {
    min-width: 18px;
    text-align: center;
    font-weight: 600;
    color: var(--color-text-black);
}

/* Date field (uses hotel calendar) */
.fs-date-box {
    position: relative;
    padding: 10px 16px;
    min-height: 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    cursor: pointer;
}

.fs-date-val {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    padding: 0;
    border: 0;
    pointer-events: none;
}

/* Multi-city segments */
.fs-multi-rows .fs-seg,
.fs-seg-template {
    border: 1px solid #dfe4e6;
    border-radius: 12px;
    margin-bottom: 12px;
    position: relative;
}

.fs-seg-x-col {
    width: 56px;
    flex: 0 0 56px;
}

.fs-seg-remove {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid #e2c6c6;
    background: #fff;
    color: #d85a5a;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.2s ease;
}

.fs-seg-remove:hover:not(:disabled) {
    background: #d85a5a;
    color: #fff;
    border-color: #d85a5a;
}

.fs-seg-remove:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.fs-seg-remove svg {
    width: 16px;
    height: 16px;
}

.fs-add-flight {
    border: none;
    background: transparent;
    color: var(--color-second, #2f6271);
    font-size: 15px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 4px 8px;
    margin-left: 6px;
    cursor: pointer;
}

.fs-add-flight:hover {
    text-decoration: underline;
}

/* Compact traveler in multi top bar */
.fs-trav-inline {
    position: relative;
}

.fs-trav-inline-trg {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    gap: 8px;
    padding: 4px 8px;
    cursor: pointer;
    min-height: auto;
}

.fs-trav-inline-trg .fs-value {
    font-size: 14px;
    font-weight: 500;
}

.fs-trav-inline-trg .fs-sub {
    margin: 0;
    font-size: 14px;
    color: var(--color-text-content, #7a7a7a);
}

.fs-trav-inline-trg .fs-chevron {
    margin-left: 2px;
}

.fs-trav-inline .fs-traveler-dd {
    top: calc(100% + 6px);
}

/* Responsive */
@media (max-width: 991px) {
    .fs-dropdown {
        left: 8px;
        right: 8px;
        min-width: auto;
        max-width: none;
    }

    .fs-traveler-dd {
        left: 8px;
        right: 8px;
    }
}

@media (max-width: 767px) {
    /* Neutralise the legacy hotel-form mobile rule for flight/cruise rows */
    .search-form-wrap form .fs-fields > div:not(:last-child) {
        border-bottom: none !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    .fs-col:not(.fs-swap-col):not(:last-child) > .fs-field::after {
        display: none;
    }

    .fs-col:not(.fs-swap-col):not(:last-child) > .fs-field {
        border-bottom: 1px solid #e8eef1;
    }

    .fs-swap-col {
        width: 100%;
        padding: 4px 14px !important;
        justify-content: flex-end !important;
    }

    .fs-swap {
        width: 30px;
        height: 30px;
    }

    .fs-swap svg {
        transform: rotate(90deg);
    }

    .fs-cabin-wrap .fs-cabin {
        min-width: auto;
        max-width: 180px;
    }

    .fs-controls {
        gap: 12px 16px !important;
    }

    .fs-dropdown,
    .fs-traveler-dd {
        left: 8px;
        right: 8px;
        min-width: auto;
        max-width: none;
    }

    /* Multi-city: remove button on its own row */
    .fs-seg-x-col {
        width: 100%;
        flex: 0 0 100%;
        justify-content: flex-end !important;
        padding: 6px 14px;
    }
}

.search-form-wrap {
    background: var(--color-white);
    border-radius: 0px 20px 20px;
    padding: 14px 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    position: relative;
}

.search-field-col {
    position: relative;
    padding: 10px 15px !important;
}

.search-field-col:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 20%;
    height: 60%;
    width: 1px;
    background-color: #e0e0e0;
}

.search-field-input:focus {
    outline: none;
}

.search-field-input::placeholder {
    color: #aaa;
}

.btn-search:hover {
    background-color: #d14856;
}

/* ============ TOP SIGHTS GRID LAYOUT ============ */
.sights-grid {
    display: grid;
    grid-template-columns: repeat(13, 1fr);
    gap: 20px;
}

.sight-card {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    isolation: isolate;
}

.sight-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    display: block;
}

.sight-card:hover img {
    transform: scale(1.05);
}

.sight-card h3 {
    font-size: 20px !important;
    transition: all 0.1s ease;
}

.sight-card:hover h3 {
    font-size: 24px !important;
}

.sight-card__overlay {
    position: absolute;
    inset: 0;
    /* background: linear-gradient(360deg, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0.85) 100%), url(Louvre-Paris.jpg); */
    z-index: 1;
}

.sight-card__content {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 2;
}

.sight-card--tall {
    grid-column: span 3;
    grid-row: span 2;
}

.sight-card--wide {
    grid-column: span 4;
    aspect-ratio: 16 / 10;
}

.sight-card--medium {
    grid-column: span 3;
    aspect-ratio: 12 / 10;
}

.sight-card--small {
    grid-column: span 2;
    aspect-ratio: 8 / 10;
}

.categorySection .custom-chip-group {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
}

.categorySection .custom-chip-group button {
    white-space: nowrap;
}

.custom-chip-group button:not(.active):hover {
    background-color: var(--neutral-50) !important;
}

.custom-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.custom-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid var(--color-content);

    background: var(--color-white);
    cursor: pointer;

    position: relative;
    transition: 0.2s ease;
}

.custom-chip-remove {
    display: none;
    font-size: 14px;
    margin-left: 6px;
}

.custom-chip.active {
    background: var(--color-second) !important;
    color: var(--color-white) !important;
    border-color: transparent !important;
}



.custom-chip .dropdown-icon {
    transition: transform 0.3s ease-in-out;
}

.custom-chip.active .dropdown-icon {
    transform: rotateX(-180deg);
}

.custom-chip.active svg.stroke-gray,
.custom-chip.active svg.stroke-gray path,
.custom-chip.active svg.stroke-content path {
    stroke: var(--color-white-same) !important;
}

.custom-chip.active svg.fill-gray,
.custom-chip.active svg.fill-gray path,
.custom-chip.active svg.fill-content path {
    fill: var(--color-white-same) !important;
}

.custom-chip.active .custom-chip-label {
    color: var(--color-white-same) !important;
}

.custom-chip.active .custom-chip-price,
.custom-chip.active .custom-chip-price .color-text-content {
    color: var(--color-white-same) !important;
}

.custom-chip.active .custom-chip-remove {
    display: inline;
}

.shape-element svg path {
    fill: var(--color-white);
}

.destination-section .destination-card {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
}

.destination-section .destination-card::before {
    content: '';
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(360deg, rgba(0, 0, 0, 0.80) 0%, rgba(0, 0, 0, 0.20) 42%, rgba(0, 0, 0, 0) 68%);
    border-radius: 16px;
    z-index: 2;
    pointer-events: none;
}

.destination-section .destination-card .overlay-content {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 24px 16px;
}


.booking-section {
    position: relative;
}

.booking-section--list li {
    display: flex;
    gap: 15px;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.booking-section--list li:not(:last-child) {
    border-bottom: 1px solid var(--color-white-same);
}

/* ====== scrollbar styling for chip group ====== */
.scroll-nav {
    position: relative;
}

.scroll-nav__viewport {
    overflow-x: auto;
    scrollbar-width: none;
    scroll-behavior: smooth;
}

.scroll-nav__viewport::-webkit-scrollbar {
    display: none;
}

.scroll-nav__track {
    display: flex;
    align-items: center;
    gap: 12px;
    width: max-content;
}

.scroll-nav__btn {
    width: 40px;
    height: 40px;
    border: 1px solid var(--color-content);
    border-radius: 50%;
    background: var(--color-white);
    cursor: pointer;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.25s ease;
}

.scroll-nav__btn--prev {
    left: 0;
}

.scroll-nav__btn--next {
    right: 0;
}

/* Optional */
.scroll-nav__btn:disabled {
    cursor: not-allowed;
    pointer-events: unset;
}

.scroll-nav:not(.is-scrollable) .scroll-nav__btn {
    display: none;
}


.booking-section .img-video-section .img-box,
.booking-section .img-video-section .video-box {
    border-radius: 16px;
    overflow: hidden;
}

.booking-section .img-video-section .bg-element {
    bottom: -80px;
    left: -10px;
}

.booking-section .img-video-section .video-box .play-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-swiper-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--neutral-700);
    justify-content: center;
    background-color: var(--color-white);
}

.custom-swiper-arrow.swiper-button-disabled {
    opacity: .3;
    cursor: not-allowed;
}

/* Deal Slider */
.dealSection .card {
    border-radius: 16px;
    overflow: hidden !important;
    max-height: 432px;
    min-height: 432px;
    transition: all 0.3s ease;
}

.dealSection .card .image-overlay .overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: end;
}

.dealSection .card .image-overlay .overlay .favorite-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}

.dealSection .card .image-overlay .overlay .favorite-icon .selected {
    display: none;
}

.dealSection .card .image-overlay .overlay .favorite-icon:is(:hover) svg.default path {
    stroke: var(--color-second) !important;
}

.dealSection .card .image-overlay .overlay .favorite-icon:is(.active) svg.selected {
    display: block;
}

.dealSection .card .image-overlay .overlay .favorite-icon:is(.active) svg.default {
    display: none;
}

.dealSection .card .image-overlay .overlay .review-badge {
    width: 100%;
    display: flex;
    flex-grow: 1;
    align-items: end;
    justify-content: space-between;
}

.dealSection .card:is(:hover) {
    border-color: var(--color-first) !important;
    box-shadow: 0px 0px 9px rgba(0, 87, 255, 0.3) !important;
}

.dealSection .card .top-content .review-badge {
    margin-top: -47px;
    transition: margin-top 0.3s ease;
}

.dealSection .card:hover .top-content .review-badge {
    margin-top: 0px;
}

.dealSection .card .image-overlay .overlay .review-badge {
    margin-bottom: 0;
}

.dealSection .card:hover .image-overlay .overlay .review-badge {
    margin-bottom: -50px;
    transition: margin-bottom 0.3s ease;
}

/* ========= event & detail page css =========== */
.leisure-body-color {
    background-color: var(--leisure-body-color) !important;
}

.color-content {
    color: var(--color-content) !important;
}

.event-tabs .nav-tabs .nav-link {
    font-weight: 500;
    color: var(--color-content);
}

.event-tabs .nav-tabs .nav-link:hover,
.event-tabs .nav-tabs .nav-link {
    border: none !important;
    border-bottom: 1px solid transparent !important;
    outline: none !important;
    box-shadow: none !important;
}

.event-tabs .nav-tabs .nav-link.active {
    font-weight: 600;
    border-bottom: 1px solid var(--color-second) !important;
    color: var(--color-second);
    background: transparent;
}

.filter-btn .close-icon {
    display: none;
    cursor: pointer;
    justify-content: center;
    align-items: center;
}

.filter-btn.btnColor-second .close-icon {
    display: flex;
}

/* Optional: spacing polish */
.filter-btn {
    border-radius: 10px;
    padding: 10px 16px;
}

.btnColor-third-outline {
    background: var(--bgColor-white);
    border: 1px solid var(--color-third);
    color: var(--color-content);
    min-height: 48px;
    padding: 4px 14px;
}

.btnColor-third-outline:hover {
    color: var(--color-content);
}

.event-tabs .btnColor-second,
.event-tabs .btnColor-second span {
    color: var(--color-white-same) !important;
    font-weight: 500;
    margin: 0;
}

.event-tabs .btnColor-second.active span,
.btnColor-third-outline.btnColor-second:hover {
    color: var(--color-white-same);
}

.event-tabs .btnColor-second svg,
.event-tabs .btnColor-third-outline svg {
    width: 18px;
    min-width: 18px;
    height: 18px;
}

.event-tabs .btnColor-second svg,
.event-tabs .btnColor-third-outline svg path {
    stroke: var(--color-content) !important;
}

.event-tabs .btnColor-second.active svg,
.event-tabs .btnColor-second.active svg path {
    stroke: var(--color-white-same) !important;
}

.btn-wishlist {
    width: 34px;
    min-width: 34px;
    height: 34px;
}

.event-tabs .wishlist svg {
    width: 18px;
    min-width: 18px;
    height: 18px;
}

.btn-wishlist svg,
.btn-wishlist svg path {
    stroke: var(--color-content) !important;
}

.btn-wishlist:hover svg,
.btn-wishlist:hover svg path {
    stroke: var(--color-second) !important;
    fill: var(--color-second) !important;
}

.opacity-60 {
    opacity: 0.6;
}

.card-img-top {
    height: 200px;
    object-fit: cover;
    object-position: center;
}

.badge {
    font-size: 0.85rem;

}

.h-32 {
    min-height: 32px !important;
    height: 32px !important;
}

.event-page {
    position: relative;
}

.eventPhotosGrid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;

    align-items: stretch;
}

.leftGrid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 1fr;
    gap: 16px;
}

.galleryCard--big {
    height: 100%;
    position: relative;
}

.galleryCard {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 16px;
}

.galleryCard img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.galleryCard .play-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.eventPhotosGrid {
    grid-auto-rows: 1fr;
}

.general-info ul li svg.iconSize-25,
.general-info ul li svg.iconSize-40 {
    min-width: 25px;
}

.galleryBtn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: none;
    background-color: var(--color-white);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.30);
}

.reviewSection .reviewSlider .swiper-slide {
    box-shadow: none;
}

.custom-swiper-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--neutral-700);
    justify-content: center;
    background-color: var(--color-white);
}

.custom-swiper-arrow.swiper-button-disabled {
    opacity: .3;
    cursor: not-allowed;
}

.categorySlider .category-card .img-box {
    width: 100%;
    max-height: 180px;
    height: 180px;
    border-radius: 16px;
}

.categorySlider .category-card .img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}


.custom-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.custom-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid var(--border-light-blue);

    background: var(--color-white);
    cursor: pointer;

    position: relative;
    transition: 0.2s ease;
}

.custom-chip-remove {
    display: none;
    font-size: 14px;
    margin-left: 6px;
}

.custom-chip.active {
    background: var(--color-second) !important;
    color: var(--color-white) !important;
    border-color: transparent !important;
}

.custom-chip.active svg.stroke-gray,
.custom-chip.active svg.stroke-gray path {
    stroke: var(--color-white) !important;
}

.custom-chip.active svg.fill-gray,
.custom-chip.active svg.fill-gray path {
    fill: var(--color-white) !important;
}

.custom-chip.active .custom-chip-label {
    color: var(--color-white) !important;
}

.custom-chip.active .custom-chip-price {
    color: var(--color-white) !important;
}

.custom-chip.active .custom-chip-remove {
    display: inline;
}

.btnColor-first-outline:is(:hover) svg.fill path {
    fill: var(--color-white) !important;
}

@media (prefers-color-scheme: dark) {
    .search-form-wrap {
        box-shadow: 0 10px 30px rgb(209 208 208 / 9%);
    }

    .shape-element svg path {
        fill: #333;
    }

    .custom-chip-group .custom-chip .fill-content path {
        fill: var(--color-content) !important;
    }

    .custom-chip-group .custom-chip.active .fill-content path {
        fill: var(--color-black) !important;
    }

    .custom-chip-group .custom-chip .stroke-gray path {
        stroke: var(--color-black) !important;
    }

    .custom-chip-group .custom-chip.active .stroke-gray path {
        stroke: var(--color-black) !important;
    }

    .custom-chip-group .custom-chip.active .color-text-first {
        color: var(--color-black) !important;
    }

    .custom-chip.active .custom-chip-label.color-text-content {
        color: var(--color-black) !important;
    }

    .custom-chip.active .custom-chip-remove {
        color: var(--color-black) !important;
    }

    .general-info ul li svg.fill-first path {
        fill: var(--color-first) !important;

    }

    .general-info ul li svg.stroke-first path {
        stroke: var(--color-first) !important;

    }
}

/* Responsive Styles */
@media (min-width: 1200px) and (max-width: 1320px) {
    .booking-section .img-video-section .bg-element {
        bottom: -120px;
    }
}

@media (min-width: 991px) and (max-width: 1062px) {
    .booking-section .webNewContent .mainHeading.bannerHeading {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 1200px) {
    .ai-banner-img {
        width: 480px;
    }
}

@media screen and (max-width: 1024px) {
    .ask-me {
        right: 16px;
        bottom: 20px;
    }

    .ai-banner-img {
        width: 420px;
        height: 88px;
    }
    .webNewContent .ai-banner .mainHeading {font-size: 1.5rem;}
    .ai-banner .text-lg {font-size: 1rem !important;}
    .ai-banner .iconSize-50 {min-width: 45px;width: 45px;height: 45px;}
}

@media (max-width: 1199px) {
    .sights-grid {
        gap: 16px;
    }

    .booking-section .img-video-section .bg-element {
        bottom: -150px;
        left: -20px;
    }
}

@media (max-width: 991px) {
    .ai-banner-img {width: 350px;}
    .webNewContent .ai-banner .mainHeading {font-size: 1.4rem;}
    .ai-banner .text-lg {font-size: 0.92rem !important;}
    .ai-banner .iconSize-50 {min-width: 40px;width: 40px;height: 40px;}
    .plan-trip .plan-trip-container {
        padding: 30px !important;
    }

    .sights-grid {
        grid-template-columns: repeat(6, 1fr);
    }

    .sight-card--tall {
        grid-column: span 6;
        grid-row: span 1;
        aspect-ratio: 16 / 7;
    }

    .sight-card--wide,
    .sight-card--medium,
    .sight-card--small {
        grid-column: span 3;
        aspect-ratio: 4 / 3;
    }

    .sight-card h3 {
        font-size: 18x !important;
        transition: all 0.1s ease;
    }

    .sight-card:hover h3 {
        font-size: 22px !important;
    }

    .hero-content .hero-title {
        max-width: 460px;
    }

    .hero-content {
        padding: 100px 0 60px;
    }

    .dealSection .card {
        min-height: unset;
        max-height: unset;
    }

    .dealSection .card:hover .image-overlay .overlay .review-badge {
        margin-bottom: -60px;
    }

    .galleryBtn {
        width: 80px;
        height: 80px;
    }
}

@media (max-width: 767px) {
    .w-sm-100 {width: 100%;}
    .dotted-start-border {border-left: none;}
    .ask-me {
        right: 8px;
        bottom: 16px;
    }

    .ai-banner-img {
        width: 100%;
        height: auto;
        border-radius: 16px 16px 0 0 !important;
    }
    .teal-radio {
        width: 100%;
        justify-content: flex-start;
    }

    .btn-plan-choice {
        font-size: 13px !important;
        padding: 6px 12px !important;
    }

    .sights-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .sight-card {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
        aspect-ratio: 4/3 !important;
    }

    .hero-content {
        padding: 80px 0 50px;
    }

    .hero-content .hero-title {
        max-width: 410px;
    }

    .custom-swiper-arrow {
        width: 32px;
        height: 32px;
    }

    .search-form-wrap form .row>div:not(:last-child) {
        border-bottom: 1px solid var(--border-light-blue);
        margin-bottom: 10px !important;
    }

    .search-form-wrap form .row>div:nth-child(2)::after,
    .search-form-wrap form .row>div:nth-child(3)::after,
    .search-form-wrap form .row>div::after {
        display: none;
    }

    .search-form-wrap form .row>div:nth-child(2),
    .search-form-wrap form .row>div:nth-child(3),
    .search-form-wrap form .row>div:nth-child(4) {
        padding-bottom: 10px !important;
    }

    .w-sm-100 {
        width: 100% !important;
    }

    .leftGrid,
    .eventPhotosGrid {
        gap: 10px;
    }

    .galleryBtn {
        width: 65px;
        height: 65px;
    }

    .custom-swiper-arrow {
        width: 32px;
        height: 32px;
    }
}

@media (max-width: 575px) {
    .scroll-nav__btn {
        width: 34px;
        height: 34px;
    }

    .eventPhotosGrid {
        grid-template-columns: 1fr;
    }

    .galleryCard--big {
        order: 1;
        aspect-ratio: 16 / 9;
    }

    .leftGrid {
        order: 2;
    }
}

@media (max-width: 480px) {
    .sights-grid {
        grid-template-columns: 1fr;
    }

    .sight-card h3 {
        font-size: 16px !important;
        transition: all 0.1s ease;
    }

    .sight-card:hover h3 {
        font-size: 20px !important;
    }

    .hero-content {
        padding: 60px 0 40px;
    }

    .search-form-wrap {
        padding: 14px 5px;
    }
}

/* Hero tabs responsive */
@media (max-width: 767px) {
    .hero-tabs {
        margin-left: 0;
        padding: 4px 6px;
        gap: 6px !important;
        overflow-x: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
        max-width: 100%;
    }

    .hero-tabs::-webkit-scrollbar {
        display: none;
    }

    .hero-tab {
        padding: 6px 12px !important;
        font-size: 13px;
    }
    .hero-container-width, .search-panel-container {max-width: 100%;}
    .search-panel-container .shape-element {
        display: none;
    }

    .search-form-wrap {
        border-radius: 16px;
    }
}

@media (max-width: 480px) {
    .hero-tab .iconSize-25 {
        width: 18px;
        height: 18px;
        min-width: 18px;
    }

    .hero-tab {
        padding: 5px 10px !important;
        font-size: 12px;
    }
}
/* ---- Equal-height cards + hover (Top Destinations & Curated Collections) ---- */
.destination-section .destination-card { transition: transform .35s ease, box-shadow .35s ease; }
.destination-section .destination-card .img-box img { height: 230px; object-fit: cover; transition: transform .5s ease; }
.destination-section .destination-card:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(15, 39, 51, .18); }
.destination-section .destination-card:hover .img-box img { transform: scale(1.06); }
/* ---- Why book cards hover ---- */
.why-book-section .card { transition: transform .3s ease, box-shadow .3s ease; }
.why-book-section .card:hover { transform: translateY(-5px); box-shadow: 0 12px 28px rgba(15, 39, 51, .12); }

/* ---- Booking Benefits ---- */
.booking-benefits-section .benefit-icon {
    width: 52px;
    height: 52px;
    background: rgba(47, 98, 113, 0.09);
}
.booking-benefits-section .card { transition: transform .3s ease, box-shadow .3s ease; }
.booking-benefits-section .card:hover { transform: translateY(-5px); box-shadow: 0 12px 28px rgba(15, 39, 51, .12); }

/* ---- 7L+ promo banner: image as background, themed-blue gradient, overlaid text ---- */
.promo-banner {
    position: relative;
    overflow: hidden;
    align-items: center;
}
.promo-banner-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
    z-index: 0;
}
.promo-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    /* background: linear-gradient(90deg, var(--color-blue-light2) 0%, var(--color-blue-light2) 30%, transparent 70%); */
}
.promo-banner__content {
    position: relative;
    z-index: 2;
}
@media (max-width: 767.98px) {
    .promo-banner { min-height: 140px; }
    .promo-banner::before {
        background: linear-gradient(90deg, var(--color-blue-light2) 0%, var(--color-blue-light2) 45%, rgba(178, 222, 247, 0.55) 100%);
    }
}

/* ===================== Header (header-new) ===================== */
#mobileHeader {
  display: none;
}

#desktopHeader {
  display: block;
}

.header-search {
  display: block;
}

.menu-inner-header {
  position: sticky;
  top: 0;
  z-index: 10;
  padding: 15px;
  backdrop-filter: blur(10px);
  background: var(--bgColor-white);
  border-bottom: 1px solid var(--color-new-blue);
}

.backBtnInside {
  border: none;
  background: none;
  font-size: 16px;
  cursor: pointer;
}

.header-new .nav-item {
  padding: 0px 5px !important;
}

.header-new a.nav-link {
  padding: 0px 0px !important;
}

.header-new .nav-item-border {
  border-right: 1px solid var(--color-first);
  padding-right: 15px !important;
}

.wrapper {
  padding-top: 62px;
}

.navbar {
  position: relative;
}

.mega-wrapper {
  position: static;
}

.mega-menu {
  position: fixed;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 1320px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: 0.2s ease;
}

.country::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0px;
  bottom: 0px;
  width: 4px;
  border-radius: 0px;
  background: linear-gradient(to bottom, rgba(47, 98, 113, 1), rgba(241, 93, 107, 1));
  opacity: 0;
  transition: opacity 0.3s ease;
}

.country:hover::before,
.country.active::before {
  opacity: 1;
}

.mega-wrapper.active>.mega-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.mega-wrapper.active {
  z-index: 1000;
}

.header-new .nav-link {
  color: var(--color-dark) !important;
  transition: all 0.2s ease;
}

.header-new .nav-link .arrow {
  color: var(--color-dark);
  transition: all 0.2s ease;
}

.user-dropdown a:hover {
  background: var(--color-new-blue)
}

.country-tab,
.city-list {
  max-height: 455px;
  overflow-y: auto;
  overflow-x: hidden;
}

.header-new .mega-wrapper.active>.nav-link {
  color: var(--color-first-same) !important;
}

.header-new .mega-wrapper.active>.nav-link .arrow {
  color: var(--color-first-same);
  transform: rotate(180deg);
}

.country {
  padding: 12px;
  cursor: pointer;
  border-radius: 6px;
}

.country:hover,
.country.active {
  background: var(--color-new-blue)
}

.city-list {
  display: none;
}

.city-list.active {
  display: block;
}

.arrow {
  transition: transform 0.3s ease;
}

.mega-wrapper.active>.nav-link .arrow {
  transform: rotate(180deg);
}

.nav-thumb {
  width: 60px;
  height: 60px;
}

.header-new-card:hover {
  background: var(--color-new-blue)
}

.country-tab {
  border-color: var(--color-new-blue)
}

.user-menu {
  position: relative;
}

.user-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 20px);
  right: 0;
  width: 220px;
  z-index: 1060;
}

.user-menu.active .user-dropdown {
  display: block;
}

.header-new ::-webkit-scrollbar {
  width: 8px;
}

.header-new ::-webkit-scrollbar-track {
  background: var(--color-new-blue);
  border-radius: 10px;
}

.header-new ::-webkit-scrollbar-thumb {
  background: var(--color-first);
  border-radius: 10px;
}

.header-new ::-webkit-scrollbar-thumb:hover {
  background: var(--color-first);
}

.header-new ::-webkit-scrollbar-button {
  display: none;
  height: 0;
  width: 0;
}

.icon-wrap {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.menu-overlay {
  display: none;
}

.extra-item {
  display: none;
}


@media screen and (max-width: 1225px) {
  #mobileHeader {
    display: block;
  }

  #desktopHeader {
    display: none;
  }

  .header-search {
    display: none;
  }

  .wrapper {
    padding-top: 50px !important;
  }

  #mobileHeader {
    display: block;
  }

  .mobile-header {
    height: 60px;
    border-bottom: 1px solid #eee;
  }

  .menu-overlay {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background: var(--bgColor-white);
    display: flex;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: 0.3s ease;
    z-index: 9999;
  }

  .menu-overlay.active {
    right: 0;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .menu-top {
    height: 60px;
    border-bottom: 1px solid var(--color-white);
  }

  .menu-content {
    position: relative;
    flex: 1;
    overflow: hidden;
  }

  .menu-screen {
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: 0.3s ease;
    overflow-y: auto;
  }

  .menu-screen.active {
    left: 0;
    opacity: 1;
  }

  .menu-item {
    padding: 15px;
    border-bottom: 6px solid var(--color-new-blue);
    cursor: pointer;
  }

  .menu-content .nav-thumb {
    width: 45px;
    height: 45px;
  }

  .mobile-logo {
    width: 135px;
  }

  .mobile-search {
    width: 165px;
  }

  .extra-item {
    display: none;
  }

  .menu-overlay.active .menu-top {
    border-bottom: 1px solid var(--color-new-blue);
  }
}


@media screen and (max-width:767px) {
  .header-search {
    display: none;
  }

  .wrapper {
    padding-top: 47px !important;
  }
}

@media screen and (max-width: 480px) {
  #mobileHeader a.plan.color-text-white-same.text-md {
    font-size: 0.75rem !important;
  }
}

/* ===== Search button (.button.btn-subscribe) — red, matches reference ===== */
.search-form-wrap .button.btn-subscribe,
.search-form-wrap .button.btn-subscribe:hover,
.search-form-wrap .button.btn-subscribe:focus,
.search-form-wrap .button.btn-subscribe:active {
  background: var(--color-second, #f45d6b);
  color: var(--color-white, #fff);
  border: none;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: normal;
  text-transform: capitalize;
  line-height: 1.2;
}
.search-form-wrap .button.btn-subscribe .fill-white path {
  fill: var(--color-white, #fff);
}

/* ===== React-datepicker integration for the hotel check-in / check-out fields ===== */
/* Uses the shared @/components/ui/DatePicker (react-datepicker default wrapper
   classes), so target react-datepicker-wrapper / __input-container directly. */
.search-form-wrap input.search-field-input {
    width: 100%;
    background: transparent;
    cursor: pointer;
    border: none;
    border-radius: 0;
    box-shadow: none;
    height: auto;
    padding: 0;
    font-size: 1rem !important;
    line-height: normal;
    color: var(--color-content) !important;
}

.search-form-wrap input.search-field-input:focus {
    background: transparent;
    border: none;
    box-shadow: none;
    outline: none;
}

.search-form-wrap input.search-field-input::placeholder {
    color: var(--color-content, #7a7a7a);
    opacity: 1;
}

.search-form-wrap .react-datepicker-popper .react-datepicker__day--in-selecting-range {
    background-color: transparent !important;
}

/* .search-form-wrap .react-datepicker-wrapper {
  width: 100%;
  display: block;
}
.search-form-wrap .react-datepicker__input-container {
  display: block;
}
.search-form-wrap .react-datepicker-popper {
  z-index: 1100;
}
.search-form-wrap .react-datepicker-popper .react-datepicker {
  font-family: inherit;
  font-size: 0.85rem;
  border: 1px solid var(--border-light-blue, #c6d7ec);
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
  overflow: hidden;
}
.search-form-wrap .react-datepicker-popper .react-datepicker__header {
  background: var(--color-white, #fff);
  border-bottom: 1px solid var(--border-light-blue, #c6d7ec);
}
.search-form-wrap .react-datepicker-popper .react-datepicker__month-container {
  padding: 4px;
}
.search-form-wrap .react-datepicker-popper .react-datepicker__current-month {
  font-size: 0.95rem;
  font-weight: 600;
  padding: 4px 0 8px;
}
.search-form-wrap .react-datepicker-popper .react-datepicker__day-name,
.search-form-wrap .react-datepicker-popper .react-datepicker__day,
.search-form-wrap .react-datepicker-popper .react-datepicker__time-name {
  width: 2rem;
  line-height: 2rem;
  margin: 0.15rem;
}
.search-form-wrap .react-datepicker-popper .react-datepicker__day--selected,
.search-form-wrap .react-datepicker-popper .react-datepicker__day--in-selecting-range,
.search-form-wrap .react-datepicker-popper .react-datepicker__day--in-range,
.search-form-wrap .react-datepicker-popper .react-datepicker__day--keyboard-selected {
  background: var(--color-second, #f45d6b);
  color: var(--color-white, #fff);
  border-radius: 50%;
}
.search-form-wrap .react-datepicker-popper .react-datepicker__day:hover {
  background: var(--color-second-light, #ffe3e5);
} */

/* Logo sizing (desktop header-new) */
.header-new .navbar-brand .logo,
#desktopHeader .navbar-brand .logo {
  width: 150px;
  height: auto;
  display: block;
}

/* Traveler picker: tidy spacing inside the dropdown */
.search-form-wrap #div_collapseHotelTravellerClass {
  min-width: 280px;
}
.search-form-wrap #div_collapseHotelTravellerClass .qty-container {
  gap: 8px;
  min-width: 110px;
}
.search-form-wrap #div_collapseHotelTravellerClass .qty-btn-minus,
.search-form-wrap #div_collapseHotelTravellerClass .qty-btn-plus {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.wrapper {
    padding-top: 62px !important;
}

/* DATEPICKER STYLES */
.daterangepicker {
    position: absolute;
    color: inherit;
    background-color: var(--color-white);
    border-radius: 4px;
    width: 278px;
    padding: 10px;
    margin-top: 1px;
    top: 100px;
    left: 20px;
    /* Calendars */
}

.daterangepicker:before,
.daterangepicker:after {
    position: absolute;
    display: inline-block;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    content: '';
}

.daterangepicker:before {
    display: none;
    top: -7px;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #ccc;
}

.daterangepicker:after {
    top: -6px;
    display: none;
    border-right: 6px solid transparent;
    border-bottom: 6px solid var(--color-white);
    border-left: 6px solid transparent;
}

.daterangepicker.opensleft:before {
    right: 9px;
}

.daterangepicker.opensleft:after {
    right: 10px;
}

.daterangepicker.openscenter:before {
    left: 0;
    right: 0;
    width: 0;
    margin-left: auto;
    margin-right: auto;
}

.daterangepicker.openscenter:after {
    left: 0;
    right: 0;
    width: 0;
    margin-left: auto;
    margin-right: auto;
}

.daterangepicker.opensright:before {
    right: 9px;
}

.daterangepicker.opensright:after {
    right: 10px;
}

.daterangepicker.dropup {
    margin-top: -5px;
}

.daterangepicker.dropup:before {
    top: initial;
    bottom: -7px;
    border-bottom: initial;
    border-top: 7px solid #ccc;
}

.daterangepicker.dropup:after {
    top: initial;
    bottom: -6px;
    border-bottom: initial;
    border-top: 6px solid var(--color-white);
}

.daterangepicker.dropdown-menu {
    max-width: none;
    z-index: 3001;
}

.daterangepicker.single .ranges,
.daterangepicker.single .calendar {
    float: none;
}

.daterangepicker.show-calendar .calendar {
    display: block;
}

.daterangepicker .calendar {
    display: none;
    max-width: 270px;
    margin: 4px;
}

.daterangepicker .calendar.single .calendar-table {
    border: none;
}

.daterangepicker .calendar th,
.daterangepicker .calendar td {
    white-space: nowrap;
    text-align: center;
    min-width: 32px;
    font-size: 13px;
}

.daterangepicker .calendar-table {
    border: 1px solid var(--color-white);
    padding: 4px;
    border-radius: 4px;
    background-color: var(--color-white);
}

.daterangepicker table {
    width: 100%;
    margin: 0;
    border-collapse: separate;
}

.daterangepicker td,
.daterangepicker th {
    text-align: center;
    width: 20px;
    height: 25px;
    border-radius: 4px;
    border: 1px solid transparent;
    white-space: nowrap;
    cursor: pointer;
}

.daterangepicker td.available:hover,
.daterangepicker th.available:hover {
    background-color: #eee;
    border-color: transparent;
    color: inherit;
}

.daterangepicker td.week,
.daterangepicker th.week {
    font-size: 80%;
    color: #ccc;
}

.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {
    background-color: var(--color-white);
    border-color: transparent;
    color: #999;
}

.daterangepicker td.in-range {
    background-color: #ebf4f8;
    border-color: transparent;
    color: #000;
    border-radius: 0;
}

.daterangepicker td.start-date {
    border-radius: 4px 0 0 4px;
}

.daterangepicker td.end-date {
    border-radius: 0 4px 4px 0;
}

.daterangepicker td.start-date.end-date {
    border-radius: 4px;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: var(--color-third);
    border-color: transparent;
    color: var(--color-white);
}

.daterangepicker th.month {
    width: auto;
}

.daterangepicker td.disabled,
.daterangepicker option.disabled {
    color: #999;
    cursor: not-allowed;
    text-decoration: line-through;
}

.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
    font-size: 12px;
    padding: 1px;
    height: auto;
    margin: 0;
    cursor: default;
}

.daterangepicker select.monthselect {
    margin-right: 2%;
    width: 56%;
}

.daterangepicker select.yearselect {
    width: 40%;
}

.daterangepicker select.hourselect,
.daterangepicker select.minuteselect,
.daterangepicker select.secondselect,
.daterangepicker select.ampmselect {
    width: 50px;
    margin-bottom: 0;
}

.daterangepicker .input-mini {
    border: none;
    border-radius: 4px;
    color: #555;
    height: 30px;
    line-height: 30px;
    display: block;
    vertical-align: middle;
    margin: 0 0 5px 0;
    padding: 0 6px 0 28px;
    width: 100%;
}

.daterangepicker .input-mini.active {
    border: 1px solid #08c;
    border-radius: 4px;
}

.daterangepicker .daterangepicker_input {
    position: relative;
    display: none;
}

.daterangepicker .calendar-table .next i,
.daterangepicker .calendar-table .prev i {
    color: var(--color-second);
}

.daterangepicker .daterangepicker_input i {
    position: absolute;
    left: 8px;
    top: 8px;
    display: none;
}

.daterangepicker.rtl .input-mini {
    padding-right: 28px;
    padding-left: 6px;
}

.daterangepicker.rtl .daterangepicker_input i {
    left: auto;
    right: 8px;
}

.daterangepicker .calendar-time {
    text-align: center;
    margin: 5px auto;
    line-height: 30px;
    position: relative;
    padding-left: 28px;
}

.daterangepicker .calendar-time select.disabled {
    color: #ccc;
    cursor: not-allowed;
}

.daterangepicker .calendar-table th.month {
    font-size: 20px;
    font-weight: 700;
}

.daterangepicker .calendar-table th,
.daterangepicker .calendar-table td {
    white-space: nowrap;
    text-align: center;
    vertical-align: middle;
    min-width: 34px;
    width: 34px;
    height: 30px;
    line-height: 24px;
    font-size: 14px;
    border-radius: 4px;
    border: 1px solid transparent;
    white-space: nowrap;
    cursor: pointer;
}

.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
    color: var(--color-white);
    border: solid var(--color-second);
    border-width: 0 4px 4px 0;
    border-radius: 0;
    display: inline-block;
    padding: 3px;
}

.ranges {
    font-size: 11px;
    float: none;
    margin: 4px;
    text-align: left;
}

.ranges ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    width: 100%;
}

.ranges li {
    font-size: 13px;
    background-color: transparent;
    border: 1px solid transparent;
    /* #f5f5f5 */
    border-radius: 4px;
    color: var(--color-third);
    padding: 3px 12px;
    margin-bottom: 8px;
    cursor: pointer;
}

.ranges li:hover {
    background-color: var(--color-third);
    border: 1px solid var(--color-third);
    color: var(--color-white);
}

.ranges li.active {
    background-color: var(--color-third);
    border: 1px solid var(--color-third);
    color: var(--color-white);
}

/*  Larger Screen Styling */
@media (min-width: 564px) {
    .daterangepicker {
        width: auto;
    }

    .daterangepicker .ranges ul {
        width: 160px;
    }

    .daterangepicker.single .ranges ul {
        width: 100%;
    }

    .daterangepicker.single .calendar.left {
        clear: none;
    }

    .daterangepicker.single.ltr .ranges,
    .daterangepicker.single.ltr .calendar {
        float: left;
    }

    .daterangepicker.single.rtl .ranges,
    .daterangepicker.single.rtl .calendar {
        float: right;
    }

    .daterangepicker.ltr {
        direction: ltr;
        text-align: left;
    }

    .daterangepicker.ltr .calendar.left {
        clear: left;
        margin-right: 0;
    }

    .daterangepicker.ltr .calendar.left .calendar-table {
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .daterangepicker.ltr .calendar.right {
        margin-left: 0;
    }

    .daterangepicker.ltr .calendar.right .calendar-table {
        border-left: none;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .daterangepicker.ltr .left .daterangepicker_input {
        padding-right: 12px;
    }

    .daterangepicker.ltr .calendar.left .calendar-table {
        padding-right: 12px;
    }

    .daterangepicker.ltr .ranges,
    .daterangepicker.ltr .calendar {
        float: left;
    }

    .daterangepicker.rtl {
        direction: rtl;
        text-align: right;
    }

    .daterangepicker.rtl .calendar.left {
        clear: right;
        margin-left: 0;
    }

    .daterangepicker.rtl .calendar.left .calendar-table {
        border-left: none;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .daterangepicker.rtl .calendar.right {
        margin-right: 0;
    }

    .daterangepicker.rtl .calendar.right .calendar-table {
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .daterangepicker.rtl .left .daterangepicker_input {
        padding-left: 12px;
    }

    .daterangepicker.rtl .calendar.left .calendar-table {
        padding-left: 12px;
    }

    .daterangepicker.rtl .ranges,
    .daterangepicker.rtl .calendar {
        text-align: right;
        float: right;
    }
}

.range_inputs .btn-success {
    background: var(--color-third) !important;
    border-color: var(--color-third) !important;
}

.range_inputs {
    display: none;
}

@media (min-width: 730px) {
    .daterangepicker .ranges {
        width: auto;
    }

    .daterangepicker.ltr .ranges {
        float: left;
    }

    .daterangepicker.rtl .ranges {
        float: right;
    }

    .daterangepicker .calendar.left {
        clear: none !important;
    }
}

/* UI Update file design */
.iconSize-20 {
    min-width: 20px;
}

.iconSize-18 {
    min-width: 18px;
    width: 18px;
    height: 18px;
}

.h-22 {
    height: 22px;
}

.text-9 {
    font-size: 9px !important;
    line-height: 9px;
}

.qr-img1 {
    width: 100px;
    height: 100px;
}

.border-color-white-light {
    border-color: rgba(255, 255, 255, 0.28) !important;
}

.stroke-white-same,
.stroke-white-same path {
    stroke: var(--color-white-same) !important;
}

.stroke-first,
.stroke-first path {
    stroke: var(--color-first) !important;
}

.stroke-second,
.stroke-second path {
    stroke: var(--color-second) !important;
}

.promo-banner {
    position: relative;
    height: 150px;
    overflow: hidden;
}

.promo-color {
    color: #0F2733 !important;
}

.promo-banner .promo-banner-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.user-dropdown {
    box-shadow: 0 0 80px rgba(0, 0, 0, 0.24) !important;
}

.footer-useful-links h4.text-md {
    font-size: 0.92rem !important;
}

footer:before {
    border-radius: var(--bs-border-radius-xl) !important;
}

.footer-top-sec {
    position: relative;
    background-color: #223e57;
    z-index: 1;
}

.footer-useful-links li a,
.footerCategoryList ul.nav a {
    color: #f5f5f5 !important
}

.img-cover {
    object-fit: cover;
    object-position: center;
}

.search-form-wrap {
    box-shadow: 0 15px 15px rgba(0, 0, 0, 0.085) !important;
}

.hero-banner-overlay.hero-banner-overlay-light {
    background: rgba(185, 235, 250, 0.28) !important;
}

.suggestion-card-check .suggestion-check-label {
    border: 1px solid var(--bs-border-color) !important;
    padding: 4px;
    border-radius: 6px;
    background-color: var(--bg-body-color) !important;
}

.suggestion-card-check .form-check-input:checked+.suggestion-check-label {
    border-color: var(--color-second) !important;
    background-color: rgba(244, 93, 107, 0.05) !important;
}

.filterDetails .suggestion-card-check {
    overflow-x: hidden !important;
    max-height: 340px !important;
}

.filterDetails .collapse {
    overflow-x: hidden !important;
}

.filterDetails .collapse .card {
    box-shadow: none !important;
}

.limited-time-offer.bgColor-light-grey {
    border-color: var(--bs-border-color) !important;
    background-color: var(--color-light-grey) !important;
}

@media screen and (max-width: 1225px) {
    .menu-overlay {
        width: 300px !important;
        box-shadow: 0 0 80px rgba(0, 0, 0, 0.24) !important;
    }
}

@media screen and (max-width: 1200px) {
    .qr-img1 {
        width: 80px;
        height: 80px;
    }

    .user-dropdown {
        top: calc(100% + 10px);
    }

    .footer-useful-links li a,
    .footerCategoryList ul.nav a {
        font-size: 0.95rem;
    }

    .footer-useful-links h4.text-md {
        font-size: 0.8rem !important;
    }

    .hero-banner-bg,
    .hero-banner-overlay {
        border-radius: 0 0 50px 50px;
    }
}

@media screen and (max-width: 991px) {
    .border-md-none {
        border: none !important;
        border-right: none !important;
    }
}

@media screen and (max-width: 767px) {
    .border-sm-none {
        border: none !important;
        border-right: none !important;
    }

    .hero-banner-section {
        margin-bottom: 40px;
    }

    .hero-banner-bg,
    .hero-banner-overlay {
        border-radius: 0 0 30px 30px;
    }
}

footer:before {
    z-index: 1;
    background-color: rgba(15, 39, 51, 0.97) !important;
}

.footer-sec,
.copyright {
    z-index: 2;
}

footer,
.download-app-block {
    background: url(/images/v3/footer-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.fixedFooter ul li,
footer .copyright ul li {
    display: inline-block;
}

.footer-useful-links li {
    margin-bottom: 15px;
}

.footer-useful-links .footer-heading {
    color: var(--color-second);
    font-family: var(--font-family-sub-heading);
    font-weight: 600;
    text-transform: uppercase;
    opacity: 1;
    margin-bottom: 10px;
}

.footer-useful-links li a,
footer a {
    color: #fff;
    text-decoration: none;
}

.footer-useful-links li a,
.footerCategoryList ul.nav a {
    font-size: 1.1rem;
    font-weight: 400;
}

.footer-useful-links li a:hover,
footer a:hover {
    color: #fff;
    opacity: 0.7;
}

.social-icons li {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-icons a i {
    font-size: 1.1 rem;
    color: #fff;
    font-weight: 500;
}

i.icon:after {
    display: none;
}
/* V3 hotel search — dynamic destination dropdown + rooms/price (API binding) */
.search-form-wrap #div_collapseHotelDestination {
    max-height: min(60vh, 420px);
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
}
.search-form-wrap #div_collapseHotelDestination .card,
.search-form-wrap #div_collapseHotelDestination .card-body {
    max-height: none;
    overflow: visible;
}
.search-form-wrap #div_collapseHotelDestination .location-item-new .loc-name {
    text-transform: capitalize;
}
.search-form-wrap #div_collapseHotelDestination .clear-recent-btn {
    color: #f45d6b;
}
.search-form-wrap #div_collapseHotelTravellerClass {
    width: 320px;
    max-width: 90vw;
}
.search-form-wrap #div_collapseHotelTravellerClass .child-age {
    border: 1px solid #d9d9d9 !important;
    border-radius: 8px;
    min-width: 110px;
}
.search-form-wrap #div_collapseHotelTravellerClass .child-age:focus {
    border-color: #f45d6b !important;
    box-shadow: none;
}
.search-form-wrap .btn-subscribe:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}