/* CarMisto UX priority fixes.
   This file is intentionally loaded last on the marketplace shell so the
   compact catalogue and checkout rules win over legacy component defaults. */

/* Keep the first catalogue offer in the first viewport without removing the
   explanatory content or the existing search controls. */
@media (min-width: 851px) {
    body.marketplace-experience #app-content > #page-fleet > .journey-hero,
    body.catalog-reference-upgrade #app-content > #page-fleet > .journey-hero {
        min-height: 0 !important;
        margin: 0 !important;
        padding: 10px 20px 2px !important;
        border-radius: 14px 14px 0 0 !important;
    }

    body.marketplace-experience #journey-title,
    body.catalog-reference-upgrade #journey-title {
        margin: 0 0 3px !important;
        font-size: clamp(24px, 2.15vw, 30px) !important;
        line-height: 1.08 !important;
    }

    body.marketplace-experience .journey-hero p:not(.eyebrow),
    body.catalog-reference-upgrade .journey-hero p:not(.eyebrow) {
        max-width: 760px;
        margin: 2px 0 !important;
        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    body.marketplace-experience #p0-trust-markers,
    body.catalog-reference-upgrade #p0-trust-markers {
        display: flex;
        gap: 6px !important;
        margin: 3px 0 !important;
        padding: 0 2px !important;
        max-height: 30px;
        overflow: hidden;
    }

    body.marketplace-experience #p0-trust-markers span,
    body.catalog-reference-upgrade #p0-trust-markers span {
        padding: 3px 7px !important;
        font-size: 10px !important;
        line-height: 1.2;
        white-space: nowrap;
    }

    body.marketplace-experience .p0-collections,
    body.catalog-reference-upgrade .p0-collections {
        gap: 7px !important;
        margin: 3px 0 5px !important;
        padding: 4px 2px !important;
        border: 0 !important;
        box-shadow: none !important;
        max-height: 47px;
        overflow-x: auto;
        overflow-y: hidden;
    }

    body.marketplace-experience .p0-collections__head,
    body.catalog-reference-upgrade .p0-collections__head {
        flex: 0 0 auto;
        margin: 0 !important;
        align-self: center;
    }

    body.marketplace-experience .p0-collections__head strong,
    body.catalog-reference-upgrade .p0-collections__head strong {
        font-size: 11px !important;
        white-space: nowrap;
    }

    body.marketplace-experience .p0-collections__head small,
    body.catalog-reference-upgrade .p0-collections__head small,
    body.marketplace-experience .p0-collections__item > span,
    body.catalog-reference-upgrade .p0-collections__item > span {
        display: none !important;
    }

    body.marketplace-experience .p0-collections__list,
    body.catalog-reference-upgrade .p0-collections__list {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 5px !important;
        min-width: 0;
        overflow: visible;
    }

    body.marketplace-experience .p0-collections__item,
    body.catalog-reference-upgrade .p0-collections__item {
        flex: 0 0 auto !important;
        min-height: 30px !important;
        padding: 5px 8px !important;
        border-radius: 999px !important;
        font-size: 11px !important;
        white-space: nowrap;
    }

    body.marketplace-experience #search-sticky,
    body.catalog-reference-upgrade #search-sticky {
        margin: 0 0 5px !important;
        padding: 5px 14px 6px !important;
        border-radius: 10px !important;
    }

    body.marketplace-experience #search-sticky .search-box,
    body.catalog-reference-upgrade #search-sticky .search-box {
        gap: 7px !important;
    }

    body.marketplace-experience #search-sticky .floating-input,
    body.catalog-reference-upgrade #search-sticky .floating-input {
        min-height: 42px !important;
    }

    body.marketplace-experience #p0-search-context,
    body.catalog-reference-upgrade #p0-search-context {
        gap: 8px !important;
        margin: 2px 0 4px !important;
        padding: 0 2px 5px !important;
    }

    body.marketplace-experience #p0-search-context b,
    body.catalog-reference-upgrade #p0-search-context b {
        font-size: 14px !important;
    }

    body.marketplace-experience #p0-search-context span,
    body.catalog-reference-upgrade #p0-search-context span {
        font-size: 11px !important;
    }

    body.marketplace-experience #cat-filters,
    body.catalog-reference-upgrade #cat-filters {
        gap: 4px !important;
        padding: 0 0 5px !important;
        flex-wrap: nowrap !important;
        overflow-x: auto;
        scrollbar-width: none;
    }

    body.marketplace-experience #cat-filters::-webkit-scrollbar,
    body.catalog-reference-upgrade #cat-filters::-webkit-scrollbar {
        display: none;
    }

    body.marketplace-experience #cat-filters .filter-btn,
    body.catalog-reference-upgrade #cat-filters .filter-btn,
    body.marketplace-experience #cat-filters .catalog-sort,
    body.catalog-reference-upgrade #cat-filters .catalog-sort {
        min-height: 34px !important;
        padding: 6px 9px !important;
        font-size: 12px !important;
    }

    body.marketplace-experience #catalog-brand-shortcuts,
    body.catalog-reference-upgrade #catalog-brand-shortcuts {
        margin: 1px 0 5px !important;
        flex-wrap: nowrap;
        overflow: hidden;
    }

    body.marketplace-experience .catalog-brand-shortcuts__list,
    body.catalog-reference-upgrade .catalog-brand-shortcuts__list {
        min-width: 0;
    }

    body.marketplace-experience #catalog-results-layout,
    body.catalog-reference-upgrade #catalog-results-layout {
        gap: 8px !important;
    }

    /* The side map is part of the catalogue, so cards must remain readable
       next to it rather than collapsing into a narrow thumbnail column. */
    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .car-card[data-offer-layout] {
        display: grid !important;
        grid-template-columns: minmax(210px, 32%) minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        align-items: start !important;
    }

    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .offer-media {
        grid-row: 1 / span 2 !important;
        align-self: start !important;
        height: clamp(240px, 22vw, 300px) !important;
    }

    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .offer-media .card-img-box {
        height: 100% !important;
        min-height: 0 !important;
    }

    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .offer-media .card-img {
        min-height: 0 !important;
        padding: 12px !important;
    }

    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .offer-info {
        padding: 14px 16px 4px !important;
    }

    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .offer-info .car-card__title {
        font-size: 18px !important;
    }

    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .offer-checkout {
        grid-column: 2 !important;
        padding: 6px 16px 14px !important;
    }

    body.catalog-reference-upgrade #catalog-map-layout.has-side-map .offer-checkout .card-total-price {
        font-size: 22px !important;
    }
}

