/* Listy w ramce: konta osobiste / firmowe. */

.list-box {
	overflow: hidden;
	border-radius: var(--radius-4xl);
	border: var(--border-width) solid var(--color-border);
	background: var(--color-surface);
}

.list-box-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--space-12);
	padding: var(--space-20) var(--space-24);
	border-bottom: var(--border-width) solid var(--color-border);
}

.list-box-title {
	display: flex;
	align-items: center;
	gap: var(--space-10);
	font-size: var(--text-2xl);
}

.list-box-title .icon-md {
	color: var(--color-brand);
}

.account-row {
	display: flex;
	align-items: center;
	gap: var(--space-14);
	padding: var(--space-16) var(--space-24);
	border-bottom: var(--border-width) solid var(--color-tint);
}

.account-row:last-child {
	border-bottom: 0;
}

.account-row:hover {
	background: var(--color-surface-hover);
}

.account-row-text {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.account-row-title {
	font-weight: var(--weight-extrabold);
}

.account-row-meta {
	font-size: var(--text-sm);
	color: var(--color-text-muted);
}

.account-row-amount {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
}

.account-row-value {
	font-size: var(--text-lg);
	font-weight: var(--weight-extrabold);
	color: var(--color-brand);
	white-space: nowrap;
}

.account-row-label {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
}

/* Telefon: nazwa w pierwszej linii, kwota i przycisk pod nią (bez ściskania tekstu). */
@media (max-width: 600px) {
	.list-box-head {
		padding: var(--space-16) var(--space-18);
	}

	.list-box-title {
		font-size: var(--text-lg);
	}

	.account-row {
		flex-wrap: wrap;
		gap: var(--space-10) var(--space-12);
		padding: var(--space-14) var(--space-18);
	}

	.account-row-text {
		flex-basis: calc(100% - var(--size-bank-logo-sm) - var(--space-12));
	}

	.account-row-amount {
		flex: 1 1 auto;
		flex-direction: row;
		align-items: baseline;
		gap: var(--space-6);
		margin-left: calc(var(--size-bank-logo-sm) + var(--space-12));
	}
}