/*
 * Listing cards: the few rules the reference stylesheet (home.css, generated
 * by tools/scope-css.py) does not have. Hand-written; regenerating home.css
 * leaves this file alone.
 */
.lh .no-photo{display:grid;place-items:center;height:100%;width:100%;background:linear-gradient(135deg,#eef2f8,#e2e9f3);color:#9aa8bd}
.lh .no-photo .ic{width:34px;height:34px;stroke-width:1.2}
.lh .dock-thumb .no-photo{border-radius:5px}
.lh .dock-thumb .no-photo .ic{width:16px;height:16px}
.lh .comparison-table th .no-photo{height:70px;border-radius:8px;margin-bottom:8px}
.lh a.property-freshness{color:#8a94a3}
.lh a.property-freshness:hover{color:var(--blue)}
.lh .listing-toolbar .text-btn.active{color:var(--navy);font-weight:700}
.lh .listing-toolbar .text-btn:disabled{opacity:.6;cursor:progress}
.lh .btn:disabled{opacity:.5;cursor:not-allowed}
@media(min-width:701px){.lh .compare-dock:not([hidden])~.toast{bottom:104px}}

/* The map (assets/map.js). The pins are Leaflet markers that hold a .map-price button; Leaflet's own stylesheet is loaded on scroll. */
.lh .map-sidebar{display:flex;flex-direction:column;min-width:0}
.lh .map-count{font-size:11px;line-height:1.6;color:var(--muted);margin:10px 0 16px}
.lh #mapProperty{min-width:0}
.lh #mapProperty .property-card:hover{transform:none;box-shadow:none}
.lh .map-sidebar .map-results{margin-top:auto;padding-top:17px}
.lh .map-status{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:24px;text-align:center;font-size:12px;color:var(--muted)}
/* a fixed height, so choosing a shorter card does not make the map jump */
.lh .map-workspace{min-height:600px}
.lh .map-canvas{min-height:600px}
.lh .map-canvas.leaflet-container{font:inherit;z-index:0}
.lh .lh-pin-icon{background:none;border:0}
.lh .lh-pin{position:absolute;left:0;top:0;display:block;transform:translate(-50%,calc(-100% - 7px))}
.lh .lh-pin .map-price{position:relative;font-size:11px;padding:7px 10px;line-height:1.2}
.lh .lh-pin .map-price em{display:none}
.lh .lh-pin .map-price.active em{display:block}
.lh .map-canvas .leaflet-control-attribution a{color:#0078a8}
@media(max-width:700px){
	.lh .map-workspace{min-height:0}
	.lh .map-canvas{min-height:340px}
	.lh .map-sidebar .map-results{margin-top:15px}
	.lh .lh-pin .map-price{font-size:10px;padding:6px 8px}
}

/* Cards in a row line up: the card is a column, the body takes the free height,
   and the View details / Compare row is pushed to the bottom of every card. */
.lh .property-card { display: flex; flex-direction: column; }
.lh .property-card > .property-image { flex: none; }
.lh .property-body { flex: 1; display: flex; flex-direction: column; }
.lh .property-footer { margin-top: auto; }

/* The map's tools (assets/map.js): "Search this area", the search box, Near me, and stepping through a building's homes. */
.lh .lh-map-here{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:1000;background:#fff;color:var(--navy);border:1px solid #d9e2ef;border-radius:999px;padding:9px 16px;font-size:13px;font-weight:600;box-shadow:0 4px 14px #10274722;cursor:pointer;white-space:nowrap}
.lh .lh-map-here:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.lh .lh-map-here[hidden]{display:none}
.lh .lh-map-tools{display:flex;gap:8px;align-items:flex-start}
.lh .lh-map-find{position:relative;margin:0}
.lh .lh-map-find input{width:220px;height:38px;border:1px solid #d9e2ef;border-radius:8px;padding:0 12px;font:inherit;font-size:13px;background:#fff;box-shadow:0 2px 10px #10274714}
.lh .lh-map-find input:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
.lh .lh-map-find ul{position:absolute;top:42px;right:0;width:280px;max-height:320px;overflow:auto;margin:0;padding:4px;list-style:none;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 10px 30px #1027472a}
.lh .lh-map-find ul[hidden]{display:none}
.lh .lh-map-find li{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:7px;cursor:pointer;font-size:13px;color:var(--navy)}
.lh .lh-map-find li span{font-size:11px;color:#8a96a7}
.lh .lh-map-find li:hover,.lh .lh-map-find li:focus{background:#eef4ff;outline:none}
.lh .lh-map-find .lh-map-find-none{cursor:default;color:#8a96a7}
.lh .lh-map-find .lh-map-find-none:hover{background:none}
.lh .lh-map-near{height:38px;padding:0 12px;border:1px solid #d9e2ef;border-radius:8px;background:#fff;color:var(--navy);font:inherit;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 2px 10px #10274714}
.lh .lh-map-near:hover{border-color:var(--blue);color:var(--blue)}
.lh .lh-map-near[disabled]{opacity:.6;cursor:wait}
.lh .lh-map-step{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px;font-size:12px;color:#586a83}
.lh .lh-map-step button{width:30px;height:30px;border:1px solid #d9e2ef;border-radius:50%;background:#fff;font-size:18px;line-height:1;color:var(--navy);cursor:pointer}
.lh .lh-map-step button:hover{border-color:var(--blue);color:var(--blue)}
.lh .lh-map-loading{font-size:13px;color:#8a96a7;padding:20px 0}
@media (max-width:767px){
	.lh .lh-map-tools{flex-direction:column;align-items:flex-end}
	.lh .lh-map-find input{width:170px}
	.lh .lh-map-find ul{width:230px}
	.lh .lh-map-here{top:auto;bottom:14px}
}
/* The map's For Sale / For Rent / New Project / Room / Auction buttons. */
.lh .lh-map-kinds{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 14px}
.lh .lh-map-kinds button{border:1px solid #d9e2ef;background:#fff;color:#4a5d78;border-radius:999px;padding:6px 11px;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.lh .lh-map-kinds button:hover{border-color:var(--blue);color:var(--blue)}
.lh .lh-map-kinds button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
/* The comparison opens wide: four homes across without a sideways scroll on desktop and tablet. */
.lh .modal-card.wide{max-width:min(1120px,calc(100vw - 40px))}
.lh .modal-card.wide .comparison-table{font-size:13px}
.lh .modal-card.wide .comparison-table img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
/* New projects as slides (templates/sections/projects.php, assets/sections.js): the first slide keeps
   the section's height (the theme's responsive heights stay in charge), the others sit on top of it. */
.lh .launch-slides{position:relative;min-width:0}
.lh .launch-slides>.launch-feature{display:block;opacity:0;visibility:hidden;transition:opacity .6s,visibility 0s .6s}
.lh .launch-slides>.launch-feature+.launch-feature{position:absolute;inset:0}
.lh .launch-slides>.launch-feature.is-active{opacity:1;visibility:visible;transition:opacity .6s,visibility 0s}
.lh .launch-dots{position:absolute;top:23px;right:25px;z-index:2;display:flex;gap:6px}
.lh .launch-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#ffffff80;cursor:pointer}
.lh .launch-dots button[aria-current="true"]{background:#fff;width:20px;border-radius:4px}
.lh .launch-dots button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (prefers-reduced-motion:reduce){.lh .launch-slides>.launch-feature{transition:none}}
/* The compare sample (templates/sections/compare.php): a photo across the column and the title on up to
   three lines, so long listing names neither shrink the photo nor run out of their column. The first row
   is the same height in every column, so the figures below still line up. */
.lh .compare-col{grid-template-rows:196px repeat(4,40px)}
.lh .mini-property{justify-content:flex-start;gap:8px;padding:2px 0 12px;min-width:0}
.lh .mini-property img,.lh .mini-property .no-photo{width:100%;height:104px;border-radius:8px;object-fit:cover;flex:none}
.lh .mini-property b{font-size:12px;line-height:1.35;font-weight:600;white-space:normal;text-align:center;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-width:100%}
.lh .mini-property small{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.lh .compare-col:not(:first-child){min-width:0}
@media (max-width:1100px){
	.lh .compare-col{grid-template-rows:178px repeat(4,36px)}
	.lh .mini-property img,.lh .mini-property .no-photo{height:88px}
	.lh .mini-property b{font-size:11px}
}
@media (max-width:767px){
	.lh .compare-col{grid-template-rows:166px repeat(4,34px)}
	.lh .mini-property img,.lh .mini-property .no-photo{height:76px}
	.lh .mini-property b{font-size:10px}
}
/* the compare dialog's Print (listin-print, signed-in members): above the table, on the right */
.lh .compare-actions{display:flex;justify-content:flex-end;margin:-4px 0 14px}
.lh .compare-actions .compare-print{min-height:38px;padding:9px 16px;font-size:13px}
/* 1.12.1: the facts line (beds · baths · car parks · built-up · land) wraps instead of running out of the card */
.lh .property-specs{flex-wrap:wrap;row-gap:7px}
/* 1.12.1: the chip row: Near MRT / LRT, tenure, then the listing's labels; 3 shown on a grid card, 4 on a list card,
   the rest stay in the markup (the layout switch only toggles .is-list) */
.lh .property-card .property-reasons>span:nth-child(n+4){display:none}
.lh .property-card.is-list .property-reasons>span:nth-child(4){display:flex}
.lh .property-reasons span.is-label{background:#eef3fb;color:#3f5f8c}