/* The full-screen map view uses the same readable offer hierarchy as the
   list. These rules are also useful on narrow desktop windows. */
body.map-view-active #fleet-grid .car-card[data-offer-layout] {
    flex: 0 0 min(86vw, 410px) !important;
    width: min(86vw, 410px) !important;
    min-width: 0 !important;
    overflow: hidden;
}

body.map-view-active #fleet-grid .offer-media .card-img-box {
    height: 185px !important;
    min-height: 185px !important;
}

body.map-view-active #fleet-grid .offer-media .card-img {
    padding: 10px !important;
    object-fit: contain !important;
}

body.map-view-active #fleet-grid .offer-info {
    padding: 12px 14px 2px !important;
}

body.map-view-active #fleet-grid .offer-info .car-card__title {
    font-size: 18px !important;
    line-height: 1.2;
}

body.map-view-active #fleet-grid .offer-info .car-card__specs,
body.map-view-active #fleet-grid .offer-info .card-terms {
    font-size: 12px !important;
}

body.map-view-active #fleet-grid .offer-checkout {
    padding: 8px 14px 12px !important;
}

body.map-view-active #fleet-grid .offer-checkout .card-total-price {
    font-size: 23px !important;
}

body.map-view-active #fleet-grid .offer-checkout .card-book-btn {
    min-height: 42px !important;
    margin-top: 8px !important;
}

/* Reduce the empty tail after the catalogue and make the next decision point
   appear close to the last offer. */
body.marketplace-experience #rental-destinations,
body.catalog-reference-upgrade #rental-destinations {
    margin-top: 12px !important;
    margin-bottom: 18px !important;
}

body.marketplace-experience .marketplace-faq,
body.catalog-reference-upgrade .marketplace-faq {
    margin-top: 14px !important;
}

/* Booking: panels are transparent on desktop, but become real steps on a
   phone. This avoids a 5,000px single scroll while keeping one request flow. */
