/*
 * Modo escuro do tema MakeGrow: redefinição dos papéis semânticos de cor por data-tema.
 *
 * Redefine SOMENTE os papéis semânticos (--wp--custom--cor--*), a sálvia de nicho e a
 * cor de foco. Este é, junto com o theme.json, o único arquivo autorizado a conter
 * valores hexadecimais. Valores conferidos contra project/01-especificacao.md (tabela 3.2)
 * e project/tokens/tokens.css.
 */

/* Preferência do sistema, quando não há escolha salva ("automático"). */
@media (prefers-color-scheme: dark) {

	:root:not([data-tema="claro"]) {
		--wp--custom--cor--fundo: #2A2520;
		--wp--custom--cor--faixa: #312B26;
		--wp--custom--cor--superficie: #3A342E;
		--wp--custom--cor--texto: #F7F2E8;
		--wp--custom--cor--texto-2: #C4BBAE;
		--wp--custom--cor--borda: #4A433C;
		--wp--custom--cor--borda-forte: #7E756A;
		--wp--custom--cor--contraste-hover: #E6DFD2;
		--wp--custom--cor--bloco-escuro: #3A342E;
		--wp--custom--cor--rodape: #221E1A;
		--wp--custom--cor--nicho-texto: #F7F2E8;
		--wp--custom--cor--ilustra-folha: transparent;
		--wp--custom--cor--sombra: rgba(0, 0, 0, 0.5);
		--wp--custom--nicho--salvia: #525C49;
		--wp--custom--foco--cor: var(--wp--preset--color--mel);
		color-scheme: dark;
	}

	:root:not([data-tema="claro"]) .only-light { display: none; }

	:root:not([data-tema="claro"]) .only-dark { display: initial; }

	/*
	 * Cabeçalho: a logomarca troca para a versão negativa. Nunca filtro de inversão;
	 * o rodapé (sempre escuro) tem a mesma troca, sempre, em assets/css/sections.css.
	 */
	:root:not([data-tema="claro"]) .site-header .wp-block-site-logo img {
		content: url(../img/logo/lockup-horizontal-negativo.svg);
	}
}

/* Escolha explícita: escuro. */
:root[data-tema="escuro"] {
	--wp--custom--cor--fundo: #2A2520;
	--wp--custom--cor--faixa: #312B26;
	--wp--custom--cor--superficie: #3A342E;
	--wp--custom--cor--texto: #F7F2E8;
	--wp--custom--cor--texto-2: #C4BBAE;
	--wp--custom--cor--borda: #4A433C;
	--wp--custom--cor--borda-forte: #7E756A;
	--wp--custom--cor--contraste-hover: #E6DFD2;
	--wp--custom--cor--bloco-escuro: #3A342E;
	--wp--custom--cor--rodape: #221E1A;
	--wp--custom--cor--nicho-texto: #F7F2E8;
	--wp--custom--cor--ilustra-folha: transparent;
	--wp--custom--cor--sombra: rgba(0, 0, 0, 0.5);
	--wp--custom--nicho--salvia: #525C49;
	--wp--custom--foco--cor: var(--wp--preset--color--mel);
	color-scheme: dark;
}

:root[data-tema="escuro"] .only-light { display: none; }

:root[data-tema="escuro"] .only-dark { display: initial; }

:root[data-tema="escuro"] .site-header .wp-block-site-logo img {
	content: url(../img/logo/lockup-horizontal-negativo.svg);
}

/* Escolha explícita: claro, mesmo com sistema escuro. Controles nativos seguem a página. */
:root[data-tema="claro"] {
	color-scheme: light;
}

/*
 * Os papéis sobre-mel, sobre-escuro, sobre-escuro-2, borda-sobre-escuro, mel-hover e
 * texto-sobre-escuro não mudam no escuro (ver project/01-especificacao.md, tabela 3.2) e por
 * isso não aparecem aqui.
 */