/**
 * DropWiper Sales Cloud — Stylesheet der zwei sichtbaren Theme-Toggle-Anker
 * (P31, datiert 2026-10-20).
 *
 * ZWECK: ausschliesslich die zwei Anker selbst —
 *  (1) das Icon-Paar (Sonne/Mond) in der Admin-Bar (#wpadminbar .dsc-ccs-toggle-icons,
 *      Knoten dsc-ccs-theme-toggle-adminbar, gesetzt von Core\CcsSettings::add_admin_bar_toggle());
 *  (2) der Floating-Button im Frontend (.dsc-ccs-theme-float, gedruckt von
 *      Core\CcsSettings::print_frontend_toggle_button()).
 *
 * VORGABE (Auftrag): KEINE hartkodierte Farbe in dieser Datei — jeder Farb-, Rahmen- und
 * Fokus-Wert kommt aus den CCS-Variablen var(--dsc-ccs-*) des Generators
 * (Core\CcsSettings::print_css_variables()). Damit folgen beide Anker dem gespeicherten
 * Light-/Dark-Mode, ohne dass hier eine zweite Farb-Wahrheit entsteht.
 *
 * SICHTBARKEIT DER ICONS: die Icon-Spans tragen im Markup kein hidden, das JavaScript setzt das
 * Attribut (syncIcons in assets/js/ccs-theme-toggle.js). Die [hidden]-Regeln unten sind deshalb
 * explizit: die Spans sind inline bzw. Flex-Items, und deren Anzeige würde die UA-Regel
 * „[hidden] { display: none }" sonst überschreiben.
 */

/* --- (1) Admin-Bar: Sonne/Mond als klickbares Icon-Paar -------------------------- */

#wpadminbar .dsc-ccs-theme-toggle-node .dsc-ccs-toggle-icons {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 2px;
	height: 32px;
	line-height: 32px;
}

#wpadminbar .dsc-ccs-theme-toggle-node .dsc-ccs-toggle-sun,
#wpadminbar .dsc-ccs-theme-toggle-node .dsc-ccs-toggle-moon {
	font-size: 16px;
	line-height: 32px;
	vertical-align: middle;
}

#wpadminbar .dsc-ccs-theme-toggle-node .dsc-ccs-toggle-sun[hidden],
#wpadminbar .dsc-ccs-theme-toggle-node .dsc-ccs-toggle-moon[hidden] {
	display: none;
}

/* --- (2) Frontend: Floating-Button unten rechts ---------------------------------- */

.dsc-ccs-theme-float {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 99999;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2px;
	padding: 0;
	border: 1px solid var(--dsc-ccs-border);
	border-radius: var(--dsc-ccs-button-radius);
	background: var(--dsc-ccs-bg);
	color: var(--dsc-ccs-text);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

.dsc-ccs-theme-float .dsc-ccs-toggle-sun,
.dsc-ccs-theme-float .dsc-ccs-toggle-moon {
	font-size: 20px;
	line-height: 1;
}

.dsc-ccs-theme-float .dsc-ccs-toggle-sun[hidden],
.dsc-ccs-theme-float .dsc-ccs-toggle-moon[hidden] {
	display: none;
}

/* Hover-/Tastatur-Fokus: Hausmuster aus assets/css/ccs-admin.css (gestrichelter Rahmen über
 * outline, keine Flächen- oder Rahmenfarb-Änderung). */
.dsc-ccs-theme-float:hover,
.dsc-ccs-theme-float:focus-visible {
	outline: 1px dashed var(--dsc-ccs-text);
	outline-offset: 2px;
}
