/* Cookie-Consent-Banner – passt sich dem Website-Theme an */
.cc {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 88px; /* über dem Chat-Button */
  z-index: 300;
  max-width: 560px;
  margin: 0 auto;
  background: var(--surface, #0d0d0f);
  color: var(--content, #f5f5f7);
  border: 1px solid var(--border, #26262a);
  border-radius: var(--radius-lg, 18px);
  box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .5);
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-family: var(--font, system-ui, sans-serif);
  animation: ccIn .35s ease both;
}
@keyframes ccIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .cc { animation: none; } }

.cc__txt {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--content-2, #a1a1a6);
}
.cc__txt a { color: var(--accent, #35B1A8); text-decoration: underline; }

.cc__btns { display: flex; gap: 10px; justify-content: flex-end; }

.cc__b {
  font: inherit;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 980px;
  padding: 9px 20px;
  min-height: 42px;
  border: 1px solid transparent;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.cc__b--no {
  background: transparent;
  color: var(--content, #f5f5f7);
  border-color: var(--border, #3a3a3e);
}
.cc__b--no:hover { border-color: var(--content-2, #a1a1a6); }
.cc__b--yes {
  background: var(--accent, #35B1A8);
  color: #06201e;
  border-color: var(--accent, #35B1A8);
}
:root[data-theme="light"] .cc__b--yes { color: #ffffff; }
.cc__b--yes:hover { background: var(--accent-hover, #3ec4b9); }

.cc__b:focus-visible { outline: 3px solid var(--accent, #35B1A8); outline-offset: 2px; }

@media (min-width: 560px) {
  .cc { flex-direction: row; align-items: center; max-width: 820px; gap: 20px; }
  .cc__txt { flex: 1; }
  .cc__btns { flex: 0 0 auto; }
}