/* se_consent – gm-Look für CookieConsent v3 (Arbeitsanweisung cookie-consent v2, Loop 4; Goldstandard-Fassung 03.10.2026).
   Regeln: nur Tokens aus dist/tokens.css (Bestandspalette, Rollenbindung), EIN Radius, EINE Schattenstufe je Typ,
   Schrift ausschließlich Inter/System-Sans (Nutzer-Vorgabe 03.10.2026 – keine Serifen im Dialog), festes helles
   Schema (kein Dark Mode, cc--darkmode wird nie gesetzt). »Alle akzeptieren« und »Ablehnen« sind dieselbe Bauform
   (I4, equalWeightButtons), »Einstellungen« ist die Ghost-Bauform des Kanons. Bibliotheks-Kästchen (Kategorie-Karten,
   Pfeilkreise, Sand-Fußstreifen) sind entfernt – eine ruhige Liste statt Karten in Karten. */
#cc-main {
  --cc-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --cc-modal-border-radius: var(--gm-radius);
  --cc-btn-border-radius: var(--gm-radius);
  --cc-pm-toggle-border-radius: var(--gm-radius-round);
  --cc-modal-transition-duration: var(--gm-dur-mid);
  --cc-modal-margin: var(--gm-space-md);
  --cc-z-index: 2147483000;
  --cc-bg: var(--gm-white);
  --cc-primary-color: var(--gm-heading);
  --cc-secondary-color: var(--gm-text);
  --cc-link-color: var(--gm-primary);
  --cc-btn-primary-bg: var(--gm-primary);
  --cc-btn-primary-color: var(--gm-white);
  --cc-btn-primary-border-color: var(--gm-primary);
  --cc-btn-primary-hover-bg: var(--gm-primary-hover);
  --cc-btn-primary-hover-color: var(--gm-white);
  --cc-btn-primary-hover-border-color: var(--gm-primary-hover);
  --cc-btn-secondary-bg: var(--gm-white);
  --cc-btn-secondary-color: var(--gm-primary);
  --cc-btn-secondary-border-color: var(--gm-primary);
  --cc-btn-secondary-hover-bg: var(--gm-primary);
  --cc-btn-secondary-hover-color: var(--gm-white);
  --cc-btn-secondary-hover-border-color: var(--gm-primary);
  --cc-separator-border-color: var(--gm-border-subtle);
  --cc-section-category-border: transparent;
  --cc-cookie-category-block-bg: transparent;
  --cc-cookie-category-block-border: transparent;
  --cc-cookie-category-block-hover-bg: var(--gm-flaeche-ruhig);
  --cc-cookie-category-block-hover-border: transparent;
  --cc-cookie-category-expanded-block-bg: transparent;
  --cc-cookie-category-expanded-block-hover-bg: transparent;
  --cc-toggle-on-bg: var(--gm-primary);
  --cc-toggle-off-bg: var(--gm-border);
  --cc-toggle-on-knob-bg: var(--gm-white);
  --cc-toggle-off-knob-bg: var(--gm-white);
  --cc-toggle-enabled-icon-color: var(--gm-primary);
  --cc-toggle-disabled-icon-color: var(--gm-border);
  --cc-toggle-readonly-bg: var(--gm-primary);
  --cc-toggle-readonly-knob-bg: var(--gm-white);
  --cc-toggle-readonly-knob-icon-color: var(--gm-primary);
  --cc-footer-bg: transparent;
  --cc-footer-color: var(--gm-text);
  --cc-footer-border-color: var(--gm-border-subtle);
  --cc-overlay-bg: rgba(var(--gm-ink-rgb), .45);
  --cc-webkit-scrollbar-bg: var(--gm-flaeche-ruhig);
  --cc-webkit-scrollbar-hover-bg: var(--gm-border);
  color-scheme: light;
  font-size: 16px;
  hyphens: manual;                                 /* Ortsname nie trennen – Goldene Regel gilt auch im Dialog */
}
#cc-main ::selection { background: var(--gm-sand); color: var(--gm-heading); }
#cc-main :focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); box-shadow: none; }
/* Die Bibliothek fokussiert beim Öffnen den Dialogkasten selbst (Fokusfalle) – der ist kein Bedienelement, der Ring blieb als
   blaue Linie am oberen Rand sichtbar (Befund 03.10.2026). Ringe gibt es nur auf Knöpfen, Schaltern und Links. */
