/* QueroTop — modo escuro do site (html[data-theme="dark"]) e botão de troca de tema.
   O visual segue o do review neon: azul-marinho, brilhos verde/amarelo/violeta e superfícies de vidro.
   O tema claro é o padrão dos outros arquivos; aqui só entra o que muda no escuro. */

/* ---------- botão (cabeçalho é escuro nos dois temas) ---------- */

.qt-theme-toggle {
	display: inline-grid;
	place-items: center;
	flex: none;
	width: 38px;
	height: 38px;
	margin-inline-start: 14px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 50%;
	background: rgba(255, 255, 255, .06);
	color: #ffd33d;
	cursor: pointer;
	transition: background .2s, border-color .2s, color .2s, transform .2s;
}

.qt-theme-toggle:hover {
	border-color: rgba(92, 255, 77, .6);
	background: rgba(92, 255, 77, .12);
	transform: rotate(-12deg);
}

.qt-theme-toggle:focus-visible {
	outline: 2px solid #5cff4d;
	outline-offset: 2px;
}

.qt-theme-toggle svg {
	grid-area: 1 / 1;
	transition: opacity .25s, transform .35s;
}

/* claro: mostra a lua (vai para o escuro); escuro: mostra o sol */
.qt-theme-toggle__sun {
	opacity: 0;
	transform: rotate(-90deg) scale(.6);
}

html[data-theme="dark"] .qt-theme-toggle {
	color: #5cff4d;
}

html[data-theme="dark"] .qt-theme-toggle__moon {
	opacity: 0;
	transform: rotate(90deg) scale(.6);
}

html[data-theme="dark"] .qt-theme-toggle__sun {
	opacity: 1;
	transform: none;
}

/* sem animações durante a troca, para tudo mudar de uma vez */
.qt-theme-switching *,
.qt-theme-switching *::before,
.qt-theme-switching *::after {
	transition: none !important;
}

/* ---------- tokens do escuro ---------- */

html[data-theme="dark"] {
	color-scheme: dark;

	/* site (querotop.css) */
	--qt-bg: #0b0d1f;
	--qt-surface: rgba(255, 255, 255, .045);
	--qt-text: #c5cae0;
	--qt-muted: #8d93ad;
	--qt-line: rgba(255, 255, 255, .1);
	--qt-heading: #f4f6ff;
	--qt-solid: #5cff4d;
	--qt-solid-text: #0b0d1f;
	--qt-hover: #5cff4d;
	--qt-shadow: 0 18px 40px -26px rgba(0, 0, 0, .85), inset 0 1px 0 rgba(255, 255, 255, .06);
	--qt-shadow-hover: 0 24px 50px -24px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 255, 255, .08);

	/* Blocksy: paleta e cores de texto */
	--theme-palette-color-3: #c5cae0;
	--theme-palette-color-4: #f4f6ff;
	--theme-palette-color-5: rgba(255, 255, 255, .12);
	--theme-palette-color-6: #12152e;
	--theme-palette-color-7: #0f1228;
	--theme-palette-color-8: #141733;
	--theme-text-color: #c5cae0;
	--theme-headings-color: #f4f6ff;
	--theme-border-color: rgba(255, 255, 255, .12);
}

html[data-theme="dark"] body {
	background-color: #0b0d1f;
	background-image:
		radial-gradient(60% 40% at 0% 0%, rgba(92, 255, 77, .05), transparent 70%),
		radial-gradient(50% 35% at 100% 15%, rgba(108, 92, 255, .14), transparent 70%),
		radial-gradient(55% 35% at 0% 85%, rgba(255, 211, 61, .06), transparent 70%);
	background-attachment: fixed;
	color: var(--qt-text);
}

/* ---------- superfícies de vidro do site ---------- */

html[data-theme="dark"] :is(.qt-card--grid, .qt-widget:not(.qt-widget--promo), .qt-topic, .qt-feature__list,
	.qt-card--row-wide, .qt-search--wide, .qt-empty, .qt-chip, .qt-pagination .page-numbers:not(.dots), .qt-scroller__btn) {
	border: 1px solid var(--qt-line);
	-webkit-backdrop-filter: blur(14px) saturate(1.3);
	backdrop-filter: blur(14px) saturate(1.3);
}

html[data-theme="dark"] .qt-topic {
	border-top: 3px solid var(--qt-cat);
}

html[data-theme="dark"] .qt-chip:hover {
	border-color: var(--qt-cat);
	box-shadow: 0 6px 22px -10px var(--qt-cat);
}

html[data-theme="dark"] .qt-chip.is-current {
	color: #fff !important;
}