.booking-wizard-anchor { display: none !important; }
.booking-step-panel { display: block; min-width: 0; }
.booking-step-panel__title { display: none; }
.booking-wizard-controls { display: none; }

.booking-progress__step[data-booking-step] {
    cursor: pointer;
}

.date-range-hint {
    min-height: 0;
    margin: 6px 2px 10px;
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.35;
}

.date-range-hint.is-warning {
    color: var(--primary);
    font-weight: 700;
}

@media (max-width: 760px) {
    body.marketplace-experience #app-content > #page-fleet,
    body.catalog-reference-upgrade #app-content > #page-fleet {
        padding-inline: 12px !important;
    }

    body.marketplace-experience #app-content > #page-fleet > .journey-hero,
    body.catalog-reference-upgrade #app-content > #page-fleet > .journey-hero {
        padding: 9px 12px 3px !important;
        margin-top: 2px !important;
    }

    body.marketplace-experience #journey-title,
    body.catalog-reference-upgrade #journey-title {
        font-size: 23px !important;
    }

    body.marketplace-experience .journey-hero p:not(.eyebrow),
    body.catalog-reference-upgrade .journey-hero p:not(.eyebrow) {
        font-size: 11px !important;
        line-height: 1.25 !important;
    }

    body.marketplace-experience #p0-trust-markers,
    body.catalog-reference-upgrade #p0-trust-markers {
        gap: 4px !important;
        margin: 2px 0 !important;
        max-height: 29px;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
    }

    body.marketplace-experience #p0-trust-markers::-webkit-scrollbar,
    body.catalog-reference-upgrade #p0-trust-markers::-webkit-scrollbar {
        display: none;
    }

    body.marketplace-experience #p0-trust-markers span,
    body.catalog-reference-upgrade #p0-trust-markers span {
        flex: 0 0 auto;
        padding: 4px 7px !important;
        font-size: 10px !important;
    }

    body.marketplace-experience .p0-collections,
    body.catalog-reference-upgrade .p0-collections {
        margin: 2px 0 4px !important;
        padding: 2px 0 !important;
        max-height: 40px;
    }

    body.marketplace-experience .p0-collections__head,
    body.catalog-reference-upgrade .p0-collections__head {
        display: none !important;
    }

    body.marketplace-experience .p0-collections__item,
    body.catalog-reference-upgrade .p0-collections__item {
        min-height: 31px !important;
        padding: 6px 9px !important;
        font-size: 11px !important;
    }

    body.marketplace-experience #search-sticky,
    body.catalog-reference-upgrade #search-sticky {
        padding: 6px 9px 8px !important;
        margin-bottom: 4px !important;
    }

    body.marketplace-experience #search-sticky .search-box,
    body.catalog-reference-upgrade #search-sticky .search-box {
        gap: 6px !important;
    }

    body.marketplace-experience #p0-search-context,
    body.catalog-reference-upgrade #p0-search-context {
        gap: 6px !important;
        margin: 2px 0 4px !important;
        padding: 0 0 4px !important;
    }

    body.marketplace-experience #p0-search-context b,
    body.catalog-reference-upgrade #p0-search-context b {
        font-size: 13px !important;
    }

    body.marketplace-experience #p0-search-context span,
    body.catalog-reference-upgrade #p0-search-context span {
        font-size: 10px !important;
    }

    body.marketplace-experience #cat-filters,
    body.catalog-reference-upgrade #cat-filters {
        padding-bottom: 4px !important;
        min-height: 40px;
        flex-wrap: nowrap !important;
        overflow-x: auto;
        scrollbar-width: none;
    }

    body.marketplace-experience #cat-filters::-webkit-scrollbar,
    body.catalog-reference-upgrade #cat-filters::-webkit-scrollbar {
        display: none;
    }

    body.marketplace-experience .catalog-brand-shortcuts,
    body.catalog-reference-upgrade .catalog-brand-shortcuts {
        flex-direction: row !important;
        align-items: center !important;
        gap: 6px !important;
        min-height: 48px;
    }

    body.marketplace-experience .catalog-brand-shortcuts > strong,
    body.catalog-reference-upgrade .catalog-brand-shortcuts > strong {
        font-size: 11px !important;
    }

    body.marketplace-experience .catalog-brand-shortcuts__list,
    body.catalog-reference-upgrade .catalog-brand-shortcuts__list {
        flex: 1 1 auto;
        gap: 5px !important;
        padding-bottom: 3px !important;
        overflow-x: auto;
    }

    body.marketplace-experience .catalog-brand-shortcuts__list button,
    body.catalog-reference-upgrade .catalog-brand-shortcuts__list button {
        min-height: 36px !important;
        padding: 5px 8px !important;
        font-size: 11px !important;
    }

    body.marketplace-experience .catalog-brand-shortcuts__list img,
    body.catalog-reference-upgrade .catalog-brand-shortcuts__list img {
        width: 20px;
        height: 20px;
    }

    body.marketplace-experience #catalog-map-layout,
    body.catalog-reference-upgrade #catalog-map-layout {
        gap: 6px !important;
    }

    body.marketplace-experience #search-sticky .btn-icon,
    body.catalog-reference-upgrade #search-sticky .btn-icon {
        min-height: 42px !important;
        height: 42px !important;
        padding: 9px !important;
    }

    body.map-view-active #fleet-grid .car-card[data-offer-layout] {
        flex-basis: min(88vw, 360px) !important;
        width: min(88vw, 360px) !important;
    }

    body.map-view-active #fleet-grid .offer-media .card-img-box {
        height: 165px !important;
        min-height: 165px !important;
    }

    /* Actual mobile wizard. The left-side vehicle details remain above the
       checkout sheet; only the right-side form is paged. */
    #bookingModal .m-right {
        padding: 14px 16px calc(18px + env(safe-area-inset-bottom)) !important;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    #bookingModal .booking-panel-header {
        position: sticky;
        top: -14px;
        padding: 4px 0 10px !important;
        margin: 0 0 10px !important;
    }

    #bookingModal .booking-progress {
        position: sticky;
        top: 39px;
        z-index: 9;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 4px;
        margin: 0 -2px 10px;
        padding: 5px 0;
        background: var(--bg-modal);
    }

    #bookingModal .booking-progress__step {
        min-width: 0;
        padding: 6px 2px;
        border: 1px solid var(--border);
        border-radius: 8px;
        color: var(--text-muted);
        font-size: 10px;
        line-height: 1.15;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #bookingModal .booking-progress__step.is-current {
        border-color: var(--primary);
        background: color-mix(in srgb, var(--primary) 9%, var(--bg-card));
        color: var(--primary);
        font-weight: 800;
    }

    #bookingModal .booking-progress__step.is-complete {
        border-color: rgba(39,174,96,.45);
        color: var(--success);
    }

    #bookingModal .booking-step-panel[hidden] {
        display: none !important;
    }

    #bookingModal .booking-step-panel__title {
        display: block;
        margin: 0 0 10px;
        color: var(--text-main);
        font-size: 17px;
        line-height: 1.2;
    }

    #bookingModal .booking-wizard-controls {
        display: flex;
        gap: 8px;
        margin: 12px 0 2px;
    }

    #bookingModal .booking-wizard-controls button {
        min-height: 46px;
        padding: 10px 13px;
        border: 1px solid var(--border);
        border-radius: 11px;
        background: var(--bg-card);
        color: var(--text-main);
        font: inherit;
        font-size: 13px;
        font-weight: 800;
        cursor: pointer;
    }

    #bookingModal .booking-wizard-controls [data-wizard-next] {
        flex: 1;
        border-color: var(--primary);
        background: var(--primary);
        color: #fff;
    }

    #bookingModal .booking-wizard-controls [data-wizard-prev] {
        flex: 0 0 auto;
    }

    #bookingModal .booking-step-panel[data-booking-step="1"] .booking-date-grid {
        gap: 8px !important;
    }

    #bookingModal .booking-step-panel[data-booking-step="3"] .checkout-option-group {
        margin-bottom: 10px !important;
        padding: 12px !important;
    }

    #bookingModal .booking-step-panel[data-booking-step="4"] .booking-steps {
        margin-top: 10px;
    }

    #bookingModal .btn-hold {
        margin: 12px 0 10px !important;
        min-height: 54px;
    }
}

