@font-face{font-family:GemsMap;src:url('font/bk-sukhumvit/SukhumvitSet-Text.ttf') format('truetype');font-display:swap;font-weight:400}
@font-face{font-family:GemsMap;src:url('font/bk-sukhumvit/SukhumvitSet-SemiBold.ttf') format('truetype');font-display:swap;font-weight:600}
.leaflet-container .gems-layer-control{font-family:GemsMap,Tahoma,sans-serif!important;font-size:13px!important;background:#fff;border:1px solid #dce7f1;border-radius:14px;box-shadow:0 6px 24px #173c6424;color:#284b6c;overflow:hidden}
.leaflet-container .gems-layer-control .leaflet-control-layers-toggle{width:44px!important;height:44px!important;background-size:22px 22px;border-radius:13px}
.leaflet-container .gems-layer-control.leaflet-control-layers-expanded{padding:0}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list{width:270px!important;max-width:calc(100vw - 36px);max-height:min(65vh,580px)!important;margin:0;padding:0 12px 12px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b7cede transparent}
.gems-layer-control .leaflet-control-layers-list .leaflet-control-layers-list{width:auto!important;margin:0;padding:0;height:auto!important;max-height:none;overflow:visible!important}
.gems-layer-control .gems-layers-heading{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0 13px;background:#fff;border-bottom:1px solid #e8eff5;margin-bottom:10px}
.gems-layers-heading strong{display:block;font-size:16px;font-weight:600;color:#164d7b;line-height:1.6}
.gems-layers-heading small{display:block;font-size:11px;color:#8a9bad;line-height:1.6}
.gems-layer-control .gems-layers-close{flex-shrink:0;display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:9px;background:#eff5fa;color:#52748f;font:24px/1 Tahoma,sans-serif;cursor:pointer}
.gems-layer-control .gems-layers-close:hover{background:#dcebf7;color:#155c94}
.gems-layer-control .menu-item-header{padding:14px 8px 7px!important;margin:4px 0 3px;background:transparent;border:0;font-size:12px;color:#6c8399;text-align:left;line-height:1.6}
.gems-layer-control .menu-item-header center{text-align:left}
.gems-layer-control label{display:flex!important;align-items:center;gap:10px;min-height:42px;margin:3px 0!important;padding:9px 10px;border:1px solid transparent;border-radius:9px;font-size:13px;font-weight:400;color:#365b7a;line-height:1.7;cursor:pointer;white-space:normal}
.gems-layer-control label:hover{background:#f1f7fc}
.gems-layer-control label.gems-layer-selected{background:#edf6fd;border-color:#d8eaf8;color:#185f96}
.gems-layer-control label>div{display:flex;align-items:center;gap:10px;width:100%}
.gems-layer-control .leaflet-control-layers-selector{position:static;top:auto;flex-shrink:0;width:17px;height:17px;margin:0;accent-color:#177cba;cursor:pointer}
.gems-layer-control label>span,.gems-layer-control label>div>span{flex:1}
.gems-layer-control .leaflet-control-layers-separator{margin:13px 0 3px;border-top-color:#e4edf5}
.gems-layer-control .leaflet-control-layers-overlays>#btnControl{display:none!important}
.gems-layer-control input:focus-visible,.gems-layer-control button:focus-visible,.gems-layer-control a:focus-visible{outline:2px solid #2189c4;outline-offset:3px}
.gems-layer-control input[id="overdue"]+span:before,.gems-layer-control input[id="time"]+span:before,.gems-layer-control input[id="made"]+span:before,.gems-layer-control input[id="nofound"]+span:before,.gems-layer-control input[id="newyear"]+span:before,.gems-layer-control input[id="notsuccess"]+span:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:7px;background:#969696}
.gems-layer-control input[id="overdue"]+span:before{background:#ff0000}.gems-layer-control input[id="time"]+span:before{background:#ff8c2c}.gems-layer-control input[id="made"]+span:before{background:#069a28}.gems-layer-control input[id="newyear"]+span:before{background:#3498db}.gems-layer-control input[id="notsuccess"]+span:before{background:#e008fc}
@media(max-width:575.98px){.leaflet-container .gems-layer-control>.leaflet-control-layers-list{width:250px!important;max-height:55vh!important}.gems-layer-control label{min-height:44px}.gems-layers-heading strong{font-size:15px}}
/* Compact layer picker while retaining comfortable touch targets on phones. */
.leaflet-container .gems-layer-control{border-radius:10px}
.leaflet-container .gems-layer-control .leaflet-control-layers-toggle{width:36px!important;height:36px!important;background-size:19px 19px;border-radius:9px}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list{width:230px!important;padding:0 9px 9px}
.gems-layer-control .gems-layers-heading{gap:8px;padding:10px 0 8px;margin-bottom:5px}
.gems-layers-heading strong{font-size:14px;line-height:1.5}
.gems-layers-heading small{font-size:10px;line-height:1.5}
.gems-layer-control .gems-layers-close{width:28px;height:28px;border-radius:7px;font-size:21px}
.gems-layer-control .menu-item-header{padding:8px 7px 4px!important;margin:2px 0;font-size:11px}
.gems-layer-control label{gap:8px;min-height:34px;margin:2px 0!important;padding:5px 8px;border-radius:7px;font-size:12px;line-height:1.6}
.gems-layer-control label>div{gap:8px}
.gems-layer-control .leaflet-control-layers-selector{width:15px;height:15px}
.gems-layer-control .leaflet-control-layers-separator{margin:8px 0 2px}
@media(max-width:575.98px){
  .leaflet-container .gems-layer-control>.leaflet-control-layers-list{width:220px!important}
  .gems-layer-control label{min-height:40px;padding:7px 8px}
  .gems-layer-control .gems-layers-close{width:32px;height:32px}
}
/* Equipment and maintenance status legend. */
.leaflet-container .gems-map-legend{width:224px;max-width:calc(100vw - 36px);max-height:48vh;overflow:auto;overscroll-behavior:contain;padding:12px 13px;background:rgba(255,255,255,.97);border:1px solid #dce7f1;border-radius:12px;box-shadow:0 5px 20px #173c641c;font-family:GemsMap,Tahoma,sans-serif!important;color:#365b7a;line-height:1.6;scrollbar-width:thin}
.gems-map-legend h4{margin:0 0 8px;padding-bottom:9px;border-bottom:1px solid #e5eef5;text-align:left;color:#164d7b;font-family:GemsMap,Tahoma,sans-serif;font-size:14px;font-weight:600}
.gems-legend-section{color:#8396a9;font-size:10px;font-weight:600;margin:6px 0}
.gems-legend-status-title{border-top:1px solid #e5eef5;padding-top:9px;margin-top:10px}
.gems-legend-row{display:flex;align-items:center;gap:10px;min-height:27px;font-size:11px;padding:3px 0}
.gems-map-legend .gems-legend-row span{position:static;bottom:auto;font-family:inherit;line-height:1.6}
.gems-equipment-symbol{width:25px;height:25px;border-radius:7px;background:#f0f6fb;display:grid;place-items:center;flex-shrink:0}
.gems-equipment-symbol img{max-width:18px;max-height:19px;object-fit:contain}
.gems-equipment-airvalve img{max-width:10px}
.gems-map-legend .gems-status-symbol{width:11px;height:11px;flex:0 0 11px;border:2px solid #fff;border-radius:50%;margin:0 7px;box-shadow:0 0 0 1px #dae5ee}
.leaflet-container .marker-pin-map,.leaflet-container .marker-pin{box-shadow:0 0 0 1px #ffffffc9,0 2px 5px #153d6240}
.leaflet-container .marker-pin-map:after,.leaflet-container .marker-pin:after{box-shadow:inset 0 0 0 1px #153d6210}
@media(max-width:575.98px){.leaflet-container .gems-map-legend{width:208px;padding:10px 11px;max-height:35vh}.gems-legend-row{min-height:25px;gap:8px}.gems-map-legend h4{font-size:13px}}
/* Show the complete legend without an internal scrollbar. */
.leaflet-container .gems-map-legend{width:218px;max-height:none;overflow:visible;padding:9px 11px}
.gems-map-legend h4{font-size:13px;margin-bottom:5px;padding-bottom:6px}
.gems-legend-section{margin:4px 0;font-size:10px}
.gems-legend-status-title{margin-top:6px;padding-top:6px}
.gems-legend-row{min-height:23px;padding:2px 0;gap:8px;font-size:11px}
.gems-equipment-symbol{width:21px;height:21px;border-radius:6px}
.gems-equipment-symbol img{max-width:16px;max-height:17px}
.gems-map-legend .gems-status-symbol{margin:0 5px}
@media(max-width:575.98px){
  .leaflet-container .gems-map-legend{width:206px;max-height:none;padding:8px 10px}
  .gems-legend-row{min-height:21px;padding:1px 0}
}
@media(max-height:600px){
  .leaflet-container .gems-map-legend{width:360px;max-width:calc(100vw - 36px);display:grid;grid-template-columns:1fr 1fr;column-gap:12px;padding:8px 10px}
  .gems-map-legend h4{grid-column:1 / -1}
  .gems-map-legend .gems-legend-section{grid-column:1;grid-row:2;margin:2px 0}
  .gems-map-legend .gems-legend-status-title{grid-column:2;grid-row:2;border:0;padding:0;margin:2px 0}
  .gems-map-legend .gems-legend-row:nth-child(3){grid-column:1;grid-row:3}
  .gems-map-legend .gems-legend-row:nth-child(4){grid-column:1;grid-row:4}
  .gems-map-legend .gems-legend-row:nth-child(5){grid-column:1;grid-row:5}
  .gems-map-legend .gems-legend-row:nth-child(n+7){grid-column:2}
  .gems-map-legend .gems-legend-row:nth-child(7){grid-row:3}
  .gems-map-legend .gems-legend-row:nth-child(8){grid-row:4}
  .gems-map-legend .gems-legend-row:nth-child(9){grid-row:5}
  .gems-map-legend .gems-legend-row:nth-child(10){grid-row:6}
  .gems-map-legend .gems-legend-row:nth-child(11){grid-row:7}
  .gems-map-legend .gems-legend-row:nth-child(12){grid-row:8}
  .gems-legend-row{min-height:20px;font-size:10px;gap:5px}
}
/* Balanced inner spacing and a quiet, usable scrollbar. */
.leaflet-container .gems-layer-control.leaflet-control-layers-expanded{padding:4px}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list{
  box-sizing:border-box;
  max-width:calc(100vw - 46px);
  padding:0 8px 7px;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:rgba(94,132,161,.04) transparent;
}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list:hover,
.leaflet-container .gems-layer-control>.leaflet-control-layers-list:focus-within{scrollbar-color:rgba(94,132,161,.05) transparent}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list::-webkit-scrollbar{width:1px;height:1px}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list::-webkit-scrollbar-track{background:transparent;margin:28px 0}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list::-webkit-scrollbar-thumb{background:rgba(94,132,161,.04);border-radius:10px}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list:hover::-webkit-scrollbar-thumb,
.leaflet-container .gems-layer-control>.leaflet-control-layers-list:focus-within::-webkit-scrollbar-thumb{background:rgba(94,132,161,.05)}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list::-webkit-scrollbar-thumb:hover{background:rgba(94,132,161,.07)}
@supports selector(::-webkit-scrollbar){
  .leaflet-container .gems-layer-control>.leaflet-control-layers-list{scrollbar-width:auto;scrollbar-color:auto}
}
/* Smaller layer panel with compact spacing and readable labels. */
.leaflet-container .gems-layer-control.leaflet-control-layers-expanded{padding:4px 7px 6px 4px;border-radius:9px}
.leaflet-container .gems-layer-control>.leaflet-control-layers-list{width:206px!important;padding:0 6px 5px;max-height:min(62vh,460px)!important}
.gems-layer-control .gems-layers-heading{gap:6px;padding:7px 0 6px;margin-bottom:3px}
.gems-layers-heading strong{font-size:13px;line-height:1.5}
.gems-layers-heading small{font-size:9px;line-height:1.4}
.gems-layer-control .gems-layers-close{width:25px;height:25px;font-size:19px;border-radius:6px}
.gems-layer-control .menu-item-header{padding:6px 5px 3px!important;margin:1px 0;font-size:10px}
.gems-layer-control label{min-height:29px;margin:1px 0!important;padding:4px 6px;gap:6px;font-size:11px;line-height:1.6;border-radius:6px}
.gems-layer-control label>div{gap:6px}
.gems-layer-control .leaflet-control-layers-selector{width:13px;height:13px}
.gems-layer-control .leaflet-control-layers-separator{margin:5px 0 2px}
@media(max-width:575.98px){
  .leaflet-container .gems-layer-control>.leaflet-control-layers-list{width:200px!important;max-height:52vh!important}
  .gems-layer-control label{min-height:34px;padding:6px}
  .gems-layer-control .gems-layers-close{width:30px;height:30px}
}