/*
 * Site-wide navigation feedback (assets/js/nav-feedback.js).
 *
 * Only the pressed-link pattern has visual output - hover prefetch is
 * network-only. .cw-nav-pressed is added to whatever <a> was clicked, so this
 * has to work whether that anchor is a single line of body text, a nav item,
 * or a whole product card wrapped in a link: the dim+scale never shifts
 * layout, and the ring anchors to the element's own corner so it reads
 * sensibly at any size.
 */

.cw-nav-pressed {
	position: relative;
	opacity: .7;
	transform: scale(.985);
	transition: opacity .15s ease, transform .15s ease;
}

.cw-nav-pressed::after {
	content: '';
	position: absolute;
	top: 4px;
	right: 4px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	border: 2px solid rgba(0, 0, 0, .14);
	border-top-color: var(--cw-lime, #80bc00);
	animation: cw-nav-spin .7s linear infinite;
	pointer-events: none;
}

@keyframes cw-nav-spin {
	to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
	.cw-nav-pressed {
		transition: none;
		transform: none;
	}

	.cw-nav-pressed::after {
		animation: none;
		opacity: .55;
	}
}