/* ============================================================
   EDEL ENTRÜMPELUNG ANSBACH — Einwilligungsbanner
   Farben und Radien wie im übrigen Auftritt. Der Banner liegt
   über allem, auch über der festen Anruf-Schaltfläche.
   ============================================================ */
.ce-box {
  position: fixed; inset: 0; z-index: 10000;
  display: none; align-items: flex-end; justify-content: center;
  padding: clamp(0.8rem, 2vw, 1.6rem);
  background: rgba(28, 26, 23, 0.55);
}
.ce-box--offen { display: flex; }

.ce-karte {
  width: min(680px, 100%);
  box-sizing: border-box;
  padding: clamp(1.3rem, 3vw, 1.9rem);
  background: #faf7f1; color: #26241f;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(28,26,23,0.12), 0 26px 60px -20px rgba(28,26,23,0.55);
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
}

.ce-titel {
  margin: 0 0 0.6rem; color: #26241f;
  font-size: clamp(1.15rem, 2.2vw, 1.4rem); font-weight: 700; line-height: 1.2;
}
.ce-text { margin: 0; font-size: 0.93rem; line-height: 1.6; color: #55504a; }
.ce-text a { color: #a94a06; }

/* ---------- Kategorien (zweite Ebene) ----------
   Das hidden-Attribut muss die display-Regeln aushebeln, sonst
   stuende die zweite Ebene schon beim ersten Blick offen. */
.ce-box [hidden] { display: none !important; }
.ce-wahl { margin-top: 1.1rem; display: grid; gap: 0.7rem; }
.ce-zeile {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.7rem;
  padding: 0.75rem 0.9rem;
  background: #ffffff; border: 1px solid #e4ddd1; border-radius: 8px;
  font-size: 0.88rem; line-height: 1.5; color: #55504a;
}
.ce-zeile strong { display: block; color: #26241f; font-size: 0.95rem; }
.ce-zeile input { width: 20px; height: 20px; margin: 0.15rem 0 0; accent-color: #ff6a00; }
.ce-zeile--fest { opacity: 0.85; }

/* ---------- Schaltflächen ---------- */
.ce-knoepfe {
  margin-top: 1.2rem;
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.7rem;
}
.ce-btn {
  flex: 1 1 200px;
  min-height: 48px; padding: 0.8rem 1.3rem;
  border: 2px solid transparent; border-radius: 6px;
  font-family: inherit; font-size: 0.98rem; font-weight: 700; line-height: 1.2;
  text-align: center; cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
.ce-btn--voll { background: #ff6a00; color: #1f1206; }
.ce-btn--voll:hover { background: #ff8127; }
.ce-btn--rand { background: #ffffff; border-color: #d3c9b8; color: #26241f; }
.ce-btn--rand:hover { background: #26241f; border-color: #26241f; color: #faf7f1; }
.ce-mehr {
  flex: 0 0 auto; padding: 0.5rem 0.2rem;
  background: none; border: 0; cursor: pointer;
  font-family: inherit; font-size: 0.92rem; font-weight: 600;
  color: #a94a06; text-decoration: underline; text-underline-offset: 0.2em;
}
.ce-btn:focus-visible, .ce-mehr:focus-visible, .ce-zeile input:focus-visible {
  outline: 3px solid #ff6a00; outline-offset: 3px;
}

@media (max-width: 639px) {
  .ce-knoepfe { flex-direction: column; align-items: stretch; }
  .ce-btn { flex: 1 1 auto; width: 100%; }
  .ce-mehr { width: 100%; }
}
