/* Einwilligungs-Dialog.
   Bewusst nuechtern und in den Farben der Kanzlei — er soll nicht wie ein
   Fremdkoerper wirken, aber auch nicht das halbe Bild verdecken. */

.ew-huelle {
  position: fixed; inset: 0; z-index: 99999;
  display: flex; align-items: flex-end; justify-content: center;
  background: rgba(15, 18, 26, .45);
  padding: 16px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.ew-huelle[hidden] { display: none; }

.ew-karte {
  background: #fff; color: #1a1d26; width: 100%; max-width: 620px;
  border-radius: 14px; box-shadow: 0 18px 50px rgba(0, 0, 0, .3);
  padding: 26px 28px 22px; max-height: calc(100vh - 32px); overflow-y: auto;
}

.ew-karte h2 { font-size: 18px; margin: 0 0 8px; font-weight: 700; }
.ew-karte p { font-size: 14px; line-height: 1.55; margin: 0 0 14px; color: #3c4150; }
.ew-karte a { color: var(--ew-akzent, #2c3e7b); }

/* --- Knoepfe ---------------------------------------------------------- */
/* Zustimmen und Ablehnen sehen bewusst gleich wichtig aus. Ein Ablehnen-Knopf,
   der schwerer zu finden ist als der Zustimmen-Knopf, ist keine freie Wahl. */
.ew-knoepfe { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.ew-knopf {
  flex: 1 1 190px; border: 2px solid var(--ew-akzent, #2c3e7b); border-radius: 8px;
  font: inherit; font-size: 15px; font-weight: 700; padding: 12px 16px;
  cursor: pointer; background: #fff; color: var(--ew-akzent, #2c3e7b);
  transition: filter .15s;
}
.ew-knopf.ew-voll { background: var(--ew-akzent, #2c3e7b); color: #fff; }
.ew-knopf:hover { filter: brightness(1.08); }
.ew-mehr {
  background: none; border: 0; color: #5c6478; font: inherit; font-size: 13.5px;
  text-decoration: underline; cursor: pointer; padding: 10px 2px 0;
}

/* --- Einzelne Kategorien ---------------------------------------------- */
.ew-details { display: none; margin: 14px 0 4px; border-top: 1px solid #e3e6ef; }
.ew-details.ew-offen { display: block; }
.ew-zeile { display: flex; gap: 12px; padding: 13px 0; border-bottom: 1px solid #eef0f6; }
.ew-zeile b { display: block; font-size: 14.5px; margin-bottom: 3px; }
.ew-zeile span { font-size: 13px; color: #5c6478; line-height: 1.5; }
.ew-schalter { flex: 0 0 auto; padding-top: 2px; }
.ew-schalter input { width: 20px; height: 20px; accent-color: var(--ew-akzent, #2c3e7b); }
.ew-schalter input:disabled { opacity: .5; }

/* --- Spaeter aendern --------------------------------------------------- */
.ew-oeffner {
  position: fixed; left: 14px; bottom: 14px; z-index: 9998;
  background: rgba(255, 255, 255, .92); border: 1px solid #d7dbe6; border-radius: 999px;
  font: inherit; font-size: 12px; color: #3c4150; padding: 7px 13px; cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
}
.ew-oeffner[hidden] { display: none; }

@media (max-width: 520px) {
  .ew-karte { padding: 20px 18px 16px; }
  .ew-knopf { flex: 1 1 100%; }
}