/* ==========================================================================
   Tryb ciemny – włącza się sam według ustawień telefonu lub komputera
   odwiedzającego albo ikoną księżyca/słońca w pasku menu (wybór zapamiętany).
   Tryb ustawia atrybut data-theme na <html> (skrypt w <head> z functions.php,
   przełączanie w animations.js).
   Paleta z granatu marki: tło #09153A, arkusze o ton jaśniejsze, sekcje
   „granatowe” o ton ciemniejsze; tekst kremowy, akcenty złote bez zmian.
   ========================================================================== */

:root[data-theme="dark"] {
	--d-page: #09153a;
	--d-sheet: #0d1a43;
	--d-sheet-2: #112050;
	--d-deep: #050c25;
	--d-card: #1c2f59;
	--d-card-2: #233764;
	--d-text: #f6f2ed;
	--d-dim: rgba(246, 242, 237, 0.72);
	--d-line: rgba(246, 242, 237, 0.14);
	--d-shadow: rgba(0, 0, 0, 0.38);

	/* Kolory bloków WordPressa (klasy has-…-background-color). */
	--wp--preset--color--beige: var(--d-page);
	--wp--preset--color--cream: var(--d-sheet);
	--wp--preset--color--white: var(--d-sheet-2);
	--wp--preset--color--navy: var(--d-deep);

	/* Granat w stylach motywu to głównie kolor tekstu – w trybie ciemnym krem. */
	--uf-navy: var(--d-text);

	color-scheme: dark;
	background: var(--d-page);
}

:root[data-theme="dark"] body {
	background: var(--d-page);
	color: var(--d-text);
}

:where(:root[data-theme="dark"]) :is(h1, h2, h3, h4, h5, h6),
:where(:root[data-theme="dark"]) a:where(:not(.wp-element-button)) {
	color: var(--d-text);
}

:root[data-theme="dark"] .has-white-color,
:root[data-theme="dark"] .has-navy-color {
	color: var(--d-text) !important;
}

:root[data-theme="dark"] .has-beige-color {
	color: #ede5da !important;
}

:root[data-theme="dark"] .uf-dim {
	color: var(--d-dim) !important;
}

/* Przyciski: kremowe z granatowym napisem, po najechaniu złote. */
:root[data-theme="dark"] .wp-element-button,
:root[data-theme="dark"] .wp-block-button__link {
	background-color: var(--d-text);
	color: #09153a;
}

:root[data-theme="dark"] .wp-element-button:hover,
:root[data-theme="dark"] .wp-block-button__link:hover {
	background-color: var(--uf-gold);
	color: #09153a;
}

:root[data-theme="dark"] .wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border-color: rgba(246, 242, 237, 0.55);
	color: var(--d-text);
}

:root[data-theme="dark"] .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--uf-gold);
	border-color: var(--uf-gold);
	color: #09153a;
}

/* Nagłówek: jasne logo, pigułka menu w ciemnym szkle. */
:root[data-theme="dark"] .uf-logo a {
	background: url("../img/logo-jasne.svg") left center / contain no-repeat;
}

:root[data-theme="dark"] .uf-logo img {
	opacity: 0;
}

:root[data-theme="dark"].uf-scrolled .uf-header::before {
	background: rgba(13, 26, 67, 0.82);
	box-shadow: 0 14px 40px var(--d-shadow), inset 0 0 0 1px var(--d-line);
}

@media (any-pointer: coarse) {
	:root[data-theme="dark"].uf-scrolled .uf-header::before {
		background: rgba(13, 26, 67, 0.97);
	}
}

/* Arkusze: cień zamiast granatowej poświaty i cienka jasna krawędź u góry. */
:root[data-theme="dark"] .wp-block-post-content > .uf3-sheet,
:root[data-theme="dark"] .uf-main > .uf3-sheet,
:root[data-theme="dark"] .uf-site-footer .uf3-sheet {
	box-shadow: 0 -18px 44px var(--d-shadow), inset 0 1px 0 rgba(246, 242, 237, 0.06);
}

