/* =========================================================
   Accessibility-fixes — WCAG 2.1 AA-baseline
   Norsk lov om Universell utforming krever dette.

   Dekker:
     - Synlig fokus-indicator på ALLE interaktive elementer
     - prefers-reduced-motion-støtte (slå av animasjoner)
     - prefers-contrast-støtte (sterkere kontraster)
     - Forced-colors mode (Windows high-contrast)
     - Touch-target min-størrelse på små viewports
     - Screen-reader-only utility
   ========================================================= */

/* ---------- Synlig fokus-ring overalt ---------- */
/* Bruker :focus-visible slik at fokus-ringen kun vises ved tastatur-fokus,
   ikke ved mus-klikk (mindre visuell støy for klikkende brukere). */
:focus-visible {
	outline: 2px solid var(--shop-navy, #1E3A5F);
	outline-offset: 2px;
	border-radius: 2px;
}
/* Buttons og links får tydeligere ring */
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid var(--shop-navy, #1E3A5F);
	outline-offset: 3px;
	box-shadow: 0 0 0 6px rgba(30, 58, 95, 0.18);
}
/* Form-inputs får inset ring (bevarer plass) */
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid var(--shop-navy, #1E3A5F);
	outline-offset: -1px;
}

/* ---------- Skip-link (allerede i header.php) ---------- */
.skip-link.screen-reader-text {
	position: absolute; left: -9999px;
	width: 1px; height: 1px; overflow: hidden;
}
.skip-link.screen-reader-text:focus {
	position: fixed; top: 12px; left: 12px;
	width: auto; height: auto;
	padding: 12px 18px;
	background: var(--shop-navy, #1E3A5F); color: #FFFFFF;
	font-weight: 700; font-size: 14px;
	border-radius: 6px; z-index: 10000;
	outline: 3px solid #FFFFFF;
}

/* ---------- Reduced motion ---------- */
@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;
	}
	.ec-prod-card:hover { transform: none; }
	.ec-prod-card:hover .ec-prod-card-img-wrap img { transform: none; }
}

/* ---------- High contrast / Windows forced-colors ---------- */
@media (forced-colors: active) {
	.ec-prod-card,
	.ec-shop-filter-block,
	.ec-meili-sidebar,
	.ec-shop-mobile-drawer,
	.ec-mini-cart-drawer {
		border: 1px solid CanvasText;
	}
	.ec-badge { border: 1px solid CanvasText; }
	.ec-btn { border: 1px solid ButtonText; }
}

/* ---------- Touch-targets på mobile ---------- */
@media (max-width: 800px) {
	a,
	button,
	input[type="checkbox"],
	input[type="radio"],
	[role="button"],
	[role="link"] {
		/* WCAG 2.5.5 — minimum 44×44px klikkbart område */
		min-height: 44px;
		min-width: 44px;
	}
	/* Unntak: inline-lenker i tekst skal IKKE bli 44px */
	p a, li a, span a, .ec-meta a {
		min-height: auto; min-width: auto;
	}
}

/* ---------- Screen-reader-only utility ---------- */
.sr-only,
.screen-reader-text {
	position: absolute !important;
	width: 1px !important; height: 1px !important;
	padding: 0 !important; margin: -1px !important;
	overflow: hidden !important; clip: rect(0,0,0,0) !important;
	white-space: nowrap !important; border: 0 !important;
}

/* ---------- Live-region for screen readers ---------- */
[aria-live] { /* allerede styled av ec-toast-container */ }

/* ---------- Disabled states ---------- */
[disabled],
[aria-disabled="true"] {
	cursor: not-allowed !important;
	opacity: 0.5;
}

/* ---------- Selected/active states for tabs/views ---------- */
[aria-pressed="true"],
[aria-selected="true"] {
	font-weight: 700;
}

/* ---------- Sufficient color contrast for placeholder text ---------- */
::placeholder { color: #64748B; opacity: 1; }
