/* Grundlayout */
body {
    background: #e5e5e5;
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
}

.container {
    width: 90%;
    max-width: 1100px;
    margin: 40px auto;
    background: #f7f7f7;
    padding: 20px;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    position: relative;
    z-index: 10;
}

h1 { text-align:center; color:#444; }

form { text-align:center; margin-bottom:15px; }
select, button {
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid #ccc;
    background: #eee;
    cursor: pointer;
}

/* Karte */
#map { height:500px; border-radius:12px; overflow:hidden; z-index:1; }

/* Leaflet Fix */
.leaflet-container { z-index:1 !important; }
.leaflet-pane,.leaflet-top,.leaflet-bottom { z-index:2 !important; }

/* Popups & Thumbnails */
.leaflet-popup-content { text-align:center; margin:8px; }
.leaflet-popup-content img.thumb {
    max-width:200px;
    max-height:200px;
    width:auto;
    height:auto;
    display:block;
    margin:0 auto;
    border-radius:8px;
    cursor:pointer;
    object-fit:contain;
    transition: transform 0.2s;
}
.leaflet-popup-content img.thumb:hover { transform:scale(1.05); }
.leaflet-popup-content-wrapper { border-radius:12px; }

/* Footer */
footer { text-align:center; margin-top:20px; color:#777; font-size:14px; }

/* Lightbox */
#lightbox {
    display:none;
    position:fixed !important;
    top:0; left:0;
    width:100vw; height:100vh;
    background: rgba(0,0,0,0.85);
    justify-content:center;
    align-items:center;
    z-index:999999 !important;
    cursor:pointer;
}
#lightbox img {
    max-width:90%;
    max-height:90%;
    width:auto;
    height:auto;
    border-radius:10px;
    box-shadow:0 0 30px rgba(0,0,0,0.6);
    object-fit:contain;
}