/* app.css – zentrale Optik- und Bedienbarkeits-Verbesserungen.
   Ergänzend gedacht: verbessert Lesbarkeit, Fokus, Touch-Bedienung und Ruhe,
   OHNE die bestehenden Abläufe oder das dichte Tabellen-Layout zu verändern.
   Wird in allen Seiten zuletzt geladen. */

/* 1) Sichtbare Tastatur-Fokus-Markierung (Barrierefreiheit) ---------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #1a3a5c;
  outline-offset: 2px;
  border-radius: 3px;
}
.btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 .2rem rgba(26, 58, 92, .35);
}
/* Navbar-Links: heller Fokusring auf dunklem Grund */
.navbar .nav-link:focus-visible,
.navbar a:focus-visible,
.navbar .btn:focus-visible {
  outline: 2px solid #ffc107;
  outline-offset: 2px;
}

/* 2) Ruhige, einheitliche Rückmeldung auf Knöpfen und Zeilen -------------- */
.btn {
  transition: background-color .12s ease, border-color .12s ease,
              box-shadow .12s ease, transform .05s ease;
}
.btn:active { transform: translateY(1px); }
.table-hover tbody tr:hover { background-color: rgba(26, 58, 92, .045); }

/* 3) Bessere Bedienbarkeit auf Touch-Geräten (Handy/Tablet).
      Gilt NUR auf Touch – Desktop/Maus bleibt unverändert. -------------- */
@media (pointer: coarse) {
  .btn:not(.btn-sm),
  .form-control:not(.form-control-sm),
  .form-select:not(.form-select-sm) { min-height: 42px; }
  .btn-sm, .form-control-sm, .form-select-sm { min-height: 34px; }
  .navbar .nav-link { padding-top: .5rem; padding-bottom: .5rem; }

  /* Aktionsknöpfe am Zeilenende (Rückfrage, Aufgabe, Bearbeiten, Löschen).
     Sie sind reine Symbole und lagen mit .py-0.px-1 bei rund 24x22 Pixeln direkt
     nebeneinander – neben "Aufgabe" steht "Löschen". Auf Touch bekommen sie eine
     Fläche, die man treffen kann, und etwas Abstand voneinander. */
  .table tbody td .btn-sm { min-width: 40px; min-height: 40px; padding: 6px 8px !important; }
  .table tbody td .d-flex { gap: 8px !important; }
  /* Löschen zusätzlich absetzen, damit es nicht neben den harmlosen Aktionen klebt */
  .table tbody td .btn-outline-danger { margin-left: 6px; }
}

/* 4) Einheitliche, ruhige Flächen ---------------------------------------- */
.card { border-radius: 10px; }

/* 5) „Reduzierte Bewegung" der Systemeinstellung respektieren ------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* 6) Sicherheitsnetz für die gemeinsame Navigation (templates/_nav.html):
      stellt sicher, dass die Links auf dem dunklen Balken auf JEDER Seite
      sichtbar sind – auch falls eine Seite eigene Nav-Stile vermisst. */
.navbar { background: #1a3a5c; }
.navbar .navbar-nav .nav-link { color: rgba(255, 255, 255, .85); }
.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link.active { color: #fff; }
.badge-nav { background: #ffc107; color: #1a1a1a; }