/*
 * Fix: Icon-Auswahl (selectIcons-FieldWizard) unlesbar bei OS-Dark-Mode.
 *
 * TYPO3 12.4 hat keinen Backend-Dark-Mode, kippt aber in backend.css unter
 * `@media (prefers-color-scheme: dark)` global die `--typo3-component-*`-Tokens
 * auf die dunkle Variante (--typo3-dark-bg = rgb(30,30,30)).
 * `.form-wizard-icon-list` benutzt genau diese Tokens als Hintergrund, wird also
 * schwarz. Die Icons daneben koennen nicht mitziehen: sie werden als
 * <img src="*.svg"> eingebunden, und `fill="currentColor"` im SVG loest im
 * eigenen Dokument gegen Schwarz auf, nie gegen --typo3-component-color (#fff).
 * Ergebnis: schwarze Icons auf schwarzem Grund, nur das aktive bleibt sichtbar
 * (blauer --typo3-list-item-active-bg dahinter).
 *
 * Der Core loest dasselbe Problem beim Content-Element-Wizard, indem er dort die
 * hellen Tokens wieder festnagelt (typo3-backend-new-content-element-wizard in
 * backend.css) -- `.form-wizard-icon-list` hat er dabei uebersehen. Wir machen
 * hier exakt dasselbe fuer die Icon-Liste.
 *
 * Betrifft u. a. das Feld "Typ" im News-Artikel (EXT:news, selectIcons).
 * Kann entfallen, sobald der Core das gefixt hat bzw. mit TYPO3 v13
 * (dort gibt es echte Color Schemes).
 */
@media (prefers-color-scheme: dark) {
	.form-wizard-icon-list {
		--typo3-component-color-scheme: var(--typo3-light-color-scheme);
		--typo3-component-color: var(--typo3-light-color);
		--typo3-component-primary-color: var(--typo3-light-primary-color);
		--typo3-component-secondary-color: var(--typo3-light-secondary-color);
		--typo3-component-bg: var(--typo3-light-bg);
		--typo3-component-border-color: var(--typo3-light-border-color);
		--typo3-component-link-color: var(--typo3-light-link-color);
		--typo3-component-link-hover-color: var(--typo3-light-link-hover-color);
		--typo3-component-hover-color: var(--typo3-light-hover-color);
		--typo3-component-hover-bg: var(--typo3-light-hover-bg);
		--typo3-component-hover-border-color: var(--typo3-light-hover-border-color);
		--typo3-component-focus-color: var(--typo3-light-focus-color);
		--typo3-component-focus-bg: var(--typo3-light-focus-bg);
		--typo3-component-focus-border-color: var(--typo3-light-focus-border-color);
		--typo3-component-active-color: var(--typo3-light-active-color);
		--typo3-component-active-bg: var(--typo3-light-active-bg);
		--typo3-component-active-border-color: var(--typo3-light-active-border-color);
		--typo3-component-disabled-color: var(--typo3-light-disabled-color);
		--typo3-component-disabled-bg: var(--typo3-light-disabled-bg);
		--typo3-component-disabled-border-color: var(--typo3-light-disabled-border-color);
	}
}
