html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100dvh;
    overflow: hidden;
    overscroll-behavior-y: contain;
}

#map {
    height: 100dvh;
    width: 100%;
    z-index: 10;
}

.bottom-sheet {
    z-index: 50;
    transition: transform 0.3s ease-in-out;
    padding-bottom: calc(1.5rem + env(safe-area-inset-bottom));
}

.ui-layer { 
    z-index: 40; 
}

.marker-cluster-small, 
.marker-cluster-medium, 
.marker-cluster-large { 
    background-color: rgba(59, 130, 246, 0.6); 
}

.marker-cluster-small div, 
.marker-cluster-medium div, 
.marker-cluster-large div { 
    background-color: rgba(59, 130, 246, 0.9); 
    color: white; 
    font-weight: bold; 
}

html.dark .leaflet-tile { 
    filter: invert(100%) hue-rotate(180deg) brightness(95%) contrast(90%); 
}

html.dark #map.is-sat-mode .leaflet-tile {
    filter: none;
}

/* Animation für die neuen Toast-Notifications */
.toast-enter {
    animation: toast-in 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.toast-exit {
    animation: toast-out 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes toast-in {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes toast-out {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(20px); }
}

/* Versteckt die Scrollbar im neuen Filter-Menü, lässt aber Wischen zu */
.hide-scrollbar::-webkit-scrollbar {
    display: none;
}

/* --- UI Helfer --- */
/* Versteckt die horizontale Scrollbar im Menü, das Wischen bleibt aber komplett erhalten */
.hide-scrollbar {
    -ms-overflow-style: none;  /* Für Internet Explorer und Edge */
    scrollbar-width: none;  /* Für Firefox */
}
.hide-scrollbar::-webkit-scrollbar {
    display: none; /* Für Chrome, Safari und Opera */
}