/* Cookie-Consent (EXT:we_cookie_consent / Klaro) im Haustech-Design: Karte unten links, Buttons wie .btn, Modal mit Ink-Header.
   Eigene Datei, nach dem Stylesheet der Extension geladen; die Extension und Klaro setzen viele Layout-Regeln (absolute Buttons,
   Icons per ::before, feste Farben) – daher hohe Spezifität (html body …) und !important für die Layout-Eigenschaften. */
html body .klaro.we_cookie_consent .cookie-notice:not(.cookie-modal-notice) { left: 1.25rem !important; right: auto !important; bottom: 1.25rem !important; top: auto !important; width: min(520px, calc(100vw - 2.5rem)) !important; max-width: none !important; padding: 1.75rem 2rem !important; border-radius: 10px !important; background: #ffffff !important; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12), 0 24px 60px rgba(0, 0, 0, 0.18) !important; font-family: var(--font-body) !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body { padding: 0 !important; position: static !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body p, html body .klaro.we_cookie_consent .cookie-notice .cn-body p span { font-family: var(--font-body) !important; font-size: 1.125rem !important; line-height: 1.55 !important; color: #1f2a37 !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body p { margin: 0 0 1.25rem !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body a { color: #76b202 !important; text-decoration: underline; text-underline-offset: 3px; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cn-ok { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; gap: 0.75rem 1.25rem !important; padding: 0 !important; margin: 0 !important; position: static !important; width: 100% !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cn-ok > * { margin: 0 !important; flex: 0 0 auto !important; width: auto !important; max-width: none !important; position: static !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cn-buttons { display: flex !important; gap: 0.75rem !important; order: -1 !important; width: 100% !important; max-width: none !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn { position: static !important; display: inline-flex !important; align-items: center; justify-content: center; flex: 1 1 0 !important; width: auto !important; margin: 0 !important; padding: 0.85rem 1.2rem !important; font-family: var(--font-body) !important; font-size: 1.125rem !important; font-weight: 500 !important; line-height: 1.2 !important; border: 1px solid #1f2a37 !important; border-radius: 0 !important; background: #ffffff !important; color: #1f2a37 !important; box-shadow: none !important; text-align: center !important; white-space: nowrap !important; min-width: 0 !important; opacity: 1 !important; transition: background 0.2s, border-color 0.2s; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn:hover { background: #f2f4f6 !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn.cm-btn-success { background: #76b202 !important; border-color: #76b202 !important; color: #ffffff !important; order: 2 !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn.cm-btn-success:hover { background: #5f9102 !important; border-color: #5f9102 !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-link, html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-learn-more { position: static !important; display: inline-block !important; width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; font-family: var(--font-body) !important; font-size: 1.125rem !important; font-weight: 500 !important; line-height: 1.4 !important; color: #4e7500 !important; text-decoration: none !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-link:hover { color: #1f2a37 !important; text-decoration: underline !important; }
html body .klaro.we_cookie_consent .cookie-notice .cm-btn::before, html body .klaro.we_cookie_consent .cookie-notice .cm-btn::after, html body .klaro.we_cookie_consent .cookie-notice .cm-link::before, html body .klaro.we_cookie_consent .cookie-notice .cm-link::after { display: none !important; content: none !important; }
@media (max-width: 640px) { html body .klaro.we_cookie_consent .cookie-notice:not(.cookie-modal-notice) { left: 0.75rem !important; bottom: 0.75rem !important; width: calc(100vw - 1.5rem) !important; padding: 1.25rem !important; } html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn { padding: 0.8rem 0.75rem !important; } }
/* Modal: zentrierte Karte (die Extension setzt Modal links unten + Footer fixiert über die volle Breite) */
html body .klaro.we_cookie_consent .cookie-modal .cm-bg { background: rgba(0, 0, 0, 0.6) !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro { position: fixed !important; top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important; transform: translate(-50%, -50%) !important; width: min(720px, calc(100vw - 2rem)) !important; max-width: none !important; max-height: min(90vh, 100vh - 2rem) !important; display: flex !important; flex-direction: column !important; margin: 0 !important; padding: 0 !important; border-radius: 10px !important; overflow: hidden !important; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3) !important; background: #ffffff !important; font-family: var(--font-body) !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-header { position: static !important; background: #ffffff !important; color: #1f2a37 !important; padding: 1.75rem 3.5rem 1.25rem 2rem !important; border: 0 !important; border-bottom: 1px solid #e5e7eb !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-header h1, html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-header h1 span { font-family: var(--font-body) !important; font-size: 1.6rem !important; font-weight: 500 !important; color: #1f2a37 !important; margin: 0 0 0.5rem !important; line-height: 1.2 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-header p, html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-header p span { font-family: var(--font-body) !important; font-size: 1.125rem !important; line-height: 1.5 !important; color: #64748b !important; margin: 0 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-header a { color: #76b202 !important; text-decoration: underline !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .hide { position: absolute !important; top: 1.25rem !important; right: 1.25rem !important; width: 2rem !important; height: 2rem !important; background: transparent !important; border: 0 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .hide svg { stroke: #1f2a37 !important; width: 16px !important; height: 16px !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-body { position: static !important; flex: 1 1 auto !important; overflow-y: auto !important; padding: 1.5rem 2rem !important; background: #ffffff !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-list-title { font-family: var(--font-body) !important; font-size: 1.125rem !important; font-weight: 500 !important; color: #1f2a37 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-list-description, html body .klaro.we_cookie_consent .cookie-modal .cm-list-description p, html body .klaro.we_cookie_consent .cookie-modal .cm-list-description span { font-family: var(--font-body) !important; font-size: 1.125rem !important; line-height: 1.5 !important; color: #64748b !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-required, html body .klaro.we_cookie_consent .cookie-modal .cm-opt-out, html body .klaro.we_cookie_consent .cookie-modal .purposes { font-family: var(--font-body) !important; font-size: 1.125rem !important; color: #4e7500 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-purpose > .cm-list-input:checked:not(.required) + .cm-list-label .slider::before { background-color: #76b202 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-purpose > .cm-list-input:not(:checked) + .cm-list-label .slider::before { background-color: #bdbdbd !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer { position: static !important; width: auto !important; height: auto !important; display: flex !important; flex-wrap: wrap !important; gap: 0.75rem !important; padding: 1.25rem 2rem !important; background: #f2f4f6 !important; border: 0 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-footer-buttons { position: static !important; display: flex !important; flex-wrap: nowrap !important; gap: 0.75rem !important; width: 100% !important; max-width: none !important; margin: 0 !important; box-sizing: border-box !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn { position: static !important; flex: 1 1 auto !important; width: auto !important; min-width: max-content !important; max-width: none !important; box-sizing: border-box !important; margin: 0 !important; padding: 0.85rem 1rem !important; font-family: var(--font-body) !important; font-size: 1.125rem !important; font-weight: 500 !important; line-height: 1.2 !important; white-space: nowrap !important; border: 1px solid #1f2a37 !important; border-radius: 0 !important; background: #ffffff !important; color: #1f2a37 !important; box-shadow: none !important; text-align: center !important; opacity: 1 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn:hover { background: #f0f0f0 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn.cm-btn-accept-all { background: #76b202 !important; border-color: #76b202 !important; color: #ffffff !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn.cm-btn-accept-all:hover { background: #5f9102 !important; border-color: #5f9102 !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-btn::before, html body .klaro.we_cookie_consent .cookie-modal .cm-btn::after { display: none !important; content: none !important; }
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-powered-by { display: none !important; }
@media (max-width: 640px) { html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-header, html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-body, html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer { padding-left: 1.25rem !important; padding-right: 1.25rem !important; } html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-footer-buttons { flex-direction: column !important; } }

/* === Consent-Buttons wie die Website-Buttons (.btn): Pill, grüner Verlauf primär, Outline sekundär === */
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn,
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn {
  border-radius: 999px !important;
  border: 2px solid var(--color-primary) !important;
  background: transparent !important;
  color: var(--color-primary) !important;
  font-weight: 700 !important;
  padding: 0.72em 1.4em !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn:hover,
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn:hover {
  background: rgba(0,0,0,0.05) !important;
  color: var(--color-primary) !important;
}
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn.cm-btn-success,
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn.cm-btn-accept-all {
  border: 0 !important;
  background: linear-gradient(100deg, var(--color-accent) 0%, var(--color-accent-light) 100%) !important;
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0,0,0,0.15) !important;
  box-shadow: 0 4px 14px rgba(118,178,2,0.35) !important;
}
html body .klaro.we_cookie_consent .cookie-notice .cn-body .cm-btn.cm-btn-success:hover,
html body .klaro.we_cookie_consent .cookie-modal .cm-modal.cm-klaro .cm-footer .cm-btn.cm-btn-accept-all:hover {
  filter: brightness(1.06) !important;
  color: #fff !important;
  background: linear-gradient(100deg, var(--color-accent) 0%, var(--color-accent-light) 100%) !important;
}
