/* =========================================================================
   QUADRONET Base - Bedienbarkeit
   Nicht verhandelbar, deshalb im Fundament und nicht im Theme.
   ========================================================================= */

@layer qn.a11y {
  :focus-visible {
    outline: 3px solid var(--qn-fokus);
    outline-offset: 2px;
  }

  /* Nur fuer Vorlesesoftware */
  .qn-nur-vorlesen {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }

  /* Sprunglink: erscheint erst bei Tastaturbedienung */
  .qn-sprunglink {
    position: absolute;
    inset-inline-start: var(--qn-raum-md);
    inset-block-start: var(--qn-raum-md);
    z-index: 100;
    translate: 0 -200%;
    padding: var(--qn-raum-sm) var(--qn-raum-md);
    background: var(--qn-flaeche-betont);
    color: var(--qn-schrift-invers);
    text-decoration: none;
  }
  .qn-sprunglink:focus-visible { translate: 0 0; }

  /* Zielflaeche fuer Finger: 44 px, auch wenn das Element kleiner aussieht */
  .qn-ziel { position: relative; }
  .qn-ziel::after {
    content: "";
    position: absolute;
    inset: 50% 50% 50% 50%;
    min-width: 44px; min-height: 44px;
    translate: -50% -50%;
  }
}