html.cd-night-mode {
	color-scheme: dark;
	background-color: var(--cd-night-bg, #0b1220) !important;
}

html.cd-night-mode body,
html.cd-night-mode #page,
html.cd-night-mode .site,
html.cd-night-mode .site-content,
html.cd-night-mode main {
	background-color: var(--cd-night-bg, #0b1220) !important;
	color: var(--cd-night-text, #e8eef7) !important;
}

html.cd-night-mode :where(
	.elementor,
	.elementor-page,
	.e-con,
	.elementor-section,
	.elementor-column-wrap,
	.elementor-widget-wrap
):not(html.cd-night-header-original :where(
	header,
	header *,
	.site-header,
	.site-header *,
	#masthead,
	#masthead *,
	#site-header,
	#site-header *,
	#menuhopin,
	#menuhopin *,
	.elementor-location-header,
	.elementor-location-header *,
	[data-elementor-type="header"],
	[data-elementor-type="header"] *
)) {
	background-color: var(--cd-night-bg, #0b1220) !important;
	color: var(--cd-night-text, #e8eef7) !important;
}

html.cd-night-mode :where(
	.site-header,
	.site-footer,
	header,
	footer,
	nav,
	aside,
	article,
	.widget,
	.card,
	.post,
	.entry,
	.elementor-nav-menu--dropdown,
	.wp-block-group.has-background,
	.wp-block-cover__inner-container
):not(html.cd-night-header-original :where(
	header,
	header *,
	.site-header,
	.site-header *,
	#masthead,
	#masthead *,
	#site-header,
	#site-header *,
	#menuhopin,
	#menuhopin *,
	.elementor-location-header,
	.elementor-location-header *,
	[data-elementor-type="header"],
	[data-elementor-type="header"] *
)) {
	background-color: var(--cd-night-surface, #111a2b) !important;
	border-color: var(--cd-night-border, #2a3850) !important;
	color: var(--cd-night-text, #e8eef7) !important;
}

html.cd-night-mode :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, figcaption, blockquote):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
)) {
	color: var(--cd-night-text, #e8eef7) !important;
}

/* Corrige widgets HTML y textos con negro fijado por el tema. */
html.cd-night-mode :where(
	.elementor-widget-html,
	.elementor-widget-html *,
	.elementor-widget-text-editor,
	.elementor-widget-text-editor *,
	.wp-block-html,
	.wp-block-html *,
	.widget_text,
	.widget_text *,
	.textwidget,
	.textwidget *
):not(html.cd-night-header-original :where(
	header,
	header *,
	.site-header,
	.site-header *,
	#masthead,
	#masthead *,
	#site-header,
	#site-header *,
	#menuhopin,
	#menuhopin *,
	.elementor-location-header,
	.elementor-location-header *,
	[data-elementor-type="header"],
	[data-elementor-type="header"] *
)) {
	color: var(--cd-night-text, #e8eef7) !important;
	border-color: var(--cd-night-border, #2a3850) !important;
}

/* Colores manuales independientes para fecha/día y temperatura/clima. */
html.cd-night-mode :where(
	.cd-night-date-text,
	.cd-night-date-text *,
	[class*="fecha"],
	[class*="fecha"] *,
	[id*="fecha"],
	[id*="fecha"] *,
	[class*="date-"],
	[class*="date-"] *,
	[id^="date-"],
	[id^="date-"] *
) {
	color: var(--cd-night-date, #e8eef7) !important;
}

html.cd-night-mode :where(
	.cd-night-weather-text,
	.cd-night-weather-text *,
	[class*="weather"],
	[class*="weather"] *,
	[id*="weather"],
	[id*="weather"] *,
	[class*="clima"],
	[class*="clima"] *,
	[id*="clima"],
	[id*="clima"] *,
	[class*="temperatura"],
	[class*="temperatura"] *,
	[id*="temperatura"],
	[id*="temperatura"] *,
	[class*="temperature"],
	[class*="temperature"] *,
	[id*="temperature"],
	[id*="temperature"] *
) {
	color: var(--cd-night-weather, #e8eef7) !important;
}

html.cd-night-mode :where(
	.has-black-color,
	[style*="color: #000"],
	[style*="color:#000"],
	[style*="color: black"],
	[style*="color:black"],
	[style*="color: rgb(0, 0, 0)"]
):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
)) {
	color: var(--cd-night-text, #e8eef7) !important;
}

html.cd-night-mode :where(.entry-meta, .post-meta, .description, .caption, time, small, .has-text-color.has-gray-color):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
)) {
	color: var(--cd-night-muted, #b8c4d6) !important;
}

html.cd-night-mode a:not(.button):not(.elementor-button):not(.wp-element-button):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
)) {
	color: var(--cd-night-link, #75bfff) !important;
}

html.cd-night-mode :where(input, textarea, select, option, fieldset, table, th, td, pre, code):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
)) {
	background-color: var(--cd-night-surface, #111a2b) !important;
	border-color: var(--cd-night-border, #2a3850) !important;
	color: var(--cd-night-text, #e8eef7) !important;
}

html.cd-night-mode :where(input, textarea, select):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
))::placeholder {
	color: var(--cd-night-muted, #b8c4d6) !important;
	opacity: .8;
}

html.cd-night-mode :where(hr, .wp-block-separator):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
)) {
	border-color: var(--cd-night-border, #2a3850) !important;
	background-color: var(--cd-night-border, #2a3850) !important;
}

html.cd-night-mode :where(.has-white-background-color, .has-background-white, .bg-white, [style*="background-color: #fff"], [style*="background-color:#fff"], [style*="background-color: white"]):not(html.cd-night-header-original :where(
	header,
	header *,
	.site-header,
	.site-header *,
	#masthead,
	#masthead *,
	#site-header,
	#site-header *,
	#menuhopin,
	#menuhopin *,
	.elementor-location-header,
	.elementor-location-header *,
	[data-elementor-type="header"],
	[data-elementor-type="header"] *
)) {
	background-color: var(--cd-night-surface, #111a2b) !important;
}

html.cd-night-mode :where(button, .button, .elementor-button, .wp-element-button, input[type="submit"], input[type="button"]):not(html.cd-night-header-original :where(
	header *,
	.site-header *,
	#masthead *,
	#site-header *,
	#menuhopin *,
	.elementor-location-header *,
	[data-elementor-type="header"] *
)) {
	border-color: var(--cd-night-border, #2a3850) !important;
}

/* Conserva los estilos originales del header cuando la opción está desactivada. */
html.cd-night-mode.cd-night-header-original :where(
	header,
	.site-header,
	#masthead,
	#site-header,
	#menuhopin,
	.elementor-location-header,
	[data-elementor-type="header"]
) {
	color-scheme: light;
}

/*
 * Refuerzo de compatibilidad para Elementor y optimizadores de CSS.
 * Estas reglas sencillas aseguran que el contenido continúe en modo nocturno
 * cuando el header debe conservar sus colores, sin aplicar estilos al header.
 */
html.cd-night-mode.cd-night-header-original body,
html.cd-night-mode.cd-night-header-original #page,
html.cd-night-mode.cd-night-header-original .site,
html.cd-night-mode.cd-night-header-original .site-content,
html.cd-night-mode.cd-night-header-original main,
html.cd-night-mode.cd-night-header-original .elementor-location-single,
html.cd-night-mode.cd-night-header-original .elementor-location-archive {
	background-color: var(--cd-night-bg, #0b1220) !important;
	color: var(--cd-night-text, #e8eef7) !important;
}

html.cd-night-mode.cd-night-header-original .site-content :where(
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	p,
	li,
	dt,
	dd,
	figcaption,
	blockquote
),
html.cd-night-mode.cd-night-header-original main :where(
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	p,
	li,
	dt,
	dd,
	figcaption,
	blockquote
) {
	color: var(--cd-night-text, #e8eef7) !important;
}

/* Colores opcionales elegidos para el header nocturno. */
html.cd-night-mode.cd-night-header-custom :is(
	header,
	.site-header,
	#masthead,
	#site-header,
	#menuhopin,
	.elementor-location-header,
	[data-elementor-type="header"]
) {
	background-color: var(--cd-night-header-bg, #111a2b) !important;
	border-color: var(--cd-night-border, #2a3850) !important;
	color: var(--cd-night-header-text, #e8eef7) !important;
}

html.cd-night-mode.cd-night-header-custom :is(
	header,
	.site-header,
	#masthead,
	#site-header,
	#menuhopin,
	.elementor-location-header,
	[data-elementor-type="header"]
) :where(
	.elementor,
	.elementor-page,
	.e-con,
	.elementor-section,
	.elementor-container,
	.elementor-column,
	.elementor-column-wrap,
	.elementor-widget-wrap,
	nav,
	.elementor-nav-menu--dropdown
) {
	background-color: var(--cd-night-header-bg, #111a2b) !important;
	border-color: var(--cd-night-border, #2a3850) !important;
	color: var(--cd-night-header-text, #e8eef7) !important;
}

html.cd-night-mode.cd-night-header-custom :is(
	header,
	.site-header,
	#masthead,
	#site-header,
	#menuhopin,
	.elementor-location-header,
	[data-elementor-type="header"]
) :where(h1, h2, h3, h4, h5, h6, p, span, li, a, label, time, small, .elementor-icon) {
	color: var(--cd-night-header-text, #e8eef7) !important;
}

/* Barra del menú configurable, independiente del logo y del resto del header. */
html.cd-night-menu-bar-custom {
	--cd-menu-bar-current-bg: var(--cd-menu-bar-light-bg, #08a9dd);
}

html.cd-night-menu-bar-custom.cd-night-mode {
	--cd-menu-bar-current-bg: var(--cd-menu-bar-dark-bg, #075985);
}

html.cd-night-menu-bar-custom .cd-night-menu-bar-target,
html.cd-night-menu-bar-custom .cd-night-menu-bar-target :where(
	.e-con,
	.e-con-inner,
	.elementor-section,
	.elementor-container,
	.elementor-column,
	.elementor-column-wrap,
	.elementor-widget-wrap,
	.elementor-element-populated,
	.elementor-widget-nav-menu,
	.elementor-widget-container,
	.elementor-background-overlay,
	nav,
	.elementor-nav-menu--main,
	.elementor-nav-menu__container,
	.elementor-nav-menu
),
html.cd-night-menu-bar-custom :is(
	header,
	.site-header,
	#masthead,
	#site-header,
	#menuhopin,
	.elementor-location-header,
	[data-elementor-type="header"]
) nav {
	background: var(--cd-menu-bar-current-bg) !important;
}

html.cd-night-menu-bar-custom .cd-night-menu-bar-target::before,
html.cd-night-menu-bar-custom .cd-night-menu-bar-target::after {
	background: var(--cd-menu-bar-current-bg) !important;
}

/* Fecha y clima del header: colores manuales para modo claro y nocturno. */
html :is(
	header,
	.site-header,
	#masthead,
	#site-header,
	#menuhopin,
	.elementor-location-header,
	[data-elementor-type="header"]
) :where(
	.cd-night-date-text,
	.cd-night-date-text *,
	[class*="fecha"],
	[class*="fecha"] *,
	[id*="fecha"],
	[id*="fecha"] *,
	[class*="date-"],
	[class*="date-"] *,
	[id^="date-"],
	[id^="date-"] *,
	time
) {
	color: var(--cd-header-date-current, #111111) !important;
}

html :is(
	header,
	.site-header,
	#masthead,
	#site-header,
	#menuhopin,
	.elementor-location-header,
	[data-elementor-type="header"]
) :where(
	.cd-night-weather-text,
	.cd-night-weather-text *,
	[class*="weather"],
	[class*="weather"] *,
	[id*="weather"],
	[id*="weather"] *,
	[class*="clima"],
	[class*="clima"] *,
	[id*="clima"],
	[id*="clima"] *,
	[class*="temperatura"],
	[class*="temperatura"] *,
	[id*="temperatura"],
	[id*="temperatura"] *,
	[class*="temperature"],
	[class*="temperature"] *,
	[id*="temperature"],
	[id*="temperature"] *
) {
	color: var(--cd-header-weather-current, #111111) !important;
}

html.cd-night-mode ::selection {
	background: var(--cd-night-link, #75bfff);
	color: var(--cd-night-bg, #0b1220);
}

.cd-night-toggle {
	appearance: none;
	position: fixed;
	top: var(--cd-night-toggle-top, 20px);
	right: var(--cd-night-toggle-right, 20px);
	z-index: 2147483000;
	display: grid;
	place-items: center;
	width: var(--cd-night-toggle-size, 48px);
	height: var(--cd-night-toggle-size, 48px);
	min-width: var(--cd-night-toggle-size, 48px);
	min-height: var(--cd-night-toggle-size, 48px);
	margin: 0;
	padding: 0;
	border: 1px solid rgba(11, 18, 32, .2);
	border-radius: 999px;
	background: var(--cd-night-toggle-light-bg, #fff) !important;
	color: var(--cd-night-toggle-light-icon, #0b1220) !important;
	box-shadow: 0 5px 18px rgba(0, 0, 0, .24);
	cursor: pointer;
	line-height: 1;
	transition: transform .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.cd-night-toggle[hidden] {
	display: none !important;
}

html.cd-night-mode .cd-night-toggle {
	border-color: var(--cd-night-border, #2a3850) !important;
	background: var(--cd-night-toggle-dark-bg, #111a2b) !important;
	color: var(--cd-night-toggle-dark-icon, #ffd166) !important;
}

.cd-night-toggle:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, .3);
}

.cd-night-toggle:focus-visible {
	outline: 3px solid var(--cd-night-link, #168ad4);
	outline-offset: 3px;
}

.cd-night-toggle__icon {
	display: block;
	width: 52%;
	height: 52%;
}

.cd-night-toggle__sun {
	display: none;
}

html.cd-night-mode .cd-night-toggle__moon {
	display: none;
}

html.cd-night-mode .cd-night-toggle__sun {
	display: block;
}

.admin-bar .cd-night-toggle {
	top: calc(var(--cd-night-toggle-top, 20px) + 32px);
}

@media (max-width: 782px) {
	.admin-bar .cd-night-toggle {
		top: calc(var(--cd-night-toggle-top, 20px) + 46px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.cd-night-toggle {
		transition: none;
	}
}

html.cd-night-mode .cd-night-keep-original,
html.cd-night-mode .cd-night-keep-original * {
	color-scheme: normal;
	background-color: revert !important;
	border-color: revert !important;
	color: revert !important;
}