/* nomes de categoria coloridos: clareados para ter contraste no fundo escuro */
html[data-theme="dark"] :is(.qt-card__kicker, .qt-chip .qt-icon, .qt-section__icon, .qt-topic__icon, .qt-catlist__icon) {
	color: color-mix(in srgb, var(--qt-cat, #5cff4d) 65%, #fff);
}

html[data-theme="dark"] .qt-section__title,
html[data-theme="dark"] .qt-archive__title,
html[data-theme="dark"] .qt-card__title {
	color: var(--qt-heading);
}

html[data-theme="dark"] .qt-section__head::after {
	box-shadow: 0 0 12px var(--qt-cat);
}

html[data-theme="dark"] .qt-rank:nth-child(n+4) .qt-rank__n,
html[data-theme="dark"] .qt-catlist__count {
	background: rgba(255, 255, 255, .07);
	color: var(--qt-heading);
}

html[data-theme="dark"] .qt-search input[type="search"] {
	color: var(--qt-heading);
}

html[data-theme="dark"] .qt-search input[type="search"]::placeholder {
	color: var(--qt-muted);
}

html[data-theme="dark"] .qt-widget--search:focus-within {
	box-shadow: 0 0 0 2px var(--qt-neon), var(--qt-shadow);
}

html[data-theme="dark"] .qt-pagination .current {
	background: var(--qt-neon);
	color: #0b0d1f;
}

html[data-theme="dark"] .qt-btn--ghost {
	border-color: var(--qt-line);
}

html[data-theme="dark"] .qt-band,
html[data-theme="dark"] .qt-widget--promo {
	border: 1px solid rgba(92, 255, 77, .18);
	background-color: #10132b;
}

html[data-theme="dark"] .qt-card--overlay,
html[data-theme="dark"] .qt-card--hero {
	box-shadow: 0 0 0 1px var(--qt-line), var(--qt-shadow);
}

html[data-theme="dark"] .qt-archive__head {
	background: linear-gradient(180deg, color-mix(in srgb, var(--qt-cat) 14%, transparent), transparent);
}

html[data-theme="dark"] .qt-footer {
	border-top: 1px solid rgba(255, 255, 255, .07);
	background-color: #090a19;
}

html[data-theme="dark"] #footer [data-row="bottom"] {
	background: #090a19 !important;
}

/* ---------- cabeçalho: submenus ----------
   O Blocksy usa palette-color-8 (branco) no texto dos submenus, que ficam sobre fundo azul-marinho
   nos dois temas. Como o escuro redefine essa cor da paleta para superfície, o texto sumia. */
html[data-theme="dark"] .ct-header [data-id="menu"] .sub-menu .ct-menu-link {
	--theme-link-initial-color: #ffffff;
}

html[data-theme="dark"] .ct-header [data-id="menu"] .sub-menu .ct-menu-link:hover {
	--theme-link-initial-color: #5cff4d;
}

/* ---------- partes do Blocksy (post, páginas, relacionados) ---------- */

html[data-theme="dark"] .hero-section .page-title,
html[data-theme="dark"] .entry-header .page-title {
	color: var(--qt-heading);
}

html[data-theme="dark"] .entry-meta,
html[data-theme="dark"] .entry-meta a {
	color: var(--qt-muted);
}

html[data-theme="dark"] [data-prefix="single_blog_post"] .ct-related-posts-container {
	border-top: 1px solid var(--qt-line);
	background-color: #0f1228;
}

html[data-theme="dark"] .ct-related-posts .related-entry-title a,
html[data-theme="dark"] .post-navigation .item-title {
	color: var(--qt-heading);
}

html[data-theme="dark"] .author-box,
html[data-theme="dark"] .ct-share-box {
	--theme-border-color: rgba(255, 255, 255, .12);
}

html[data-theme="dark"] .author-box[data-type="type-2"] {
	background: rgba(255, 255, 255, .04);
}

/* Posts e páginas no layout antigo do Elementor têm cores fixas pensadas para fundo claro.
   No escuro, o conteúdo deles fica num "papel" claro (com a paleta clara restaurada) até ser convertido. */
html[data-theme="dark"] .entry-content:has(> .elementor):not(:has(.qt-review)) {
	--theme-palette-color-3: #3A4F66;
	--theme-palette-color-4: #192a3d;
	--theme-palette-color-5: #e1e8ed;
	--theme-palette-color-6: #f2f5f7;
	--theme-palette-color-7: #FAFBFC;
	--theme-palette-color-8: #ffffff;
	--theme-text-color: #3A4F66;
	--theme-headings-color: #192a3d;
	--theme-border-color: #e1e8ed;
	color-scheme: light;
	padding: clamp(14px, 3vw, 28px);
	border-radius: 20px;
	background: #f4f2ef;
	color: #3A4F66;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 30px 70px -40px rgba(0, 0, 0, .9);
}

@media (max-width: 767px) {
	html[data-theme="dark"] .entry-content:has(> .elementor):not(:has(.qt-review)) {
		border-radius: 0;
	}

	.qt-theme-toggle {
		width: 36px;
		height: 36px;
		margin-inline-start: 4px;
		margin-inline-end: 10px;
	}
}