/* Nextl360 — small hand-written rules that Tailwind's utility classes
   can't express: focus styles, reduced-motion handling, and a couple
   of brand touches (selection color, scrollbar). Everything else is
   Tailwind utilities in markup + the inline config in functions.php. */

:root {
	color-scheme: dark;
}

::selection {
	background: #f0a92e;
	color: #0a0c10;
}

/* Visible focus ring everywhere — never remove outline without a
   replacement. Tailwind's focus-visible utilities cover most
   interactive elements in markup; this is the fallback for anything
   that slips through (skip link aside, which sets its own). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid #f0a92e;
	outline-offset: 2px;
	border-radius: 4px;
}

/* Scrollbar, dark-themed (WebKit + Firefox) */
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}
::-webkit-scrollbar-track {
	background: #0a0c10;
}
::-webkit-scrollbar-thumb {
	background: #323846;
	border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover {
	background: #4b5160;
}
html {
	scrollbar-color: #323846 #0a0c10;
}

/* Header: solid background once the page has scrolled past the hero. */
#site-header.is-scrolled {
	background-color: rgba(10, 12, 16, 0.92);
	backdrop-filter: blur(10px);
	border-bottom-color: #1b1f29;
}

/* Respect reduced-motion: disable AOS's transform/opacity animation
   and show all content in its resting state immediately. */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	[data-aos] {
		opacity: 1 !important;
		transform: none !important;
	}
}

/* Minimal prose tuning for the dark theme on generic pages. */
.prose-invert :where(a):not(:where([class~="not-prose"] *)) {
	text-decoration-line: underline;
	text-underline-offset: 2px;
}