/*
 * CSSFlow V4.3 final CTA/icon and gallery-navigation polish.
 * Additive styles only; safe to load after the existing CSSFlow stylesheets.
 */

.cssflow-button--with-icon {
	gap: 8px;
}

.cssflow-button__icon {
	fill: none;
	flex: 0 0 auto;
	height: 19px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.9;
	width: 19px;
}

.cssflow-header-cta .cssflow-button__icon {
	height: 18px;
	width: 18px;
}

.cssflow-gallery__nav-button {
	align-items: center;
	background: #ffffff;
	border: 1.5px solid #cfd5e1;
	border-radius: 11px;
	box-shadow: 0 5px 14px rgba(23, 32, 51, 0.07);
	color: #344054;
	display: inline-flex;
	height: 48px;
	justify-content: center;
	min-height: 48px;
	padding: 0;
	transition:
		background-color 160ms ease,
		border-color 160ms ease,
		box-shadow 160ms ease,
		color 160ms ease,
		transform 160ms ease;
	width: 48px;
}

.cssflow-gallery__nav-button svg {
	fill: none;
	height: 24px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2.2;
	width: 24px;
}

.cssflow-gallery__nav-button:hover {
	background: #f3f1ff;
	border-color: rgba(91, 76, 240, 0.52);
	box-shadow: 0 8px 20px rgba(91, 76, 240, 0.14);
	color: var(--cssflow-accent, #5b4cf0);
	transform: translateY(-1px);
}

.cssflow-gallery__nav-button:active {
	transform: translateY(0);
}

.cssflow-gallery__nav-button:focus-visible {
	outline: 3px solid rgba(91, 76, 240, 0.25);
	outline-offset: 3px;
}

@media (max-width: 760px) {
	.cssflow-gallery__nav-button {
		height: 46px;
		min-height: 46px;
		width: 46px;
	}

	.cssflow-gallery__nav-button svg {
		height: 22px;
		width: 22px;
	}
}