#cc-main .cm:focus-visible, #cc-main .pm:focus-visible, #cc-main .cm:focus, #cc-main .pm:focus { outline: none; }
/* Dasselbe für den klassenlosen Hilfs-<div tabindex="-1">, den die Bibliothek als Fokusanker in den Kasten setzt: in Safari/WebKit
   malte das Theme darauf seinen 3-px-Ring – ein blauer Streifen an der Oberkante (Nutzer 12.10.2026 »KI-Slop«). Kein Bedienelement. */
#cc-main .cm > div[tabindex="-1"]:focus, #cc-main .pm > div[tabindex="-1"]:focus { outline: none; }

/* ---------- Typografie: eine Familie, zwei Stufen ---------- */
#cc-main .cm__title, #cc-main .pm__title, #cc-main .pm__section-title {
  font-family: var(--cc-font-family); color: var(--gm-heading); font-weight: 600; letter-spacing: -.005em; text-wrap: balance;
}
#cc-main .cm__title { font-size: 1.0625rem; line-height: 1.3; padding-top: var(--gm-space-md); }
#cc-main .cm__desc { font-size: .9375rem; line-height: 1.55; color: var(--gm-text); padding-top: var(--gm-space-xs); padding-bottom: var(--gm-space-md); }
#cc-main .pm__title { font-size: 1.125rem; line-height: 1.3; }
#cc-main .pm__section-title { font-size: 1rem; line-height: 1.35; }
#cc-main .pm__section-desc { font-size: .9375rem; line-height: 1.55; color: var(--gm-text); }
#cc-main .cm__footer a, #cc-main .pm__section-desc a { color: var(--gm-primary); text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; }
#cc-main .cm__footer a:hover, #cc-main .pm__section-desc a:hover { color: var(--gm-primary-hover); }

/* ---------- Banner (Ebene 1, Kasten mittig über abgedunkelter Seite – Overlay wie Cookiebot, Nutzer 12.10.2026) ---------- */
#cc-main .cm {
  max-width: 26rem; border: 1px solid var(--gm-border-subtle); border-top-width: 1px;
  box-shadow: var(--gm-shadow-overlay);
}
#cc-main .cm__btns { border-top: 1px solid var(--gm-border-subtle) !important; padding-top: var(--gm-space-md) !important; padding-bottom: var(--gm-space-md) !important; gap: var(--gm-space-xs); }
#cc-main .cm__btn-group { display: grid !important; grid-template-columns: 1fr 1fr; gap: var(--gm-space-xs); }
/* I4 Symmetrie: beide Knöpfe füllen ihre Spalte – sonst richtet sich die Breite nach dem Text (182 ≠ 176 px, Messung 03.10.2026) */
#cc-main .cm__btn-group > .cm__btn { width: 100% !important; justify-self: stretch; }
#cc-main .cm__btn-group + .cm__btn-group { margin: 0 !important; grid-template-columns: 1fr; }
#cc-main .cm__footer { padding: var(--gm-space-xs) 0 var(--gm-space-sm); }
#cc-main .cm__links { padding-top: 0 !important; padding-bottom: 0 !important; }
#cc-main .cm__link-group { gap: var(--gm-space-md); font-size: .8125rem; }

/* ---------- Knöpfe: Bauform des Kanons (gmbtn: Versalien, Spationierung, Label-Gewicht) ---------- */
#cc-main .cm__btn, #cc-main .pm__btn {
  min-height: 44px; padding: .55rem 1rem;
  font-family: var(--cc-font-family); font-size: .8125rem; font-weight: var(--gm-fw-label); letter-spacing: .06em; text-transform: uppercase; line-height: 1.2;
  transition: background-color var(--gm-dur-fast) ease, color var(--gm-dur-fast) ease, border-color var(--gm-dur-fast) ease, transform var(--gm-dur-press) ease;
}
#cc-main .cm__btn:active, #cc-main .pm__btn:active { transform: scale(.97); }
/* Schließen = Ghost-Knopf des Kanons: Ruhe weiß mit Haarlinie, Hover Marke mit weißem Kreuz (Bibliothek nimmt dafür die
   secondary-hover-Variablen). Befund 03.10.2026: eine eigene Creme-Hover-Fläche ließ das weiße Kreuz der Bibliothek verschwinden. */
