/* fairInstitut Lernapp: gemeinsame Rueckmeldung fuer bedienbare Elemente.
   Inhalt bleibt ruhig. Nur echte Schaltflaechen, Kartenlinks und Eingabefelder
   reagieren auf Maus, Tastatur oder Beruehrung. */
:root{
  --fi-interaktion-gold:var(--gold,#b6892f);
  --fi-interaktion-ease:cubic-bezier(.2,.7,.2,1);
  --fi-interaktion-dauer:.18s;
  --fi-interaktion-bg:rgba(182,137,47,.10);
  --fi-interaktion-schatten:0 4px 10px rgba(20,30,45,.08),0 12px 26px rgba(20,30,45,.14);
}

:where(
  a[href],
  button,
  summary,
  [role="button"],
  input,
  select,
  textarea
){
  -webkit-tap-highlight-color:rgba(182,137,47,.18);
}

/* Grundzustand aller drueckbaren Steuerelemente. */
:where(
  button:not(:disabled),
  a.btn:not([aria-disabled="true"]),
  [role="button"]:not([aria-disabled="true"]),
  [role="radio"]:not([aria-disabled="true"]),
  summary,
  .choice,
  .exam-tab,
  .mini,
  .nav-dot,
  .vclose,
  .fi-lies,
  .liveq-opt:not(:disabled),
  #liveq-badge,
  #t34a-consent-ok,
  #pwa-install,
  #fi-a11y-open,
  #fi-a11y-close
){
  cursor:pointer;
  transition:
    background-color var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    border-color var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    color var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    box-shadow var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    filter var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    transform .11s var(--fi-interaktion-ease);
}

/* Links, die optisch wie Schaltflaechen oder Karten gebaut sind. */
:where(
  a.modecard,
  a.nav-btn,
  a.hbtn,
  a.primary,
  a.sec,
  a.back,
  a.go,
  a.chip-link,
  a.amt,
  a.revbtn,
  a.card,
  a.fi-action,
  a.matdoc,
  .links a,
  .guidebar a,
  a.lnk,
  a.del,
  .bz-mode,
  a.fi-link,
  .card.is-click
){
  cursor:pointer;
  transition:
    background-color var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    border-color var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    color var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    box-shadow var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    filter var(--fi-interaktion-dauer) var(--fi-interaktion-ease),
    transform var(--fi-interaktion-dauer) var(--fi-interaktion-ease);
}

button:disabled,
[aria-disabled="true"]{
  cursor:not-allowed;
}

.fi-action .fi-icp,
.fi-action .fi-action-arrow,
a.card .fi-icp,
a.card .arr,
a.card .go{
  transition:transform var(--fi-interaktion-dauer) var(--fi-interaktion-ease);
}

/* Tastaturbedienung bleibt auch ohne Bewegung klar sichtbar. */
:where(
  a[href]:not([aria-disabled="true"]),
  button:not(:disabled),
  summary,
  [role="button"]:not([aria-disabled="true"]),
  [role="radio"]:not([aria-disabled="true"]),
  input:not(:disabled):not([type="hidden"]),
  select:not(:disabled),
  textarea:not(:disabled)
):focus-visible{
  outline:3px solid var(--fi-interaktion-gold)!important;
  outline-offset:3px!important;
}

/* Kurzer Druckzustand fuer Maus und Touch. */
button:not(:disabled):active,
a.btn:not([aria-disabled="true"]):active,
[role="button"]:not([aria-disabled="true"]):active,
[role="radio"]:not([aria-disabled="true"]):active,
a.modecard:active,
a.nav-btn:active,
a.hbtn:active,
a.primary:active,
a.sec:active,
a.back:active,
a.go:active,
a.chip-link:active,
a.amt:active,
a.revbtn:active,
a.card:active,
a.fi-action:active,
a.matdoc:active,
.links a:active,
.guidebar a:active,
a.lnk:active,
a.del:active,
.bz-mode:active,
a.fi-link:active,
.card.is-click:active{
  filter:brightness(.92);
  transform:translateY(1px) scale(.99);
  transition-duration:.06s;
}

summary:active{
  background-color:var(--fi-interaktion-bg);
}

/* Bewegung nur mit einer echten Maus. Auf Tablets bleibt kein Hoverzustand stehen. */
@media (hover:hover) and (pointer:fine){
  button:not(:disabled):hover,
  a.btn:not([aria-disabled="true"]):hover,
  [role="button"]:not([aria-disabled="true"]):hover,
  [role="radio"]:not([aria-disabled="true"]):hover,
  .choice:hover,
  .exam-tab:hover,
  .mini:hover,
  .nav-dot:hover,
  .vclose:hover,
  .fi-lies:hover,
  .liveq-opt:not(:disabled):hover,
  #liveq-badge:hover,
  #t34a-consent-ok:hover,
  #pwa-install:hover,
  #fi-a11y-open:hover,
  #fi-a11y-close:hover{
    filter:brightness(.96) saturate(1.08);
    transform:translateY(-2px);
  }

  a.btn:not([aria-disabled="true"]):hover,
  button.btn:not(:disabled):hover,
  a.nav-btn:hover,
  a.hbtn:hover,
  a.primary:hover,
  a.sec:hover,
  a.chip-link:hover,
  a.amt:hover{
    box-shadow:var(--fi-interaktion-schatten);
  }

  a.modecard:hover,
  a.card:hover,
  .card.is-click:hover,
  a.fi-action-card:hover,
  a.matdoc:hover,
  .links a:hover,
  .guidebar a:hover,
  a.lnk:hover,
  a.del:hover,
  .bz-mode:hover,
  a.fi-link:hover,
  a.revbtn:hover{
    transform:translateY(-2px);
    box-shadow:var(--fi-interaktion-schatten);
  }

  a.fi-action-row:hover{
    background-color:var(--fi-interaktion-bg);
    box-shadow:inset 3px 0 0 var(--fi-interaktion-gold);
    transform:none;
  }

  .fi-action:hover .fi-icp,
  a.card:hover .fi-icp{
    transform:scale(1.05);
  }

  .fi-action:hover .fi-action-arrow,
  a.card:hover .arr,
  a.card:hover .go{
    transform:translateX(4px);
  }

  a.back:hover{
    transform:translateX(-2px);
  }

  summary:hover{
    background-color:var(--fi-interaktion-bg);
  }

  :where(input,select,textarea):not(:disabled):hover{
    border-color:var(--fi-interaktion-gold);
  }
}

