
/* cookie-consent.css */
.cb-backdrop {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.4);
  display: none; z-index: 9998;
}

.cb {
  position: fixed; left: 50%; bottom: 24px;
  transform: translateX(-50%);
  max-width: 680px; width: calc(100% - 24px);
  background: #fff; color: #111;
  border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.2);
  padding: 16px; z-index: 9999; display: none;
  font: 14px/1.45 system-ui,Segoe UI,Roboto,Arial;
}

.cb h3 { margin: .2rem 0 .6rem; font-size: 1.05rem; }
.cb p  { margin: .4rem 0 .8rem; }

.cb .row {
  display: flex; gap: 12px; flex-wrap: wrap;
  align-items: center; justify-content: space-between;
}

.cb .btn {
  appearance: none; border: 0; border-radius: 10px;
  padding: 10px 14px; cursor: pointer; font-weight: 600;
}

.cb .btn-primary { background: #ffd700; }
.cb .btn-ghost   { background: #eee; }

.cb .link {
  color: #111; text-decoration: underline; cursor: pointer;
}

.cb-prefs {
  display: none; margin-top: 10px; padding: 10px;
  border: 1px solid #eee; border-radius: 10px; background: #fafafa;
}

.cb-prefs label {
  display: flex; gap: 8px; align-items: center; margin: 6px 0;
}

@media (max-width:600px){
  .cb { bottom:12px; }
}

/* --- Mini-Fix: Position + Breite + Z-Index erzwingen --- */
.cb {
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: clamp(12px, env(safe-area-inset-bottom) + 12px, 32px) !important;
  width: min(680px, calc(100% - 24px)) !important;
  z-index: 2147483647 !important; /* ganz oben */
}

.cb-backdrop {
  z-index: 2147483646 !important;
}

/* kleine UX-Verbesserung: sichtbarer Fokus für Tastatur */
.cb :is(button, a):focus {
  outline: 2px solid #000;
  outline-offset: 2px;
}
