.cdp-map-picker,.cdp-map-viewer { position:relative!important }
.cdp-map-aerial-toggle { position:absolute!important; top:0; right:0; z-index:30; display:flex!important; align-items:center; gap:6px; margin:10px!important; padding:8px 10px!important; border:1px solid #cfe0d7!important; border-radius:8px!important; background:#fff!important; color:#173b36!important; font:600 12px/1.2 'Noto Sans Thai Looped',sans-serif!important; box-shadow:0 2px 8px rgba(13,46,42,.14) }
.cdp-map-aerial-toggle input { width:15px; height:15px; margin:0; accent-color:#1769e0 }
.cdp-map-view-control { position:absolute!important; z-index:35; left:10px; bottom:10px; display:flex!important; align-items:flex-end; gap:9px; font-family:'Noto Sans Thai Looped',sans-serif!important }
.cdp-map-view-button { display:flex!important; flex-direction:column!important; align-items:center!important; gap:4px!important; width:72px!important; padding:4px!important; border:1px solid rgba(20,87,127,.25)!important; border-radius:9px!important; background:#fff!important; color:#183b56!important; box-shadow:0 3px 12px rgba(12,52,86,.24)!important; cursor:pointer!important; overflow:hidden!important }
.cdp-map-view-button:hover,.cdp-map-view-control:focus-within .cdp-map-view-button { border-color:#1479c9!important; box-shadow:0 4px 15px rgba(20,105,174,.3)!important }
.cdp-map-view-thumb { display:grid!important; place-items:center!important; width:62px!important; height:42px!important; border-radius:5px!important; background:linear-gradient(135deg,rgba(39,119,83,.9),rgba(21,91,129,.8)),url('https://warincity.go.th/gtiles/14/12960/8898.png') center/cover!important; color:#fff!important; font-size:18px!important; text-shadow:0 1px 3px rgba(0,0,0,.45)!important }
.cdp-map-view-control.is-aerial .cdp-map-view-thumb { background:linear-gradient(135deg,#e8f5fc,#d8ecf6)!important; color:#1769e0!important; text-shadow:none!important }
.cdp-map-view-label { display:block!important; width:100%!important; padding:0 2px!important; overflow:hidden!important; color:inherit!important; font-size:10px!important; font-weight:800!important; line-height:1.25!important; white-space:nowrap!important; text-overflow:ellipsis!important }
.cdp-map-view-options { display:grid!important; gap:6px!important; min-width:158px!important; padding:9px!important; border:1px solid #c8dfef!important; border-radius:9px!important; background:rgba(255,255,255,.98)!important; box-shadow:0 4px 16px rgba(12,52,86,.22)!important; opacity:0!important; transform:translateX(-8px)!important; pointer-events:none!important; transition:opacity .16s ease,transform .16s ease!important }
.cdp-map-view-control:hover .cdp-map-view-options,.cdp-map-view-control:focus-within .cdp-map-view-options { opacity:1!important; transform:translateX(0)!important; pointer-events:auto!important }
.cdp-map-view-options-title { color:#527289!important; font-size:10px!important; font-weight:800!important; letter-spacing:.06em!important; text-transform:uppercase!important }
.cdp-map-view-options label { display:flex!important; align-items:center!important; gap:7px!important; color:#173b56!important; font-size:12px!important; font-weight:700!important; cursor:pointer!important }
.cdp-map-view-options input { width:15px!important; height:15px!important; margin:0!important; accent-color:#1769e0!important }
@media(max-width:720px){.cdp-map-view-control{left:8px;bottom:8px}.cdp-map-view-options{min-width:148px}.cdp-map-view-control:not(:focus-within) .cdp-map-view-options{display:none!important}.cdp-map-view-control:active .cdp-map-view-options,.cdp-map-view-control:focus-within .cdp-map-view-options{display:grid!important}}

/* Keep OpenLayers controls readable even when the administration theme styles buttons globally. */
.cdp-map-picker .ol-control,.cdp-map-viewer .ol-control { background:transparent!important; padding:0!important }
.cdp-map-picker .ol-zoom,.cdp-map-viewer .ol-zoom { top:10px!important; left:10px!important }
.cdp-map-picker .cdp-map-reset-control,.cdp-map-viewer .cdp-map-reset-control { top:90px!important; left:10px!important }
.cdp-map-picker .ol-control button,.cdp-map-viewer .ol-control button { display:flex!important; align-items:center!important; justify-content:center!important; width:34px!important; height:34px!important; margin:0 0 4px!important; padding:0!important; border:1px solid #b9d8ee!important; border-radius:8px!important; background:#fff!important; color:#1769e0!important; font-size:22px!important; font-weight:800!important; line-height:0!important; box-shadow:0 2px 8px rgba(23,68,110,.16)!important; text-shadow:none!important }
.cdp-map-picker .cdp-map-reset-control button,.cdp-map-viewer .cdp-map-reset-control button { font-size:24px!important; line-height:0!important }
.cdp-map-picker .ol-control button:hover,.cdp-map-picker .ol-control button:focus,.cdp-map-viewer .ol-control button:hover,.cdp-map-viewer .ol-control button:focus { background:#edf7ff!important; color:#0d4fb6!important; outline:2px solid rgba(23,105,224,.2)!important; outline-offset:1px!important }
.cdp-map-popup { min-width:220px; max-width:min(330px,calc(100vw - 42px)); padding:11px 12px; border:1px solid #c8def0; border-radius:10px; background:#fff; color:#17324f; box-shadow:0 8px 22px rgba(23,68,110,.18); font:600 12px/1.45 'Noto Sans Thai Looped',sans-serif; transform:translateY(-4px) }
.cdp-map-popup strong { display:block; margin-bottom:7px; color:#0d4fb6; font-size:13px }
.cdp-map-popup-record dl { display:grid; grid-template-columns:minmax(82px,.8fr) minmax(0,1.4fr); gap:4px 9px; margin:0 }
.cdp-map-popup-record dt { color:#5c758d; font-weight:600 }
.cdp-map-popup-record dd { min-width:0; margin:0; overflow-wrap:anywhere; color:#17324f }
.cdp-map-popup-images { display:flex; gap:6px; margin-top:9px; overflow-x:auto; overflow-y:hidden; padding-bottom:2px }
.cdp-map-popup-image-button { display:block; flex:0 0 auto; width:82px; height:62px; padding:0; border:0; border-radius:6px; background:transparent; cursor:zoom-in }
.cdp-map-popup-images img { width:82px; height:62px; flex:0 0 auto; object-fit:cover; border:1px solid #c8def0; border-radius:6px; background:#eef5fa }
.cdp-map-image-lightbox { position:fixed; z-index:2000; inset:0; display:flex; align-items:center; justify-content:center; padding:28px 82px; background:rgba(11,25,41,.72); opacity:0; transition:opacity .2s ease }
.cdp-map-image-lightbox[hidden] { display:none }
.cdp-map-image-lightbox.is-visible { opacity:1 }
.cdp-map-image-lightbox img { max-width:100%; max-height:100%; object-fit:contain; border-radius:8px; box-shadow:0 12px 36px rgba(0,0,0,.42); transform:scale(.98); transition:transform .2s ease }
.cdp-map-image-lightbox.is-visible img { transform:scale(1) }
.cdp-map-image-lightbox-close,.cdp-map-image-lightbox-nav { position:absolute; z-index:1; display:grid; place-items:center; width:42px; height:42px; border:0; border-radius:50%; background:#fff; color:#17324f; box-shadow:0 3px 12px rgba(0,0,0,.3); cursor:pointer }
.cdp-map-image-lightbox-nav[hidden],.cdp-map-image-lightbox-counter[hidden] { display:none!important }
.cdp-map-image-lightbox-close { top:12px; right:12px; font:700 30px/1 sans-serif }
.cdp-map-image-lightbox-nav { top:50%; transform:translateY(-50%); font:700 36px/1 sans-serif }
.cdp-map-image-lightbox-previous { left:18px }
.cdp-map-image-lightbox-next { right:18px }
.cdp-map-image-lightbox-counter { position:absolute; z-index:1; bottom:14px; left:50%; transform:translateX(-50%); padding:4px 9px; border-radius:999px; background:rgba(0,0,0,.58); color:#fff; font:700 12px/1 sans-serif }
.cdp-map-image-lightbox-close:hover,.cdp-map-image-lightbox-nav:hover { background:#edf7ff; color:#0d4fb6 }
@media(max-width:720px){.cdp-map-image-lightbox{padding:20px 58px}.cdp-map-image-lightbox-close{top:8px;right:8px}.cdp-map-image-lightbox-nav{width:36px;height:36px}.cdp-map-image-lightbox-previous{left:8px}.cdp-map-image-lightbox-next{right:8px}}
.cdp-map-popup-coordinates { margin-top:9px; padding-top:7px; border-top:1px solid #e2edf5; color:#356987; font-size:11px }
.cdp-map-popup-coordinates i { color:#1479c9; margin-right:3px }
.cdp-map-popup-empty { margin:0; color:#71879b; font-weight:500 }
.cdp-cctv-image-link { display:block; width:100%; margin-top:10px; padding:0; border:0; background:transparent; color:#1769e0; font:inherit; font-size:11px; text-decoration:none; text-align:left; cursor:zoom-in }
.cdp-cctv-image { display:block; width:100%; max-width:270px; height:135px; object-fit:cover; border:1px solid #c8def0; border-radius:7px; background:#eef5fa }
.cdp-cctv-image-link span { display:block; margin-top:4px; text-align:center }
.cdp-map-community-tooltip { display:none; max-width:220px; padding:7px 10px; border:1px solid #e7a12d; border-radius:7px; background:rgba(255,255,255,.96); color:#874d00; box-shadow:0 3px 12px rgba(112,64,0,.2); font:700 12px/1.3 'Noto Sans Thai Looped',sans-serif; pointer-events:none; white-space:nowrap }
.public-layer-copy small:has(.public-layer-appeal-status) { white-space:normal }
.public-layer-appeal-status { display:inline; margin-left:3px; font-weight:700 }
.public-layer-appeal-status.is-pending { color:#dc2626 }
.public-layer-appeal-status.is-progress { color:#a16207 }