/* ============================================================
   mieterhoehung.at – Einwilligungsbanner im Stil der Seite
   ------------------------------------------------------------
   js/consent.js hängt seinen eigenen Notfall-Stil nur dann ein,
   wenn der Marker --vhab-consent-css fehlt. Weil er hier gesetzt
   ist, gilt ausschließlich dieses Blatt.
   ============================================================ */
:root { --vhab-consent-css: 1; }

#vhab-consent {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999;
  background: #0c0c22; color: #fff; font-family: inherit;
  border-top: 1px solid #b99552; box-shadow: 0 -20px 50px rgba(12, 12, 34, .4);
}
#vhab-consent .vhab-c-inner { width: min(1180px, 100% - 48px); margin-inline: auto; padding: 26px 0 28px; }
#vhab-consent h2 { font-size: 12px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: #cbab6b; margin: 0 0 12px; }
#vhab-consent p { font-size: 14.5px; line-height: 1.65; margin: 0 0 18px; color: rgba(255, 255, 255, .7); max-width: 86ch; }
#vhab-consent a { color: #cbab6b; text-decoration: underline; }
#vhab-consent fieldset { border: 0; padding: 18px 0 0; margin: 0 0 20px; display: flex; flex-wrap: wrap; gap: 10px 30px; border-top: 1px solid rgba(255, 255, 255, .14); }
#vhab-consent legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#vhab-consent .vhab-c-cat { display: inline-flex; align-items: center; gap: 9px; font-size: 14.5px; font-weight: 500; color: #fff; cursor: pointer; }
#vhab-consent .vhab-c-cat input { width: 17px; height: 17px; accent-color: #b99552; cursor: pointer; }
#vhab-consent .vhab-c-cat input:disabled { cursor: default; }
#vhab-consent .vhab-c-cat .vhab-c-hint { font-weight: 400; color: rgba(255, 255, 255, .5); font-size: 13px; }
#vhab-consent .vhab-c-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
#vhab-consent button {
  font-family: inherit; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  border-radius: 999px; padding: 14px 26px; cursor: pointer; transition: background .25s, color .25s, border-color .25s;
}
#vhab-consent .vhab-c-accept { background: #b99552; border: 1px solid #b99552; color: #0c0c22; }
#vhab-consent .vhab-c-accept:hover { background: #cbab6b; border-color: #cbab6b; }
#vhab-consent .vhab-c-necessary, #vhab-consent .vhab-c-save { background: transparent; border: 1px solid rgba(255, 255, 255, .45); color: #fff; }
#vhab-consent .vhab-c-necessary:hover, #vhab-consent .vhab-c-save:hover { background: rgba(255, 255, 255, .1); }
#vhab-consent button:focus-visible, #vhab-consent input:focus-visible, #vhab-consent a:focus-visible { outline: 2px solid #b99552; outline-offset: 2px; }

#vhab-consent-open {
  position: fixed; left: 16px; bottom: 16px; z-index: 9990;
  background: rgba(12, 12, 34, .8); color: #fff; font-family: inherit;
  font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .2);
  cursor: pointer; opacity: .55; transition: opacity .25s;
}
#vhab-consent-open:hover, #vhab-consent-open:focus-visible { opacity: 1; outline-color: #b99552; }

@media (max-width: 680px) {
  #vhab-consent .vhab-c-inner { width: calc(100% - 32px); padding: 20px 0 22px; }
  #vhab-consent .vhab-c-actions { flex-direction: column; align-items: stretch; }
  #vhab-consent button { width: 100%; }
}
@media print {
  #vhab-consent, #vhab-consent-open { display: none !important; }
}