/* News & Kurzmeldungen */
body.cronus.news_kurz.news_kurz.full_preview .col-slider-slider-right {
    position: sticky;
    top: 0; 
    align-self: flex-start; 
    height: auto; /
}

body.cronus.news_kurz.news_kurz.full_preview .Heinersreuth {
    overflow: visible;
}
/* News & Kurzmeldungen end*/

/* Verlinkungen  */



.collection_container {
    position: relative;
    .header-col-icon_link a{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 10;
        opacity: 0;
        background: transparent;
    }
}

.footer-col-icon {
    position: relative;
    .footer-col-icon_link{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 10;
        opacity: 0;
        background: transparent;
    }
}
/* Verlinkungen end */

body.aktuelles #area-2 .col-aktuelles .collection_content.preview_text {
    /* font-weight: bold; */
    padding-bottom: 10px;
}

.home .collection_list.gnubrew {
    width: 100%;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
    padding: 0px;
    border-radius: 8px;

    .gnubrew_bild img{
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
        border-radius: 8px;

    }
}

@media (min-width: 820px) {
    .app-download-button {
        display: none !important;
        pointer-events: none !important;
    }  
}

/* ==============================================
   Focus ring for ALL collection containers.
   Uses :has(a:focus-visible) so any deeply nested
   overlay link triggers the ring on the card itself.
   box-shadow is used instead of outline so it is
   never clipped by overflow:hidden on parents.
================================================ */
.collection_container:has(a:focus-visible),
.collection_container:focus-visible {
    outline: none;
    /* box-shadow: 0 0 0 3px #275b91, 0 0 0 5px rgba(255,255,255,0.8);
    border-radius: 4px; */
}

/* Fallback for browsers without :has() (focus-within fires on mouse too,
   so we add :focus-within only as progressive enhancement) */
@supports not selector(:has(*)) {
    .collection_container:focus-within {
        outline: none;
        box-shadow: 0 0 0 3px #275b91, 0 0 0 5px rgba(255,255,255,0.8);
        border-radius: 4px;
    }
}

/* Suppress individual outline on invisible overlay links inside containers
   (the container box-shadow already shows the ring) */
.collection_container a:not(.button):not([class*="level_"]):focus {
    outline: none;
}


h{
    font-weight: var(--fw-bold);
    font-size: 20px;
}

.filter_display {
    max-width: 100%;
    padding: 10px;
    overflow: hidden;
}

.filter_display .filter-list {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center;
    gap: 16px;

    width: 100%;
    max-width: 100%;

    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;

    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;

    scrollbar-width: thin;
    scrollbar-color: #ccc transparent;
}

.filter_display .filter-list > li {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    white-space: nowrap;
}

.filter_display .filter-list > li > a.button_filter {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    text-decoration: none;
}

.filter_display .filter-list::-webkit-scrollbar {
    height: 6px;
}

.filter_display .filter-list::-webkit-scrollbar-track {
    background: transparent;
}

.filter_display .filter-list::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.collection_nav{
    display: contents;
}

.collection_wrapper {
    display: contents;
    margin: 0;
    padding: 0;
    list-style: none;
}

.collection_wrapper > li {
    display: contents;
    margin: 0;
    padding: 0;
    list-style: none;
}

.subtitle{
    margin-bottom: 100px;
}