/* The Live Dubai Map, simple version. Light, map-app look: white panels, grey text, one accent. */
:root{--lm-bg:#E5E3DF;--lm-panel:#FFFFFF;--lm-line:#DADCE0;--lm-ink:#202124;--lm-mute:#5F6368;--lm-faint:#80868B;--lm-blue:#1A73E8;--lm-blue2:#E8F0FE;--lm-gold:#C9A227;--lm-wa:#25D366;--lm-wa2:#128C7E;--lm-up:#188038;--lm-down:#D93025;--lm-top:56px;--lm-sh:0 1px 2px rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15)}
body.ldi-map-page{margin:0;background:var(--lm-bg);color:var(--lm-ink);overflow:hidden}
body.ldi-map-page .site-header,body.ldi-map-page .site-footer,body.ldi-map-page .m-bar,body.ldi-map-page .joinchat,body.ldi-map-page #wpadminbar~.site-header{display:none!important}
#lm{position:fixed;inset:0;display:flex;flex-direction:column;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
#lm *,#lm *::before,#lm *::after{box-sizing:border-box}
#lm a{color:inherit}
#lm button{font:inherit;color:inherit;cursor:pointer}

/* Top bar */
.lm-top{height:var(--lm-top);flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:0 12px;background:var(--lm-panel);box-shadow:0 1px 3px rgba(0,0,0,.12);z-index:5}
.lm-logo{display:flex;align-items:center;gap:8px;text-decoration:none;white-space:nowrap}
.lm-logo .mk{width:34px;height:34px;border-radius:9px;border:1.5px solid var(--lm-gold);color:var(--lm-gold);display:grid;place-items:center;font-size:13px;font-weight:700;letter-spacing:.04em}
.lm-logo span{display:none;color:var(--lm-mute);font-size:14px;font-weight:500}
.lm-search{position:relative;flex:1;min-width:0}
.lm-search input{width:100%;height:40px;border-radius:20px;border:1px solid transparent;background:#F1F3F4;color:var(--lm-ink);padding:0 14px 0 38px;font-size:16px}
.lm-search input::placeholder{color:var(--lm-mute)}
.lm-search input:focus{outline:none;background:#fff;border-color:var(--lm-line);box-shadow:var(--lm-sh)}
.lm-search svg{position:absolute;left:13px;top:12px;width:16px;height:16px;fill:none;stroke:var(--lm-mute);stroke-width:2;pointer-events:none}
#lm-qlist{position:absolute;left:0;right:0;top:46px;margin:0;padding:6px 0;list-style:none;background:var(--lm-panel);border-radius:12px;box-shadow:var(--lm-sh);z-index:20;max-height:50vh;overflow:auto}
#lm-qlist li{display:flex;justify-content:space-between;gap:10px;padding:10px 16px;cursor:pointer;font-size:15px}
#lm-qlist li.on,#lm-qlist li:hover{background:#F1F3F4}
#lm-qlist li b{font-weight:500}
#lm-qlist li span{color:var(--lm-mute);font-variant-numeric:tabular-nums;white-space:nowrap}
#lm-qlist li.lm-empty{color:var(--lm-mute);cursor:default;font-size:14px}
.lm-metric{display:flex;gap:2px;background:#F1F3F4;border-radius:20px;padding:3px;flex:0 0 auto}
.lm-metric button{height:34px;padding:0 14px;border:0;border-radius:17px;background:transparent;color:var(--lm-mute);font-size:14px;font-weight:500;white-space:nowrap}
.lm-metric button[aria-pressed=true]{background:var(--lm-blue2);color:#174EA6}
.lm-metric button:focus-visible{outline:2px solid var(--lm-blue);outline-offset:1px}

/* Stage */
.lm-stage{position:relative;flex:1;min-height:0}
#lm-map{position:absolute;inset:0}
#lm-map canvas:focus{outline:2px solid var(--lm-blue)}
.maplibregl-ctrl-top-right{top:10px;right:10px}
.maplibregl-ctrl-group{background:#fff!important;box-shadow:var(--lm-sh)!important;border:0}
.maplibregl-ctrl-group button{width:40px!important;height:40px!important}
.maplibregl-ctrl-attrib{background:rgba(255,255,255,.8)!important;color:var(--lm-mute);font-size:11px}
.lm-pulse{width:18px;height:18px;border-radius:50%;border:3px solid #202124;background:transparent;box-shadow:0 0 0 0 rgba(32,33,36,.5);animation:lmp 1.6s ease-out infinite;pointer-events:none}
@keyframes lmp{0%{box-shadow:0 0 0 0 rgba(32,33,36,.45)}100%{box-shadow:0 0 0 22px rgba(32,33,36,0)}}
#lm-legend{position:absolute;left:12px;top:12px;width:min(230px,calc(100% - 80px));padding:8px 12px 9px;background:var(--lm-panel);border-radius:10px;box-shadow:var(--lm-sh);z-index:3}
#lm-legend .bar{height:8px;border-radius:4px}
#lm-legend .ends{display:flex;justify-content:space-between;margin-top:5px;font-size:12px;color:var(--lm-ink);font-variant-numeric:tabular-nums}
#lm-legend small{display:block;margin-top:4px;font-size:11px;color:var(--lm-faint);line-height:1.35}
#lm-err{position:absolute;left:12px;right:12px;top:12px;z-index:6;padding:12px 14px;background:#FCE8E6;color:#A50E0E;border-radius:10px;box-shadow:var(--lm-sh);font-size:14px}
#lm-err button{margin-left:8px;padding:6px 10px;border:1px solid #A50E0E;background:transparent;border-radius:8px}

/* Sheet (list) and card (one community) */
.lm-panel{position:absolute;z-index:4;background:var(--lm-panel);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--lm-sh)}
.lm-panel[hidden]{display:none}
#lm-sheet .hd{flex:0 0 auto;padding:6px 16px 10px;border-bottom:1px solid var(--lm-line)}
#lm-grab{display:none;width:100%;padding:6px 0 4px;border:0;background:transparent}
#lm-grab i{display:block;width:36px;height:4px;margin:0 auto;border-radius:2px;background:#DADCE0}
#lm-sheet h2{margin:0;font-size:18px;font-weight:500}
#lm-note{margin:3px 0 8px;font-size:13px;color:var(--lm-mute);line-height:1.4}
.lm-sortrow{display:flex;justify-content:flex-end;align-items:center;gap:10px;font-size:13px;color:var(--lm-mute)}
.lm-sortrow button{height:32px;padding:0 12px;border:1px solid var(--lm-line);border-radius:16px;background:#fff;color:var(--lm-ink);font-size:13px}
#lm-list{flex:1;margin:0;padding:4px 8px 20px;list-style:none;overflow:auto;-webkit-overflow-scrolling:touch}
.lm-row{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:6px 8px;border:0;border-radius:8px;background:transparent;text-align:left}
.lm-row:hover{background:#F1F3F4}
.lm-row.on{background:var(--lm-blue2)}
.lm-row:focus-visible{outline:2px solid var(--lm-blue);outline-offset:-2px}
.lm-row .n{width:24px;color:var(--lm-faint);font-size:12px;text-align:right;font-variant-numeric:tabular-nums}
.lm-row .tx{flex:1;min-width:0;display:flex;flex-direction:column}
.lm-row .tx b{font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lm-row .tx small{font-size:12px;color:var(--lm-mute)}
.lm-row .v{font-weight:500;color:var(--lm-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.lm-row .v.na{color:var(--lm-faint);font-size:13px}

#lm-card{overflow:auto;-webkit-overflow-scrolling:touch}
.lm-img{height:160px;background:#E8EAED center/cover no-repeat;flex:0 0 auto}
.lm-img.short{height:40px;background:#fff}
.lm-x{position:absolute;top:10px;right:10px;width:40px;height:40px;border:0;border-radius:50%;background:#fff;color:var(--lm-ink);font-size:24px;line-height:1;z-index:2;box-shadow:var(--lm-sh)}
.lm-x:focus-visible{outline:2px solid var(--lm-blue)}
.lm-cb{padding:14px 16px 24px}
.lm-eyebrow{margin:0 0 2px;font-size:12px;color:var(--lm-mute)}
.lm-cb h2{margin:0;font-size:22px;line-height:1.2;font-weight:500}
.lm-cb h2:focus{outline:none}
.lm-sub{margin:6px 0 0;color:var(--lm-mute);font-size:14px;line-height:1.4}
.lm-kpis{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.lm-kpis.small{margin-top:8px}
.lm-kpis.three{grid-template-columns:1fr 1fr}
@media (min-width:900px){.lm-kpis.three{grid-template-columns:1fr 1fr 1fr}}
.lm-kpi{padding:10px 12px;border:1px solid var(--lm-line);border-radius:10px;background:#fff;min-width:0}
.lm-kpi small{display:block;font-size:12px;color:var(--lm-mute);line-height:1.3}
.lm-kpi b{display:block;margin-top:3px;font-size:17px;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.15}
.lm-kpi.big b{font-size:26px;color:var(--lm-ink)}
.lm-kpi b.na{font-size:13px;font-weight:400;color:var(--lm-faint)}
.lm-kpi i{display:block;margin-top:4px;font-size:11px;font-style:normal;color:var(--lm-faint)}
.lm-cb h3{margin:22px 0 8px;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--lm-mute);font-weight:600}
.lm-muted{margin:0;color:var(--lm-mute);font-size:14px;line-height:1.45}
.lm-muted a{color:var(--lm-blue)}
.lm-growth{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;background:#F8F9FA;margin-bottom:8px}
.lm-growth b{font-size:22px;font-weight:500;white-space:nowrap}
.lm-growth.up b{color:var(--lm-up)}
.lm-growth.down b{color:var(--lm-down)}
.lm-growth span{font-size:13px;color:var(--lm-mute);line-height:1.35}
.lm-chart{padding:8px 0 0}
.lm-chart svg{display:block;width:100%;height:auto}
.lm-chart .line{fill:none;stroke:var(--lm-blue);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.lm-chart .fill{fill:var(--lm-blue);opacity:.08}
.lm-chart circle{fill:#fff;stroke:var(--lm-blue);stroke-width:2}
.lm-chart-x{display:flex;justify-content:space-between;font-size:11px;color:var(--lm-faint);margin-top:2px}
.lm-hist{width:100%;border-collapse:collapse;margin-top:8px;font-size:13px}
.lm-hist td{padding:5px 0;border-top:1px solid var(--lm-line);color:var(--lm-mute)}
.lm-hist td:nth-child(2){color:var(--lm-ink);font-variant-numeric:tabular-nums;white-space:nowrap;padding:5px 10px}
.lm-hist td:last-child{font-size:12px}
.lm-mini{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.lm-mini a{display:flex;align-items:center;gap:10px;min-height:56px;padding:6px;border:1px solid var(--lm-line);border-radius:10px;text-decoration:none;background:#fff}
.lm-mini a:hover{background:#F8F9FA}
.lm-mini .th{width:60px;height:44px;flex:0 0 auto;border-radius:6px;background:#E8EAED center/cover no-repeat}
.lm-mini .tx{min-width:0;display:flex;flex-direction:column}
.lm-mini .tx b{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lm-mini .tx small{font-size:12px;color:var(--lm-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lm-more{display:inline-block;margin-top:8px;font-size:14px;color:var(--lm-blue);text-decoration:none}
.lm-btns{display:flex;flex-direction:column;gap:8px;margin-top:22px}
.lm-btn{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 14px;border:1px solid var(--lm-line);border-radius:24px;text-decoration:none;font-weight:500;font-size:15px;background:#fff;text-align:center;color:var(--lm-blue)}
.lm-btn.wa{background:var(--lm-wa2);border-color:var(--lm-wa2);color:#fff}
.lm-btn:focus-visible{outline:2px solid var(--lm-blue);outline-offset:2px}
.lm-fold{margin-top:16px;border-top:1px solid var(--lm-line);padding-top:10px}
.lm-fold summary{cursor:pointer;font-size:14px;color:var(--lm-mute)}
.lm-src{margin:8px 0 0;padding-left:18px;font-size:13px;color:var(--lm-mute);line-height:1.45}
.lm-fold p{font-size:12px;color:var(--lm-faint);line-height:1.4}

/* Phone: bottom sheet */
@media (max-width:899px){
	.lm-metric button{padding:0 9px;font-size:12px;height:32px}
	.lm-logo .mk{width:30px;height:30px;font-size:12px}
	.lm-search input{padding-left:34px;font-size:15px}
	.lm-search svg{left:12px}
	.lm-top{gap:8px;padding:0 10px}
	.lm-panel{left:0;right:0;bottom:0;border-radius:16px 16px 0 0;box-shadow:0 -2px 10px rgba(0,0,0,.18)}
	#lm-sheet{height:auto;max-height:86vh;transition:height .25s ease}
	#lm-sheet .hd{cursor:pointer;padding-bottom:12px}
	#lm-sheet:not(.tall) #lm-note,#lm-sheet:not(.tall) .lm-sortrow,#lm-sheet:not(.tall) #lm-list{display:none}
	#lm-sheet:not(.tall) h2{font-size:16px;display:flex;justify-content:space-between;align-items:center}
	#lm-sheet:not(.tall) h2::after{content:"See all areas";font-size:13px;font-weight:500;color:var(--lm-blue)}
	#lm-sheet.tall{height:86vh}
	#lm-sheet.tall .hd{padding-bottom:10px}
	#lm-grab{display:block}
	#lm-card{height:74vh}
	#lm-legend{width:min(220px,calc(100% - 70px))}
}
/* Desktop: panel on the left */
@media (min-width:900px){
	.lm-top{padding:0 18px;gap:14px}
	.lm-logo span{display:inline}
	.lm-search{max-width:420px}
	.lm-panel{left:16px;top:16px;bottom:16px;width:400px;border-radius:12px}
	#lm-legend{left:auto;right:60px;top:12px;width:240px}
	.maplibregl-ctrl-top-right{top:60px}
	#lm-card{height:auto}
}
@media (min-width:1280px){.lm-panel{width:440px}}
@media (prefers-reduced-motion:reduce){.lm-pulse{animation:none}#lm-sheet{transition:none}}
