/* ==========================================================================
   RomaEnjoy theme - search results page (search.css)
   --------------------------------------------------------------------------
   Page-specific styles, prefixed .srch-. Shared tokens/components come from app.css.
    1. Band (compact search bar) & mobile summary
    2. Breadcrumb & layout grid
    3. Sidebar / offcanvas shell
    4. Filter groups: checks, switches, budget slider, show-all toggle
    5. Map teaser & map modal
    6. Results header, chips, toolbar, sort
    7. Results list, promo, loading state, empty state
    8. Pagination
    9. Mobile sticky bar
   10. Responsive
   ========================================================================== */

/* 1. Band & mobile summary
   ========================================================================== */
.srch-form {
    display: block;
    margin: 0;
}

.srch-band {
    padding: 14px 0 18px;
    background: var(--re-primary);
    background-image:
        radial-gradient(120% 160% at 100% 0%, rgba(205, 160, 75, .22) 0%, rgba(205, 160, 75, 0) 55%),
        var(--re-gradient);
}

.srch-band .re-search--compact {
    border-color: rgba(255, 255, 255, .35);
    box-shadow: 0 8px 24px rgba(43, 6, 14, .28);
}

.srch-searchbox-summary {
    display: flex;
    align-items: center;
    gap: .75rem;
    width: 100%;
    min-height: 56px;
    padding: .55rem .9rem;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 14px;
    background: var(--re-surface);
    color: var(--re-ink);
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 24px rgba(43, 6, 14, .28);
    transition: box-shadow var(--re-dur) var(--re-ease);
}

.srch-searchbox-summary[hidden] {
    display: none;
}

.srch-searchbox-summary:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px var(--re-accent);
}

.srch-searchbox-icon {
    flex: 0 0 auto;
    color: var(--re-primary);
    font-size: 1.2rem;
}

.srch-searchbox-text {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    line-height: 1.3;
}

.srch-searchbox-place {
    overflow: hidden;
    font-size: .95rem;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.srch-searchbox-meta {
    overflow: hidden;
    color: var(--re-ink-500);
    font-size: .78rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.srch-searchbox-edit {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    flex: 0 0 auto;
    color: var(--re-primary);
    font-size: .8rem;
    font-weight: 700;
}

.srch-searchbox-edit .bi {
    font-size: .9rem;
}

/* 2. Breadcrumb & layout grid
   ========================================================================== */
.srch-breadcrumb {
    padding: 14px 0 4px;
}

.srch-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    content: "›";
    font-weight: 600;
}

.srch-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    padding: 12px 0 56px;
}

.srch-main {
    min-width: 0;
}

/* 3. Sidebar / offcanvas shell
   ========================================================================== */
.srch-sidebar {
    --bs-offcanvas-width: min(380px, 92vw);
    min-width: 0;
}

.srch-sidebar-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: 1.05rem;
    font-weight: 800;
}

.srch-sidebar-title .bi {
    color: var(--re-primary);
}

.srch-sidebar-foot {
    display: flex;
    gap: .5rem;
    flex: 0 0 auto;
    padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom));
    border-top: 1px solid var(--re-ink-200);
    background: var(--re-surface);
    box-shadow: 0 -8px 24px rgba(38, 38, 43, .06);
}

.srch-sidebar-foot .btn-re-ghost {
    flex: 0 0 auto;
}

.srch-apply {
    flex: 1 1 auto;
}

.srch-filters {
    background: var(--re-surface);
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius);
    box-shadow: var(--re-shadow-sm);
}

.srch-filters-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: 14px 16px;
    border-bottom: 1px solid var(--re-ink-200);
}

.srch-filters-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
}

.srch-filters-title .bi {
    color: var(--re-primary);
}

.srch-filters-reset {
    font-size: .8125rem;
    font-weight: 600;
    white-space: nowrap;
}

/* 4. Filter groups
   ========================================================================== */
.srch-fs {
    min-width: 0;
    margin: 0;
    padding: 14px 16px 12px;
    border: 0;
    border-bottom: 1px solid var(--re-ink-200);
}

.srch-fs--last {
    border-bottom: 0;
}

.srch-fs-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    float: none;
    width: 100%;
    margin: 0 0 6px;
    padding: 0;
    font-family: var(--re-font-heading);
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--re-ink);
}

