/* Slide Themen-Einreichungen: Karten mit Tags, Filter und Aufklappen */

.filters { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-bottom: 1vh; }

.tag {
    font: inherit;
    font-size: clamp(.65rem, .8vw, .9rem);
    padding: .2em .7em;
    border-radius: 0;
    border: 1px solid var(--color-border);
    background: var(--color-bg-secondary);
    color: var(--color-text-secondary);
    cursor: pointer;
    transition: background var(--ux-transition), color var(--ux-transition);
}

.tag.on { background: var(--color-primary); border-color: var(--color-primary); color: #ffffff; font-weight: 700; }
.subtags .tag { cursor: default; }

.slidebody { overflow-y: auto; }

.subs {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(21rem, 1fr));
    gap: var(--space-3);
    align-content: start;
}

.sub {
    border: 1px solid var(--color-border);
    border-radius: 0;
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

.sub.focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-light); }

.subhead { display: block; width: 100%; text-align: left; background: none; border: 0; padding: var(--space-3) var(--space-4); cursor: pointer; min-height: 0; }
.subhead h3 { margin: 0 0 .25em; font-size: clamp(.9rem, 1.05vw, 1.15rem); color: var(--color-h1); line-height: 1.25; }
.subhead p { margin: 0 0 .5em; font-size: clamp(.75rem, .9vw, 1rem); color: var(--color-text-secondary); line-height: 1.35; }
.subtags { display: flex; gap: .3em; flex-wrap: wrap; }

.subdetail { display: none; padding: 0 var(--space-4) var(--space-4); font-size: clamp(.72rem, .85vw, .95rem); color: var(--color-text-primary); line-height: 1.5; white-space: pre-line; border-top: 1px solid var(--color-bg-tertiary); padding-top: var(--space-3); }
.sub.open .subdetail { display: block; }
.subdetail h4 { margin: 0 0 .4em; font-size: inherit; }
.subdetail blockquote { margin: 0; padding-left: 1em; border-left: 2px solid var(--color-border); }
.sub.open { grid-column: 1 / -1; }

.empty { color: var(--color-text-muted); font-size: 1rem; }