/* The condition cards must occupy their own flow row. Earlier compact rules
   capped this block at one line, so the cards were painted underneath the
   search-context toolbar and could not explain how to turn a choice off. */
body.catalog-reference-upgrade #stories-bar.p0-collections:not([hidden]),
body.marketplace-experience #stories-bar.p0-collections:not([hidden]) {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    margin-bottom: 10px !important;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__head,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__head {
    display: flex !important;
    align-items: flex-start;
    margin-bottom: 6px !important;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__head .p0-collections__hint,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__head .p0-collections__hint {
    display: block !important;
    margin-top: 2px;
    color: var(--text-muted) !important;
    font-size: 11px !important;
    font-weight: 600;
    line-height: 1.25;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__head .p0-collections__total,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__head .p0-collections__total {
    display: none !important;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__list,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__list {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    min-height: 0;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 1px 2px 9px !important;
    scrollbar-width: thin;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item {
    flex: 0 0 190px !important;
    min-height: 66px !important;
    box-sizing: border-box;
    display: grid !important;
    align-content: space-between;
    gap: 4px;
    padding: 9px 11px !important;
    border-radius: 12px !important;
    white-space: normal !important;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item-copy,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item-copy {
    display: grid !important;
    min-width: 0;
    gap: 3px;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item-copy b,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item-copy b {
    display: block !important;
    overflow: hidden;
    font-size: 12px !important;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item-count,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item-count {
    display: block !important;
    color: var(--text-muted) !important;
    font-size: 10px !important;
    font-weight: 700;
    line-height: 1.2;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item-action,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item-action {
    display: block !important;
    color: var(--text-muted) !important;
    font-size: 10px !important;
    font-weight: 800;
    line-height: 1.2;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item.is-active,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item.is-active {
    border-color: var(--primary) !important;
    background: var(--primary-light) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 14%, transparent);
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item.is-active .p0-collections__item-action,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item.is-active .p0-collections__item-action {
    color: var(--primary) !important;
}
@media (max-width: 760px) {
    body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__list,
    body.marketplace-experience #stories-bar.p0-collections .p0-collections__list {
        padding-bottom: 5px !important;
        scrollbar-width: none;
    }
    body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__list::-webkit-scrollbar,
    body.marketplace-experience #stories-bar.p0-collections .p0-collections__list::-webkit-scrollbar {
        display: none;
    }
    body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item,
    body.marketplace-experience #stories-bar.p0-collections .p0-collections__item {
        flex-basis: 184px !important;
        min-height: 68px !important;
    }
}

/* Four compact date/time cells fit comfortably on medium phones; narrow
   phones keep the safer two-column layout. */
@media (min-width: 520px) and (max-width: 760px) {
    body.marketplace-experience #search-sticky .marketplace-search__date-fields,
    body.catalog-reference-upgrade #search-sticky .marketplace-search__date-fields {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }
}

/* Search must remain a catalogue field, never a contact field. These hints
   complement the semantic autocomplete attributes in the markup and keep
   browser/password-manager decoration from looking like a real query. */
#f-search:-webkit-autofill,
#f-search:-webkit-autofill:hover,
#f-search:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--text-main) !important;
    -webkit-box-shadow: 0 0 0 1000px var(--bg-card) inset !important;
    transition: background-color 9999s ease-out 0s;
}

/* Keep the live condition tabs visible after every catalogue rerender. */
body.catalog-reference-upgrade #stories-bar.p0-collections:not([hidden]),
body.marketplace-experience #stories-bar.p0-collections:not([hidden]) {
    display: flex !important;
    visibility: visible !important;
}

/* A labelled sort control reads as an intentional decision point instead of
   an unexplained native dropdown. */
.catalog-sort-control {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    padding: 4px 6px 4px 10px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-card);
    box-shadow: 0 2px 8px rgba(23, 32, 42, .06);
}
.catalog-sort-control__label {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .01em;
    white-space: nowrap;
}
.catalog-sort-control .catalog-sort {
    min-width: 184px;
    min-height: 34px;
    padding: 6px 28px 6px 5px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: var(--bg-card) !important;
    color: var(--text-main) !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}
.catalog-sort-control .catalog-sort:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 1px;
}

/* The map heading starts after Leaflet's top-left zoom control, so the
   heading cannot cover or intercept zoom in either map layout. */
body.catalog-reference-upgrade #map-wrapper .map-context,
body.marketplace-experience #map-wrapper .map-context {
    top: 12px !important;
    left: 58px !important;
    right: 12px !important;
    max-width: calc(100% - 70px) !important;
    pointer-events: none;
}
body.catalog-reference-upgrade #map-wrapper .map-context > div,
body.marketplace-experience #map-wrapper .map-context > div {
    min-width: 0;
    overflow: hidden;
}
body.catalog-reference-upgrade #map-wrapper .map-context b,
body.catalog-reference-upgrade #map-wrapper .map-context span:not(.map-context-badge),
body.marketplace-experience #map-wrapper .map-context b,
body.marketplace-experience #map-wrapper .map-context span:not(.map-context-badge) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Show the actual duration tariff inside a card. The main price is always
   the 1–3 day rate when dates are not selected; longer-term rates are listed
   explicitly instead of being disguised as a misleading “from” price. */
