/*!
 * Accessible Keyboard Navigator - styles
 * Version: 1.0.0
 * License: MIT
 *
 * Written for maximum compatibility back to IE 9 / early Edge. Modern browsers
 * will pick up the CSS-variable lines and override the hardcoded fallback.
 *
 * To theme this:
 *   1) For modern browsers, override in your theme:
 *        :root { --akn-color: #e11d48; --akn-glow: rgba(225,29,72,0.45); }
 *   2) For old browsers, duplicate the rules below with your own colors.
 */

/* Default colors (used as fallback when CSS variables aren't supported). */
.akn-focused {
	outline: 3px solid #2563eb !important;              /* hardcoded fallback */
	outline: 3px solid var(--akn-color, #2563eb) !important;
	outline-offset: 3px !important;
	-webkit-box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.45) !important;
	        box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.45) !important;
	-webkit-box-shadow: 0 0 0 4px var(--akn-glow, rgba(37, 99, 235, 0.45)) !important;
	        box-shadow: 0 0 0 4px var(--akn-glow, rgba(37, 99, 235, 0.45)) !important;
	-webkit-transition: outline-offset 120ms ease, box-shadow 160ms ease;
	transition: outline-offset 120ms ease, box-shadow 160ms ease;
	position: relative;
	z-index: 10;
	border-radius: 4px;
}

/* One-shot pulse on focus. Uses ::after which works in IE 9+. */
.akn-focused:after {
	content: "";
	position: absolute;
	top: -6px;
	right: -6px;
	bottom: -6px;
	left: -6px;
	border-radius: inherit;
	pointer-events: none;
	-webkit-animation: akn-pulse 0.55s ease-out;
	        animation: akn-pulse 0.55s ease-out;
}

@-webkit-keyframes akn-pulse {
	0%   { -webkit-box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.45); }
	100% { -webkit-box-shadow: 0 0 0 14px rgba(37, 99, 235, 0);  }
}
@keyframes akn-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.45); }
	100% { box-shadow: 0 0 0 14px rgba(37, 99, 235, 0);  }
}

/*
 * Force submenus to appear when the plugin opens them via keyboard.
 * Most WordPress themes hide .sub-menu with display:none or visibility:hidden
 * and only show it on :hover. These rules override that for keyboard users.
 */
li.akn-open > ul,
li.akn-open > .sub-menu,
li.akn-open > .submenu,
.akn-submenu-open {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
	-webkit-transform: none !important;
	    -ms-transform: none !important;
	        transform: none !important;
	left: auto !important;          /* undo off-screen hides */
	clip: auto !important;          /* undo screen-reader-only hides */
	height: auto !important;
	overflow: visible !important;
}

/* Respect reduced-motion preference on browsers that support it. */
@media (prefers-reduced-motion: reduce) {
	.akn-focused { -webkit-transition: none; transition: none; }
	.akn-focused:after { -webkit-animation: none; animation: none; }
}