#cc-main .pm__close-btn { width: 40px; height: 40px; border: 1px solid var(--gm-border-subtle); background: var(--gm-white); border-radius: var(--gm-radius); transition: background-color var(--gm-dur-fast) ease, border-color var(--gm-dur-fast) ease; }
#cc-main .pm__close-btn svg { stroke: var(--gm-heading); stroke-width: 1.5; }
#cc-main .pm__close-btn:hover { background: var(--gm-primary); border-color: var(--gm-primary); }
#cc-main .pm__close-btn:hover svg { stroke: var(--gm-white); }

/* ---------- Einstellungen (Ebene 2) ---------- */
#cc-main .pm { max-width: 42rem; border: 1px solid var(--gm-border-subtle); box-shadow: var(--gm-shadow-overlay); }
#cc-main .pm__header { padding: var(--gm-space-md) var(--gm-space-lg); }
#cc-main .pm__body { padding: var(--gm-space-xs) var(--gm-space-lg) var(--gm-space-md); }
#cc-main .pm__footer { padding: var(--gm-space-md) var(--gm-space-lg); border-top: 1px solid var(--gm-border-subtle); }
#cc-main .pm__section { margin: var(--gm-space-md) 0 0; }
#cc-main .pm__section:first-child .pm__section-title { font-size: 1.0625rem; }
/* Kategorien: ruhige Liste mit Haarlinien statt Kästchen in Kästchen */
#cc-main .pm__section--toggle { margin: 0; border-radius: 0; border-top: 1px solid var(--gm-border-subtle); background: transparent; }
#cc-main .pm__section--toggle:last-of-type { border-bottom: 1px solid var(--gm-border-subtle); }
#cc-main .pm__section--toggle .pm__section-title {
  min-height: 56px; padding: var(--gm-space-sm) 5.2rem var(--gm-space-sm) 1.75rem; border: 0; border-radius: var(--gm-radius); background: transparent;
  transition: background-color var(--gm-dur-fast) ease;
}
#cc-main .pm__section--toggle .pm__section-title:hover { background: var(--gm-flaeche-ruhig); }
/* Pfeil: schlichter Chevron statt Kreisfläche (Bibliothek: 20-px-Kreis in Toggle-Farbe bei left:18px) */
#cc-main .pm__section--expandable .pm__section-arrow { left: 0; width: 1.25rem; height: 1.25rem; background: transparent; border-radius: 0; }
#cc-main .pm__section--expandable .pm__section-arrow svg { stroke: var(--gm-heading); stroke-width: 1.5; transform: scale(.6); }
#cc-main .pm__section--toggle.is-expanded .pm__section-arrow svg { transform: scale(.6) rotate(180deg); }
#cc-main .pm__section--toggle .pm__section-desc-wrapper { border: 0; border-radius: 0; margin: 0; background: transparent; }
#cc-main .pm__section--toggle .pm__section-desc { padding: 0 0 var(--gm-space-md) 1.75rem; }
#cc-main .section__toggle-wrapper { right: .25rem; }
#cc-main .pm__badge { background: var(--gm-flaeche-ruhig); color: var(--gm-text); font-weight: 600; }
/* Dienste je Kategorie: kompakte Zeilen, Name als Anker, Rest ruhig */
#cc-main .gm-cc-dienste { list-style: none; margin: var(--gm-space-xs) 0 0; padding: 0; }
#cc-main .gm-cc-dienste li { position: relative; padding: .35rem 0 .35rem 1rem; font-size: .875rem; line-height: 1.5; color: var(--gm-text); }
#cc-main .gm-cc-dienste li::before { content: ''; position: absolute; left: 0; top: .95em; width: .35rem; height: .35rem; border-radius: 50%; background: var(--gm-primary); opacity: .55; }
#cc-main .gm-cc-dienste strong { color: var(--gm-heading); font-weight: 600; }
#cc-main .pm__btn-group { display: flex; gap: var(--gm-space-xs); flex-wrap: wrap; }
/* Einstellungen: ALLE drei Knöpfe gleich (Nutzer-Entscheid 03.10.2026) – keine optische Bevorzugung von »Alle akzeptieren«
   gegenüber »Ablehnen« oder dem Speichern einer Teilauswahl (Art. 7 Abs. 3 DSGVO, EDSA 05/2020, DSK-OH Telemedien). */
#cc-main .pm__btn.pm__btn--secondary { background: var(--cc-btn-primary-bg); color: var(--cc-btn-primary-color); border-color: var(--cc-btn-primary-border-color); }
#cc-main .pm__btn.pm__btn--secondary:hover { background: var(--cc-btn-primary-hover-bg); color: var(--cc-btn-primary-hover-color); border-color: var(--cc-btn-primary-hover-border-color); }
#cc-main .pm__footer { display: flex; justify-content: space-between; gap: var(--gm-space-sm); flex-wrap: wrap; }

