/**
 * Træinfo Core — Navigation Blocks CSS
 *
 * Styles for:
 *   - traeinfo/child-pages   (.traeinfo-child-pages)
 *   - traeinfo/sibling-pages (.traeinfo-sibling-pages)
 *   - traeinfo/various-resources (.traeinfo-resources-list)
 *
 * BEM-structured, design-token-driven styles.
 */

/* ==========================================================================
   Shared List Resets & Basic Navigation Styling
   ========================================================================== */

.traeinfo-child-pages,
.traeinfo-sibling-pages,
.traeinfo-resources-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.traeinfo-child-pages__item,
.traeinfo-sibling-pages__item,
.traeinfo-resources-list__item {
	margin-bottom: var(--wp--preset--spacing--20, 0.75rem);
	padding: 0;
}

.traeinfo-child-pages__item:last-child,
.traeinfo-sibling-pages__item:last-child,
.traeinfo-resources-list__item:last-child {
	margin-bottom: 0;
}

/* ==========================================================================
   Links & Hover States
   ========================================================================== */

.traeinfo-child-pages__link,
.traeinfo-sibling-pages__link,
.traeinfo-resources-list__link {
	color: var(--wp--preset--color--primary, currentColor);
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.traeinfo-child-pages__link:hover,
.traeinfo-child-pages__link:focus-visible,
.traeinfo-sibling-pages__link:hover,
.traeinfo-sibling-pages__link:focus-visible,
.traeinfo-resources-list__link:hover,
.traeinfo-resources-list__link:focus-visible {
	color: var(--wp--preset--color--primary-hover, #0056b3);
	text-decoration: none;
}

/* Transitions — opt-in for users who have not requested reduced motion. */
@media (prefers-reduced-motion: no-preference) {
	.traeinfo-child-pages__link,
	.traeinfo-sibling-pages__link,
	.traeinfo-resources-list__link {
		transition: color 0.2s ease-in-out, text-decoration-color 0.2s ease-in-out;
	}
}

/* ==========================================================================
   Page Excerpt Formatting
   ========================================================================== */

.traeinfo-pages-excerpt {
	margin-top: var(--wp--preset--spacing--10, 0.25rem);
	font-size: var(--wp--preset--font-size--small, 0.875rem);
	line-height: 1.4;
	color: var(--wp--preset--color--contrast-2, #555555);
}

/* ==========================================================================
   Various Resources Block Specifics
   ========================================================================== */

.traeinfo-resources-list__heading {
	font-weight: 600;
	margin-top: 0;
	margin-bottom: var(--wp--preset--spacing--20, 0.5rem);
	font-size: var(--wp--preset--font-size--medium, 1.125rem);
}

.traeinfo-resources-list__link {
	display: inline-flex;
	align-items: baseline;
	gap: 0.3em;
}

.traeinfo-resources-list__external-indicator {
	display: inline-block;
	font-size: 0.85em;
	line-height: 1;
	opacity: 0.85;
}

/* External indicator animation — opt-in for users who have not requested reduced motion. */
@media (prefers-reduced-motion: no-preference) {
	.traeinfo-resources-list__external-indicator {
		transition: transform 0.15s ease-in-out;
	}

	.traeinfo-resources-list__link:hover .traeinfo-resources-list__external-indicator,
	.traeinfo-resources-list__link:focus-visible .traeinfo-resources-list__external-indicator {
		transform: translate(2px, -2px);
		opacity: 1;
	}
}