/* Tour listings share the homestay catalogue's spacing and card treatment. */
.tour-hero,
.tour-page {
    --tour-red: var(--brand-primary, #00cf32);
    --tour-red-dark: var(--brand-primary-hover, #00b82c);
    --tour-border: #e0e6ed;
    --tour-text: #10233e;
}

.tour-hero {
    background: #fff;
}

.tour-shell {
    max-width: 1256px;
}

.tour-shell--hero {
    padding-top: 48px;
    padding-bottom: 0;
}

.tour-hero__content {
    align-items: end;
    gap: 40px;
    padding: 26px 0 48px;
}

.tour-hero h1 {
    color: #10233e;
    font-size: clamp(26px, 2.5vw, 40px);
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.035em;
}

.tour-hero p {
    margin-top: 12px;
    color: #718198;
    font-size: 14px;
    line-height: 1.75;
}

.tour-hero-search {
    min-height: 56px;
    box-shadow: 0 3px 8px rgb(16 35 62 / 5%);
}

.tour-hero-search button {
    box-shadow: 0 3px 8px rgb(0 207 50 / 18%);
}

.tour-page {
    background: #f7f9fb;
}

.tour-layout { gap: 40px; }
.tour-filter-panel { border-radius: 24px; box-shadow: 0 1px 2px rgb(16 35 62 / 4%); }
.tour-filter-panel__toggle { background: linear-gradient(100deg, #edfcf1, #fff); }
.tour-filter-panel__toggle > span:first-child { font-size: 14px; font-weight: 700; }
.tour-reset-filters-btn { border-color: #e0e6ed; }
.tour-toolbar { margin-bottom: 26px; }
.tour-toolbar__summary { min-height: 40px; padding: 0 18px; font-size: 13px; color: #718198; }
.tour-toolbar__sort-group { font-size: 11px; font-weight: 400; }
.tour-toolbar__sort-select { min-width: 164px; height: 40px; font-size: 13px; font-weight: 500; }
.tour-list-grid { gap: 24px; margin-bottom: 18px; }
.tour-page .tour-listing-card { border-radius: 24px; box-shadow: 0 1px 2px rgb(16 35 62 / 5%); }
.tour-page .tour-listing-card:hover { border-color: #a0e8b3; box-shadow: 0 12px 26px rgb(16 35 62 / 7%); }
.tour-page .tour-listing-card__body { padding: 20px; }
.tour-page .tour-listing-card__title { color: #10233e; font-size: 16px; }
.tour-page .tour-listing-card__excerpt { color: #718198; line-height: 1.7; }
.tour-page .tour-listing-card__meta { font-size: 12px; }
.tour-page .tour-listing-card__footer { padding-top: 16px; margin-top: auto; }
.tour-page .tour-listing-card__cta {
    min-height: 44px;
    border: 1px solid #90eaa6;
    border-radius: 16px;
    background: #f2fcf5;
    color: #00b82c;
    box-shadow: none;
    font-size: 12px;
    padding: 10px 14px;
}
.tour-page .tour-listing-card__cta:hover { background: #00cf32; color: #fff; box-shadow: none; }
.tour-page .tour-listing-card__price .text-lg,
.tour-page .tour-listing-card__price .text-xl { color: #10233e !important; font-size: 18px; }

@media (min-width: 1024px) {
    .tour-sidebar { width: 288px; }
    .tour-filters__panels > :not([hidden]) ~ :not([hidden]) { margin-top: 0; }
    .tour-page .tour-list-grid:not(.is-list) .tour-listing-card__media { height: auto; aspect-ratio: 1.62; }
    .tour-page .tour-list-grid:not(.is-list) .tour-listing-card__footer {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }
    .tour-page .tour-list-grid:not(.is-list) .tour-listing-card__price { width: auto; flex: 1; }
    .tour-page .tour-list-grid:not(.is-list) .tour-listing-card__cta { width: auto; }
    .tour-page .tour-list-grid:not(.is-list) .tour-listing-card__cta .material-symbols-outlined { display: none; }
}

@media (max-width: 1023px) {
    .tour-layout { gap: 24px; }
    .tour-shell--hero { padding-top: 20px; }
    .tour-hero__content { gap: 20px; padding-bottom: 32px; }
}

@media (max-width: 767px) {
    .tour-shell--hero { padding-top: 10px; }
    .tour-hero h1 { font-size: 26px; }
    .tour-hero__content { gap: 18px; padding-top: 18px; }
    .tour-list-grid { gap: 16px; }
    .tour-page .tour-listing-card__body { padding: 16px; }
}

/* Match the homestay sidebar controls, including circular multi-selects. */
.tour-page .tour-filter-panel__toggle {
    padding: 0 24px;
    min-height: 64px;
}
.tour-page .tour-filter-panel__body {
    color: #10233e;
    padding: 16px 18px;
}
.tour-page .tour-filter-option {
    color: #10233e;
    gap: 12px;
    font-size: 14px;
    font-weight: 400;
    min-height: 32px;
}
.tour-page .tour-filter-panel__body--ratings .tour-filter-option--rating > span:not(.tour-filter-count) {
    color: #10233e;
    font-size: 14px;
    font-weight: 400;
}
.tour-page .tour-filter-checkbox { border-radius: 50%; }
.tour-page .tour-filter-checkbox:checked,
.tour-page .tour-filter-radio:checked {
    border-color: var(--tour-red);
    background: var(--tour-red);
    box-shadow: inset 0 0 0 3px #fff;
}
.tour-page .tour-filter-count { font-weight: 400; }
.tour-page .tour-price-hints { font-size: 12px; }
.tour-page .tour-reset-filters-btn {
    min-height: 54px;
    border-radius: 22px;
    font-weight: 500;
}

.tour-page .tour-filter-checkbox,
.tour-page .tour-filter-radio {
    appearance: none;
    background-image: none !important;
    color: var(--tour-red);
    opacity: 1;
    visibility: visible;
}
.tour-page .tour-filter-checkbox:checked,
.tour-page .tour-filter-radio:checked {
    background-image: radial-gradient(circle, var(--tour-red) 0 42%, #fff 46%) !important;
    box-shadow: 0 0 0 3px rgb(0 207 50 / 12%);
}

.listing-filter-actions { display: flex; flex-direction: column; gap: 16px; }
.listing-apply-filters-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 46px;
    padding: 12px 20px;
    border: 0;
    border-radius: 14px;
    background: var(--brand-primary, #00cf32);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}
.listing-apply-filters-btn:hover { background: var(--brand-primary-hover, #00b82c); }
.listing-apply-filters-btn .material-symbols-outlined { font-size: 20px; }
.listing-filter-actions .homestay-reset-filters-btn,
.listing-filter-actions .tour-reset-filters-btn {
    min-height: 54px;
    border: 2px dashed #e0e6ed;
    border-radius: 24px;
    background: transparent;
    color: #718198;
    font-size: 14px;
    font-weight: 400;
}

/* Mobile filter drawer: fixed heading and actions around a scrolling body. */
@media (min-width: 1024px) {
    #homestay-filters-container > .listing-filter-actions,
    #filters-container > .listing-filter-actions { margin-top: 20px; }
}
@media (max-width: 1023px) {
    #homestay-filters-container:not(.hidden),
    #filters-container:not(.hidden) {
        display: flex !important;
        flex-direction: column;
        padding: 0 !important;
        height: 100dvh;
        max-height: 100dvh;
        width: min(86vw, 360px);
        max-width: 360px;
        border-radius: 0;
        overflow: hidden;
        background: #fff !important;
    }
    #homestay-filters-container > .flex:first-child,
    #filters-container .tour-filters__mobile-head {
        display: flex;
        flex: none;
        align-items: center;
        min-height: 72px;
        margin: 0;
        padding: 16px 18px;
        background: linear-gradient(110deg, #edfcf1, #fff);
    }
    #homestay-filters-container > .flex:first-child h3,
    #filters-container .tour-filters__mobile-head h3 { font-size: 15px; font-weight: 700; }
    #homestay-close-filters-btn,
    #close-filters-btn {
        width: 40px;
        height: 40px;
        border: 0;
        border-radius: 50%;
        background: #f1f5f9;
        color: #64748b;
    }
    #homestay-filters-container > .space-y-5,
    #filters-container:not(.hidden) .tour-filters__panels {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        padding: 16px;
        overscroll-behavior: contain;
    }
    #homestay-filters-container .homestay-filter-panel,
    #filters-container .tour-filter-panel { background: #f8fafb !important; }
    #homestay-filters-container .homestay-filter-panel__header,
    #filters-container .tour-filter-panel__toggle {
        min-height: 50px;
        padding: 0 14px;
        background: #f8fafb;
    }
    #homestay-filters-container .homestay-filter-panel__header > span:first-child,
    #filters-container .tour-filter-panel__toggle > span:first-child {
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
    }
    #homestay-filters-container > .listing-filter-actions,
    #filters-container > .listing-filter-actions {
        flex: none;
        display: flex;
        flex-direction: row;
        gap: 12px;
        padding: 16px 16px max(16px, env(safe-area-inset-bottom));
        border-top: 1px solid #e2e8f0;
        background: #fff;
    }
    #homestay-filters-container .listing-filter-actions > button,
    #filters-container .listing-filter-actions > button {
        flex: 1 1 0;
        width: 0;
        min-width: 0;
        min-height: 42px;
        padding: 10px 8px;
        border-radius: 9px;
        font-size: 13px;
    }
    #homestay-filters-container .homestay-reset-filters-btn,
    #filters-container .tour-reset-filters-btn {
        order: -1;
        border: 1px solid #dce4ee;
        background: #fff;
        color: #526981;
    }
}

#filters-container .tour-filter-option:has(> input:checked) > span:not(.tour-filter-count) {
    color: #008b27 !important;
    font-weight: 600 !important;
}

.tour-hero-search .tour-search-arrow { display: none; }
@media (max-width: 1023px) {
    .tour-mobile-refine { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; color: #718198; font-size: 13px; }
    #mobile-filter-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 0 16px; border: 1px solid #e0e6ed; border-radius: 999px; background: #fff; color: #10233e; font-size: 12px; font-weight: 600; box-shadow: 0 2px 6px rgb(16 35 62 / 5%); }
    #mobile-filter-toggle .material-symbols-outlined { color: var(--brand-primary, #00cf32); font-size: 19px; }
    .tour-toolbar { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
    .tour-toolbar__summary { width: 100%; min-height: 34px; justify-content: flex-start; padding: 0 14px; font-size: 12px; }
    .tour-toolbar__sort-group { width: 100%; margin-left: 0; justify-content: flex-start; gap: 8px; }
    .tour-toolbar__sort-group label { font-size: 10px; }
    .tour-toolbar__sort-select { flex: none; width: 156px; min-width: 0; height: 40px; font-size: 12px; font-weight: 400; }
    .tour-hero-search { min-height: 56px; padding: 4px 5px 4px 18px; border-radius: 16px; }
    .tour-hero-search button { width: 44px; min-width: 44px; height: 44px; padding: 0; border-radius: 16px; }
    .tour-search-label { display: none; }
    .tour-hero-search .tour-search-arrow { display: inline-block; color: #fff; font-size: 24px; }
    .tour-shell--hero, .tour-shell--page { padding-left: 16px; padding-right: 16px; }
    .tour-hero h1 { font-size: 23px; line-height: 1.2; }
    .tour-hero p { font-size: 13px; line-height: 1.65; }
    .tour-hero__content { gap: 22px; padding-bottom: 24px; }
    .tour-shell--page { padding-top: 18px; }
}

@media (max-width: 1023px) {
    #filters-container:not(.hidden),
    #homestay-filters-container:not(.hidden) {
        position: fixed;
        top: 0;
        bottom: 0;
        min-height: 0;
        box-sizing: border-box;
    }
    #filters-container:not(.hidden) > .tour-filters__panels,
    #homestay-filters-container:not(.hidden) > .space-y-5 {
        display: block !important;
        flex: 1 1 0% !important;
        height: 0;
        min-height: 0 !important;
        overflow-y: auto !important;
        overflow-x: hidden;
        touch-action: pan-y;
        -webkit-overflow-scrolling: touch;
    }
}

#filters-container { --tour-red: var(--brand-primary, #00cf32); }
#filters-container .tour-filter-option > input {
    appearance: none;
    -webkit-appearance: none;
    border-radius: 50%;
    background: #fff;
    width: 16px;
    height: 16px;
    border: 1px solid #cbd5e1;
}
#filters-container .tour-filter-option > input:checked {
    border-color: var(--tour-red);
    background: radial-gradient(circle, var(--tour-red) 0 42%, #fff 46%) !important;
    box-shadow: 0 0 0 3px rgb(0 207 50 / 12%);
}

@media (max-width: 1023px) {
    #filters-container .tour-filter-option,
    #filters-container .tour-filter-option > span:not(.material-symbols-outlined),
    #filters-container .tour-filter-panel__body--ratings .tour-filter-option--rating > span:not(.tour-filter-count) {
        font-size: 12px;
        line-height: 1.5;
    }
    #filters-container .tour-filter-option { font-weight: 400; }
    #filters-container .tour-filter-panel__body--ratings .tour-filter-option--rating > span:not(.tour-filter-count) { font-weight: 400; }
}

/* Only the drawer body scrolls on mobile; option groups must pass gestures through. */
@media (max-width: 1023px) {
    #filters-container:not(.hidden) .tour-filter-panel__body--locations,
    #filters-container:not(.hidden) .tour-filter-panel__body--durations,
    #filters-container:not(.hidden) .tour-filter-panel__body--ratings,
    #filters-container:not(.hidden) .group-tour-month-filter__list {
        max-height: none;
        overflow: visible;
        overscroll-behavior: auto;
    }
}

#filters-container .tour-filter-panel--rating .tour-filter-panel__toggle > span:first-child > .material-symbols-outlined {
    color: var(--brand-primary, #00cf32);
    font-size: 20px;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
@media (max-width: 1023px) {
    #filters-container .tour-filter-panel__body--ratings { gap: 6px; padding: 16px 22px; }
    #filters-container .tour-filter-panel__body--ratings .tour-filter-option { min-height: 32px; }
    #filters-container .tour-filter-panel--rating .tour-filter-option > input:checked {
        background: radial-gradient(circle, #fff 0 24%, var(--brand-primary, #00cf32) 28%) !important;
        box-shadow: none;
    }
}

/* AJAX results must remain visible on mobile, even below the reveal threshold. */
@media (max-width: 1023px) {
    .tour-anim-page.js-ready .tour-anim__reveal,
    .tour-anim-page.js-ready .tour-anim__stagger > * {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }
}

.tour-hero-search input:focus,
.tour-hero-search input:focus-visible {
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    --tw-ring-shadow: 0 0 #0000;
    --tw-ring-offset-shadow: 0 0 #0000;
}

@media (max-width: 1023px) {
    .tour-page .tour-list-grid .tour-listing-card__footer {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }
    .tour-page .tour-list-grid .tour-listing-card__price {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        max-width: none;
    }
    .tour-page .tour-list-grid .tour-listing-card__cta {
        flex: 0 0 auto;
        width: auto;
        min-width: 0;
        min-height: 44px;
        padding: 10px 16px;
    }
    .tour-page .tour-list-grid .tour-listing-card__cta .material-symbols-outlined {
        display: none;
    }
}

.tour-page .tour-listing-card__cta {
    font-weight: 500;
}

.tour-page .tour-listing-card__price .text-lg,
.tour-page .tour-listing-card__price .text-xl {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: normal;
}

.tour-page .tour-listing-card__rating {
    font-size: 12px;
    font-weight: 400;
    color: #718198;
    gap: 4px;
}
.tour-page .tour-listing-card__rating strong {
    font-weight: 600;
    color: #10233e;
}
.tour-page .tour-listing-card__rating .material-symbols-outlined {
    font-size: 16px;
    color: #ffbf00;
}

.tour-page .tour-listing-card__rating { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; font-size: 12px; }
.tour-page .tour-listing-card__rating .tour-listing-card__star { font-variation-settings: 'FILL' 1; color: #ffbf00; }
.tour-page .tour-listing-card__review-count { color: #10233e; margin-left: -2px; }
.tour-page .tour-listing-card__views { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; color: #8b9ab0; }
.tour-page .tour-listing-card__views .material-symbols-outlined { color: #8b9ab0; font-size: 15px; }