/**
 * ===============================================================================
 * wezunu - Bett+Bike Layer (ADFC-Unterkuenfte)
 * Developed by Toni Sciacca - mail@tonisciacca.com
 * ===============================================================================
 */

/* Marker — zertifiziert (ADFC Bett+Bike): voll blau */
.bl-marker {
    width: 26px; height: 26px; border-radius: 50%;
    background: #fff;
    border: 2px solid #3b82f6;
    display: inline-flex; align-items: center; justify-content: center;
    box-shadow: 0 3px 8px rgba(59,130,246,0.32);
    transition: transform 0.12s;
}
.bl-marker:hover { transform: scale(1.18); border-color: #1d4ed8; }
.bl-marker [data-lucide], .bl-marker svg { width: 14px; height: 14px; color: #1d4ed8; stroke: #1d4ed8; }

/* Community-Marker (OSM): kleiner, hellblauer Outline-Look */
.bl-marker-community {
    width: 22px; height: 22px;
    background: rgba(255,255,255,0.92);
    border: 1.5px dashed #60a5fa;
    box-shadow: 0 2px 4px rgba(96,165,250,0.22);
}
.bl-marker-community [data-lucide], .bl-marker-community svg { width: 11px; height: 11px; color: #2563eb; stroke: #2563eb; }
.bl-marker-community:hover { border-color: #2563eb; border-style: solid; }

.bl-badge.bl-badge-osm {
    color: #1e40af;
    background: rgba(147,197,253,0.22);
}
.bl-meta {
    font-size: 11px; color: #6b6b6b; margin-top: 2px;
    text-transform: capitalize;
}

/* Toggle in Karte (unten links neben MiniRoutes-Toggle, deshalb leicht nach rechts versetzt) */
.bl-toggle {
    position: absolute; bottom: 16px; left: 230px; z-index: 410;
    background: rgba(255,255,255,0.95); backdrop-filter: blur(6px);
    border: 1px solid #e8e8e8; border-radius: 999px;
    padding: 8px 16px;
    font-family: 'Outfit', sans-serif;
    font-size: 12px; font-weight: 600; color: #6b6b6b;
    cursor: pointer;
    display: inline-flex; align-items: center; gap: 6px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    user-select: none;
}
.bl-toggle:hover { background: #fff; }
.bl-toggle.active { background: #3b82f6; color: #fff; border-color: #3b82f6; }
.bl-toggle [data-lucide] { width: 13px; height: 13px; }

/* Popup */
.bl-popup { font-family: 'Outfit', sans-serif; min-width: 220px; padding: 4px; }
.bl-badge {
    display: inline-block;
    font-size: 9px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase;
    color: #1d4ed8; background: rgba(59,130,246,0.12);
    padding: 2px 6px; border-radius: 4px;
    margin-bottom: 6px;
}
.bl-title { font-size: 14px; font-weight: 700; color: #1a1a1a; line-height: 1.25; }
.bl-addr  { font-size: 12px; color: #6b6b6b; margin-top: 4px; }
.bl-tel   { font-size: 12px; color: #1d4ed8; margin-top: 4px; }
.bl-tel a { color: inherit; text-decoration: none; font-weight: 600; }
.bl-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.bl-btn {
    font: inherit; font-size: 11px; font-weight: 600;
    padding: 5px 10px; border-radius: 999px;
    background: #3b82f6; color: #fff; border: none; cursor: pointer;
    display: inline-flex; align-items: center;
}
.bl-btn.sec { background: #f5f5f5; color: #1d4ed8; }
.bl-btn.sec a { color: inherit; text-decoration: none; }

/* Workbench-Suggestion: kleine Karte */
.bl-suggest {
    display: grid; grid-template-columns: 32px 1fr 28px; gap: 8px;
    align-items: center;
    padding: 8px 10px;
    border: 1px solid #e8e8e8; border-radius: 10px;
    background: #fff;
    margin-bottom: 6px;
    font-family: 'Outfit', sans-serif;
}
.bl-suggest-icon {
    width: 28px; height: 28px; border-radius: 50%;
    background: rgba(59,130,246,0.1);
    display: inline-flex; align-items: center; justify-content: center;
}
.bl-suggest-icon [data-lucide] { width: 14px; height: 14px; color: #1d4ed8; stroke: #1d4ed8; }
.bl-suggest-body { min-width: 0; }
.bl-suggest-name { font-size: 13px; font-weight: 600; color: #1a1a1a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bl-suggest-meta { font-size: 11px; color: #6b6b6b; margin-top: 1px; }
.bl-suggest-btn {
    width: 28px; height: 28px; border-radius: 50%;
    background: #3b82f6; color: #fff; border: none; cursor: pointer;
    font: inherit; font-size: 14px; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
}

/* Mobile: Toggle-Position nach links zurueck damit beide untereinander */
@media (max-width: 640px) {
    .bl-toggle { left: 16px; bottom: 70px; }
}