.srch-fs-clear {
    flex: 0 0 auto;
    padding: .15rem .4rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--re-primary);
    font-family: var(--re-font-body);
    font-size: .78rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease);
}

.srch-fs-clear:hover {
    background: var(--re-primary-50);
}

.srch-fs-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.srch-fs-more[hidden] {
    display: none;
}

.srch-fs-toggle {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 36px;
    margin-top: 4px;
    padding: .3rem .4rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--re-primary);
    font-family: var(--re-font-body);
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease);
}

.srch-fs-toggle:hover {
    background: var(--re-primary-50);
}

.srch-fs-toggle .bi {
    font-size: .8rem;
    transition: transform var(--re-dur) var(--re-ease);
}

.srch-fs-toggle[aria-expanded="true"] .bi {
    transform: rotate(180deg);
}

/* Check / radio rows */
.srch-check {
    display: flex;
    align-items: center;
    gap: .6rem;
    min-height: 40px;
    margin: 0 -6px;
    padding: 4px 6px;
    border-radius: 8px;
    color: var(--re-ink-700);
    font-size: .9rem;
    line-height: 1.3;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease);
}

.srch-check:hover {
    background: var(--re-primary-50);
    color: var(--re-ink);
}

.srch-check.is-empty {
    color: var(--re-ink-500);
}

.srch-check .form-check-input {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    cursor: pointer;
}

.srch-check:has(.form-check-input:checked) {
    color: var(--re-primary);
    font-weight: 600;
}

.srch-check-icon {
    flex: 0 0 auto;
    width: 1.25rem;
    color: var(--re-ink-500);
    font-size: 1.05rem;
    line-height: 1;
    text-align: center;
}

.srch-check:has(.form-check-input:checked) .srch-check-icon {
    color: var(--re-primary);
}

.srch-check-text {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: center;
    gap: .15rem .5rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.srch-check-stars {
    font-size: .75rem;
}

.srch-check-sub {
    font-size: .85rem;
}

.srch-check-score {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 34px;
    height: 26px;
    padding: 0 .35rem;
    border-radius: 6px 6px 6px 0;
    background: var(--re-primary);
    color: #fff;
    font-family: var(--re-font-heading);
    font-size: .78rem;
    font-weight: 800;
}

.srch-count {
    flex: 0 0 auto;
    min-width: 1.5rem;
    color: var(--re-ink-500);
    font-size: .8rem;
    font-weight: 500;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Switch rows (popular filters) */
.srch-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    min-height: 42px;
    margin: 0 -6px;
    padding: 4px 6px;
    border-radius: 8px;
    color: var(--re-ink-700);
    font-size: .9rem;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease);
}

.srch-switch:hover {
    background: var(--re-primary-50);
}

.srch-switch:has(.form-check-input:checked) {
    color: var(--re-ink);
    font-weight: 600;
}

.srch-switch-text {
    display: flex;
    align-items: center;
    gap: .6rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.srch-switch-icon {
    flex: 0 0 auto;
    width: 1.25rem;
    font-size: 1.05rem;
    text-align: center;
}

.srch-switch-icon--success { color: var(--re-success); }
.srch-switch-icon--accent { color: var(--re-accent-600); }
.srch-switch-icon--deal { color: var(--re-terracotta-ink); }

.srch-switch-ctl {
    flex: 0 0 auto;
    min-height: 0;
    margin: 0;
    padding: 0;
}

.srch-switch-ctl .form-check-input {
    float: none;
    width: 2.5em;
    height: 1.4em;
    margin: 0;
    cursor: pointer;
}

/* Budget: dual-thumb range + number inputs */
.srch-price {
    padding-top: 4px;
}

.srch-range {
    position: relative;
    height: 30px;
    margin: 0 8px 8px;
    --lo: 0%;
    --hi: 100%;
}

.srch-range-track {
    position: absolute;
    top: 50%;
    right: -8px;
    left: -8px;
    height: 4px;
    border-radius: 2px;
    background: var(--re-ink-200);
    transform: translateY(-50%);
}

.srch-range-fill {
    position: absolute;
    top: 50%;
    right: calc(100% - var(--hi));
    left: var(--lo);
    height: 4px;
    border-radius: 2px;
    background: var(--re-primary);
    transform: translateY(-50%);
}

.srch-range-input {
    position: absolute;
    top: 0;
    left: -8px;
    width: calc(100% + 16px);
    height: 30px;
    margin: 0;
    padding: 0;
    background: transparent;
    appearance: none;
    -webkit-appearance: none;
    pointer-events: none;
    outline: 0;
}

.srch-range-input--min { z-index: 3; }
.srch-range-input--max { z-index: 4; }

.srch-range-input::-webkit-slider-runnable-track {
    height: 30px;
    background: transparent;
    border: 0;
}

.srch-range-input::-moz-range-track {
    height: 30px;
    background: transparent;
    border: 0;
}

.srch-range-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 22px;
    height: 22px;
    margin-top: 4px;
    border: 2px solid var(--re-primary);
    border-radius: 50%;
    background: #fff;
    box-shadow: var(--re-shadow-sm);
    cursor: grab;
    pointer-events: auto;
    transition: box-shadow var(--re-dur) var(--re-ease), transform var(--re-dur) var(--re-ease);
}