/* Otwarcie. */
:root[data-theme="dark"] .uf3-hero {
	background: var(--d-page);
}

:root[data-theme="dark"] .uf3-hero__stage .uf3-hero__img {
	background: var(--d-deep);
}

:root[data-theme="dark"] .uf3-hero__stage .uf3-deal {
	background: rgba(28, 47, 89, 0.88);
	box-shadow: 0 20px 50px var(--d-shadow), inset 0 0 0 1px var(--d-line);
}

/* O nas: warstwy finansowania. */
:root[data-theme="dark"] .uf3-layers > .uf3-layer {
	box-shadow: 0 10px 30px var(--d-shadow);
}

:root[data-theme="dark"] .uf3-layers > .uf3-layer:nth-child(1) {
	color: #09153a;
}

:root[data-theme="dark"] .uf3-layers > .uf3-layer:nth-child(2) {
	background: #33466f;
}

:root[data-theme="dark"] .uf3-layers > .uf3-layer:nth-child(3) {
	background: var(--d-card);
}

:root[data-theme="dark"] .uf3-layers > .uf3-layer:nth-child(4) {
	background: var(--d-deep);
	color: var(--d-text);
	box-shadow: 0 10px 30px var(--d-shadow), inset 0 0 0 1px var(--d-line);
}

:root[data-theme="dark"] .uf3-about .uf3-team {
	background: var(--d-deep);
}

:root[data-theme="dark"] .wp-block-columns.uf-claims > .wp-block-column {
	background: var(--d-card);
}

/* Realizacje, eksperci, opinie: karty o ton jaśniejsze od arkusza. */
:root[data-theme="dark"].uf-js .uf-projects-grid.is-deck > .uf-project,
:root[data-theme="dark"] .uf-experts-section:not(.uf4-team-section) .uf-experts > .uf-expert,
:root[data-theme="dark"] .uf4-team .uf-experts > .uf-expert,
:root[data-theme="dark"] .uf3-quote,
:root[data-theme="dark"] .uf-cta__box {
	background: var(--d-card);
	box-shadow: 0 24px 60px var(--d-shadow);
}

:root[data-theme="dark"] .uf-expert__photo {
	background: var(--d-card-2);
}

:root[data-theme="dark"].uf-js .uf-expert.is-active .uf-expert__bio,
:root[data-theme="dark"].uf-js .uf-expert.is-closing .uf-expert__bio {
	background: var(--d-card);
}

:root[data-theme="dark"] .uf-expert__open::after {
	background:
		linear-gradient(var(--uf-plus), var(--uf-plus)) center / var(--uf-plus-size) 1.5px no-repeat,
		linear-gradient(var(--uf-plus), var(--uf-plus)) center / 1.5px var(--uf-plus-size) no-repeat,
		rgba(9, 21, 58, 0.85);
	box-shadow: 0 6px 18px var(--d-shadow);
}

:root[data-theme="dark"] .uf-expert:hover .uf-expert__open::after,
:root[data-theme="dark"] .uf-expert__open:focus-visible::after {
	--uf-plus: #09153a;
	background-color: var(--uf-gold);
}

/* Aktualności i opinie: przyciski. */
:root[data-theme="dark"] .uf3-news-all a {
	background: var(--d-text);
	color: #09153a;
}

:root[data-theme="dark"] .uf3-news-all a:hover {
	background: var(--uf-gold);
	color: #09153a;
}

:root[data-theme="dark"] .uf3-deck__btn:hover {
	background: var(--d-text);
	color: #09153a;
}

/* Kontakt: panel z formularzem jako karta. */
:root[data-theme="dark"] .uf3-contact__panel {
	background: var(--d-card);
	color: var(--d-text);
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45), inset 0 0 0 1px var(--d-line);
}

:root[data-theme="dark"] .uf3-contact__panel :is(h2, h3, p, label) {
	color: var(--d-text);
}

:root[data-theme="dark"] .uf-form input,
:root[data-theme="dark"] .uf-form textarea {
	border-color: var(--d-line);
	background: var(--d-page);
	color: var(--d-text);
}

