/* ============================================================================
   „Nach oben“-Knopf (T80) – ersetzt WPFront Scroll Top
   ----------------------------------------------------------------------------
   Unten rechts, 44 px, Radius wie alle Knöpfe. Farben nur über Rollen (T71).
   „body button.…“ schlägt das Elementor-Kit, das jeden <button> schwarz färbt.
   ============================================================================ */

body button.hac-nach-oben {
	position: fixed;
	/* Die Variablen setzt nach-oben.js, wenn der Chat unten rechts sitzt. */
	right: var(--hac-nach-oben-rechts, max(16px, env(safe-area-inset-right)));
	bottom: var(--hac-nach-oben-unten, max(16px, env(safe-area-inset-bottom)));
	z-index: 9990; /* unter Chat (100001) und Handymenü */
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--hac-knopf-hoehe-klein, 44px);
	height: var(--hac-knopf-hoehe-klein, 44px);
	margin: 0;
	padding: 0;
	border: 1px solid var(--hac-feld-rand, #e8e8e2);
	border-radius: var(--hac-knopf-radius, 8px);
	background: var(--hac-flaeche-erhoeht, #ffffff);
	color: var(--hac-schrift, #333333);
	box-shadow: var(--hac-schatten, 0 6px 18px rgba(0, 0, 0, .12));
	cursor: pointer;
	/* Unsichtbar, bis gescrollt wurde: nicht klickbar, nicht in der Tab-Reihe. */
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s,
	            color .16s ease, border-color .16s ease, background-color .16s ease;
}
body button.hac-nach-oben.ist-sichtbar {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition-delay: 0s;
}
body button.hac-nach-oben:hover,
body button.hac-nach-oben:focus {
	border-color: var(--hac-hd-brand, #bac6ae);
	background: var(--hac-flaeche, #f4f6f2);
	color: var(--hac-schrift-gruen, #4d5f3b);
}
body.hac-elektro button.hac-nach-oben:hover,
body.hac-elektro button.hac-nach-oben:focus {
	border-color: var(--hac-hd-blue, #1d89f6);
	color: var(--hac-schrift-blau, #0363c3);
}
body button.hac-nach-oben:focus-visible {
	outline: 2px solid var(--hac-fokus, #333333);
	outline-offset: 3px;
}
body button.hac-nach-oben svg {
	display: block;
	pointer-events: none;
}

/* Offenes Chat-Fenster: Pfeil ausblenden, er läge sonst hinter dem Fenster. */
body:has(#rh-chat-root .rh-chat-panel:not([hidden])) button.hac-nach-oben.ist-sichtbar {
	opacity: 0;
	visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
	body button.hac-nach-oben {
		transition: none;
		transform: none;
	}
}

@media print {
	body button.hac-nach-oben {
		display: none;
	}
}

/* Der Kopf bekommt nach dem Klick den Fokus (Skript), ohne sichtbaren Rahmen. */
.hac-kopf:focus { outline: none; }