.srch-range-input::-moz-range-thumb {
    width: 22px;
    height: 22px;
    border: 2px solid var(--re-primary);
    border-radius: 50%;
    background: #fff;
    box-shadow: var(--re-shadow-sm);
    cursor: grab;
    pointer-events: auto;
}

.srch-range-input:hover::-webkit-slider-thumb,
.srch-range-input:focus-visible::-webkit-slider-thumb {
    box-shadow: 0 0 0 4px var(--re-primary-100);
    transform: scale(1.06);
}

.srch-range-input:focus-visible::-moz-range-thumb {
    box-shadow: 0 0 0 4px var(--re-primary-100);
}

.srch-range-input:active::-webkit-slider-thumb {
    cursor: grabbing;
}

.srch-price-fields {
    display: flex;
    align-items: flex-end;
    gap: .5rem;
}

.srch-price-field {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.srch-price-label {
    color: var(--re-ink-500);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.srch-price-input {
    position: relative;
    display: block;
}

.srch-price-cur {
    position: absolute;
    top: 50%;
    left: .7rem;
    color: var(--re-ink-500);
    font-size: .875rem;
    font-weight: 600;
    transform: translateY(-50%);
    pointer-events: none;
}

.srch-price-input .form-control {
    min-height: 40px;
    padding: .4rem .5rem .4rem 1.65rem;
    font-size: .9rem;
    font-weight: 600;
    -moz-appearance: textfield;
}

.srch-price-input .form-control::-webkit-outer-spin-button,
.srch-price-input .form-control::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.srch-price-sep {
    padding-bottom: .65rem;
    color: var(--re-ink-500);
}

/* 5. Map teaser & modal
   ========================================================================== */
.srch-fs--map {
    padding: 12px;
}

.srch-map-card {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border: 1px solid var(--re-ink-200);
    border-radius: 10px;
    background: var(--re-primary-50);
}

/* Oversized so the embed's zoom controls / attribution bar fall outside the crop;
   the credit overlay below keeps the OpenStreetMap attribution visible. */
.srch-map-card iframe {
    position: absolute;
    top: -25%;
    left: -25%;
    width: 150%;
    height: 150%;
    border: 0;
    filter: saturate(.85);
    pointer-events: none;
}

.srch-map-credit {
    position: absolute;
    right: 6px;
    bottom: 5px;
    z-index: 1;
    padding: 1px 6px;
    border-radius: 4px;
    background: rgba(255, 255, 255, .8);
    color: var(--re-ink-700);
    font-size: .62rem;
    font-weight: 500;
    line-height: 1.4;
    pointer-events: none;
}

.srch-map-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(140, 16, 36, 0) 40%, rgba(107, 12, 27, .20) 100%);
    pointer-events: none;
}

.srch-map-card-btn {
    position: relative;
    z-index: 1;
    box-shadow: 0 6px 18px rgba(107, 12, 27, .35);
}

.srch-map-title {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .35rem .6rem;
    min-width: 0;
}

.srch-map-title .bi {
    color: var(--re-primary);
}

.srch-map-sub {
    color: var(--re-ink-500);
    font-family: var(--re-font-body);
    font-size: .85rem;
    font-weight: 500;
}

.srch-map-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 0;
    padding: 0;
    overflow: hidden;
}

.srch-map-frame {
    position: relative;
    min-height: min(70vh, 640px);
    background: var(--re-primary-50);
}

