/* Diffreng — Core-Block-Icon-Erweiterungen (Navigation + Anmelden/Abmelden)
 * --------------------------------------------------------------------
 * Ersetzt rein per CSS-Maskierung das Standard-Hamburger-/Listen-Icon
 * des WordPress-Core-Navigation-Blocks durch ein Personen-Icon, sowie
 * (weiter unten) den Text des Anmelden/Abmelden-Blocks durch ein Icon.
 * Bewusst KEIN Eingriff in die Core-Blöcke selbst (der Navigation-Icon-
 * Umschalter kennt offiziell nur "Handle"/"Menü" — es gibt dafür
 * keinen Erweiterungspunkt) — stattdessen wird das native Element
 * unsichtbar gemacht und stattdessen eine eigene Maske mit
 * "currentColor" eingeblendet, die automatisch die vom Theme
 * vorgegebene Textfarbe übernimmt.
 *
 * Alle Regeln bewusst auf .diffreng-nav-hover-icon bzw. das jeweils
 * nur bei aktivierter Checkbox vorhandene Icon-Element eingegrenzt —
 * andere Navigation- bzw. Anmelden/Abmelden-Blöcke der Website (z.B.
 * im Footer) bleiben dadurch unberührt. Siehe
 * includes/diffreng-nav-icon.php für die serverseitige Logik.
 */

.diffreng-nav-hover-icon .wp-block-navigation__responsive-container-open svg {
	display: none;
}
.diffreng-nav-hover-icon .wp-block-navigation__responsive-container-open {
	position: relative;
}
.diffreng-nav-hover-icon .wp-block-navigation__responsive-container-open::before {
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-color: currentColor;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

/* ── Anmelden/Abmelden-Icon (core/loginout, pro Block aktivierbar) ──
   Icon-Farbe/-Form je nach An-/Abmelde-Status unterschiedlich —
   nutzt die von WordPress selbst gesetzte Klasse ".logged-in" am
   äußeren Wrapper, keine eigene Zustandsprüfung nötig. */

/* Absicherung: .screen-reader-text ist zwar eine WordPress-Standard-
   Klasse, wird aber nicht von jedem Theme zwingend definiert — eigene
   Definition als Rückfall, damit der für Screenreader erhaltene Text
   (siehe includes/diffreng-nav-icon.php) auch ohne Theme-Unterstützung
   zuverlässig funktioniert. */
.diffreng-loginout-icon + .screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.diffreng-loginout-icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	vertical-align: middle;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}
/* Ausgeloggt → "Anmelden": Personen-Icon (dasselbe wie beim
   Navigation-Icon, für ein einheitliches Erscheinungsbild) */
.wp-block-loginout:not(.logged-in) .diffreng-loginout-icon {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E");
}
/* Eingeloggt → "Abmelden": Pfeil aus einer Tür heraus */
.wp-block-loginout.logged-in .diffreng-loginout-icon {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17 7l-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5zM4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4V5z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17 7l-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5zM4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4V5z'/%3E%3C/svg%3E");
}