:root[data-theme="dark"] .uf-form input::placeholder,
:root[data-theme="dark"] .uf-form textarea::placeholder {
	color: rgba(246, 242, 237, 0.5);
}

:root[data-theme="dark"] .uf-form input:focus,
:root[data-theme="dark"] .uf-form textarea:focus {
	border-color: var(--uf-gold);
}

:root[data-theme="dark"] .uf-form button {
	background: var(--uf-gold);
	color: #09153a;
}

:root[data-theme="dark"] .uf-form button:hover {
	background: var(--d-text);
}

:root[data-theme="dark"] .uf-form .uf-form__done,
:root[data-theme="dark"] .uf-form .uf-form__error {
	background: var(--d-page);
}

:root[data-theme="dark"] .uf-mobilebar {
	background: var(--d-deep);
	box-shadow: 0 0 24px var(--d-shadow), inset 0 0 0 1px var(--d-line);
}

/* Pasek „Zadzwoń / Napisz do nas” na telefonie. */
:root[data-theme="dark"] .uf-mobilebar .wp-block-button:first-child .wp-block-button__link {
	background: var(--uf-gold);
	color: #09153a;
}

/* Podstrony: linie podziału, tła pod zdjęciami, stronicowanie. */
:root[data-theme="dark"] .uf4-ticks,
:root[data-theme="dark"] .uf4-ticks > li,
:root[data-theme="dark"] .uf4-index__item {
	border-color: var(--d-line);
}

:root[data-theme="dark"] .uf4-terms {
	--uf4-rule: var(--d-line);
}

:root[data-theme="dark"] .uf4-index__img,
:root[data-theme="dark"] .uf4-post-hero__img {
	background: var(--d-card);
}

:root[data-theme="dark"] .uf4-pagination .page-numbers.current {
	background: var(--d-text);
	color: #09153a;
}

:root[data-theme="dark"] .uf4-note {
	background: var(--d-card);
}

/* Zdjęcia odrobinę przygaszone, żeby nie raziły na ciemnym tle. */
:root[data-theme="dark"] main img:not(.uf-logo img):not([src$=".svg"]) {
	filter: brightness(0.94);
}

/* ==========================================================================
   Ikona trybu w pasku menu (obie wersje strony)
   ========================================================================== */

.uf-mode {
	position: relative;
	display: grid;
	flex: none;
	place-items: center;
	width: 36px;
	height: 36px;
	margin: -6px -8px -6px -16px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--uf-navy);
	cursor: pointer;
	transition: color 0.2s linear, background-color 0.2s linear;
}

.uf-mode:hover {
	background: rgba(205, 166, 112, 0.16);
	color: var(--uf-gold);
}

.uf-mode svg {
	grid-area: 1 / 1;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: opacity 0.3s var(--uf-ease), transform 0.45s var(--uf-ease);
}

.uf-mode__sun,
:root[data-theme="dark"] .uf-mode__moon {
	opacity: 0;
	transform: rotate(-60deg) scale(0.6);
}

:root[data-theme="dark"] .uf-mode__sun {
	opacity: 1;
	transform: none;
}

/* Telefon i tablet: ikona przed przyciskiem menu. */
@media (max-width: 991px) {
	.uf-header__right {
		gap: 6px;
	}

	.uf-mode {
		order: -1;
		margin: 0;
	}
}

@media (max-width: 600px) {
	.uf-header__right {
		gap: 2px;
	}

	.uf-mode {
		width: 32px;
		height: 32px;
	}
}

/* Przełączenie trybu: cała strona płynnie przenika (animations.js, View Transitions).
   Przejścia poszczególnych elementów zostają bez zmian – ich nadpisanie przerywało
   animację otwarcia i ruch pasa logotypów. */
.uf-mode-switching::view-transition-old(root),
.uf-mode-switching::view-transition-new(root) {
	animation-duration: 0.35s;
	animation-timing-function: ease;
}