/* ---------- Mobil: Banner mittig in voller Breite (abzüglich Rand), Einstellungen bildschirmfüllend ---------- */
@media (max-width: 575.98px) {
  #cc-main { --cc-modal-margin: var(--gm-space-sm); }
  #cc-main .cm { max-width: none; width: calc(100% - 2 * var(--gm-space-sm)) !important; }
  #cc-main .cm__btn-group, #cc-main .cm--inline .cm__btn-group { grid-template-columns: 1fr; grid-auto-flow: row; }   /* Bibliothek erzwingt bei »inline« Spaltenfluss */
  #cc-main .cm--inline .cm__btn + .cm__btn { margin-left: 0; }
  #cc-main .pm__header, #cc-main .pm__body, #cc-main .pm__footer { padding-left: var(--gm-space-md); padding-right: var(--gm-space-md); }
  #cc-main .pm__footer .pm__btn-group { width: 100%; }
  #cc-main .pm__footer .pm__btn { flex: 1 1 auto; }
}

/* ---------- Schwebender Einstellungs-Knopf (eigener Unterbau; Pendant zum Cookiebot-Widget) ----------
   Erscheint erst nach einer Entscheidung, weicht Banner/Einstellungen und der Gästebefragungs-Bodenleiste. */
.gm-consent-widget {
  /* Gleiche Höhe, Größe und Pille wie der Back-to-top (.gm-btt, gm-layout.css): bottom/left = --gm-space-xl, 48 px,
     --gm-shadow-card-hover, --gm-radius-round (Nutzer-Entscheid 03.10.2026). Unter 992 px gibt es keinen Back-to-top → Mobilabstand. */
  position: fixed; left: var(--gm-space-xl); bottom: calc(var(--gm-space-xl) + env(safe-area-inset-bottom, 0px)); z-index: 1000;
  width: 48px; height: 48px; border-radius: var(--gm-radius-round); border: 0; padding: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--gm-primary); color: var(--gm-white); font-size: 1.25rem; line-height: 1;
  box-shadow: var(--gm-shadow-card-hover);
  transition: background-color var(--gm-dur-fast) ease, transform var(--gm-dur-press) ease, opacity var(--gm-dur-mid) var(--gm-ease-out), visibility 0s linear;
}
.gm-consent-widget:hover { background: var(--gm-primary-hover); transform: translateY(-2px); }   /* wie .gm-btt:hover */
.gm-consent-widget:active { transform: scale(.94); }
.gm-consent-widget:focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); }
.gm-consent-widget[hidden] { display: none; }
html.show--consent .gm-consent-widget, html.show--preferences .gm-consent-widget { opacity: 0; visibility: hidden; transition-delay: 0s, 0s, 0s, var(--gm-dur-mid); }
body.gm-has-feedback .gm-consent-widget { bottom: calc(var(--gm-feedback-h, 0px) + 1.25rem + env(safe-area-inset-bottom, 0px)); }   /* über der Gästebefragungs-Leiste, exakt wie .gm-btt (gm-content.css) */
@media (max-width: 991.98px) { .gm-consent-widget { left: var(--gm-space-md); bottom: calc(var(--gm-space-md) + env(safe-area-inset-bottom, 0px)); } }
@media (hover: none) { .gm-consent-widget { width: 44px; height: 44px; } }

@media (prefers-reduced-motion: reduce) {
  #cc-main { --cc-modal-transition-duration: 0s; }
  #cc-main .cm__btn, #cc-main .pm__btn, .gm-consent-widget { transition: none; }
  #cc-main .cm__btn:active, #cc-main .pm__btn:active, .gm-consent-widget:active { transform: none; }
}

/* Loop 6: Consent-ID in der Fußzeile der Einstellungen (Nachweis; Ort laut Datenschutzerklärung). Markierbar in einem Zug. */
#cc-main .pm__footer .gm-cc-id { flex-basis: 100%; order: 9; margin-top: .5rem; font-size: .8rem; line-height: 1.4; text-align: left; opacity: .85; }
#cc-main .pm__footer .gm-cc-id code { font: inherit; color: inherit; background: none; padding: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; user-select: all; -webkit-user-select: all; }
