/*
 * Huber-Bausteine: Cookie-Hinweis im Design des Kunden (gleiche Variablen wie die übrigen Bausteine).
 * Leiste unten über die ganze Breite, verdeckt nichts Wichtiges (keine Sperre der Seite).
 * Drei gleichwertige Knöpfe; auf dem Handy untereinander, mindestens 44 px hoch.
 */
.hb-einwilligung,.hb-einwilligung *{box-sizing:border-box}
.hb-einwilligung{position:fixed;left:0;right:0;bottom:0;z-index:100000;max-height:85vh;overflow-y:auto;padding:1rem;
	background:var(--farbe-hintergrund,#fff);color:var(--farbe-text,#222);font-family:var(--schrift-text,inherit);font-size:1rem;line-height:1.5;
	border-top:3px solid var(--farbe-primaer,#1e73be);box-shadow:0 -6px 28px rgba(0,0,0,.18)}
.hb-einwilligung:focus{outline:none}
.hb-einwilligung:focus-visible{outline:3px solid var(--farbe-primaer,#1e73be);outline-offset:-6px}
.hb-einwilligung__innen{max-width:1180px;margin:0 auto;display:grid;gap:.75rem}
.hb-einwilligung__titel{margin:0;font-family:var(--schrift-titel,inherit);font-size:1.15rem;line-height:1.3;font-weight:700;color:inherit}
.hb-einwilligung__text{margin:0;max-width:62rem}
.hb-einwilligung__text a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:.2em}
.hb-einwilligung__liste{margin:0;padding:0;border:0;display:grid;gap:.5rem}
.hb-einwilligung__liste[hidden]{display:none}
.hb-einwilligung__legende{padding:0;margin:0 0 .25rem;font-weight:700}
.hb-einwilligung__dienst{display:flex;gap:.75rem;align-items:flex-start;padding:.6rem .75rem;border:1px solid color-mix(in srgb,var(--farbe-text,#222) 18%,transparent);border-radius:var(--radius,6px);cursor:pointer}
.hb-einwilligung__dienst input{flex:none;width:1.25rem;height:1.25rem;margin:.15rem 0 0;accent-color:var(--farbe-primaer,#1e73be)}
.hb-einwilligung__dienst input:disabled{opacity:.7}
.hb-einwilligung__dienst span{display:grid;gap:.1rem}
.hb-einwilligung__beschreibung{font-size:.92rem;color:var(--farbe-text-leise,#555)}
.hb-einwilligung__knoepfe{display:flex;flex-wrap:wrap;gap:.6rem}
/* Gleichwertig: alle drei Knöpfe gleich gross und gleich auffällig */
.hb-einwilligung__knopf{flex:1 1 0;min-width:10rem;min-height:44px;padding:.7rem 1.2rem;border:2px solid var(--farbe-primaer,#1e73be);border-radius:var(--radius,6px);
	background:var(--farbe-primaer,#1e73be);color:var(--farbe-auf-primaer,#fff);font:600 1rem/1.2 var(--schrift-text,inherit);cursor:pointer}
.hb-einwilligung__knopf:hover{filter:brightness(1.08)}
.hb-einwilligung__knopf:focus-visible,.hb-einwilligung__dienst input:focus-visible,.hb-einwilligung__text a:focus-visible{outline:3px solid var(--farbe-text,#222);outline-offset:3px}

/* Ersatz, wenn die Fusszeile keinen Datenschutz-Link hat */
.hb-einwilligung-ecke{position:fixed;left:.75rem;bottom:.75rem;z-index:99999;padding:.45rem .75rem;border-radius:var(--radius,6px);
	background:var(--farbe-hintergrund,#fff);color:var(--farbe-text,#222);box-shadow:0 2px 10px rgba(0,0,0,.18);font:600 .85rem/1.2 var(--schrift-text,inherit);text-decoration:underline;text-underline-offset:.2em}
.hb-einwilligung-ecke:focus-visible{outline:3px solid var(--farbe-primaer,#1e73be);outline-offset:3px}

@media (max-width:600px){
	.hb-einwilligung{padding:.85rem}
	.hb-einwilligung__knoepfe{flex-direction:column}
	.hb-einwilligung__knopf{width:100%;flex:none}
}
@media print{.hb-einwilligung,.hb-einwilligung-ecke{display:none}}