.srch-map-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.srch-map-placeholder {
    position: absolute;
    top: 50%;
    left: 50%;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .9rem;
    border-radius: var(--re-radius-pill);
    background: var(--re-surface);
    color: var(--re-ink-500);
    font-size: .85rem;
    box-shadow: var(--re-shadow);
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.srch-map-placeholder[hidden] {
    display: none;
}

.srch-map-list {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(70vh, 640px);
    border-left: 1px solid var(--re-ink-200);
    background: var(--re-surface);
}

.srch-map-list-title {
    flex: 0 0 auto;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--re-ink-200);
    color: var(--re-ink-500);
    font-size: .8rem;
    font-weight: 600;
}

.srch-map-items {
    flex: 1 1 auto;
    margin: 0;
    padding: .5rem;
    overflow-y: auto;
    list-style: none;
}

.srch-map-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .5rem;
    border-radius: 10px;
    color: var(--re-ink);
    transition: background-color var(--re-dur) var(--re-ease);
}

.srch-map-item:hover {
    background: var(--re-primary-50);
    color: var(--re-ink);
    text-decoration: none;
}

.srch-map-item-img {
    flex: 0 0 auto;
    width: 72px;
    height: 54px;
    border-radius: 8px;
    object-fit: cover;
    background: var(--re-ink-100);
}

.srch-map-item-text {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
}

.srch-map-item-name {
    overflow: hidden;
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.3;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.srch-map-item:hover .srch-map-item-name {
    color: var(--re-primary);
}

.srch-map-item-meta {
    overflow: hidden;
    color: var(--re-ink-500);
    font-size: .75rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.srch-map-item-side {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: flex-end;
    gap: .25rem;
}

.srch-map-item-side .re-rating {
    min-width: 34px;
    height: 28px;
    font-size: .85rem;
}

.srch-map-item-price {
    font-family: var(--re-font-heading);
    font-size: .95rem;
    font-weight: 800;
    white-space: nowrap;
}

.srch-map-empty {
    padding: 1rem;
    color: var(--re-ink-500);
}

/* 6. Results header, chips, toolbar
   ========================================================================== */
.srch-head {
    margin-bottom: 12px;
}

.srch-title {
    margin: 0 0 .35rem;
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.srch-sub {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem 1rem;
    margin: 0;
    color: var(--re-ink-500);
    font-size: .875rem;
}

.srch-sub-item {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

.srch-sub-item .bi {
    color: var(--re-primary);
    font-size: .95rem;
}

.srch-sub-item--q {
    color: var(--re-ink-700);
    font-weight: 600;
}

.srch-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

.srch-chips-label {
    margin-right: .25rem;
    color: var(--re-ink-500);
    font-size: .8rem;
    font-weight: 600;
}

.srch-chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 36px;
    padding: .35rem .6rem .35rem .8rem;
    border: 1px solid var(--re-primary-100);
    border-radius: var(--re-radius-pill);
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-size: .8125rem;
    font-weight: 600;
    line-height: 1.2;
    transition: background-color var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease);
}

.srch-chip .bi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: var(--re-radius-pill);
    font-size: .7rem;
    transition: background-color var(--re-dur) var(--re-ease);
}

.srch-chip:hover {
    border-color: var(--re-primary);
    background: var(--re-surface);
    color: var(--re-primary);
    text-decoration: none;
}

.srch-chip:hover .bi {
    background: var(--re-primary);
    color: #fff;
}

.srch-chips-reset {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 36px;
    padding: .35rem .5rem;
    border-radius: 8px;
    font-size: .8125rem;
    font-weight: 600;
    transition: background-color var(--re-dur) var(--re-ease);
}

.srch-chips-reset:hover {
    background: var(--re-primary-50);
    text-decoration: none;
}

.srch-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem 1rem;
    min-height: 44px;
    margin-bottom: 12px;
    padding: 6px 0;
    border-top: 1px solid var(--re-ink-200);
    border-bottom: 1px solid var(--re-ink-200);
}

.srch-showing {
    margin: 0;
    color: var(--re-ink-700);
    font-size: .875rem;
    font-weight: 500;
}

.srch-sort {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-left: auto;
}

.srch-sort-label {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin: 0;
    color: var(--re-ink-700);
    font-size: .8125rem;
    font-weight: 600;
    white-space: nowrap;
}

.srch-sort-label .bi {
    color: var(--re-primary);
}

