/* Sonnen-Energie · Cookie Consent (CI) */
.se-consent {
  --se-c-z: 220;
  font-family: var(--se-font-sans, "Onest", system-ui, sans-serif);
  color: var(--se-ink, #0D0D0D);
}
.se-consent[hidden] { display: none !important; }

.se-consent__scrim {
  position: fixed; inset: 0; z-index: calc(var(--se-c-z) - 1);
  background: rgba(13, 13, 13, .42);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  opacity: 0; transition: opacity .28s ease;
}
.se-consent__scrim.is-on { opacity: 1; }
.se-consent__scrim[hidden] { display: none !important; }

/* ---- Banner (unten links) --------------------------------------------- */
.se-consent__banner {
  position: fixed; z-index: var(--se-c-z);
  left: 16px; right: auto; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  width: min(420px, calc(100vw - 32px));
  max-width: 420px;
  margin: 0;
}
.se-consent__banner[hidden] { display: none !important; }
.se-consent__banner-inner {
  display: grid; gap: 18px;
  padding: 22px 22px 20px;
  background: #fff;
  border: 1px solid var(--se-ink-a10, rgba(13,13,13,.1));
  border-radius: 24px;
  box-shadow: 0 28px 60px -28px rgba(9, 32, 84, .55), 0 2px 0 rgba(255,255,255,.6) inset;
}
.se-consent__eyebrow {
  margin: 0 0 6px;
  font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--se-accent, #1245AB);
}
.se-consent__title {
  margin: 0; font-size: clamp(20px, 2.4vw, 24px); font-weight: 700;
  letter-spacing: -.02em; line-height: 1.15;
}
.se-consent__text {
  margin: 10px 0 0; font-size: 14.5px; line-height: 1.55;
  color: var(--se-muted, #5B6470);
}
.se-consent__legal { margin: 10px 0 0; font-size: 13px; }
.se-consent__legal a {
  color: var(--se-accent, #1245AB); font-weight: 600; text-decoration: underline;
  text-underline-offset: 2px;
}
.se-consent__legal a:hover { color: var(--se-accent-dark, #0E3585); }

.se-consent__actions {
  display: grid; grid-template-columns: 1fr; gap: 8px;
}
@media (min-width: 640px) {
  .se-consent__banner {
    left: 24px; right: auto;
    bottom: calc(24px + env(safe-area-inset-bottom, 0px));
    width: 420px;
  }
  .se-consent__banner-inner { padding: 26px 28px 24px; }
  .se-consent__actions { grid-template-columns: 1fr; }
}
@media (min-width: 900px) {
  .se-consent__actions { grid-template-columns: 1fr 1fr 1.15fr; }
}

.se-consent__btn {
  appearance: none; border: none; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 46px; padding: 0 18px; border-radius: 999px;
  font-family: inherit; font-size: 14.5px; font-weight: 700;
  letter-spacing: -.01em; transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.se-consent__btn:active { transform: translateY(1px); }
.se-consent__btn--primary {
  background:var(--se-blue); color: #fff;
}
.se-consent__btn--primary:hover { background:var(--se-blue-hover); }
.se-consent__btn--secondary {
  background: var(--se-paper, #F4F5F0); color: var(--se-ink, #0D0D0D);
}
.se-consent__btn--secondary:hover { background: #e8e9e3; }
.se-consent__btn--ghost {
  background: #fff; color: var(--se-ink, #0D0D0D);
  border: 1.5px solid var(--se-ink-a15, rgba(13,13,13,.15));
}
.se-consent__btn--ghost:hover { border-color: var(--se-ink, #0D0D0D); }

/* Sticky-CTA Platz: Banner etwas höher wenn CTA sichtbar */
body.se-scta-visible .se-consent__banner {
  bottom: calc(88px + env(safe-area-inset-bottom, 0px));
}
body.se-scta-visible .se-consent__fab {
  bottom: calc(88px + env(safe-area-inset-bottom, 0px));
}

/* ---- Floating reopen (unten links) ------------------------------------ */
.se-consent__fab {
  position: fixed; z-index: calc(var(--se-c-z) - 10);
  left: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0 14px 0 12px;
  border: 1px solid var(--se-ink-a10, rgba(13,13,13,.1));
  border-radius: 999px;
  background: #fff;
  color: var(--se-ink, #0D0D0D);
  font-family: inherit; font-size: 13px; font-weight: 700;
  letter-spacing: -.01em;
  box-shadow: 0 14px 32px -16px rgba(9, 32, 84, .5);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.se-consent__fab[hidden] { display: none !important; }
.se-consent__fab:hover {
  background: var(--se-paper, #F4F5F0);
  box-shadow: 0 18px 36px -14px rgba(9, 32, 84, .55);
}
.se-consent__fab:active { transform: translateY(1px); }
.se-consent__fab:focus-visible {
  outline: 3px solid var(--se-accent, #1245AB); outline-offset: 2px;
}
.se-consent__fab-ic {
  width: 28px; height: 28px; border-radius: 999px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--se-accent-pale, #D7E2F7); color: var(--se-accent, #1245AB);
}
.se-consent__fab-ic svg { display: block; }
.se-consent__fab-lbl { white-space: nowrap; }
@media (min-width: 640px) {
  .se-consent__fab { left: 24px; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 480px) {
  .se-consent__fab-lbl { /* kompakt: nur Icon auf sehr schmalen Screens optional lesbar lassen */ }
}
/* Banner offen → FAB ausblenden (JS setzt hidden; Fallback) */
.se-consent:not([hidden]) .se-consent__banner:not([hidden]) ~ .se-consent__fab,
body:has(.se-consent__banner:not([hidden])) .se-consent__fab {
  /* handled in JS */
}

/* ---- Settings Panel ---------------------------------------------------- */
.se-consent__panel {
  position: fixed; inset: 0; z-index: calc(var(--se-c-z) + 2);
  display: flex; align-items: flex-end; justify-content: center;
  padding: 16px; padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}
.se-consent__panel[hidden] { display: none !important; }
@media (min-width: 720px) {
  .se-consent__panel { align-items: center; }
}
.se-consent__panel-card {
  width: min(560px, 100%); max-height: min(86vh, 720px);
  overflow: auto; -webkit-overflow-scrolling: touch;
  background: #fff; border-radius: 28px;
  border: 1px solid var(--se-ink-a10, rgba(13,13,13,.1));
  box-shadow: 0 40px 80px -30px rgba(9, 32, 84, .6);
  padding: 22px 22px 20px;
}
@media (min-width: 720px) {
  .se-consent__panel-card { padding: 28px 28px 24px; }
}
.se-consent__panel-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
}
.se-consent__panel-title {
  margin: 0; font-size: 22px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15;
}
.se-consent__icon-close {
  flex-shrink: 0; width: 40px; height: 40px; border-radius: 999px;
  border: 1px solid var(--se-ink-a10, rgba(13,13,13,.1));
  background: var(--se-paper, #F4F5F0); color: var(--se-ink, #0D0D0D);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
}
.se-consent__icon-close:hover { background: #e8e9e3; }
.se-consent__panel-intro {
  margin: 12px 0 0; font-size: 14px; line-height: 1.55; color: var(--se-muted, #5B6470);
}
.se-consent__cats { display: grid; gap: 10px; margin-top: 18px; }
.se-consent__cat {
  display: block; padding: 14px 16px; border-radius: 16px;
  background: var(--se-paper, #F4F5F0); border: 1px solid transparent;
  cursor: pointer;
}
.se-consent__cat:hover { border-color: var(--se-ink-a10, rgba(13,13,13,.1)); }
.se-consent__cat--locked { cursor: default; opacity: .92; }
.se-consent__cat--locked input { display: none; }
.se-consent__cat-top {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.se-consent__cat-name { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.se-consent__cat-desc {
  display: block; margin-top: 6px; font-size: 13px; line-height: 1.45;
  color: var(--se-muted, #5B6470);
}
.se-consent__badge {
  font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--se-accent, #1245AB); background: var(--se-accent-pale, #D7E2F7);
  padding: 5px 10px; border-radius: 999px; white-space: nowrap;
}

/* Switch */
.se-consent__switch { position: relative; display: inline-flex; flex-shrink: 0; }
.se-consent__switch input {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0;
  opacity: 0; cursor: pointer; z-index: 1;
}
.se-consent__switch span {
  width: 46px; height: 28px; border-radius: 999px;
  background: #c9ced6; display: block; position: relative;
  transition: background .2s ease;
}
.se-consent__switch span::after {
  content: ""; position: absolute; top: 3px; left: 3px;
  width: 22px; height: 22px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 3px rgba(13,13,13,.2);
  transition: transform .2s ease;
}
.se-consent__switch input:checked + span { background:var(--se-blue); }
.se-consent__switch input:checked + span::after { transform: translateX(18px); }
.se-consent__switch input:focus-visible + span {
  outline: 3px solid var(--se-accent, #1245AB); outline-offset: 2px;
}

.se-consent__panel-actions {
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 8px; margin-top: 18px;
}
.se-consent__legal--panel { text-align: center; margin-top: 14px; }

body.se-consent-open { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  .se-consent__scrim, .se-consent__btn, .se-consent__switch span, .se-consent__switch span::after {
    transition: none !important;
  }
}

/* Mobil (15.10.2026): kein schwebender Cookie-Knopf mehr – er lag über der
   Kontaktleiste und dem Inhalt. Die Einstellungen bleiben jederzeit über
   „Cookie-Einstellungen" im Footer jeder Seite erreichbar. */
@media (max-width: 1000px) {
  .se-consent__fab { display: none !important; }
}