.card-price-tiers {
    margin-top: 9px;
    padding-top: 8px;
    border-top: 1px solid var(--border);
}
.card-price-tiers > small {
    display: block;
    margin-bottom: 5px;
    color: var(--text-muted);
    font-size: 10px;
    font-weight: 800;
}
.card-price-tiers > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 8px;
}
.card-price-tiers span {
    display: flex;
    min-width: 0;
    align-items: baseline;
    justify-content: space-between;
    gap: 5px;
    color: var(--text-muted);
    font-size: 10px;
}
.card-price-tiers b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.card-price-tiers strong {
    flex: 0 0 auto;
    color: var(--text-main);
    font-size: 10px;
    white-space: nowrap;
}
.card-price-tiers em {
    color: var(--text-muted);
    font-size: 9px;
    font-style: normal;
    font-weight: 600;
}
.card-price-guidance {
    display: block;
    margin-top: 6px;
    color: var(--text-muted);
    font-size: 10px;
    line-height: 1.35;
}

/* Keep the homepage flow visually grouped: search and result controls form
   one decision area; explanations and partner acquisition follow the offers. */
body.catalog-reference-upgrade .marketplace-proof,
body.marketplace-experience .marketplace-proof {
    margin-top: 16px !important;
    margin-bottom: 12px !important;
}
body.catalog-reference-upgrade .affiliate-spotlight,
body.marketplace-experience .affiliate-spotlight {
    margin-top: 10px !important;
    margin-bottom: 14px !important;
}

