.map-panel {
    position: relative;
    width: 100%;
    flex-shrink: 0;
    transition: height 0.3s ease;
    border-top: 1px solid var(--devana-border, #ddd);
}

.map-panel.collapsed {
    height: 36px;  /* just enough for the toggle button */
    overflow: hidden;
}

.map-panel.expanded {
    height: 45vh;
    min-height: 350px;
}

.map-container {
    width: 100%;
    height: calc(100% - 36px);
    margin-top: 36px;
}

.map-toggle-btn {
    position: absolute;
    top: 0;
    right: 16px;
    z-index: 10;
    padding: 6px 16px;
    border: 1px solid var(--devana-border, #ddd);
    border-top: none;
    border-radius: 0 0 4px 4px;
    background: var(--devana-surface, #fff);
    cursor: pointer;
    font-size: 13px;
    color: var(--devana-text, #333);
}

.map-toggle-btn:hover {
    background: var(--devana-surface-hover, #f5f5f5);
}

.devana-marker-depot {
    z-index: 10 !important;
}

/* Stop type marker colors for route visualization */
.devana-marker-loading { background-color: #e74c3c !important; }
.devana-marker-unloading { background-color: #3498db !important; }
.devana-marker-start { background-color: #2ecc71 !important; }
.devana-marker-end { background-color: #95a5a6 !important; }
