/* gtg.pl - przełącznik motywu (05.11.2026). Tokeny jasnego motywu: body.ab-alt (main.css), ciemnego: :root (grafit + złoto). */
html[data-theme='light'] { color-scheme: light; }
html[data-theme='dark'] { color-scheme: dark; }

.ab-theme {
	position: relative; flex: none; width: 44px; height: 44px; display: grid; place-items: center; padding: 0;
	border: 1px solid var(--ab-border-strong); border-radius: var(--ab-radius-lg); background: transparent; color: var(--ab-text); cursor: pointer;
	transition: background-color .2s var(--ab-ease), border-color .2s var(--ab-ease), transform .3s var(--ab-ease);
}
.ab-theme svg {
	grid-area: 1 / 1; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
	transition: transform .6s var(--ab-ease), opacity .3s;
}
/* jasny motyw: księżyc (klik włącza ciemny); ciemny motyw: słońce (klik włącza jasny) */
.ab-theme__sun { opacity: 0; transform: rotate(-80deg) scale(.4); }
html[data-theme='dark'] .ab-theme__sun { opacity: 1; transform: none; }
html[data-theme='dark'] .ab-theme__moon { opacity: 0; transform: rotate(80deg) scale(.4); }
.ab-theme:active { transform: scale(.92); }
.ab-theme:focus-visible { outline: 2px solid var(--ab-gold); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .ab-theme:hover { border-color: var(--ab-gold); background: var(--ab-gold-soft); } }

/* na czas zmiany: bez przejść CSS, żeby nowy motyw nie "wpływał" pod kołem */
html.gtg-switching *, html.gtg-switching *::before, html.gtg-switching *::after { transition: none !important; }
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-old(root) { z-index: 1; }
::view-transition-new(root) { z-index: 2; }
@media (prefers-reduced-motion: reduce) { ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; } }

/* ciemny motyw: poprawki miejsc, które w jasnym mają stały kolor */
html[data-theme='dark'] .ab-footer__nav a.ab-footer__amytak { color: #B9BCF5; }
html[data-theme='dark'] .ab-footer__nav a.ab-footer__amytak:hover { color: #D6D8FF; }

/* ciemny motyw: logo z rozjaśnionym napisem "wsparcie technologiczne" (w jasnym wariancie jest granatowy, na grafitowym tle niewidoczny).
   content:url() podmienia obraz w Chrome i Safari; przeglądarka bez tej obsługi zostaje przy oryginale. */
html[data-theme='dark'] img.ab-brand__mark { content: url('/wp-content/uploads/2026/10/gtg-logo-ciemny-naglowek.png'); }
html[data-theme='dark'] img.abo-hero__logo { content: url('/wp-content/uploads/2026/10/gtg-logo-ciemny-1024x665.png'); }