@media (max-width: 760px) {
    .catalog-sort-control {
        flex: 1 0 100%;
        justify-content: space-between;
        min-height: 40px;
        padding-inline: 9px;
    }
    .catalog-sort-control .catalog-sort {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 245px;
        text-align: right;
    }
    body.catalog-reference-upgrade .p0-collections,
    body.marketplace-experience .p0-collections {
        display: block !important;
        max-height: none !important;
        overflow: visible !important;
    }
    body.catalog-reference-upgrade .p0-collections__head,
    body.marketplace-experience .p0-collections__head {
        display: flex !important;
        align-items: center;
        margin-bottom: 4px !important;
    }
    body.catalog-reference-upgrade .p0-collections__head > div small,
    body.catalog-reference-upgrade .p0-collections__head > small,
    body.marketplace-experience .p0-collections__head > div small,
    body.marketplace-experience .p0-collections__head > small {
        display: none !important;
    }
    body.catalog-reference-upgrade .p0-collections__list,
    body.marketplace-experience .p0-collections__list {
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }
    body.catalog-reference-upgrade .p0-collections__list::-webkit-scrollbar,
    body.marketplace-experience .p0-collections__list::-webkit-scrollbar {
        display: none;
    }
    body.catalog-reference-upgrade #map-wrapper .map-context,
    body.marketplace-experience #map-wrapper .map-context {
        left: 54px !important;
        right: 9px !important;
        max-width: calc(100% - 63px) !important;
    }
    .card-price-tiers > div {
        grid-template-columns: 1fr;
    }
}

/* The search summary is the catalogue toolbar, not map metadata. Keep it
   above both layouts so the user's location and the main filter action are
   visible before the map or first card. */