.srch-sort-select {
    width: auto;
    min-width: 200px;
    min-height: 38px;
    padding-block: .35rem;
    border-color: var(--re-ink-200);
    font-size: .875rem;
    font-weight: 600;
}

/* 7. Results list, promo, loading, empty
   ========================================================================== */
.srch-results {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 200px;
}

.srch-results .re-pcard--list {
    grid-template-columns: 260px minmax(0, 1fr) 210px;
}

.srch-promo {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: .9rem 1.1rem;
    border: 1px solid #C9E6D2;
    border-radius: var(--re-radius);
    background: var(--re-success-100);
    color: var(--re-ink);
}

.srch-promo-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: var(--re-radius-pill);
    background: #fff;
    color: var(--re-success);
    font-size: 1.3rem;
}

.srch-promo-text {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
    font-size: .875rem;
}

.srch-promo-text strong {
    color: var(--re-success-ink);
}

.srch-promo-btn {
    flex: 0 0 auto;
    border-color: var(--re-success);
    color: var(--re-success-ink);
}

.srch-promo-btn:hover {
    background: #fff;
    color: var(--re-success-ink);
}

.srch-loading {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: none;
    align-items: flex-start;
    justify-content: center;
    padding-top: 96px;
    border-radius: var(--re-radius);
    background: rgba(248, 246, 243, .6);
    backdrop-filter: blur(1px);
}

.srch-results.is-loading .srch-loading {
    display: flex;
}

.srch-results.is-loading > .re-pcard,
.srch-results.is-loading > .srch-promo,
.srch-results.is-loading > .srch-empty {
    opacity: .55;
    pointer-events: none;
}

.srch-loading-box {
    position: sticky;
    top: calc(var(--re-header-total) + 24px);
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    padding: .7rem 1.1rem;
    border-radius: var(--re-radius-pill);
    background: var(--re-surface);
    color: var(--re-ink-700);
    font-size: .9rem;
    font-weight: 600;
    box-shadow: var(--re-shadow-lg);
}

.srch-loading-box .spinner-border {
    width: 1.1rem;
    height: 1.1rem;
    color: var(--re-primary);
    border-width: 2px;
}

.srch-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 24px;
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius-lg);
    background: var(--re-surface);
    text-align: center;
}

.srch-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    margin-bottom: 1rem;
    border-radius: 22px;
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-size: 2rem;
}

.srch-empty-title {
    margin: 0 0 .5rem;
    font-size: 1.35rem;
    font-weight: 800;
}

.srch-empty-text {
    max-width: 48ch;
    margin: 0 0 1.25rem;
    color: var(--re-ink-500);
}

.srch-empty-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem;
}

.srch-empty-help {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin: 1.25rem 0 0;
    padding: .55rem .95rem;
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius-pill);
    background: var(--re-bg);
    color: var(--re-ink-700);
    font-size: .875rem;
}

.srch-empty-help .bi {
    color: var(--re-primary);
}

.srch-empty-help a {
    font-weight: 700;
    white-space: nowrap;
}

.srch-empty-zones {
    width: 100%;
    max-width: 640px;
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--re-ink-200);
}

.srch-empty-zones-title {
    display: block;
    margin-bottom: .75rem;
    color: var(--re-ink-500);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.srch-empty-zones-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem;
}

.srch-empty-zones-list .re-chip .bi {
    color: var(--re-primary);
}

.srch-empty-zone-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 .35rem;
    border-radius: var(--re-radius-pill);
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-size: .72rem;
    font-weight: 700;
}

/* 8. Pagination
   ========================================================================== */
.srch-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem 1rem;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--re-ink-200);
}

.srch-pagination-info {
    margin: 0;
    color: var(--re-ink-500);
    font-size: .875rem;
}

.srch-pagination .pagination {
    flex-wrap: wrap;
}

.srch-pagination .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: .4rem .75rem;
    background: var(--re-surface);
}

.srch-pagination .page-item.active .page-link {
    border-color: var(--re-primary);
    background: var(--re-primary);
    color: #fff;
    box-shadow: 0 2px 8px rgba(140, 16, 36, .22);
}

.srch-page-arrow {
    gap: .35rem;
}

.srch-page-arrow .bi {
    font-size: .8rem;
}

.srch-page-gap .page-link {
    border-color: transparent;
    background: transparent;
    color: var(--re-ink-500);
}

