/* Przyciski, linki „więcej”, chipy (filtry). */

.button-primary,
.button-brand,
.button-ghost,
.button-outline-light {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-8);
	min-height: var(--size-button);
	padding: 0 var(--space-22);
	border-radius: var(--radius-lg);
	border: 0;
	font-weight: var(--weight-extrabold);
	font-size: var(--text-base);
	line-height: var(--leading-snug);
	text-decoration: none;
	text-align: center;
	transition: background-color var(--duration-fast), color var(--duration-fast);
}

.button-primary {
	background: var(--color-cta);
	color: var(--color-on-cta);
}

.button-primary:hover {
	background: var(--color-cta-hover);
	color: var(--color-on-cta);
}

.button-brand {
	background: var(--color-brand);
	color: var(--color-on-dark);
	cursor: pointer;
}

.button-brand:hover {
	background: var(--color-brand-strong);
	color: var(--color-on-dark);
}

.button-ghost {
	min-height: var(--size-touch);
	padding: 0 var(--space-14);
	font-size: var(--text-md);
	color: var(--color-brand);
	background: var(--color-surface);
	border: var(--border-width) solid var(--color-border-strong);
}

.button-ghost:hover {
	background: var(--color-tint);
	color: var(--color-brand);
}

.button-outline-light {
	font-weight: var(--weight-bold);
	color: var(--color-on-dark);
	background: transparent;
	border: var(--border-width-thick) solid var(--color-on-dark-outline);
}

.button-outline-light:hover {
	color: var(--color-on-dark);
	border-color: var(--color-on-dark);
}

.button-sm {
	min-height: var(--size-touch);
	font-size: var(--text-md);
}

.button-md {
	min-height: var(--size-button-lg);
	border-radius: var(--radius-xl);
}

.button-lg {
	min-height: var(--size-button-xl);
	padding: 0 var(--space-26);
	border-radius: var(--radius-xl);
}

.button-xl {
	min-height: var(--size-button-cta);
	border-radius: var(--radius-xl);
}

.button-block {
	display: flex;
	width: 100%;
}

.button-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-12);
}

/* Link „Wszystkie promocje →” */
.link-more {
	display: inline-flex;
	align-items: center;
	gap: var(--space-6);
	min-height: var(--size-touch);
	font-weight: var(--weight-extrabold);
	color: var(--color-brand);
	text-decoration: none;
}

.link-more:hover {
	color: var(--color-accent-text);
}

.link-more-sm {
	font-size: var(--text-md);
}

/* Chip = zakładka / filtr (pigułka). Aktywny: aria-pressed="true" albo .is-active */
.chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-8);
	margin-bottom: var(--space-28);
}

.chip-row-flush {
	margin-bottom: 0;
}

.chip {
	display: inline-flex;
	font-family: inherit;
	cursor: pointer;
	align-items: center;
	min-height: var(--size-touch);
	padding: 0 var(--space-18);
	border-radius: var(--radius-pill);
	border: var(--border-width) solid var(--color-border-strong);
	background: var(--color-surface);
	color: var(--color-brand);
	font-size: var(--text-md);
	font-weight: var(--weight-bold);
	text-decoration: none;
	white-space: nowrap;
}

.chip:hover {
	background: var(--color-tint);
	color: var(--color-brand);
}

.chip[aria-pressed="true"],
.chip.is-active {
	background: var(--color-brand);
	border-color: var(--color-brand);
	color: var(--color-on-dark);
	font-weight: var(--weight-extrabold);
}

.chip-sm {
	min-height: var(--size-touch);
	padding: 0 var(--space-12);
	font-size: var(--text-sm);
}

.card-link {
	color: inherit;
	text-decoration: none;
}

.card-link:hover {
	color: var(--color-brand);
	text-decoration: underline;
}