body.catalog-reference-upgrade #p0-search-context,
body.marketplace-experience #p0-search-context {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 14px !important;
    width: 100%;
    max-width: 1180px;
    min-height: 0 !important;
    margin: 6px auto 10px !important;
    padding: 9px 12px !important;
    box-sizing: border-box;
    border: 1px solid var(--border) !important;
    border-radius: 14px !important;
    background: var(--surface-secondary) !important;
}
body.catalog-reference-upgrade #p0-search-context > :first-child,
body.marketplace-experience #p0-search-context > :first-child {
    flex: 1 1 auto;
}
body.catalog-reference-upgrade .catalog-view-controls,
body.marketplace-experience .catalog-view-controls {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}
body.catalog-reference-upgrade .catalog-view-controls button,
body.marketplace-experience .catalog-view-controls button {
    min-height: 38px;
    padding: 7px 11px;
    border-radius: 10px;
    white-space: nowrap;
}
body.catalog-reference-upgrade .catalog-view-controls .catalog-all-filters,
body.marketplace-experience .catalog-view-controls .catalog-all-filters {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
    box-shadow: 0 4px 12px rgba(201, 22, 29, .18);
}
body.catalog-reference-upgrade .catalog-view-controls .catalog-all-filters:hover,
body.catalog-reference-upgrade .catalog-view-controls .catalog-all-filters:focus-visible,
body.marketplace-experience .catalog-view-controls .catalog-all-filters:hover,
body.marketplace-experience .catalog-view-controls .catalog-all-filters:focus-visible {
    background: var(--primary-dark, #a9161d);
    color: #fff;
}
@media (min-width: 1000px) {
    /* The toolbar now owns the primary entry point; keep the rail focused on
       active chips and quick conditions instead of a second hidden-looking CTA. */
    body.catalog-reference-upgrade #catalog-filter-rail .catalog-filter-rail__all,
    body.marketplace-experience #catalog-filter-rail .catalog-filter-rail__all {
        display: none !important;
    }
}

/* Make every advanced-filter option an obvious, comfortable touch target and
   keep the checked state visible in both light and dark themes. */
body.catalog-reference-upgrade #filtersModal .filters-option,
body.marketplace-experience #filtersModal .filters-option {
    min-height: 48px;
    box-sizing: border-box;
    cursor: pointer;
    user-select: none;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}
body.catalog-reference-upgrade #filtersModal .filters-option:has(input:checked),
body.marketplace-experience #filtersModal .filters-option:has(input:checked) {
    background: color-mix(in srgb, var(--primary) 10%, var(--bg-input)) !important;
    outline: 1px solid color-mix(in srgb, var(--primary) 40%, transparent);
}
body.catalog-reference-upgrade #filtersModal .filters-option input[type="checkbox"],
body.marketplace-experience #filtersModal .filters-option input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    margin: 0;
    accent-color: var(--primary);
    cursor: pointer;
}
body.catalog-reference-upgrade #filtersModal .filters-option input:checked + span,
body.marketplace-experience #filtersModal .filters-option input:checked + span {
    color: var(--text-main);
    font-weight: 800;
}

/* Keep the factual condition tabs present and readable after every async
   catalogue refresh, including the compact mobile layout. */
body.catalog-reference-upgrade #stories-bar.p0-collections:not([hidden]),
body.marketplace-experience #stories-bar.p0-collections:not([hidden]) {
    display: block !important;
    visibility: visible !important;
    min-height: 0;
}
@media (max-width: 760px) {
    body.catalog-reference-upgrade #p0-search-context,
    body.marketplace-experience #p0-search-context {
        align-items: stretch;
        flex-direction: column;
        gap: 8px !important;
        margin: 5px 0 8px !important;
    }
    body.catalog-reference-upgrade .catalog-view-controls,
    body.marketplace-experience .catalog-view-controls {
        width: 100%;
        margin-left: 0;
    }
    body.catalog-reference-upgrade .catalog-view-controls button,
    body.marketplace-experience .catalog-view-controls button {
        flex: 1 1 0;
        min-width: 0;
        padding-inline: 7px;
        font-size: 11px;
    }
    body.catalog-reference-upgrade .catalog-view-controls .catalog-all-filters,
    body.marketplace-experience .catalog-view-controls .catalog-all-filters {
        flex: 1.25 1 0;
    }
    body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__head,
    body.marketplace-experience #stories-bar.p0-collections .p0-collections__head {
        display: flex !important;
        align-items: center;
        margin-bottom: 5px !important;
    }
    body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__head strong,
    body.marketplace-experience #stories-bar.p0-collections .p0-collections__head strong {
        font-size: 12px !important;
    }
}