/* 9. Mobile sticky bar
   ========================================================================== */
.srch-mobilebar {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1025;
    display: flex;
    gap: .5rem;
    padding: .55rem 1rem calc(.55rem + env(safe-area-inset-bottom));
    border-top: 1px solid var(--re-ink-200);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 -8px 24px rgba(38, 38, 43, .1);
    backdrop-filter: blur(8px);
}

.srch-mobilebar-btn {
    flex: 1 1 0;
    min-width: 0;
    min-height: 48px;
    padding: .45rem .7rem;
    font-size: .875rem;
    white-space: normal;
    line-height: 1.15;
}

/* The filters button carries the count badge: give it a little more room */
.srch-mobilebar-btn.btn-re-primary {
    flex-grow: 1.3;
}

.srch-mobilebar-btn > span:not(.srch-mobilebar-count) {
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 399.98px) {
    .srch-mobilebar-btn {
        gap: .4rem;
        padding-inline: .55rem;
        font-size: .8125rem;
    }
}

.srch-mobilebar-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 22px;
    height: 22px;
    padding: 0 .4rem;
    border-radius: var(--re-radius-pill);
    background: var(--re-accent);
    color: var(--re-ink);
    font-size: .72rem;
    font-weight: 800;
}

.srch-mobilebar-count[hidden] {
    display: none;
}

/* 10. Responsive
   ========================================================================== */
@media (min-width: 992px) {
    /* .offcanvas-lg turns the aside into flow content: make the body a plain block */
    .srch-sidebar .offcanvas-body {
        display: block;
        overflow: visible;
    }
}

@media (max-width: 1199.98px) {
    .srch-layout {
        grid-template-columns: 250px minmax(0, 1fr);
        gap: 20px;
    }

    .srch-results .re-pcard--list {
        grid-template-columns: 220px minmax(0, 1fr) 190px;
    }

    .srch-sort-select {
        min-width: 170px;
    }
}

@media (max-width: 991.98px) {
    body.page-search {
        padding-bottom: calc(64px + env(safe-area-inset-bottom));
    }

    .srch-band {
        padding: 12px 0 14px;
    }

    .srch-searchbox.is-collapsed .srch-searchbox-form {
        display: none;
    }

    .srch-searchbox-form {
        margin-top: 10px;
    }

    .srch-breadcrumb {
        padding-top: 10px;
    }

    .srch-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        padding-top: 8px;
        padding-bottom: 32px;
    }

    .srch-sidebar-body {
        padding: 0;
        background: var(--re-bg);
    }

    .srch-filters {
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .srch-fs {
        padding-inline: 1rem;
    }

    .srch-results .re-pcard--list {
        grid-template-columns: minmax(0, 1fr);
    }

    .srch-map-body {
        grid-template-columns: minmax(0, 1fr);
    }

    .srch-map-frame {
        min-height: 46vh;
    }

    .srch-map-list {
        max-height: none;
        border-left: 0;
        border-top: 1px solid var(--re-ink-200);
    }

    .srch-map-items {
        max-height: 34vh;
    }
}

@media (max-width: 767.98px) {
    .srch-title {
        font-size: 1.25rem;
    }

    .srch-sub {
        font-size: .8125rem;
        gap: .25rem .75rem;
    }

    .srch-toolbar {
        min-height: 0;
        padding: 8px 0;
    }

    .srch-promo {
        flex-wrap: wrap;
    }

    .srch-promo-btn {
        width: 100%;
    }

    .srch-page-arrow-text {
        display: none;
    }

    .srch-pagination {
        justify-content: center;
    }

    .srch-pagination-info {
        width: 100%;
        text-align: center;
    }

    .srch-empty {
        padding: 36px 16px;
    }

    .srch-map-modal .modal-content {
        border-radius: 0;
    }
}

@media (max-width: 575.98px) {
    .srch-chips {
        gap: 6px;
    }

    .srch-chips-label {
        width: 100%;
    }

    .srch-searchbox-edit span {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .srch-range-input::-webkit-slider-thumb,
    .srch-fs-toggle .bi {
        transition: none;
    }
}

@media print {
    .srch-band,
    .srch-sidebar,
    .srch-mobilebar,
    .srch-toolbar,
    .srch-loading,
    .srch-pagination .pagination {
        display: none !important;
    }

    .srch-layout {
        grid-template-columns: minmax(0, 1fr);
    }
}