/* Container mit 12-Spalten-Grid */
.frame-type-r2_downloads .downloads {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: var(--gap);
    align-items: start;
}


/* Vorschaubild: 4 Spalten */
.frame-type-r2_downloads .downloads.has-preview figure {
    grid-column: span 4;
    margin: 0;
}


.frame-type-r2_downloads .downloads.has-preview figure img {
    width: 100%;
    height: auto;
    display: block;
    /*box-shadow: var(--box-shadow);*/
}

.frame-type-r2_downloads .downloads ul{
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: var(--font-size-s-1);
    line-height: var(--line-height-s-1);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
}


/* Download-Liste: 8 Spalten (wenn Vorschaubild vorhanden) */
.frame-type-r2_downloads .downloads.has-preview ul {
    grid-column: span 8;
}


/* Download-Liste: 12 Spalten (wenn kein Vorschaubild) */
.frame-type-r2_downloads .downloads:not(.has-preview) ul {
    grid-column: span 12;
}


.frame-type-r2_downloads .downloads ul li {
    display: flex;
}


.frame-type-r2_downloads .downloads ul li a {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    outline: 1px solid rgb(var(--rgb_color_value_base));
    padding: var(--gap-s);
    gap: var(--gap-s);
    text-decoration: none;
    color: inherit;
    transition: background-color 0.2s ease;
}


.frame-type-r2_downloads .downloads ul li a:hover {
    background-color: rgba(var(--rgb_color_value_background_light_01),0.4);
}


.frame-type-r2_downloads .downloads .file-name {
    font-weight: bold;
    margin-bottom: 0.25rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5em;
}


.frame-type-r2_downloads .downloads .file-name-text {
    flex: 1;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: anywhere;
}


.frame-type-r2_downloads .downloads .file-name::after {
    content: "";
    display: block;
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16.8361448,9.52175144 L12.1611448,14.2717514 C12.1307587,14.3026251 12.0988014,14.3309295 12.0655345,14.3566646 L11.9837207,14.4132457 C11.8423066,14.5000907 11.6768898,14.55 11.5,14.55 C11.3584882,14.55 11.224319,14.518058 11.1040956,14.4608831 L10.9990264,14.4023559 L10.9347017,14.3567696 L10.8388552,14.2717514 L6.16385516,9.52175144 C5.79871495,9.15075336 5.79871495,8.54924664 6.16385516,8.17824856 C6.52899537,7.80725048 7.12100463,7.80725048 7.48614484,8.17824856 L10.56585,11.3053182 L10.565,2.2 C10.565,1.67532949 10.9836138,1.25 11.5,1.25 C12.0163862,1.25 12.435,1.67532949 12.435,2.2 L12.43585,11.3053182 L15.5138552,8.17824856 C15.8509077,7.83578879 16.3812687,7.80944574 16.748061,8.09921938 L16.8361448,8.17824856 C17.2012851,8.54924664 17.2012851,9.15075336 16.8361448,9.52175144 Z M20.1363636,17.6454545 C20.1363636,19.0537807 18.9763741,20.1954545 17.5454545,20.1954545 L5.45454545,20.1954545 C4.02362588,20.1954545 2.86363636,19.0537807 2.86363636,17.6454545 L2.86363636,14.2454545 C2.86363636,13.7760125 3.25029953,13.3954545 3.72727273,13.3954545 C4.20424592,13.3954545 4.59090909,13.7760125 4.59090909,14.2454545 L4.59090909,17.6454545 C4.59090909,18.1148966 4.97757226,18.4954545 5.45454545,18.4954545 L17.5454545,18.4954545 C18.0224277,18.4954545 18.4090909,18.1148966 18.4090909,17.6454545 L18.4090909,14.2454545 C18.4090909,13.7760125 18.7957541,13.3954545 19.2727273,13.3954545 C19.7497005,13.3954545 20.1363636,13.7760125 20.1363636,14.2454545 L20.1363636,17.6454545 Z"></path></svg>');
}


.frame-type-r2_downloads .downloads .file-properties {
    font-size: var(--font-size-s-2);
    line-height: var(--line-height-s-2);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--gap-s);
}


.frame-type-r2_downloads .downloads .file-extension {
    text-transform: uppercase;
}


.frame-type-r2_downloads .downloads .file-thumbnail {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: rgba(var(--rgb_color_value_background_light_01),0.4);
    border-radius: 4px;
}


.frame-type-r2_downloads .downloads .file-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}


.frame-type-r2_downloads .downloads .file-thumbnail svg {
    width: 40px;
    height: 40px;
    color: rgb(200, 200, 200);
}


.frame-type-r2_downloads .downloads .file-info {
    flex: 1;
}


/* Responsive Anpassungen */
@media (max-width: 1024px) {
    /* Bei mittleren Bildschirmen: Download-Liste auf 1 Spalte */
    .frame-type-r2_downloads .downloads.has-preview ul,
    .frame-type-r2_downloads .downloads:not(.has-preview) ul {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 600px) {
    /* Bei kleinen Bildschirmen: Alles untereinander */
    .frame-type-r2_downloads .downloads.has-preview {
        grid-template-columns: 1fr;
    }
    
    .frame-type-r2_downloads .downloads.has-preview figure,
    .frame-type-r2_downloads .downloads.has-preview ul {
        grid-column: span 1;
    }
    
    .frame-type-r2_downloads .downloads.has-preview figure {
        margin-bottom: var(--gap);
    }
}