/* Final cascade for the condition row: it must never be clipped by the
   compact catalogue rules above, and its off/on instruction must remain
   visible on phones as well as desktop. */
body.catalog-reference-upgrade #stories-bar.p0-collections:not([hidden]),
body.marketplace-experience #stories-bar.p0-collections:not([hidden]) {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__head .p0-collections__hint,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__head .p0-collections__hint {
    display: block !important;
}
body.catalog-reference-upgrade #stories-bar.p0-collections .p0-collections__item-action,
body.marketplace-experience #stories-bar.p0-collections .p0-collections__item-action {
    display: block !important;
}

/* Keep one obvious advanced-filter entry point on the homepage.  The search
   row used to repeat the same action next to the date fields and again above
   the results, which made the controls look like two competing filters. */
body.catalog-reference-upgrade #search-sticky button[onclick*="openFilters"],
body.marketplace-experience #search-sticky button[onclick*="openFilters"] {
    display: none !important;
}

/* Make the category/sort row self-explanatory: conditions are shortcuts,
   while this row is the catalogue's category and sorting control. */
body.catalog-reference-upgrade #cat-filters .catalog-controls-heading,
body.marketplace-experience #cat-filters .catalog-controls-heading {
    display: grid;
    flex: 0 0 auto;
    align-content: center;
    gap: 1px;
    min-width: 132px;
    min-height: 34px;
    padding: 4px 9px;
    box-sizing: border-box;
    border-left: 3px solid var(--primary);
    border-radius: 5px;
    background: var(--surface-secondary);
}
body.catalog-reference-upgrade #cat-filters .catalog-controls-heading strong,
body.marketplace-experience #cat-filters .catalog-controls-heading strong {
    color: var(--text-main);
    font-size: 11px;
    line-height: 1.15;
}
body.catalog-reference-upgrade #cat-filters .catalog-controls-heading span,
body.marketplace-experience #cat-filters .catalog-controls-heading span {
    color: var(--text-muted);
    font-size: 9px;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
}

/* On a phone the photo, description and CTA share the same card width. */
@media (max-width: 760px) {
    body.catalog-reference-upgrade #fleet-grid,
    body.marketplace-experience #fleet-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    body.catalog-reference-upgrade #fleet-grid .car-card[data-offer-layout],
    body.marketplace-experience #fleet-grid .car-card[data-offer-layout] {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }
    body.catalog-reference-upgrade #fleet-grid .car-card[data-offer-layout] .offer-media,
    body.catalog-reference-upgrade #fleet-grid .car-card[data-offer-layout] .offer-info,
    body.catalog-reference-upgrade #fleet-grid .car-card[data-offer-layout] .offer-checkout,
    body.marketplace-experience #fleet-grid .car-card[data-offer-layout] .offer-media,
    body.marketplace-experience #fleet-grid .car-card[data-offer-layout] .offer-info,
    body.marketplace-experience #fleet-grid .car-card[data-offer-layout] .offer-checkout {
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box;
    }
    body.catalog-reference-upgrade #fleet-grid .car-card[data-offer-layout] .offer-media,
    body.marketplace-experience #fleet-grid .car-card[data-offer-layout] .offer-media {
        align-self: stretch !important;
        height: auto !important;
    }
    body.catalog-reference-upgrade #fleet-grid .car-card[data-offer-layout] .offer-media .card-img-box,
    body.marketplace-experience #fleet-grid .car-card[data-offer-layout] .offer-media .card-img-box {
        width: 100% !important;
        height: clamp(190px, 56vw, 240px) !important;
        min-height: 0 !important;
    }
    body.catalog-reference-upgrade #fleet-grid .car-card[data-offer-layout] .offer-media .card-img,
    body.marketplace-experience #fleet-grid .car-card[data-offer-layout] .offer-media .card-img {
        width: 100% !important;
        height: 100% !important;
        box-sizing: border-box;
    }
}
