/* Cookie-Banner. Eigene Datei, weil ihn auch Impressum und Datenschutz
   brauchen — die laden styles.css nicht. Gehoert zu assets/js/consent.js. */

.cc-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  /* Das GHL-Chat-Widget (.lc_text-widget) laeuft auf z-index 99999999 und legt
     sich sonst ueber die Banner-Buttons — dann ist weder Zustimmen noch
     Ablehnen klickbar. Deshalb bewusst darueber. */
  z-index: 2147483000;
  padding: 0 1rem 1rem;
  transform: translateY(120%);
  transition: transform .45s cubic-bezier(.4, 0, .2, 1);
}
.cc-bar.is-in { transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  .cc-bar { transition: none; }
}

.cc-inner {
  max-width: 68rem;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  padding: 1.1rem 1.35rem;
  border-radius: 1.1rem;
  background: rgba(15, 26, 46, .92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(124, 198, 247, .18);
  box-shadow: 0 24px 70px -24px rgba(0, 0, 0, .85);
}

.cc-text { flex: 1 1 22rem; min-width: 0; }

.cc-title {
  font-family: Manrope, Inter, system-ui, sans-serif;
  font-weight: 700;
  font-size: .95rem;
  color: #F4F7FB;
  margin: 0 0 .25rem;
}

.cc-body {
  margin: 0;
  font-size: .82rem;
  line-height: 1.55;
  color: rgba(244, 247, 251, .72);
}

.cc-link { color: #7CC6F7; text-decoration: underline; text-underline-offset: 2px; }
.cc-link:hover { color: #A9DBFB; }

.cc-actions {
  flex: 0 0 auto;
  display: flex;
  gap: .6rem;
  margin-left: auto;
}

.cc-btn {
  font-size: .82rem;
  font-weight: 600;
  padding: .62rem 1.25rem;
  border-radius: 9999px;
  cursor: pointer;
  white-space: nowrap;
  border: 1px solid transparent;
  transition: background-position .5s ease, box-shadow .3s ease,
              background-color .2s ease, border-color .2s ease;
}
.cc-btn:focus-visible { outline: 2px solid #7CC6F7; outline-offset: 2px; }

.cc-btn--solid {
  color: #fff;
  background-image: linear-gradient(to right, #56CCF2 0%, #2F80ED 51%, #56CCF2 100%);
  background-size: 200% auto;
  box-shadow: 0 0 18px rgba(86, 204, 242, .35);
}
.cc-btn--solid:hover { background-position: right center; box-shadow: 0 0 24px rgba(86, 204, 242, .5); }

.cc-btn--ghost {
  color: rgba(244, 247, 251, .8);
  background: transparent;
  border-color: rgba(255, 255, 255, .18);
}
.cc-btn--ghost:hover { color: #fff; border-color: rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .05); }

@media (max-width: 600px) {
  .cc-inner { padding: 1rem 1.1rem; border-radius: .9rem; }
  .cc-actions { width: 100%; margin-left: 0; }
  .cc-btn { flex: 1 1 0; text-align: center; padding-left: .75rem; padding-right: .75rem; }
}

.cc-choices { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; margin-top: .9rem; }
.cc-choices[hidden] { display: none; }
.cc-check { display: inline-flex; align-items: center; gap: .45rem; font-size: .875rem; color: rgba(255,255,255,.85); cursor: pointer; }
.cc-check input { width: 1rem; height: 1rem; accent-color: #7CC6F7; }

@media (max-width: 600px) {
  .cc-actions { flex-wrap: wrap; }
  .cc-btn { flex: 1 1 auto; }
}
