/*
 * Listing page v2 — same ink / yellow / canvas language as index-v2.css
 * and property-detail-v2/property-v2.css. Scope: everything here is
 * namespaced under body.cr-properties-v2, loaded only by properties.php.
 * The query/filter/pagination/cache logic and every shared include
 * (menu.php, footer.php, ...) live in properties.php/perpage.php/helpers,
 * untouched by this file. Several rules need !important because the
 * legacy card/pagination markup carries its own inline border-radius/
 * box-shadow/color, which otherwise wins regardless of selector
 * specificity.
 *
 * Bump the ?v= query param on this file's <link> in properties.php on
 * every edit — Cloudflare and browsers both cache this aggressively, and
 * without a version bump a fix can sit invisible in caches for up to 48h
 * (this bit us once already; see the 2026-08-17 incident notes).
 */

/*
 * assets/css/style.css sets html,body{overflow-x:hidden} with no
 * overflow-y. Per spec, a non-"visible" overflow-x forces the other axis
 * to compute as "auto" too — that's a used-value rule, not something a
 * later/!important overflow-y declaration on the SAME element can undo.
 * html and body both end up independently scrollable at once (root cause
 * of the double-scrollbar / scroll-not-registering reports). Real fix:
 * body doesn't need its own overflow-x:hidden — html clipping horizontal
 * overflow is enough — so give body a plain, non-conflicting
 * overflow:visible instead and let only html do the (correct, singular)
 * root scrolling. Inlined because style.css has no cache-busting query
 * param and is stuck in browsers' 48h HTTP cache; this page's own HTML is
 * never cached. Safe to remove once style.css's fix has fully rolled out.
 */
body { overflow: visible !important; }

/*
 * Listing page v2 (draft) — same ink / yellow / canvas language as
 * index-v2.css and property-detail-v2/property-v2.css.
 *
 * Inlined (rather than a linked /assets/css file) because this account
 * does not have write access to assets/css/ on this server (owned by a
 * different deploy user) — inlining avoids needing that permission at
 * all. Scope: everything here is namespaced under body.cr-properties-v2,
 * loaded only by this draft file. The real properties.php, its filter/
 * pagination/cache logic and every shared include (menu.php, footer.php,
 * ...) are untouched. Several rules need !important because the legacy
 * card/pagination markup carries its own inline border-radius/box-shadow/
 * color, which otherwise wins regardless of selector specificity.
 */

