/* =========================================================================
   ITX-Dokumentliste – minimales Layout-CSS.
   Optik (Farben, Rahmen, Abstände, Größen) läuft über CSS-Variablen mit
   Prefix --dok_. Das Modul SETZT keine Variablen selbst – die Standardwerte
   stehen als Fallback direkt in var(). Werte lassen sich daher überall
   (z. B. :root, eine Wrapper-Klasse oder .dokumente-liste) ohne erhöhte
   Spezifität und ohne !important definieren.
   Vollständige Variablenliste: siehe Moduleinstellungen.
   ========================================================================= */

.dokumente-liste {
	display: flex;
	flex-direction: column;
	gap: var(--dok_list-gap, .6rem);          /* Gap zwischen den Dokumenten */
	margin: var(--dok_list-margin, 1.5rem 0);
	padding: 0;
	list-style: none;
}

.dokumente-liste__item {
	margin: 0;
	padding: 0;
}

/* Ein Dokument-Item = der gesamte Link (eine Zeile) */
.dokument-item {
	display: flex;
	align-items: center;
	gap: var(--dok_item-gap, .6rem);          /* Gap zwischen Icon und Titel/Text */
	padding: var(--dok_pad, .75rem 1rem);
	background: var(--dok_bg, transparent);
	border: var(--dok_border-width, 0) var(--dok_border-style, solid) var(--dok_border-color, currentColor);
	border-radius: var(--dok_radius, 10px);
	text-decoration: none;
	color: inherit;
	transition: border-color .18s ease, background-color .18s ease;
}

.dokument-item:hover,
.dokument-item:focus-visible {
	border-color: var(--dok_border-color-hover, var(--dok_border-color, currentColor));
	background: var(--dok_bg-hover, transparent);
	outline: none;
}

/* Dokument-Icon (links) */
.dokument-item__icon {
	flex: 0 0 auto;
	display: flex;
	width: var(--dok_icon-size, 34px);
	height: var(--dok_icon-size, 34px);
	color: var(--dok_icon-color, currentColor);
}

.dokument-item__icon svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* Titel + Zusatztext (gestapelt) */
.dokument-item__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.dokument-item__title {
	font-weight: var(--dok_title-weight, 600);
	line-height: 1.3;
	color: var(--dok_title-color, inherit);
}

.dokument-item__text {
	font-size: var(--dok_text-size, .9rem);
	line-height: 1.35;
	color: var(--dok_text-color, inherit);
}

/* Download-Icon (rechts) */
.dokument-item__download {
	flex: 0 0 auto;
	margin-left: auto;
	display: flex;
	width: var(--dok_dl-size, 24px);
	height: var(--dok_dl-size, 24px);
	color: var(--dok_dl-color, currentColor);
	transition: color .18s ease, transform .18s ease;
}

.dokument-item__download svg {
	width: 100%;
	height: 100%;
	display: block;
}

.dokument-item:hover .dokument-item__download {
	color: var(--dok_dl-color-hover, var(--dok_dl-color, currentColor));
	transform: translateY(2px);
}

/* Leer-Zustand */
.dokumente-leer {
	font-style: italic;
	opacity: .7;
}