/*
 * Modo claro: sobrescreve as variáveis do modo noturno (padrão em :root).
 * Só atua com html[data-theme="light"], definido pelo botão ou pelo script do <head>.
 * As quatro cores base vêm do Personalizar (“Modo claro e noturno”); o restante deriva delas.
 */
html[data-theme="light"] {
	color-scheme: light;

	--pen-bg: var(--pen-light-bg);
	--pen-surface: var(--pen-light-surface);
	--pen-text: var(--pen-light-text);
	--pen-text-2: color-mix(in srgb, var(--pen-light-text) 72%, var(--pen-light-surface));
	--pen-text-3: color-mix(in srgb, var(--pen-light-text) 60%, var(--pen-light-surface));
	--pen-border: var(--pen-light-border);

	--pen-header-bg: var(--pen-light-surface);
	--pen-header-text: var(--pen-light-text);
	--pen-search-bg: var(--pen-light-bg);
	--pen-search-color: var(--pen-light-text);
	--pen-social-bg: var(--pen-light-bg);
	--pen-social-color: var(--pen-light-text);

	--pen-nav-bg: var(--pen-light-surface);
	--pen-nav-border: var(--pen-light-border);
	--pen-menubtn-color: var(--pen-light-text);
	--pen-menubtn-bg: var(--pen-light-surface);
	--pen-chip-border: var(--pen-light-border);
	--pen-chip-bg: var(--pen-light-surface);
	--pen-chip-color: var(--pen-light-text);
	--pen-chip-hover-border: var(--pen-accent);
	--pen-chip-hover-color: var(--pen-accent);
	--pen-chip-active-bg: var(--pen-light-bg);
	--pen-chip-active-border: var(--pen-light-border);
	--pen-chip-active-color: var(--pen-light-text);
	--pen-chip-track: var(--pen-light-border);
	--pen-chip-thumb: var(--pen-text-3);

	--pen-drawer-bg: var(--pen-light-surface);
	--pen-drawer-color: var(--pen-light-text);
	--pen-drawer-sub: var(--pen-text-2);
	--pen-drawer-divider: var(--pen-light-border);

	--pen-link: var(--pen-accent);
	--pen-link-hover: var(--pen-accent);
	--pen-title-hover: var(--pen-accent);
	--pen-archive-h1: var(--pen-light-text);
	--pen-focus: var(--pen-accent);
	--pen-img-fallback: var(--pen-light-bg);
	--pen-caption-bg: var(--pen-light-bg);
	--pen-caption-color: var(--pen-text-2);
	--pen-tags-border: var(--pen-light-border);
	--pen-ad-border: var(--pen-light-border);
	--pen-ad-label: var(--pen-text-2);
	--pen-more-border: var(--pen-text-2);
	--pen-more-color: var(--pen-light-text);

	--pen-sidenav-bg: var(--pen-light-surface);
	--pen-sidenav-icon: var(--pen-light-text);
}