.wrapper {
    display: flex;
    flex-direction: column;
}

.wrapper h2 {
    align-self: center;
}

.aloc-map-container {
    position: relative;
}


.aloc-location {
    position: absolute;
    max-height: 30px;
    transform: translateY(-50%);
}

.aloc-radio {
    display: none;
}

#standort0:checked ~ .aloc-map-container .aloc-location #aloc-map-label0::after,
#standort1:checked ~ .aloc-map-container .aloc-location #aloc-map-label1::after,
#standort2:checked ~ .aloc-map-container .aloc-location #aloc-map-label2::after,
#standort3:checked ~ .aloc-map-container .aloc-location #aloc-map-label3::after,
#standort4:checked ~ .aloc-map-container .aloc-location #aloc-map-label4::after,
#standort5:checked ~ .aloc-map-container .aloc-location #aloc-map-label5::after {
    opacity: 1;
}


.aloc-location label {
    cursor: pointer;
    position: relative;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    border: 5px solid var(--bs-secondary);
}

.aloc-location label::after {
    position: absolute;
    inset: 3px;
    display: block;
    content: "";
    background: var(--bs-secondary);
    border-radius: inherit;
    transition: 300ms;
    opacity: 0;
}

/* ausgelagert in theme als eigenständige tooltip klasse
.aloc-location label::before {
    content: attr(custom-tooltip); /* Holt den Standortnamen *//*
    position: absolute;
    bottom: 150%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: .5rem;
    border-radius: 4px;
    font-size: .75rem;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s;
}

.aloc-location label:hover::before {
    opacity: 1;
    visibility: visible;
} */

.aloc-info-container {
    display: flex;
    overflow: hidden;
}


/* Info Container standardmäßig versteckt */
.aloc-info {
    display: flex;
    opacity: 0;
    width: 0;
    visibility: 0;
    overflow: hidden;

    /* textumbruch bei width shrink verhindern */
    white-space: nowrap;

    flex-direction: column;
    justify-content: center;
    transition: opacity 500ms;

}

/* Wenn das zugehörige Radio-Input gecheckt ist -> Info sichtbar */
#standort0:checked ~ .aloc-info-container #aloc-info0,
#standort1:checked ~ .aloc-info-container #aloc-info1,
#standort2:checked ~ .aloc-info-container #aloc-info2,
#standort3:checked ~ .aloc-info-container #aloc-info3,
#standort4:checked ~ .aloc-info-container #aloc-info4,
#standort5:checked ~ .aloc-info-container #aloc-info5 {
    opacity: 1;
    visibility: 1;
    width: 100%;
}