/**
 * Style dla niestandardowych markerów map z avatarami restauracji.
 */

/* Kontener markera */
.leaflet-div-icon.custom-marker {
    background: transparent !important;
    border: none !important;
}

/* Kontener dla avatara i pinezki */
.marker-container {
    position: relative;
    width: 84px;
    height: 104px;
    pointer-events: auto;
}

/* Avatar restauracji */
.marker-avatar {
    position: absolute;
    top: 2px;
    left: 49%;
    width: 57px;
    height: 57px;
    border-radius: 27px;
    transform: translateX(-50%);
    background-size: cover;
    background-position: center;
    border: 0px solid rgba(255,255,255,0.95);
    box-shadow: 0 5px 13px rgba(0, 0, 0, 0.22);
    z-index: 4;
}

/* Pinezka pod avatarem */
.marker-pin {
    position: absolute;
    top: 0;
    left: 50%;
    width: 61px;
    height: 61px;
    box-sizing: border-box;
    overflow: hidden;
    background: #ffffff;
    border: 3px solid var(--bd-marker-color, #0ea5e9);
    border-radius: 50% 50% 50% 0;
    transform: translateX(-50%) rotate(-45deg);
    box-shadow: 0 18px 28px rgba(0, 0, 0, 0.18);
    z-index: 1;
}

/* Styl dla polecanych restauracji */
.marker-pin.featured {
    border-color: #e74c3c;
}

.custom-marker.featured .marker-avatar {
    border-color: rgba(231, 76, 60, 0.95);
    box-shadow: 0 2px 10px rgba(231, 76, 60, 0.55);
}

/* Animacja przy najechaniu */
.leaflet-marker-icon:hover .marker-avatar {
    transform: translateX(-50%);
    transition: none;
}

/* Zapobieganie problemom z nakładaniem się markerów */
.leaflet-marker-pane {
    z-index: 600;
}

/* Poprawka dla popupów */
.leaflet-popup-content-wrapper {
    border-radius: 4px;
}

/* Ukryj domyślną ikonę cienia markera */
.leaflet-marker-shadow {
    display: none;
}
