/**
 * By Bang Dynamic Downloads — frontend-styling.
 *
 * Flad liste af downloadbare filer: filtype-ikon til venstre, display-navn til
 * højre, hele linjen klikbar. Tynde grå separator-linjer mellem linjerne.
 * Separator-farve, ikon-størrelse og linjeafstand styres via CSS-variabler,
 * som Elementor-style-kontrollerne overskriver.
 */

/* ---------------------------------------------------------------------------
 * Container.
 * ------------------------------------------------------------------------- */
.bybang-downloads {
	--bybang-dl-separator: #e5e5e5;
	--bybang-dl-spacing: 12px;
	--bybang-dl-icon-size: 24px;
	width: 100%;
	margin: 0;
}

/* ---------------------------------------------------------------------------
 * Overskrift.
 * ------------------------------------------------------------------------- */
.bybang-downloads__heading {
	margin: 0 0 16px;
	padding-bottom: 8px;
	font-weight: 600;
	border-bottom: 1px solid var(--bybang-dl-separator);
}

/* ---------------------------------------------------------------------------
 * Liste.
 * ------------------------------------------------------------------------- */
.bybang-downloads__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.bybang-downloads__item {
	border-bottom: 1px solid var(--bybang-dl-separator);
}

.bybang-downloads__item:last-child {
	border-bottom: 0;
}

.bybang-downloads--no-separator .bybang-downloads__item {
	border-bottom: 0;
}

/* ---------------------------------------------------------------------------
 * Linje — hele linjen er et klikbart link.
 * ------------------------------------------------------------------------- */
.bybang-downloads__link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: var(--bybang-dl-spacing) 0;
	color: #1a1a1a;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.bybang-downloads__link:hover,
.bybang-downloads__link:focus-visible {
	background-color: rgba(0, 0, 0, 0.03);
	outline: none;
}

/* ---------------------------------------------------------------------------
 * Filtype-ikon.
 * ------------------------------------------------------------------------- */
.bybang-downloads__icon {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--bybang-dl-icon-size);
}

.bybang-downloads__icon svg {
	display: block;
	width: 100%;
	height: auto;
}

/* ---------------------------------------------------------------------------
 * Display-navn.
 * ------------------------------------------------------------------------- */
.bybang-downloads__name {
	flex: 1 1 auto;
	min-width: 0;
	line-height: 1.4;
}

.bybang-downloads__type {
	opacity: 0.55;
}

/* ---------------------------------------------------------------------------
 * Editor-besked når der ikke er nogen filer.
 * ------------------------------------------------------------------------- */
.bybang-downloads__empty {
	padding: 24px;
	text-align: center;
	color: #777777;
	background-color: #f5f5f5;
	border: 1px dashed #cccccc;
	border-radius: 12px;
	font-size: 14px;
}