@media (prefers-reduced-motion:reduce){
  :where(
    button,a.btn,[role="button"],[role="radio"],summary,.choice,.exam-tab,.mini,
    .nav-dot,.vclose,.fi-lies,.liveq-opt,#liveq-badge,#t34a-consent-ok,
    #pwa-install,#fi-a11y-open,#fi-a11y-close,a.modecard,a.nav-btn,a.hbtn,
    a.primary,a.sec,a.back,a.go,a.chip-link,a.amt,a.revbtn,a.card,a.fi-action,
    a.matdoc,.links a,.guidebar a,a.lnk,a.del,.bz-mode,a.fi-link,.card.is-click,
    .fi-action .fi-icp,.fi-action .fi-action-arrow,a.card .fi-icp,a.card .arr,a.card .go
  ){
    transition:none!important;
  }

  :where(
    button,a.btn,[role="button"],[role="radio"],a.modecard,a.nav-btn,a.hbtn,
    a.primary,a.sec,a.back,a.go,a.chip-link,a.amt,a.revbtn,a.card,a.fi-action,
    a.matdoc,.links a,.guidebar a,a.lnk,a.del,.bz-mode,a.fi-link,.card.is-click
  ):active{
    transform:none!important;
  }
}

@media (prefers-reduced-motion:reduce) and (hover:hover) and (pointer:fine){
  :where(
    button,a.btn,[role="button"],[role="radio"],a.modecard,a.nav-btn,a.hbtn,
    a.primary,a.sec,a.back,a.go,a.chip-link,a.amt,a.revbtn,a.card,a.fi-action,
    a.matdoc,.links a,.guidebar a,a.lnk,a.del,.bz-mode,a.fi-link,.card.is-click
  ):hover,
  .fi-action:hover .fi-icp,
  .fi-action:hover .fi-action-arrow,
  a.card:hover .fi-icp,
  a.card:hover .arr,
  a.card:hover .go{
    transform:none!important;
  }
}

html.fi-reduce-motion :where(
  button,a.btn,[role="button"],[role="radio"],summary,.choice,.exam-tab,.mini,
  .nav-dot,.vclose,.fi-lies,.liveq-opt,#liveq-badge,#t34a-consent-ok,
  #pwa-install,#fi-a11y-open,#fi-a11y-close,a.modecard,a.nav-btn,a.hbtn,
  a.primary,a.sec,a.back,a.go,a.chip-link,a.amt,a.revbtn,a.card,a.fi-action,
  a.matdoc,.links a,.guidebar a,a.lnk,a.del,.bz-mode,a.fi-link,.card.is-click,
  .fi-action .fi-icp,.fi-action .fi-action-arrow,a.card .fi-icp,a.card .arr,a.card .go
){
  transition:none!important;
}

html.fi-reduce-motion :where(
  button,a.btn,[role="button"],[role="radio"],a.modecard,a.nav-btn,a.hbtn,
  a.primary,a.sec,a.back,a.go,a.chip-link,a.amt,a.revbtn,a.card,a.fi-action,
  a.matdoc,.links a,.guidebar a,a.lnk,a.del,.bz-mode,a.fi-link,.card.is-click
):active{
  transform:none!important;
}

@media (hover:hover) and (pointer:fine){
  html.fi-reduce-motion :where(
    button,a.btn,[role="button"],[role="radio"],a.modecard,a.nav-btn,a.hbtn,
    a.primary,a.sec,a.back,a.go,a.chip-link,a.amt,a.revbtn,a.card,a.fi-action,
    a.matdoc,.links a,.guidebar a,a.lnk,a.del,.bz-mode,a.fi-link,.card.is-click
  ):hover,
  html.fi-reduce-motion .fi-action:hover .fi-icp,
  html.fi-reduce-motion .fi-action:hover .fi-action-arrow,
  html.fi-reduce-motion a.card:hover .fi-icp,
  html.fi-reduce-motion a.card:hover .arr,
  html.fi-reduce-motion a.card:hover .go{
    transform:none!important;
  }
}