/* zaehlung-widerspruch.css  ·  Schalter fuer den Widerspruch
   ------------------------------------------------------------------
   Angelegt am 10.09.2026, Sitzung 2ebc94c3.
   Gehoert zu assets/zaehlung-widerspruch.js.

   Masse sind nicht geraten: Knopf 48 Pixel hoch, also ueber den
   44 mal 44 aus WCAG 2.2. Farben aus den Projektvariablen, damit der
   Kasten nicht wie ein Fremdkoerper wirkt.
   ------------------------------------------------------------------ */

.zw-kasten{
  margin:14px 0 6px;
  padding:18px 20px;
  background-color:var(--cream-soft, #F2EDE1);
  border:1px solid var(--line-strong, rgba(26,31,27,0.14));
  border-radius:14px;
  border-left:4px solid var(--forest, #2A4A38);
}

/* Widersprochen: der Streifen wechselt auf Gold, damit der Zustand
   auch ohne Lesen erkennbar ist. Die Farbe ist nicht der einzige
   Traeger der Aussage, der Text sagt es ebenfalls (WCAG 1.4.1). */
.zw-kasten-aus{ border-left-color:var(--gold, #A88948); }

.zw-lage{
  margin:0 0 12px;
  font-size:16px;
  line-height:1.5;
  color:var(--forest-ink, #1C3125);
}

.zw-knopf{
  min-height:48px;
  padding:12px 24px;
  border:0;
  border-radius:999px;
  background-color:var(--forest, #2A4A38);
  color:var(--white, #FFFFFF);
  font-family:inherit;
  font-size:16px;
  font-weight:600;
  line-height:1.2;
  cursor:pointer;
  transition:background .18s ease;
}

.zw-knopf:hover{ background-color:var(--forest-ink, #1C3125); }

.zw-knopf:focus-visible{
  outline:3px solid var(--forest-ink, #1C3125);  /* FOKUS-KONTRAST-20260911: Gold auf Creme hatte 2,84 zu 1 */
  outline-offset:3px;
}

.zw-meldung{
  margin:10px 0 0;
  min-height:1.4em;
  font-size:15px;
  line-height:1.45;
  color:var(--forest, #2A4A38);
  font-weight:600;
}

.zw-meldung:empty{ margin:0; min-height:0; }

@media (max-width:490px){
  .zw-kasten{ padding:16px; }
  .zw-knopf{ width:100%; }
  .zw-lage{ font-size:15px; }
}

@media (prefers-reduced-motion:reduce){
  .zw-knopf{ transition:none; }
}