/**
 * Accessibility — Global focus styles and WCAG AA helpers
 *
 * Standalone file enqueued AFTER nivo-saas-style so it can safely
 * override any outline:none rules in compiled component CSS.
 *
 * Principles:
 *   - :focus-visible  → keyboard / AT users receive a visible ring
 *   - :focus:not(:focus-visible) → mouse clicks suppress the ring
 *   - prefers-reduced-motion → disable non-essential animation
 *
 * @package NivoSaaS
 * @since   1.0.0
 */

/* ── 1. Global focus-visible ring ──────────────────────────────
   Visible on every interactive element during keyboard navigation.
   Uses the brand primary colour from theme.json so it respects
   any future Site Editor colour overrides.                       */

:focus-visible {
	outline: 2px solid var( --wp--preset--color--primary-500, #6b55f1 );
	outline-offset: 3px;
	border-radius: 3px;
}

/* Suppress visible outline on mouse / touch interactions */
:focus:not( :focus-visible ) {
	outline: none;
}

/* ── 2. Navigation links ────────────────────────────────────────
   Tighter radius matches the pill-style nav items.               */

.nivo-header__nav .wp-block-navigation-item__content:focus-visible,
.nivo-header__nav .wp-block-navigation__submenu-icon:focus-visible,
.nivo-header__nav .wp-block-navigation-item__label:focus-visible {
	outline: 2px solid var( --wp--preset--color--primary-500, #6b55f1 );
	outline-offset: 2px;
	border-radius: var( --wp--custom--border-radius--md, 6px );
}

/* ── 3. Buttons ─────────────────────────────────────────────────*/

.wp-block-button__link:focus-visible,
.nivo-header__cta .wp-block-button__link:focus-visible {
	outline: 2px solid var( --wp--preset--color--primary-500, #6b55f1 );
	outline-offset: 3px;
}

/* ── 4. Form elements ───────────────────────────────────────────
   Restores a visible ring for keyboard users, overriding the
   outline:none in forms.css which was a WCAG AA failure.
   The existing border-color + box-shadow from forms.css is kept;
   we simply add the 2px brand outline on top.                    */

input[type="text"]:focus-visible,
input[type="email"]:focus-visible,
input[type="password"]:focus-visible,
input[type="search"]:focus-visible,
input[type="url"]:focus-visible,
input[type="tel"]:focus-visible,
input[type="number"]:focus-visible,
input[type="date"]:focus-visible,
input[type="time"]:focus-visible,
input[type="month"]:focus-visible,
input[type="week"]:focus-visible,
input[type="datetime-local"]:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid var( --wp--preset--color--primary-500, #6b55f1 );
	outline-offset: 0;
}

/* ── 5. Visual-card links ───────────────────────────────────────*/

.nivo-visual-card__btn:focus-visible {
	outline: 2px solid var( --wp--preset--color--primary-500, #6b55f1 );
	outline-offset: 3px;
	border-radius: var( --wp--custom--border-radius--md, 6px );
}

/* ── 6. FAQ, pricing, and other interactive block elements ─────*/

.nivo-faq__question:focus-visible,
.nivo-pricing__toggle-btn:focus-visible {
	outline: 2px solid var( --wp--preset--color--primary-500, #6b55f1 );
	outline-offset: 2px;
	border-radius: var( --wp--custom--border-radius--md, 6px );
}

/* ── 7. Footer navigation links ─────────────────────────────── */

.nivo-footer a:focus-visible {
	outline: 2px solid var( --wp--preset--color--primary-400, #8b77f5 );
	outline-offset: 2px;
	border-radius: 2px;
}

/* ── 8. Reduced motion ──────────────────────────────────────────
   Honour the OS "reduce motion" preference.
   Keeps instant transitions — removes decorative animation.      */

@media ( prefers-reduced-motion: reduce ) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}