





.ablage{container:ablage / inline-size;min-width:0}
.ablage--eingebettet,.ablage--streifen{display:flex;flex-direction:column;gap:var(--sp-2)}
.ablage > .wp-statuszeile{margin:var(--sp-2) 0 0}




.ablage-filter-zahl{font-weight:400;font-variant-numeric:tabular-nums}
.ablage-filter[aria-pressed="true"]{background:var(--zustand-flaeche);color:var(--zustand-text)}
.ablage-kopf-rechts{display:inline-flex;align-items:center;gap:var(--sp-2);margin-left:auto}
@container ablage-kopf (max-width:479px){
.ablage-kopf:has(> .ablage-filter) > .wp-akte-kopf-titel,.ablage-kopf--auswahl > .wp-akte-kopf-titel{display:none}
.ablage-kopf:has(> .ablage-filter) > .ablage-filter{margin-left:auto}
}
@container ablage (max-width:479px){
.ablage-kopf--auswahl{display:none}
}


.ablage-zone{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1) var(--sp-2);margin:var(--sp-2) 0 0;
padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);background:var(--gh-panel);font-size:var(--t-neben);color:var(--gh-text)}
.ablage-zone > .wp-i{width:var(--ico);height:var(--ico);flex:none}
.ablage-zone-ziel{color:var(--gh-muted)}


.ablage .dok-folder-head > .dok-folder-count{margin-right:var(--sp-2)}
.ablage .ablage-alle{flex:none}
.ablage-etiketten{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--sp-1) var(--sp-2)}


@container ablage (max-width:559px){
.ablage .dok-folder-head{flex-wrap:wrap;row-gap:var(--sp-1)}
.ablage .dok-folder-head > .dok-folder-title{flex:1 1 6rem;max-width:max-content;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
line-clamp:2;white-space:normal;overflow-wrap:break-word}
}


.ablage-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,9rem),1fr));align-items:start;gap:var(--sp-3) var(--sp-2)}
@container ablage (max-width:559px){
.ablage-raster{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-1)}
}
.ablage .ablage-kachel.fotos-thumb{position:relative;display:block;min-width:0;margin:0}
.ablage-kachel-bild{position:relative;display:block;width:100%;aspect-ratio:4 / 3;margin:0;padding:0;border:0;border-radius:var(--r-sm);
overflow:hidden;background:var(--kachel-bg);color:var(--gh-muted);font:inherit;cursor:zoom-in}
.ablage-bild{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.ablage-bild > img{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;-webkit-touch-callout:none}
.ablage-bild > .wp-i{width:var(--ico-lg);height:var(--ico-lg)}
.ablage-kachel-bild.ist-verweilt{outline:2px solid var(--gh-accent);outline-offset:2px}

.ablage-zuordnung{position:absolute;right:var(--sp-1);bottom:var(--sp-1);display:inline-flex;align-items:center;justify-content:center;
width:var(--chip-h);height:var(--chip-h);border-radius:var(--r-pill);background:var(--gh-panel);color:var(--gh-accent)}
.ablage-zuordnung > .wp-i{width:60%;height:60%}
.ablage-titelbild{position:absolute;left:var(--sp-1);bottom:var(--sp-1);display:inline-flex;max-width:calc(100% - var(--chip-h) - 3 * var(--sp-1))}
.ablage-titelbild > .wp-chip{background:var(--gh-panel);color:var(--gh-accent)}

.ablage-kachel-bild{container:ablage-kachel / inline-size}
.ablage-titelbild .wp-chip > .wp-i{display:none}
@container ablage-kachel (max-width:7.5rem){
.ablage-titelbild .wp-chip-text{display:none}
.ablage-titelbild .wp-chip > .wp-i{display:inline-block}
}

.ablage-kachel-name{display:none}
@container ablage (min-width:560px){
.ablage-kachel-name{display:block;margin-top:var(--sp-1);overflow:hidden;font-size:var(--t-neben);color:var(--gh-text);
white-space:nowrap;text-overflow:ellipsis}
.ablage-kachel-name.ist-leise{color:var(--gh-muted)}
}


.ablage-haken{position:absolute;left:var(--sp-1);top:var(--sp-1);display:inline-flex;align-items:center;justify-content:center;
width:var(--chip-h);height:var(--chip-h);border:2px solid var(--gh-border-strong);border-radius:var(--r-sm);
background:var(--gh-card);color:transparent}
.ablage-haken > .wp-i{width:70%;height:70%}
.ablage-kachel.selected .ablage-kachel-bild{outline:3px solid var(--gh-accent);outline-offset:-3px}
.ablage-kachel.selected .ablage-haken{border-color:var(--zustand-flaeche);background:var(--zustand-flaeche);color:var(--zustand-text)}
.ist-auswahl .ablage-kachel-bild{cursor:pointer}


.ablage-zeilen{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0}
.ablage-raster + .ablage-zeilen{margin-top:var(--sp-2)}
.ablage-abschnitt{display:flex;flex-direction:column;gap:var(--sp-1)}
.ablage-abschnitt-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1) var(--sp-2);margin-top:var(--sp-1);
font-size:var(--t-neben);color:var(--gh-muted)}
.ablage-abschnitt-kopf > .dok-folder-title{font-size:var(--t-neben);font-weight:400}
.ablage-abschnitt-kopf > .dok-folder-count{margin:0;font-size:var(--t-neben)}
.ablage-nachsatz{margin:var(--sp-1) 0 0;font-size:var(--t-neben);color:var(--gh-muted)}
.ablage-pk-hinweis{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) 0;font-size:var(--t-neben);color:var(--gh-muted)}
.ablage-pk-hinweis > .wp-i{width:var(--ico);height:var(--ico);flex:none}


.ablage-streifen{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:var(--sp-2)}
.ablage-streifen .ablage-kachel-bild{border-radius:var(--r-md)}
.ablage--streifen .ablage-kachel-name{display:none}
.ablage-neu{flex-direction:column;justify-content:center;gap:var(--sp-1);width:100%;height:auto;aspect-ratio:4 / 3}
.ablage-luecke{margin:0}
.ablage-luecke-bild{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);aspect-ratio:4 / 3;
padding:var(--sp-1);border-radius:var(--r-md);background:var(--kachel-bg);color:var(--gh-muted);font-size:var(--t-neben);text-align:center}
.ablage-luecke-bild > .wp-i{width:var(--ico);height:var(--ico)}


.ablage-vorschau{position:fixed;z-index:9600;min-width:15rem;max-width:20rem;padding:var(--sp-2) var(--sp-3);pointer-events:none;
border-radius:var(--r-md);background:var(--gh-card);box-shadow:0 0 0 var(--rand-haar) var(--gh-border),var(--shadow-md)}
.ablage-vorschau-titel{margin-bottom:var(--sp-1);font-weight:600;color:var(--gh-text)}
.ablage-vorschau-zeile{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--t-neben);line-height:1.6;color:var(--gh-muted)}
.ablage-vorschau-zeile > .wp-i{width:var(--ico);height:var(--ico);flex:none}

@media (hover:hover){
.ablage-kachel-bild:hover{outline:2px solid var(--gh-accent);outline-offset:-2px}
}

.ablage-kachel:is(:where(:root:not([data-wp-objekt-zieht],[data-wp-markierung-ruht])) [data-wp-markiert]){box-shadow:none}
.ablage-kachel:is(:where(:root:not([data-wp-objekt-zieht],[data-wp-markierung-ruht])) [data-wp-markiert]) > .ablage-kachel-bild{outline:var(--markierung-kontur) solid var(--gh-accent);outline-offset:1px}