.cr-properties-v2 {
    --cr-ink: #171717;
    --cr-muted: #676760;
    --cr-line: #e4e2da;
    --cr-paper: #ffffff;
    --cr-canvas: #f6f5f0;
    --cr-yellow: #f5c400;
    --cr-yellow-soft: #fff7cf;
    --cr-green: #157a55;
    --cr-radius: 18px;
    --cr-shadow: 0 14px 40px rgba(28, 27, 22, 0.08);
    --cr-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

body.cr-properties-v2 {
    background: var(--cr-canvas);
    color: var(--cr-ink);
    font-family: var(--cr-font-sans);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.cr-properties-v2 button,
body.cr-properties-v2 input,
body.cr-properties-v2 select,
body.cr-properties-v2 textarea,
body.cr-properties-v2 .btn,
body.cr-properties-v2 .form-control {
    font-family: var(--cr-font-sans) !important;
}

.cr-properties-v2 a:focus-visible,
.cr-properties-v2 button:focus-visible,
.cr-properties-v2 input:focus-visible,
.cr-properties-v2 select:focus-visible,
.cr-properties-v2 summary:focus-visible {
    outline: 3px solid var(--cr-yellow) !important;
    outline-offset: 3px !important;
}

.cr-properties-v2 .sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.cr-p2-hero {
    background:
        radial-gradient(circle at 92% 0%, rgba(245, 196, 0, 0.24), transparent 40%),
        var(--cr-ink);
    border-radius: 0 0 28px 28px;
    color: #fff;
    margin-bottom: 22px;
    overflow: hidden;
    padding: 20px 0 34px;
    position: relative;
}

.cr-p2-hero::after {
    background: var(--cr-yellow);
    bottom: 0;
    content: "";
    height: 5px;
    left: 0;
    position: absolute;
    width: 30%;
}

.cr-p2-shell {
    margin: 0 auto;
    max-width: 1200px;
    padding: 0 15px;
}

.cr-p2-crumb {
    color: rgba(255, 255, 255, 0.55);
    font-size: 12.5px;
    font-weight: 600;
    margin-bottom: 12px;
}

.cr-p2-crumb ol {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.cr-p2-crumb li {
    align-items: center;
    display: inline-flex;
}

.cr-p2-crumb li + li::before {
    color: rgba(255, 255, 255, 0.36);
    content: "/";
    margin: 0 7px 0 3px;
}

.cr-p2-crumb li[aria-current="page"] {
    color: rgba(255, 255, 255, 0.86);
}

.cr-p2-crumb a {
    color: rgba(255, 255, 255, 0.55);
}

.cr-p2-crumb a:hover {
    color: #fff;
}

.cr-p2-crumb span {
    margin: 0 6px;
    opacity: 0.5;
}

.cr-p2-hero-head {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 24px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.cr-p2-kicker {
    color: var(--cr-yellow);
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.cr-p2-hero-head h1 {
    color: #fff;
    font-size: clamp(21px, 2.4vw, 28px);
    font-weight: 750;
    letter-spacing: -0.02em;
    line-height: 1.15;
    margin: 0;
    text-transform: none;
    max-width: 760px;
}

.cr-p2-search {
    background: #fff;
    border-radius: var(--cr-radius);
    box-shadow: var(--cr-shadow);
    color: var(--cr-ink);
    padding: 16px;
}

.cr-p2-search-row {
    display: grid;
    gap: 10px;
    grid-template-columns: 1.4fr 1fr 1fr auto;
}

.cr-p2-field label {
    color: var(--cr-muted);
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.cr-p2-search input[type="text"],
.cr-p2-search select {
    background: var(--cr-canvas) !important;
    border: 1px solid var(--cr-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    color: var(--cr-ink) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    height: 42px !important;
    padding: 0 12px !important;
    width: 100%;
}

.cr-p2-adv-grid .cr-p2-field input[type="text"] {
    height: 38px !important;
    font-size: 13px !important;
}

.cr-p2-submit {
    align-self: end;
}

.cr-p2-search .cr-p2-submit-btn {
    align-items: center;
    appearance: none;
    background: var(--cr-yellow) !important;
    border: 0 !important;
    border-radius: 10px !important;
    color: var(--cr-ink) !important;
    display: inline-flex;
    font-size: 14.5px !important;
    font-weight: 800 !important;
    height: 42px !important;
    justify-content: center;
    line-height: 1 !important;
    min-width: 112px;
    padding: 0 22px !important;
    text-align: center;
    -webkit-appearance: none;
    white-space: nowrap;
    width: auto !important;
}

.cr-p2-search .cr-p2-submit-btn:hover {
    filter: brightness(0.96);
}

.cr-p2-adv {
    border-top: 1px dashed var(--cr-line);
    margin-top: 10px;
    padding-top: 10px;
}

.cr-p2-adv > summary {
    color: var(--cr-muted);
    cursor: pointer;
    font-size: 12.5px;
    font-weight: 700;
    list-style: none;
    padding: 4px 2px;
}

.cr-p2-adv > summary::-webkit-details-marker {
    display: none;
}

.cr-p2-adv > summary::before {
    content: "\25B8\0020";
}

.cr-p2-adv[open] > summary::before {
    content: "\25BE\0020";
}

.cr-p2-adv-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    margin-top: 10px;
}

.cr-p2-adv-chip-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 12px;
}

.cr-p2-check {
    align-items: center;
    color: var(--cr-ink);
    display: flex;
    font-size: 13px;
    font-weight: 600;
    gap: 6px;
}

.cr-p2-check input {
    accent-color: var(--cr-ink);
    height: 15px;
    width: 15px;
}

.cr-p2-apply-btn {
    background: var(--cr-ink);
    border: 0;
    border-radius: 10px;
    color: #fff;
    font-size: 13.5px;
    font-weight: 800;
    margin-top: 14px;
    min-height: 42px;
    padding: 10px 20px;
}

.cr-p2-active-filters {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 12px;
}

.cr-p2-active-filters a {
    align-items: center;
    background: var(--cr-yellow-soft);
    border: 1px solid #ead76e;
    border-radius: 999px;
    color: var(--cr-ink);
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 6px;
    padding: 6px 10px;
    text-decoration: none;
}

.cr-p2-active-filters a:hover {
    border-color: var(--cr-ink);
    color: var(--cr-ink);
}

.cr-p2-active-filters .cr-p2-clear-filters {
    background: transparent;
    border-color: transparent;
    text-decoration: underline;
    text-underline-offset: 3px;
}

@media (max-width: 900px) {
    .cr-p2-search-row {
        grid-template-columns: 1fr 1fr;
    }
    .cr-p2-submit {
        grid-column: 1 / -1;
    }
    .cr-p2-search .cr-p2-submit-btn {
        width: 100% !important;
    }
    .cr-p2-adv-grid {
        grid-template-columns: 1fr 1fr;
    }
}

.cr-p2-results-controls {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.cr-p2-sort-group {
    display: flex;
    gap: 8px;
}

.cr-p2-sort-pill {
    align-items: center;
    background: var(--cr-paper);
    border: 1px solid var(--cr-line);
    border-radius: 999px;
    color: var(--cr-muted);
    display: inline-flex;
    font-size: 12.5px;
    font-weight: 700;
    gap: 6px;
    padding: 7px 14px;
    text-decoration: none;
}

.cr-p2-sort-pill:hover {
    border-color: var(--cr-ink);
    color: var(--cr-ink);
}

.cr-p2-sort-pill.is-active {
    background: var(--cr-ink);
    border-color: var(--cr-ink);
    color: #fff;
}

.cr-p2-perpage-select {
    appearance: none;
    background: var(--cr-paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%231c1b16' stroke-width='1.4' fill='none' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;
    border: 1px solid var(--cr-line);
    border-radius: 999px;
    color: var(--cr-ink);
    font-size: 12.5px;
    font-weight: 700;
    padding: 7px 30px 7px 14px;
}

.cr-p2-perpage-select option {
    color: var(--cr-ink);
}

.cr-properties-v2 .properties-area {
    background: var(--cr-canvas) !important;
    padding-bottom: 40px;
}

.cr-p2-results-head h2 {
    color: var(--cr-ink);
    font-size: clamp(20px, 2vw, 24px);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.2;
    margin: 0;
    text-transform: none;
}

.cr-p2-results-head {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin: 0 0 16px;
}

.cr-properties-v2 #list-type.proerty-th,
.cr-properties-v2 #list-type.proerty-th-list {
    display: flex !important;
    flex-direction: column;
    gap: 16px;
    margin: 0 !important;
}

.cr-properties-v2 #list-type > div[class*="col-"] {
    float: none !important;
    padding: 0 !important;
    width: 100% !important;
}

.cr-properties-v2 .box-two.proerty-item {
    background: var(--cr-paper) !important;
    border-radius: var(--cr-radius) !important;
    box-shadow: 0 8px 24px rgba(28, 27, 22, 0.07) !important;
    display: flex;
    flex-direction: row;
    min-height: 232px;
    overflow: hidden;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.cr-properties-v2 .box-two.proerty-item:hover {
    box-shadow: var(--cr-shadow) !important;
    transform: translateY(-3px);
}

.cr-properties-v2 .box-two.proerty-item.is-featured {
    border-top: 3px solid var(--cr-yellow) !important;
}

.cr-properties-v2 .item-thumb {
    /* legacy .proerty-th-list CSS already floats this to a fixed width for
       a row layout — keep that idea, just take over the exact width/height
       ourselves instead of fighting it. */
    box-shadow: none !important;
    flex: 0 0 300px;
    float: none !important;
    min-height: 232px;
    position: relative;
    width: 300px !important;
}

.cr-properties-v2 .item-thumb img {
    display: block !important;
    height: 100% !important;
    inset: 0;
    max-height: none !important;
    min-height: 0 !important;
    object-fit: cover;
    opacity: 1 !important;
    padding-right: 0 !important;
    position: absolute;
    width: 100% !important;
}

.cr-properties-v2 .item-thumb > a {
    display: block;
    height: 100%;
}

.cr-properties-v2 .box-two.proerty-item:hover .item-thumb img {
    opacity: 1 !important;
}

.cr-properties-v2 .duplicate-agency-badge {
    bottom: 10px;
    left: auto !important;
    max-width: calc(100% - 20px);
    right: 10px !important;
    top: auto !important;
    width: max-content;
}

.cr-p2-top-badge {
    align-items: center;
    background: var(--cr-yellow);
    border-radius: 999px;
    color: var(--cr-ink);
    display: inline-flex;
    font-size: 11px;
    font-weight: 850;
    gap: 6px;
    left: 10px;
    letter-spacing: 0.03em;
    padding: 7px 10px;
    position: absolute;
    text-transform: uppercase;
    top: 10px;
    z-index: 3;
}

.cr-properties-v2 .item-entry {
    display: flex;
    flex: 1;
    flex-direction: column;
    float: none !important;
    min-width: 0;
    overflow: visible;
    padding: 16px 20px !important;
    width: auto !important;
}

@media (max-width: 640px) {
    .cr-properties-v2 .box-two.proerty-item {
        flex-direction: column;
        height: auto;
    }
    .cr-properties-v2 .item-thumb {
        aspect-ratio: 16 / 9;
        flex: none;
        min-height: 0;
        width: 100% !important;
    }
    .cr-properties-v2 .item-thumb img {
        height: 100% !important;
    }
    .cr-properties-v2 .item-entry {
        height: auto;
    }
}

.cr-properties-v2 .cr-p2-card-title {
    font-size: 15px;
    line-height: 1.35;
    margin: 0;
    min-height: 40px;
    text-transform: none;
}

.cr-properties-v2 .cr-p2-card-title a {
    color: var(--cr-ink) !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    display: -webkit-box;
    overflow: hidden;
    text-transform: none !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.cr-properties-v2 .dot-hr {
    display: none;
}

.cr-properties-v2 .item-entry .proerty-price {
    color: var(--cr-ink) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    margin-top: 4px;
}

.cr-properties-v2 .item-entry > span.pull-left {
    color: var(--cr-muted) !important;
    font-weight: 600 !important;
    margin-top: 6px;
}

.cr-properties-v2 .item-entry > span.pull-left strong {
    color: var(--cr-ink) !important;
}

.cr-properties-v2 .cr-p2-location {
    align-items: center;
    color: var(--cr-muted);
    display: inline-flex;
    font-size: 13px;
    gap: 6px;
    margin-top: 7px;
    text-decoration: none;
    width: max-content;
}

.cr-properties-v2 .cr-p2-location:hover,
.cr-properties-v2 .cr-p2-location:hover strong {
    color: var(--cr-ink);
}

.cr-properties-v2 .item-entry::after {
    clear: both;
    content: "";
    display: block;
}

.cr-properties-v2 .property-icon {
    background: var(--cr-canvas) !important;
    border: 1px solid var(--cr-line) !important;
    margin-top: auto !important;
    margin-bottom: 0 !important;
}

.cr-properties-v2 .property-icon span[title] {
    background: var(--cr-paper) !important;
    border-color: var(--cr-line) !important;
}

.cr-properties-v2 .pagination {
    background: none !important;
    box-shadow: none !important;
    display: flex;
    justify-content: center;
    margin: 30px 0 0 !important;
    width: 100%;
}

.cr-properties-v2 .pagination ul {
    display: flex;
    gap: 6px;
    list-style: none;
    margin: 0 !important;
    padding: 0 !important;
}

.cr-properties-v2 .pagination ul li a,
.cr-properties-v2 .pagination ul li span {
    align-items: center;
    background: var(--cr-paper);
    border: 1px solid var(--cr-line);
    border-radius: 10px;
    color: var(--cr-ink);
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    height: 36px;
    justify-content: center;
    min-width: 36px;
    padding: 0 8px;
    text-decoration: none;
}

.cr-properties-v2 .pagination ul li a:hover {
    border-color: var(--cr-ink);
}

.cr-properties-v2 .pagination ul li span {
    background: var(--cr-ink);
    border-color: var(--cr-ink);
    color: #fff;
}

.cr-properties-v2 .properties-load-more-wrap {
    display: flex;
    justify-content: center;
    margin-top: 16px;
}

.cr-properties-v2 #properties-load-more-btn {
    background: #fff !important;
    border: 1px solid var(--cr-line) !important;
    border-radius: 10px !important;
    color: var(--cr-ink) !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    padding: 11px 22px !important;
}

.cr-properties-v2 #properties-load-more-btn:hover {
    border-color: var(--cr-ink) !important;
}

/* Same layout-shift issue as the loader: this button toggles the native
   [hidden] attribute on every infinite-scroll cycle, popping its own
   height in/out of the page right where the user is scrolling. Reserve
   the space and toggle visibility instead. */
.cr-properties-v2 #properties-load-more-btn {
    display: inline-block !important;
    visibility: hidden;
}
.cr-properties-v2 #properties-load-more-btn:not([hidden]) {
    pointer-events: auto;
    visibility: visible;
}
.cr-properties-v2 #properties-load-more-btn[hidden] {
    pointer-events: none;
}

/* Diagnostics ruled out slow JS (parse+append+ads well under 10ms, no
   long tasks). What's left is scroll anchoring: positionInfiniteControls()
   moves the sentinel/loader/button (via insertBefore) right where the user
   is scrolling — that's the trigger point by definition — and the browser
   tries to compensate scroll position for DOM changes near the viewport.
   No JS error or slow task shows up because this happens at the compositor
   level, not on the main thread. Opt this whole region out of scroll
   anchoring so the browser never "corrects" the scroll position here. */
.cr-properties-v2 #list-type,
.cr-properties-v2 #properties-infinite-sentinel,
.cr-properties-v2 #properties-infinite-loader,
.cr-properties-v2 .properties-load-more-wrap,
.cr-properties-v2 .box-two.proerty-item {
    overflow-anchor: none;
}

.cr-properties-v2 .blog-asside-right .panel.panel-default {
    background: var(--cr-paper) !important;
    border: 0 !important;
    border-radius: var(--cr-radius) !important;
    box-shadow: 0 8px 24px rgba(28, 27, 22, 0.06) !important;
    margin-bottom: 16px;
    overflow: hidden;
}

.cr-properties-v2 .blog-asside-right .panel-heading {
    background: none !important;
    border: 0 !important;
    padding: 18px 18px 6px !important;
}

.cr-properties-v2 .blog-asside-right .panel-title {
    color: var(--cr-ink) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.cr-properties-v2 .blog-asside-right .panel-body {
    padding: 12px 18px 18px !important;
}

.cr-p2-side-group {
    margin-bottom: 14px;
}

.cr-p2-side-label {
    color: var(--cr-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.cr-p2-pill-group {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.cr-p2-pill {
    background: var(--cr-canvas) !important;
    border: 1px solid var(--cr-line);
    border-radius: 999px;
    color: var(--cr-ink) !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    padding: 6px 12px;
    text-decoration: none !important;
    text-transform: none !important;
}

.cr-p2-pill.is-active {
    background: var(--cr-ink) !important;
    border-color: var(--cr-ink);
    color: #fff !important;
}

.cr-p2-side-utility {
    border-top: 1px solid var(--cr-line);
    display: grid;
    gap: 0;
    margin-top: 16px;
    padding-top: 8px;
}

.cr-p2-side-utility a {
    align-items: center;
    color: var(--cr-ink);
    display: flex;
    font-size: 12.5px;
    font-weight: 750;
    justify-content: space-between;
    padding: 8px 0;
    text-decoration: none;
}

.cr-p2-side-utility a:hover {
    color: var(--cr-ink);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.cr-properties-v2 .search-widget input[type="text"] {
    background: var(--cr-canvas) !important;
    border: 1px solid var(--cr-line) !important;
    border-radius: 9px !important;
    box-shadow: none !important;
    color: var(--cr-ink) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    height: 38px !important;
}

/* Bootstrap's floated .col-xs-6 pair inside .search-widget .row breaks when
   one label wraps to 2 lines and its row sibling doesn't ("První řada u
   moře" vs "Garáž") — the next pair then only clears the shorter column and
   visibly jumps ("U moře" landing lower than "Výhled na moře"). Grid instead
   of floats sidesteps that entirely. */
.cr-properties-v2 .search-widget .row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 0 !important;
}

.cr-properties-v2 .search-widget .row::before,
.cr-properties-v2 .search-widget .row::after {
    content: none !important;
    display: none !important;
}

.cr-properties-v2 .search-widget .row > [class*="col-"] {
    float: none !important;
    padding: 0 !important;
    width: auto !important;
}

.cr-properties-v2 .search-widget .row > .col-xs-12 {
    grid-column: 1 / -1;
}

.cr-properties-v2 .search-widget .checkbox {
    margin: 0 !important;
}

.cr-properties-v2 .search-widget .checkbox label {
    color: var(--cr-ink) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
}

.cr-properties-v2 .search-widget .largesearch-btn {
    background: var(--cr-yellow) !important;
    border: 0 !important;
    border-radius: 10px !important;
    color: var(--cr-ink) !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    height: 40px !important;
    width: 100%;
}

.cr-properties-v2 .recent-property-widget h6 a {
    color: var(--cr-ink) !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.cr-properties-v2 .recent-property-widget .property-price {
    color: var(--cr-muted) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

@media (min-width: 992px) {
    .cr-properties-v2 .blog-asside-right {
        position: sticky;
        top: 18px;
    }
}

@media (max-width: 991px) {
    .cr-properties-v2 .properties-area > .container > .row > .col-md-9 {
        width: 100%;
    }
    .cr-properties-v2 .properties-area > .container > .row > .col-md-3 {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .cr-p2-hero {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
    .cr-p2-shell {
        padding-left: 0;
        padding-right: 0;
    }
    .cr-p2-search {
        margin: 0;
        padding: 13px;
    }
    .cr-p2-search-row {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
    .cr-p2-search-row > .cr-p2-field:first-child {
        grid-column: 1 / -1;
    }
    .cr-p2-search input[type="text"],
    .cr-p2-search select,
    .cr-p2-adv-grid .cr-p2-field input[type="text"],
    .cr-p2-search .cr-p2-submit-btn,
    .cr-p2-apply-btn {
        font-size: 16px !important;
        min-height: 44px !important;
    }
    .cr-p2-apply-btn {
        width: 100%;
    }
    .cr-p2-perpage-select {
        display: none;
    }
    .cr-p2-sort-group {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
    }
    .cr-p2-sort-pill {
        justify-content: center;
        min-height: 42px;
    }
    .cr-p2-results-head {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }
    .cr-p2-results-controls {
        justify-content: stretch;
        width: 100%;
    }
    .cr-properties-v2 .properties-area {
        padding-top: 0;
    }
    .cr-properties-v2 .properties-page {
        padding-top: 18px !important;
    }
    .cr-properties-v2 .item-entry {
        padding: 14px 15px !important;
    }
    .cr-properties-v2 .property-icon {
        margin-top: 12px !important;
    }
}

/* Infinite-scroll loader used display:none-on-toggle (the native [hidden]
   attribute), so its ~27px (padding + bar) popped in and out of the layout
   right where the user was scrolling to trigger it — every auto page-load
   caused a real layout shift, which reads as the scroll "catching" and
   needing a second attempt. Reserve the space permanently and toggle
   visibility instead, so appearing/disappearing never moves content. */
.cr-properties-v2 #properties-infinite-loader {
    display: block !important;
    visibility: hidden;
}
.cr-properties-v2 #properties-infinite-loader:not([hidden]) {
    visibility: visible;
}