/* Public map (/map) and the mini map on business pages. Leaflet's own CSS is in /vendor/leaflet/. */
.map-page { width: 100vw; margin-left: calc(50% - 50vw); }
.map-toolbar { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; padding: .5rem 16px; }
.map-layers { display: flex; flex-wrap: wrap; gap: .25rem .9rem; }
.map-layer { display: inline-flex; align-items: center; gap: .35rem; font-size: .9rem; cursor: pointer; }
.map-dot { display: inline-block; width: .8rem; height: .8rem; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .35); }
.map-canvas { height: 70vh; min-height: 380px; background: #dfe3e8; }
.map-mini { height: 250px; border-radius: var(--radius, 8px); overflow: hidden; background: #dfe3e8; }
.map-note { padding: .5rem 16px; margin: 0; font-size: .85rem; }
.map-status { font-size: .85rem; }
.ctk-cluster { display: flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; background: rgba(33, 37, 41, .82); border: 2px solid #fff; font: 600 13px/1 system-ui, sans-serif; box-shadow: 0 0 0 1px rgba(0, 0, 0, .3); }
.ctk-popup strong { display: block; }
.ctk-popup .ctk-cat { color: #666; font-size: .85em; }
.ctk-popup a { display: inline-block; margin-top: .3rem; }
@media (max-width: 640px) { .map-canvas { height: 62vh; } }
.ctk-popup .ctk-official { font-size: .85em; margin-top: .25em; }