/* Downloadseite: Filterknöpfe, Suchfeld und Zeilen-Karten (inc/dokument-filter.php). */

.dokfilter__bar {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem 1.25rem;
	align-items: center;
	justify-content: space-between;
	margin-bottom: .9rem;
}
.dokfilter__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.dokfilter__chip {
	padding: .7rem 1rem;
	border: 1.5px solid var(--line-strong);
	border-radius: var(--r-pill);
	background: var(--paper);
	color: var(--forest);
	font: 700 var(--fs-meta)/1 var(--font-mono);
	letter-spacing: .06em;
	cursor: pointer;
	transition: border-color .2s var(--ease), background-color .2s var(--ease), color .2s var(--ease);
}
.dokfilter__chip:hover { border-color: var(--orange); }
.dokfilter__chip[aria-pressed="true"] { background: var(--forest); border-color: var(--forest); color: var(--cream); }
/* Gleich wie das Suchfeld auf der Teamseite (team.css, .tfilter__suche). */
.dokfilter__suche {
	display: flex;
	align-items: center;
	gap: .4rem;
	flex: 0 0 12.5rem;
	width: 12.5rem;
	max-width: 100%;
	min-width: 0;
	padding: 0 .8rem;
	border: 1.5px solid var(--line-strong);
	border-radius: var(--r-pill);
	background: var(--paper);
	color: var(--ink-3);
}
.dokfilter__suche:focus-within { border-color: var(--orange); }
.dokfilter__suche svg { flex: none; width: 15px; height: 15px; }
.dokfilter__feld {
	width: 100%;
	min-width: 0;
	padding: .42rem 0;
	border: 0;
	outline: 0;
	background: none;
	color: var(--ink);
	font: inherit;
	font-size: var(--fs-small);
}
.dokfilter__zahl {
	margin: 0 0 .9rem;
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	color: var(--ink-3);
}
.dokfilter__zahl strong { color: var(--orange-dark); }
.dokfilter__leer { margin: 1rem 0 0; color: var(--ink-2); }

/* ---------- Zeilen-Karten ---------- */
.dokumente--karten { gap: .65rem; }
.dokumente--karten .dokument {
	padding: 1rem 5rem 1rem 1rem;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.dokumente--karten .dokument:first-child { border-top: 1px solid var(--line); }
.dokumente--karten .dokument:hover {
	background: var(--paper);
	border-color: var(--orange);
	box-shadow: var(--shadow-sm);
}
.dokumente--karten .dokument__typ {
	border: 0;
	border-radius: 4px 10px 4px 4px;
	background: #FDEEE1;
	color: var(--orange-dark);
}
.dokumente--karten .dokument__name { color: var(--forest); font-weight: 700; }
.dokumente--karten .dokument:hover .dokument__name { color: var(--forest); text-decoration: none; }
/* Rundes Download-Zeichen rechts. Es fängt keine Klicks ab - die ganze Zeile lädt herunter. */
.dokumente--karten .dokument::after {
	content: "";
	position: absolute;
	right: 1rem;
	top: 50%;
	width: 2.75rem;
	height: 2.75rem;
	margin-top: -1.375rem;
	border: 1.5px solid var(--line-strong);
	border-radius: 50%;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v11M7 10.5l5 5 5-5M5 20h14' fill='none' stroke='%23192729' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 20px no-repeat;
	pointer-events: none;
	transition: background-color .2s var(--ease), border-color .2s var(--ease);
}
.dokumente--karten .dokument:hover::after { background-color: var(--orange); border-color: var(--orange); }
.dokumente--karten .dokument[hidden] { display: none; }

@media (max-width: 600px) {
	.dokfilter__suche { flex-basis: 100%; }
	.dokumente--karten .dokument { padding-right: 1rem; }
	.dokumente--karten .dokument::after { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.dokfilter__chip, .dokumente--karten .dokument, .dokumente--karten .dokument::after { transition: none; }
}