/* *************************************************
 * Datei: /css/cookie-consent.css
 * Zweck: Banner- & Modal-Styling
 * Farbschema: Rot (#D30000), Schwarz (#111), Weiß (#fff)
 ***************************************************/

:root {
  --cc-bg: #111;
  --cc-fg: #fff;
  --cc-accent: #D30000;
  --cc-muted: #e8e8e8;
}

.cc-banner {
  position: fixed; left: 0; right: 0; bottom: 0;
  background: var(--cc-bg); color: var(--cc-fg);
  z-index: 9999; padding: 14px 10px; box-shadow: 0 -4px 16px rgba(0,0,0,.25);
  font: 14px/1.45 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.cc-banner .cc-inner { max-width: 1100px; margin: 0 auto; display: flex; gap: 14px; align-items: center; }
.cc-banner .cc-text a { color: var(--cc-accent); text-decoration: underline; }
.cc-banner .cc-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }

.cc-btn {
  border: 1px solid var(--cc-accent);
  background: transparent; color: var(--cc-fg);
  padding: 8px 12px; cursor: pointer; border-radius: 4px;
}
.cc-btn.cc-accept { background: var(--cc-accent); color: #fff; border-color: var(--cc-accent); }
.cc-btn.cc-settings { border-color: var(--cc-muted); color: var(--cc-fg); }
.cc-btn.cc-decline { border-color: var(--cc-muted); color: var(--cc-muted); }

.cc-modal {
  position: fixed; inset: 0; background: rgba(0,0,0,.5);
  z-index: 10000; display: grid; place-items: center;
  font: 14px/1.45 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.cc-modal[hidden] { display: none; }
.cc-modal__dialog {
  width: min(680px, 92vw);
  background: #fff; color: #111; border-radius: 8px; padding: 18px 18px 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35); position: relative;
}
.cc-modal__close {
  position: absolute; top: 8px; right: 10px;
  border: 0; background: transparent; font-size: 22px; line-height: 1; cursor: pointer;
}
.cc-group { margin: 12px 0; }

.cc-switch { display: flex; align-items: center; gap: 10px; }
.cc-switch input[type="checkbox"] { width: 18px; height: 18px; }
.cc-switch__label { user-select: none; }

.cc-modal__actions { margin-top: 14px; display: flex; gap: 8px; justify-content: flex-end; }
.cc-modal .cc-btn { border-color: #ccc; color: #111; }
.cc-modal .cc-btn.cc-save { background: var(--cc-accent); color: #fff; border-color: var(--cc-accent); }
.cc-modal .cc-btn.cc-decline { color: #666; }
