/*
 * Glowence Anchor Nav: pill links to sections on the same page.
 * Stacked and left-aligned on desktop, a centred row on tablet, a centred
 * stack on mobile. Every value can be overridden from the Style tab.
 */

.glowence-anchor-nav {
	--glw-anchor-direction: column;
	--glw-anchor-align: flex-start;
	--glw-anchor-gap: 1rem;
	--glw-anchor-padding: 0.75rem 1.5rem;
	--glw-anchor-color: var(--e-global-color-text, #6f6c6a);
	--glw-anchor-bg: transparent;
	--glw-anchor-border: var(--e-global-color-glw_light_gray, #e2dfde);
	--glw-anchor-border-width: 1px;
	--glw-anchor-hover-color: var(--e-global-color-glw_warm_white, #fffcfb);
	--glw-anchor-hover-bg: var(--e-global-color-primary, #af6200);
	--glw-anchor-hover-border: var(--glw-anchor-hover-bg);
	--glw-anchor-transition: 0.25s;
}

.glowence-anchor-nav__list {
	display: flex;
	flex-direction: var(--glw-anchor-direction);
	flex-wrap: wrap;
	align-items: var(--glw-anchor-align);
	justify-content: var(--glw-anchor-align);
	gap: var(--glw-anchor-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.glowence-anchor-nav__item {
	margin: 0;
	padding: 0;
}

.glowence-anchor-nav .glowence-anchor-nav__link {
	display: inline-block;
	padding: var(--glw-anchor-padding);
	border: var(--glw-anchor-border-width) solid var(--glw-anchor-border);
	border-radius: 999px;
	background-color: var(--glw-anchor-bg);
	color: var(--glw-anchor-color);
	text-decoration: none;
	transition: color var(--glw-anchor-transition) ease, background-color var(--glw-anchor-transition) ease, border-color var(--glw-anchor-transition) ease;
}

.glowence-anchor-nav .glowence-anchor-nav__link:hover,
.glowence-anchor-nav .glowence-anchor-nav__link:focus-visible {
	border-color: var(--glw-anchor-hover-border);
	background-color: var(--glw-anchor-hover-bg);
	color: var(--glw-anchor-hover-color);
}

.elementor-widget-glowence-anchor-nav.glowence-anchor-nav--sticky-yes {
	position: sticky;
	top: var(--glw-anchor-top, 8rem);
	z-index: 2;
}

@media (max-width: 991px) {
	.glowence-anchor-nav {
		--glw-anchor-direction: row;
		--glw-anchor-align: center;
		--glw-anchor-padding: 0.75rem 1.35rem;
	}
}

@media (max-width: 767px) {
	.glowence-anchor-nav {
		--glw-anchor-padding: 0.75rem 1.25rem;
	}
}

@media (max-width: 479px) {
	.glowence-anchor-nav {
		--glw-anchor-direction: column;
		--glw-anchor-padding: 0.75rem 1.125rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.glowence-anchor-nav .glowence-anchor-nav__link {
		transition: none;
	}
}
