/* © Haut Forvalting AS (Org.nr. 931 603 760) — Altibedrift.
 * Konfidensiell arkitektur/arbeidsdokument. Uautorisert kopiering/distribusjon forbudt.
 * MTA output with integration corrections for static cards and focus contrast.
 */
/* ==========================================================================
   MTA — MORPHE TRANSFORMATION ARCHITECT
   TARGET: WEBSJEKK-PAGE-SURFACE-003 (/ai-og-automatisering/)
   SCOPE: html body[data-ws-experience="2"][data-ws-ai-surface="1"] main
   ========================================================================== */

html body[data-ws-experience="2"][data-ws-ai-surface="1"] main {
  --mta-ease: cubic-bezier(0.2, 0, 0, 1);
  --mta-trans: 180ms var(--mta-ease);
}

/* 1. Interaksjonsflater & Knapper (Feedback) */
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .button,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .ai-auto-text-link,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .traffic-journey__link,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .ai-auto-signal-card a,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .ws-mention-traffic a {
  transition: transform var(--mta-trans), box-shadow var(--mta-trans), filter var(--mta-trans);
}

/* Active / Pressed-tilstand (Gjelder Touch og Mus) */
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .button:active,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .ai-auto-text-link:active,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .traffic-journey__link:active,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .ai-auto-signal-card a:active,
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .ws-mention-traffic a:active {
  transform: scale(0.98);
}

/* 2. Hover-tilstander (KUN for fine pointer, skjermet fra touch) */
@media (hover: hover) and (pointer: fine) {
  html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .button:hover,
  html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .traffic-journey__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(16, 39, 36, 0.08);
  }

  html body[data-ws-experience="2"][data-ws-ai-surface="1"] main .button--primary:hover {
    filter: brightness(1.05);
  }


}

/* 3. Tilgjengelighet for native checkboxes (Fokusflytting til span) */
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main input[type="checkbox"]:focus-visible {
  outline: none; /* Skjuler standard outline hvis vi flytter den til span */
}
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main input[type="checkbox"]:focus-visible + span {
  outline: 3px solid #397651;
  outline-offset: 4px;
  border-radius: 2px;
}
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main input[type="checkbox"] {
  transition: transform var(--mta-trans);
}
html body[data-ws-experience="2"][data-ws-ai-surface="1"] main input[type="checkbox"]:active {
  transform: scale(0.9);
}

/* 4. Nøytralisering av all overflødig animasjon (Pre-MTA arv) og sikring av Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  html body[data-ws-experience="2"][data-ws-ai-surface="1"] main *,
  html body[data-ws-experience="2"][data-ws-ai-surface="1"] main *::before,
  html body[data-ws-experience="2"][data-ws-ai-surface="1"] main *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;

  }
}

@media(prefers-reduced-motion: reduce) {
 html body[data-ws-experience="2"][data-ws-ai-surface="1"] main :is(.button,.ai-auto-text-link,.traffic-journey__link,.ai-auto-signal-card a,.ws-mention-traffic a,input[type="checkbox"]):is(:active,:hover) { transform:none !important; }
}
