/*
 * [kd_download] — free-standing download buttons.
 * Reuses the .kdtc-calc header/body shell from kdtc-shared.css; this file
 * only adds the button list itself.
 */

/* Stretch to fill its container instead of capping at kdtc-shared's 640px,
 * so width can be set from Elementor (same override kd-names.css uses). */
.kdtc-downloads {
	max-width: 100%;
	width: 100%;
}

.kdtc-downloads__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.9em;
}

.kdtc-downloads__item {
	flex: 1 1 220px;
	display: flex;
	align-items: center;
	gap: 0.8em;
	padding: 0.9em 1em;
	border: 1px solid var(--kdtc-border);
	border-radius: var(--kdtc-radius-sm);
	background: var(--kdtc-panel-bg);
	text-decoration: none;
	color: var(--kdtc-ink);
	transition: border-color 120ms ease, background 120ms ease, transform 120ms ease;
}

.kdtc-downloads__item:hover,
.kdtc-downloads__item:focus-visible {
	border-color: var(--kdtc-accent);
	background: var(--kdtc-accent-soft);
	transform: translateY(-1px);
}

.kdtc-downloads__item:focus-visible {
	outline: 2px solid var(--kdtc-accent);
	outline-offset: 2px;
}

.kdtc-downloads__icon {
	flex: 0 0 auto;
	width: 2.3em;
	height: 2.3em;
	border-radius: 50%;
	background: var(--kdtc-accent);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.kdtc-downloads__icon svg {
	width: 1.15em;
	height: 1.15em;
	fill: currentColor;
}

.kdtc-downloads__text {
	display: flex;
	flex-direction: column;
	gap: 0.15em;
	min-width: 0;
}

.kdtc-downloads__label {
	font-weight: 700;
	font-size: 0.98em;
	line-height: 1.25;
}

.kdtc-downloads__meta {
	font-size: 0.8em;
	color: var(--kdtc-muted);
}

@media (max-width: 420px) {
	.kdtc-downloads__item {
		flex: 1 1 100%;
	}
}