/* Page styles for the map page, loaded after the shared core files.
   Sitewide styles live in style.css; keep only map-scoped rules here. */




/* ==========================================================================
   INTERACTIVE MAP PAGE STYLES
   ========================================================================== */

.map-layout {
    display: grid;
    grid-template-columns: 380px minmax(0, 1fr);
    gap: 20px;
    width: 100%;
    margin-top: 10px;
    height: calc(100vh - 120px);
    min-height: 500px;
    box-sizing: border-box;
}

@media (min-width: 769px) {
    body.map-page .topbar {
        margin-right: 8px;
    }

    body.map-page .content-stack {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 0 8px 0 0 !important;
    }

    body.map-page .map-layout {
        margin-top: 0;
        height: 100%;
        min-height: 0;
        padding: 0 4px 12px 0;
    }
}

@media (max-width: 1200px) {
    .map-layout {
        grid-template-columns: 340px minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    .map-layout {
        grid-template-columns: 1fr;
        height: auto;
        min-height: auto;
    }
}