/**
 * PB Toolkit — Elementy strony
 * Sekcja komentarzy z zachętą do logowania i chmura tematów.
 *
 * Konwencje: zmienne na :root z wartościami awaryjnymi przy każdym użyciu;
 * tryb ciemny wyłącznie przez html.pb-uw-motyw-ciemny (nigdy prefers-color-scheme);
 * selektory dwuczłonowe, bo .td-post-content / .td-page-content motywu
 * mają wyższą specyficzność; przyciski i pola resetowane z !important.
 *
 * Paleta sekcji komentarzy pochodzi z paywalla.
 *
 * Panel logowania pod artykułem ma wyglądać tak samo jak ten nad ścianą
 * płatności — czytelnik ma go rozpoznać, a nie poznawać od nowa. Zamiast
 * przepisywać kolory, sięgamy po zmienne, które paywall deklaruje na :root
 * (`--pb-*`) i wstrzykuje z ustawień (`--pb-plan-*`). Zmiana koloru
 * w panelu paywalla obejmuje wtedy oba miejsca. Każde odwołanie ma wartość
 * zapasową równą domyślnej palecie paywalla, więc bez niego (moduł
 * wyłączony, arkusz niezaładowany) wygląd zostaje ten sam.
 *
 * To odczyt zmiennych, nie zależność: nie wywołujemy niczego z paywalla
 * i nie zakładamy, że jego arkusz w ogóle jest na stronie.
 *
 * @since 1.0.0
 */

:root {
	--pbes-tekst: var(--pb-tekst, #1b1f24);
	--pbes-tekst-wyciszony: var(--pb-tekst-slaby, #5b6570);
	--pbes-ramka: var(--pb-linia, #dfe3e8);
	--pbes-ramka-mocna: var(--pb-linia-mocna, #c4cbd4);
	--pbes-tlo: var(--pb-tlo, #ffffff);
	--pbes-tlo-pola: var(--pb-tlo-kafelek, #ffffff);
	--pbes-tlo-panelu: var(--pb-plan-tlo-sciany, var(--pb-tlo-alt, #f6f7f9));
	--pbes-ramka-panelu: var(--pb-plan-ramka-sciany, var(--pb-linia, #dfe3e8));
	--pbes-tlo-hover: var(--pb-tlo-alt, #f6f7f9);
	--pbes-akcent: var(--pb-akcent, #2f5d8c);
	--pbes-akcent-jasny: var(--pb-akcent-jasny, #eaf1f8);
	--pbes-przycisk: var(--pb-plan-btn, var(--pb-akcent, #2f5d8c));
	--pbes-przycisk-tekst: var(--pb-plan-btn-tekst, var(--pb-akcent-tekst, #ffffff));
	--pbes-link: var(--pb-plan-link, var(--pb-akcent, #2f5d8c));
	--pbes-blad: var(--pb-blad, #a33236);
	--pbes-sukces: var(--pb-ok, #1f7a4d);
	--pbes-font: var(--pb-font, Verdana, Geneva, sans-serif);
	--pbes-radius: var(--pb-radius, 10px);
	--pbes-radius-maly: var(--pb-radius-maly, 6px);
	--pbes-pole-h: 38px;

	/* Chmura tematów — niezależna od paywalla, wygląd ze zrzutu. */
	--pbes-tematy-tekst: #1a1a1a;
	--pbes-tematy-ramka: #c4cbd4;
	--pbes-tematy-ramka-hover: #8a94a0;
	--pbes-tematy-hover: #f2f2f2;
	--pbes-tematy-ikona: #6f6f6f;
}

/* Wartości zapasowe trybu ciemnego, gdy arkusza paywalla nie ma na stronie.
   Kiedy jest, jego deklaracje na tym samym elemencie wygrywają — zmienne
   `--pb-*` są wtedy zdefiniowane i odwołania niżej z nich korzystają. */
html.pb-uw-motyw-ciemny {
	--pbes-tekst: var(--pb-tekst, #e8ebef);
	--pbes-tekst-wyciszony: var(--pb-tekst-slaby, #a3adb9);
	--pbes-ramka: var(--pb-linia, #2c343e);
	--pbes-ramka-mocna: var(--pb-linia-mocna, #3c4653);
	--pbes-tlo: var(--pb-tlo, #14181d);
	--pbes-tlo-pola: var(--pb-tlo-kafelek, #1c222a);
	--pbes-tlo-panelu: var(--pb-plan-tlo-sciany, var(--pb-tlo-alt, #1a1f26));
	--pbes-ramka-panelu: var(--pb-plan-ramka-sciany, var(--pb-linia, #2c343e));
	--pbes-tlo-hover: var(--pb-tlo-alt, #1a1f26);
	--pbes-akcent: var(--pb-akcent, #6ea3d4);
	--pbes-akcent-jasny: var(--pb-akcent-jasny, #1e2c3a);
	--pbes-przycisk: var(--pb-plan-btn, var(--pb-akcent, #6ea3d4));
	--pbes-przycisk-tekst: var(--pb-plan-btn-tekst, var(--pb-akcent-tekst, #0f1419));
	--pbes-link: var(--pb-plan-link, var(--pb-akcent, #6ea3d4));
	--pbes-blad: var(--pb-blad, #e0787c);
	--pbes-sukces: var(--pb-ok, #4cb37e);

	--pbes-tematy-tekst: #ececec;
	--pbes-tematy-ramka: #3c4653;
	--pbes-tematy-ramka-hover: #6b7684;
	--pbes-tematy-hover: #262626;
	--pbes-tematy-ikona: #a3a3a3;
}

/* =========================================================================
   Sekcja komentarzy
   ========================================================================= */

.pbes-kom {
	margin: 2rem 0;
	scroll-margin-top: 90px;
}

.pbes-kom .pbes-kom__gosc {
	position: relative;
	margin-bottom: 1.5rem;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif);
}

/* --- Pole udające pole komentarza ----------------------------------------- */

.pbes-kom button.pbes-kom__pole {
	display: flex !important;
	align-items: flex-start !important;
	gap: 14px;
	width: 100% !important;
	min-height: 110px;
	margin: 0 !important;
	padding: 16px 18px !important;
	border: 1px solid var(--pbes-ramka-mocna, #c4cbd4) !important;
	border-radius: var(--pbes-radius, 10px) !important;
	background: var(--pbes-tlo-pola, #ffffff) !important;
	color: var(--pbes-tekst-wyciszony, #5b6570) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .9rem !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	letter-spacing: normal !important;
	text-align: left !important;
	text-transform: none !important;
	box-shadow: none !important;
	cursor: text;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.pbes-kom button.pbes-kom__pole:hover,
.pbes-kom .pbes-kom__gosc.is-otwarty button.pbes-kom__pole {
	border-color: var(--pbes-akcent, #2f5d8c) !important;
	/* Pogrubienie ramki cieniem wewnętrznym — bez przesunięcia układu. */
	box-shadow: inset 0 0 0 1px var(--pbes-akcent, #2f5d8c) !important;
}

.pbes-kom button.pbes-kom__pole:focus-visible {
	outline: 2px solid var(--pbes-akcent, #2f5d8c) !important;
	outline-offset: 2px;
}

.pbes-kom .pbes-kom__awatar {
	flex: 0 0 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--pbes-tlo-hover, #f6f7f9);
	color: var(--pbes-tekst-wyciszony, #5b6570);
	font-size: 18px;
}

.pbes-kom .pbes-kom__zacheta {
	flex: 1 1 auto;
	padding-top: 9px;
}

.pbes-kom .pbes-kom__klodka {
	flex: 0 0 auto;
	padding-top: 10px;
	font-size: 14px;
	opacity: .7;
}

/* --- Rozwijany panel ------------------------------------------------------- */

.pbes-kom .pbes-kom__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .22s ease;
}

.pbes-kom .pbes-kom__wnetrze {
	min-height: 0;
	overflow: hidden;
	visibility: hidden;
	transition: visibility 0s linear .22s;
}

.pbes-kom .pbes-kom__gosc.is-otwarty .pbes-kom__panel,
.pbes-kom .pbes-kom__gosc:not(.pbes-js):hover .pbes-kom__panel,
.pbes-kom .pbes-kom__gosc:not(.pbes-js):focus-within .pbes-kom__panel {
	grid-template-rows: 1fr;
}

.pbes-kom .pbes-kom__gosc.is-otwarty .pbes-kom__wnetrze,
.pbes-kom .pbes-kom__gosc:not(.pbes-js):hover .pbes-kom__wnetrze,
.pbes-kom .pbes-kom__gosc:not(.pbes-js):focus-within .pbes-kom__wnetrze {
	visibility: visible;
	transition-delay: 0s;
}

/* --- Panel logowania — układ górnej części paywalla ----------------------- */

/* Ramka i tło jak panel nad ścianą płatności. Odstęp od pola komentarza
   mieści się w marginesie panelu, nie w wypełnieniu kontenera — zwinięty
   kontener ma zerową wysokość i nie może zostawiać po sobie szczeliny. */
.pbes-kom .pbes-kom__logowanie {
	margin-top: 10px;
	padding: .9rem 1rem;
	background: var(--pbes-tlo-panelu, #f6f7f9);
	border: 1px solid var(--pbes-ramka-panelu, #dfe3e8);
	border-radius: var(--pbes-radius, 10px);
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif);
}

/* Trzy elementy w rzędzie: kolumna pól, kreska, kolumna dostawców. Układ
   giętki, nie siatka — tak samo jak w paywallu i z tego samego powodu:
   liczba elementów w kolumnie pól zależy od stanu (komunikat błędu). */
.pbes-kom .pbes-kom__logowanie--z-dostawcami {
	display: flex;
	align-items: stretch;
	gap: 1.25rem;
}

.pbes-kom .pbes-kom__formularz {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 0;
}

.pbes-kom .pbes-kom__wiersz {
	display: flex;
	align-items: stretch;
	gap: .5rem;
	width: 100%;
}

.pbes-kom input.pbes-kom__input {
	flex: 1 1 0;
	min-width: 0;
	box-sizing: border-box !important;
	height: var(--pbes-pole-h, 38px) !important;
	margin: 0 !important;
	padding: 0 .7rem !important;
	border: 1px solid var(--pbes-ramka-mocna, #c4cbd4) !important;
	border-radius: var(--pbes-radius-maly, 6px) !important;
	background: var(--pbes-tlo-pola, #ffffff) !important;
	color: var(--pbes-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .88rem !important;
	font-weight: 400 !important;
	line-height: normal !important;
	box-shadow: none !important;
	transition: border-color .15s, box-shadow .15s;
}

/* Nazwa pola w placeholderze, wersalikami — jak w paywallu: odróżnia
   podpowiedź od wpisanej wartości. */
.pbes-kom input.pbes-kom__input::placeholder {
	text-transform: uppercase;
	font-size: .74rem;
	letter-spacing: .05em;
	color: var(--pbes-tekst-wyciszony, #5b6570);
	opacity: 1;
}

.pbes-kom input.pbes-kom__input:focus {
	outline: none !important;
	border-color: var(--pbes-akcent, #2f5d8c) !important;
	box-shadow: 0 0 0 3px var(--pbes-akcent-jasny, #eaf1f8) !important;
}

/* Przycisk tej samej szerokości co w paywallu (210 px) — trzy elementy
   wiersza mają tam proporcje pól do przycisku, które czytelnik już zna. */
.pbes-kom button.pbes-kom__wyslij {
	flex: 0 0 auto;
	width: 210px;
	min-width: 0;
	height: var(--pbes-pole-h, 38px) !important;
	margin: 0 !important;
	padding: 0 .75rem !important;
	border: 0 !important;
	border-radius: var(--pbes-radius-maly, 6px) !important;
	background: var(--pbes-przycisk, #2f5d8c) !important;
	color: var(--pbes-przycisk-tekst, #ffffff) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .85rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-align: center;
	text-transform: none !important;
	letter-spacing: normal !important;
	white-space: nowrap;
	box-shadow: none !important;
	cursor: pointer;
	transition: filter .15s;
}
.pbes-kom button.pbes-kom__wyslij:hover:not([disabled]) { filter: brightness(.94); }
.pbes-kom button.pbes-kom__wyslij[disabled] { opacity: .55; cursor: progress; }

.pbes-kom a.pbes-kom__reset {
	display: inline-block;
	margin-top: .45rem;
	color: var(--pbes-link, #2f5d8c) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif);
	font-size: .75rem;
	font-weight: 400;
	text-decoration: underline !important;
	box-shadow: none !important;
}

.pbes-kom .pbes-kom__pulapka {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Komunikat jest akapitem w treści wpisu — motyw narzuca mu krój
   szeryfowy, więc krój i wielkość domykamy. */
.pbes-kom p.pbes-kom__komunikat {
	margin: .45rem 0 0 !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .76rem !important;
	line-height: 1.45 !important;
	color: var(--pbes-tekst-wyciszony, #5b6570);
}
.pbes-kom p.pbes-kom__komunikat:empty { display: none; }
.pbes-kom p.pbes-kom__komunikat.is-blad { color: var(--pbes-blad, #a33236) !important; }
.pbes-kom p.pbes-kom__komunikat.is-sukces { color: var(--pbes-sukces, #1f7a4d) !important; }

/* Pionowa kreska z napisem „lub" — dwa pseudo-elementy rosnące w pionie,
   bez znajomości wysokości panelu. */
.pbes-kom .pbes-kom__lub {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .4rem;
	align-self: stretch;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif);
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--pbes-tekst-wyciszony, #5b6570);
}
.pbes-kom .pbes-kom__lub::before,
.pbes-kom .pbes-kom__lub::after {
	content: '';
	flex: 1 1 auto;
	width: 1px;
	background: var(--pbes-ramka-mocna, #c4cbd4);
}

.pbes-kom .pbes-kom__dostawcy {
	flex: 0 1 34%;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

/* --- Przyciski dostawców (Nextend Social Login) ---------------------------
   Biała karta z obramowaniem, znak po lewej, pełna szerokość kolumny.
   NSL ustawia tło inline'owo na wewnętrznym div — stąd !important. */
.pbes-kom .pbes-kom__social {
	display: block;
	width: 100%;
}

.pbes-kom .pbes-kom__social .nsl-container,
.pbes-kom .pbes-kom__social .nsl-container-block,
.pbes-kom .pbes-kom__social .nsl-container-buttons {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	text-align: left !important;
}

.pbes-kom .pbes-kom__social a[data-provider] {
	box-sizing: border-box !important;
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	text-decoration: none !important;
}

.pbes-kom .pbes-kom__social .nsl-button,
.pbes-kom .pbes-kom__social .nsl-button-google,
.pbes-kom .pbes-kom__social .nsl-button-facebook,
.pbes-kom .pbes-kom__social .nsl-button-default {
	box-sizing: border-box !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 10px !important;
	width: 100% !important;
	max-width: none !important;
	min-height: 44px !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 14px !important;
	background: var(--pbes-tlo-pola, #ffffff) !important;
	background-color: var(--pbes-tlo-pola, #ffffff) !important;
	border: 1px solid var(--pbes-ramka-mocna, #c4cbd4) !important;
	border-radius: var(--pbes-radius-maly, 6px) !important;
	box-shadow: none !important;
	color: var(--pbes-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .82rem !important;
	font-weight: 400 !important;
	line-height: 1.35 !important;
	transition: border-color .15s ease;
}
.pbes-kom .pbes-kom__social a[data-provider]:hover .nsl-button {
	border-color: var(--pbes-akcent, #2f5d8c) !important;
}

.pbes-kom .pbes-kom__social .nsl-button-label-container {
	display: block !important;
	flex: 1 1 auto !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	color: inherit !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .82rem !important;
	font-weight: 400 !important;
	line-height: 1.35 !important;
	text-align: left !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

/* Własny znak dostawcy (wstawiany w PHP). Znak wtyczki chowamy tylko przy
   przyciskach, w których podmiana się udała. */
.pbes-kom .pbes-kom__znak {
	flex: 0 0 auto;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
}
.pbes-kom .pbes-kom__znak svg {
	display: block;
	width: 18px;
	height: 18px;
}
.pbes-kom .pbes-kom__social--ze-znakiem .nsl-button-svg-container {
	display: none !important;
}

/* --- Rejestracja ---------------------------------------------------------- */

.pbes-kom p.pbes-kom__rejestracja {
	margin: .6rem 2px 4px !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .78rem !important;
	line-height: 1.5 !important;
	color: var(--pbes-tekst-wyciszony, #5b6570);
}

.pbes-kom p.pbes-kom__rejestracja a {
	color: var(--pbes-link, #2f5d8c) !important;
	font-weight: 700;
	text-decoration: underline !important;
	box-shadow: none !important;
}

/* --- Wąskie ekrany --------------------------------------------------------
   Próg 782 px — ten sam co w paywallu, żeby oba panele zmieniały układ
   w tym samym momencie. Kreska pionowa staje się poziomą. */
@media (max-width: 782px) {
	.pbes-kom .pbes-kom__logowanie--z-dostawcami {
		flex-direction: column;
		align-items: stretch;
		gap: .5rem;
	}

	.pbes-kom .pbes-kom__wiersz {
		flex-wrap: wrap;
	}

	.pbes-kom input.pbes-kom__input {
		flex: 1 1 calc(50% - .25rem);
	}

	.pbes-kom button.pbes-kom__wyslij {
		flex: 1 1 100%;
		width: 100%;
	}

	.pbes-kom .pbes-kom__dostawcy {
		flex: 1 1 auto;
	}

	.pbes-kom .pbes-kom__lub {
		flex-direction: row;
		align-self: auto;
		gap: .6rem;
		margin: .2rem 0;
	}
	.pbes-kom .pbes-kom__lub::before,
	.pbes-kom .pbes-kom__lub::after {
		width: auto;
		height: 1px;
	}
}

/* --- wpDiscuz dla gościa: dyskusja tak, formularz nie ------------------------
   Pole zachęty zastępuje główny formularz i nagłówek z zaproszeniem do
   logowania. Odpowiadanie na komentarze i tak wymaga konta. */
.pbes-kom--gosc .pbes-kom__dyskusja .wpd-form-wrap,
.pbes-kom--gosc .pbes-kom__dyskusja .wpd-main-form-wrapper,
.pbes-kom--gosc .pbes-kom__dyskusja .wpd-login-to-comment,
.pbes-kom--gosc .pbes-kom__dyskusja .wpd-reply-button {
	display: none !important;
}

/* =========================================================================
   Chmura tematów
   ========================================================================= */

.pbes-tematy {
	/* Pełna szerokość kontenera, wymuszona.
	   
	   Wyrównanie wewnątrz listy (1.1.2) nie wystarczyło: blok tagDiv, w którym
	   stoi shortcode, układa zawartość giętko i wyśrodkowuje ją. Element
	   giętki bez zadanej szerokości kurczy się do swojej treści, więc cała
	   chmura — już wyrównana do lewej w środku — stawała na środku bloku.
	   Rozciągnięcie jej na całą szerokość odbiera rodzicowi miejsce,
	   w którym mógłby ją przesuwać. Działa tak samo w zwykłym bloku (display:
	   block) i w kontenerze giętkim albo siatce. */
	display: block !important;
	box-sizing: border-box;
	width: 100% !important;
	max-width: none !important;
	flex: 1 1 100% !important;
	align-self: stretch !important;
	justify-self: stretch !important;
	float: none !important;

	/* Mały odstęp pod spodem — chmura zamyka artykuł i ma przylegać do tego,
	   co stoi pod nią, a nie odcinać się pustym pasem. Boczne marginesy
	   zerowe zamiast `auto`, które wyśrodkowuje element o zadanej szerokości. */
	margin: 1.5rem 0 .5rem 0 !important;
	padding: 0 !important;
	text-align: left !important;
}

/* Wyrównanie do lewej domknięte wprost.
   
   Bloki tagDiv potrafią wyśrodkowywać zawartość (text-align i justify-content
   ustawiane na kontenerze w Kompozytorze). Domyślne `flex-start` układu
   giętkiego tego nie przetrwa, jeśli motyw nadpisze wyrównanie regułą
   o wyższej specyficzności. */
.pbes-tematy ul.pbes-tematy__lista {
	width: 100% !important;
	display: flex !important;
	flex-wrap: wrap;
	justify-content: flex-start !important;
	align-items: center;
	text-align: left !important;
	gap: 8px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.pbes-tematy li.pbes-tematy__pozycja {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	line-height: 1;
}

.pbes-tematy li.pbes-tematy__pozycja::before,
.pbes-tematy li.pbes-tematy__pozycja::marker {
	content: none !important;
	display: none !important;
}

.pbes-tematy a.pbes-tematy__el {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 36px;
	padding: 0 16px;
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4);
	border-radius: 999px;
	background: transparent;
	color: var(--pbes-tematy-tekst, #1a1a1a) !important;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.2;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background-color .15s ease, box-shadow .15s ease;
}

.pbes-tematy a.pbes-tematy__el:hover,
.pbes-tematy a.pbes-tematy__el:focus-visible {
	background: var(--pbes-tematy-hover, #f2f2f2);
	/* Przy najechaniu ramka ciemnieje — jasna ramka w spoczynku nie może
	   zostać jedynym sygnałem, bo na jasnym tle łatwo ją przeoczyć. */
	border-color: var(--pbes-tematy-ramka-hover, #8a94a0);
}

.pbes-tematy a.pbes-tematy__el:focus-visible {
	outline: 2px solid var(--pbes-tematy-ramka-hover, #8a94a0);
	outline-offset: 2px;
}

.pbes-tematy .pbes-tematy__ikona {
	color: var(--pbes-tematy-ikona, #6f6f6f);
	font-size: 11px;
	line-height: 1;
}

@media (max-width: 600px) {
	.pbes-tematy ul.pbes-tematy__lista {
		gap: 6px;
	}

	.pbes-tematy a.pbes-tematy__el {
		min-height: 32px;
		padding: 0 12px;
		font-size: 13px;
	}
}

/* =========================================================================
   Zakładka i udostępnianie
   =========================================================================
   Rząd pigułek w tym samym stylu co chmura tematów — jasna ramka, ciemniejsza
   przy najechaniu — bo oba elementy stoją w tej samej okolicy artykułu
   i powinny wyglądać na jedną rodzinę. Stąd wspólne zmienne `--pbes-tematy-*`.

   Próg 782 px — ten sam co w panelu logowania i w paywallu. Powyżej: przyciski
   sieci w rzędzie. Poniżej: jeden przycisk „Udostępnij" otwierający kartę. */

.pbes-akcje {
	--pbes-akcje-h: 36px;

	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start !important;
	gap: 8px;
	width: 100%;
	margin: 1rem 0 !important;
	padding: 0 !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif);
	text-align: left !important;
}

/* --- Przycisk zakładki (HTML z modułu Zakładki) ---------------------------
   Wygląd dopasowany do rzędu. Selektor przez nasz kontener, więc reguły
   dotyczą wyłącznie tego jednego miejsca — przycisk zakładki gdzie indziej
   na stronie zostaje taki, jak go zaprojektował moduł Zakładki. */
.pbes-akcje .pbes-akcje__zakladka {
	display: inline-flex;
}

.pbes-akcje .pbes-akcje__zakladka .pb-zakladki-btn {
	display: inline-flex !important;
	align-items: center !important;
	gap: 7px !important;
	box-sizing: border-box !important;
	height: var(--pbes-akcje-h, 36px) !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4) !important;
	border-radius: 999px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tematy-tekst, #1a1a1a) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	white-space: nowrap;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease;
}

.pbes-akcje .pbes-akcje__zakladka .pb-zakladki-btn:hover {
	border-color: var(--pbes-tematy-ramka-hover, #8a94a0) !important;
	background: var(--pbes-tematy-hover, #f2f2f2) !important;
}

.pbes-akcje .pbes-akcje__zakladka .pb-zakladki-btn .bff-icon {
	display: inline-flex;
	margin: 0 !important;
}

.pbes-akcje .pbes-akcje__zakladka .pb-zakladki-btn svg {
	display: block;
	width: 16px;
	height: 16px;
}

/* Zapisany artykuł: wypełniona ikona (z modułu Zakładki) i ramka w kolorze
   akcentu — stan ma być widoczny, a nie tylko zgadywalny po ikonie. */
.pbes-akcje .pbes-akcje__zakladka .pb-zakladki-btn.bff-active {
	border-color: var(--pbes-akcent, #2f5d8c) !important;
	color: var(--pbes-akcent, #2f5d8c) !important;
}

/* --- Przyciski sieci (komputer) ------------------------------------------ */

.pbes-akcje ul.pbes-akcje__sieci {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.pbes-akcje ul.pbes-akcje__sieci li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	line-height: 1;
}

.pbes-akcje ul.pbes-akcje__sieci li::before,
.pbes-akcje ul.pbes-akcje__sieci li::marker {
	content: none !important;
	display: none !important;
}

.pbes-akcje .pbes-akcje__siec {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	box-sizing: border-box !important;
	width: var(--pbes-akcje-h, 36px) !important;
	height: var(--pbes-akcje-h, 36px) !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4) !important;
	border-radius: 50% !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tekst-wyciszony, #5b6570) !important;
	text-decoration: none !important;
	cursor: pointer;
	transition: color .15s ease, background-color .15s ease, border-color .15s ease;
}

.pbes-akcje .pbes-akcje__siec .pbes-ikona {
	width: 16px;
	height: 16px;
}

/* Przy najechaniu przycisk przyjmuje kolor sieci — czytelnik widzi, dokąd
   trafi, zanim kliknie. W spoczynku wszystkie są szare, żeby pięć barw
   marek nie konkurowało z tekstem artykułu. */
.pbes-akcje .pbes-akcje__siec:hover,
.pbes-akcje .pbes-akcje__siec:focus-visible {
	color: #fff !important;
}
.pbes-akcje .pbes-akcje__siec--facebook:hover,
.pbes-akcje .pbes-akcje__siec--facebook:focus-visible { background: #1877f2 !important; border-color: #1877f2 !important; }
.pbes-akcje .pbes-akcje__siec--x:hover,
.pbes-akcje .pbes-akcje__siec--x:focus-visible { background: #000 !important; border-color: #000 !important; }
.pbes-akcje .pbes-akcje__siec--linkedin:hover,
.pbes-akcje .pbes-akcje__siec--linkedin:focus-visible { background: #0a66c2 !important; border-color: #0a66c2 !important; }
.pbes-akcje .pbes-akcje__siec--whatsapp:hover,
.pbes-akcje .pbes-akcje__siec--whatsapp:focus-visible { background: #25d366 !important; border-color: #25d366 !important; }
.pbes-akcje .pbes-akcje__siec--kopiuj:hover,
.pbes-akcje .pbes-akcje__siec--kopiuj:focus-visible { background: var(--pbes-tekst, #1b1f24) !important; border-color: var(--pbes-tekst, #1b1f24) !important; color: var(--pbes-tlo, #fff) !important; }

.pbes-akcje .pbes-akcje__siec--kopiuj.is-skopiowano {
	background: var(--pbes-sukces, #1f7a4d) !important;
	border-color: var(--pbes-sukces, #1f7a4d) !important;
	color: #fff !important;
}

/* --- Przycisk „Udostępnij" (telefon) ------------------------------------- */

.pbes-akcje button.pbes-akcje__udostepnij {
	display: none !important;
	align-items: center;
	gap: 7px;
	box-sizing: border-box !important;
	height: var(--pbes-akcje-h, 36px) !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4) !important;
	border-radius: 999px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tematy-tekst, #1a1a1a) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	cursor: pointer;
}

.pbes-akcje button.pbes-akcje__udostepnij .pbes-ikona {
	width: 16px;
	height: 16px;
}

/* Potwierdzenie skopiowania obok przycisków. */
.pbes-akcje .pbes-akcje__potwierdzenie {
	font-size: 13px;
	color: var(--pbes-sukces, #1f7a4d);
	opacity: 0;
	transition: opacity .2s ease;
}
.pbes-akcje .pbes-akcje__potwierdzenie.is-widoczne { opacity: 1; }

@media (max-width: 782px) {
	.pbes-akcje ul.pbes-akcje__sieci { display: none !important; }
	.pbes-akcje button.pbes-akcje__udostepnij { display: inline-flex !important; }
}

/* --- Karta udostępniania (telefon) ---------------------------------------
   Układ karty systemowej Androida: zaokrąglona góra, uchwyt, krzyżyk po
   lewej i tytuł na środku, kafelek z tytułem i adresem, rząd okrągłych
   ikon z podpisami. Krój systemowy, bo karta ma się czytać jak część
   telefonu, a nie strony. Nad menu dolnym (`--pbmd-z-index` 9997)
   i nad paskiem paywalla (99990). */

.pbes-karta {
	position: fixed;
	inset: 0;
	z-index: 100000;
	font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

.pbes-karta[hidden] { display: none !important; }

html.pbes-karta-otwarta,
html.pbes-karta-otwarta body {
	overflow: hidden !important;
}

.pbes-karta .pbes-karta__tlo {
	position: absolute;
	inset: 0;
	background: rgba(15, 20, 25, .5);
	opacity: 0;
	transition: opacity .26s ease;
}

.pbes-karta .pbes-karta__okno {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	box-sizing: border-box;
	max-width: 640px;
	max-height: 85vh;
	margin: 0 auto;
	padding: 10px 20px calc(22px + env(safe-area-inset-bottom, 0px));
	overflow-y: auto;
	background: var(--pbes-tlo, #fff);
	color: var(--pbes-tekst, #1b1f24);
	border-radius: 24px 24px 0 0;
	box-shadow: 0 -8px 30px rgba(0, 0, 0, .18);
	transform: translateY(100%);
	transition: transform .26s cubic-bezier(.22, 1, .36, 1);
}

.pbes-karta .pbes-karta__okno.is-przeciagane { transition: none; }

.pbes-karta.is-otwarta .pbes-karta__tlo { opacity: 1; }
.pbes-karta.is-otwarta .pbes-karta__okno { transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
	.pbes-karta .pbes-karta__tlo,
	.pbes-karta .pbes-karta__okno { transition: none; }
}

.pbes-karta .pbes-karta__uchwyt {
	display: block;
	width: 40px;
	height: 4px;
	margin: 0 auto 10px;
	border-radius: 2px;
	background: var(--pbes-ramka-mocna, #c4cbd4);
}

.pbes-karta .pbes-karta__naglowek {
	display: grid;
	grid-template-columns: 44px 1fr 44px;
	align-items: center;
	margin-bottom: 16px;
}

.pbes-karta button.pbes-karta__zamknij {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 44px !important;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tekst, #1b1f24) !important;
	cursor: pointer;
}
.pbes-karta button.pbes-karta__zamknij .pbes-ikona { width: 24px; height: 24px; }

/* Fokus ustawiany skryptem przy otwarciu karty nie powinien rysować obrysu
   po dotknięciu palcem — tylko przy obsłudze klawiaturą. */
.pbes-karta button:focus:not(:focus-visible),
.pbes-karta a:focus:not(:focus-visible) { outline: none !important; }
.pbes-karta button:focus-visible,
.pbes-karta a:focus-visible {
	outline: 2px solid var(--pbes-akcent, #2f5d8c) !important;
	outline-offset: 2px;
}

.pbes-karta .pbes-karta__tytul {
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.2;
}

/* Kafelek z linkiem. */
.pbes-karta .pbes-karta__link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 12px 12px 14px;
	border-radius: 18px;
	background: var(--pbes-tlo-hover, #f1f3f5);
}

.pbes-karta .pbes-karta__znak {
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	border-radius: 10px;
	border: 1px solid var(--pbes-ramka, #dfe3e8);
	background: var(--pbes-tlo, #fff);
	object-fit: cover;
}

.pbes-karta .pbes-karta__znak--tekst {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 15px;
}

.pbes-karta .pbes-karta__opis {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.pbes-karta .pbes-karta__opis-tytul,
.pbes-karta .pbes-karta__opis-adres {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pbes-karta .pbes-karta__opis-tytul { font-size: 16px; font-weight: 600; }
.pbes-karta .pbes-karta__opis-adres { font-size: 14px; color: var(--pbes-tekst-wyciszony, #5b6570); }

.pbes-karta button.pbes-karta__kopiuj {
	flex: 0 0 auto;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 44px !important;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tekst, #1b1f24) !important;
	cursor: pointer;
}
.pbes-karta button.pbes-karta__kopiuj .pbes-ikona { width: 22px; height: 22px; }
.pbes-karta button.pbes-karta__kopiuj.is-skopiowano { color: var(--pbes-sukces, #1f7a4d) !important; }

/* Rząd sieci — przewijany w poziomie, gdy się nie mieści, jak w karcie
   systemowej. */
.pbes-karta ul.pbes-karta__sieci {
	display: flex;
	gap: 2px;
	margin: 20px -20px 0 !important;
	padding: 0 20px 4px !important;
	list-style: none !important;
	overflow-x: auto;
	scrollbar-width: none;
}
.pbes-karta ul.pbes-karta__sieci::-webkit-scrollbar { display: none; }

.pbes-karta ul.pbes-karta__sieci li {
	flex: 0 0 auto;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.pbes-karta ul.pbes-karta__sieci li::before,
.pbes-karta ul.pbes-karta__sieci li::marker { content: none !important; display: none !important; }

.pbes-karta .pbes-karta__siec {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	width: 66px;
	margin: 0 !important;
	padding: 4px 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tekst, #1b1f24) !important;
	text-decoration: none !important;
	cursor: pointer;
	font: inherit;
}

.pbes-karta .pbes-karta__kolko {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	color: #fff;
}
.pbes-karta .pbes-karta__kolko .pbes-ikona { width: 24px; height: 24px; }

/* Pięć kafelków po 66 px mieści się na ekranie 360 px bez przewijania;
   węższe kafelki przy dłuższych podpisach zawijają tekst, nie ucinają go. */

.pbes-karta .pbes-karta__kolko--facebook { background: #1877f2; }
.pbes-karta .pbes-karta__kolko--x        { background: #000; }
.pbes-karta .pbes-karta__kolko--linkedin { background: #0a66c2; }
.pbes-karta .pbes-karta__kolko--whatsapp { background: #25d366; }
.pbes-karta .pbes-karta__kolko--kopiuj   { background: var(--pbes-tlo-hover, #f1f3f5); color: var(--pbes-tekst, #1b1f24); }

html.pb-uw-motyw-ciemny .pbes-karta .pbes-karta__kolko--x { background: #000; box-shadow: inset 0 0 0 1px #3c4653; }

.pbes-karta .pbes-karta__nazwa {
	font-size: 13px;
	line-height: 1.25;
	text-align: center;
}

.pbes-karta .pbes-karta__potwierdzenie {
	display: block;
	min-height: 18px;
	margin-top: 10px;
	text-align: center;
	font-size: 14px;
	color: var(--pbes-sukces, #1f7a4d);
	opacity: 0;
	transition: opacity .2s ease;
}
.pbes-karta .pbes-karta__potwierdzenie.is-widoczne { opacity: 1; }

/* =========================================================================
   Wariant kompaktowy: [pb_udostepnij_kompakt]
   =========================================================================
   Formatowanie jak w [pb_udostepnij] i chmurze tematów: przezroczyste tło,
   jasna ramka (`--pbes-tematy-ramka`), szare ikony, ciemniejsza ramka i tło
   przy najechaniu. Zakładka i komentarze to kółka jak przyciski sieci,
   „Udostępnij" — pigułka jak „Dodaj zakładkę". */

.pbes-kompakt {
	--pbes-k-h: 36px;

	/* Wyrównanie do prawej, wymuszone.
	   
	   Shortcode stoi w bloku tagDiv (`.td-fix-index`), który bywa kontenerem
	   giętkim albo ma własne wyrównanie tekstu. Pełna szerokość odbiera mu
	   miejsce na przesuwanie paska, a `flex-end` dosuwa przyciski do prawej
	   krawędzi bloku. */
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end !important;
	gap: 8px;
	box-sizing: border-box;
	width: 100% !important;
	max-width: none !important;
	flex: 1 1 100% !important;
	align-self: stretch !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	text-align: right !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif);
}

.pbes-kompakt .pbes-kompakt__btn,
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn {
	position: relative;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 7px !important;
	box-sizing: border-box !important;
	height: var(--pbes-k-h, 36px) !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4) !important;
	border-radius: 999px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tematy-tekst, #1a1a1a) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-decoration: none !important;
	white-space: nowrap;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}

.pbes-kompakt .pbes-kompakt__btn:hover,
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn:hover,
.pbes-kompakt.is-dymek-otwarty .pbes-kompakt__btn--udostepnij {
	border-color: var(--pbes-tematy-ramka-hover, #8a94a0) !important;
	background: var(--pbes-tematy-hover, #f2f2f2) !important;
}

.pbes-kompakt .pbes-kompakt__btn:focus-visible,
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn:focus-visible {
	outline: 2px solid var(--pbes-tematy-ramka-hover, #8a94a0) !important;
	outline-offset: 2px;
}

.pbes-kompakt .pbes-kompakt__btn .pbes-ikona,
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn svg {
	display: block;
	width: 16px;
	height: 16px;
}

/* Kółka: zakładka i komentarze — ikony szare jak przyciski sieci. */
.pbes-kompakt .pbes-kompakt__zakladka { display: inline-flex; }

.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn,
.pbes-kompakt .pbes-kompakt__btn--komentarze {
	width: var(--pbes-k-h, 36px) !important;
	padding: 0 !important;
	border-radius: 50% !important;
	color: var(--pbes-tekst-wyciszony, #5b6570) !important;
}

/* Zakładka bez napisu — etykieta zostaje w `aria-label` przycisku. */
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn .bff-label { display: none !important; }
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn .bff-icon { display: inline-flex; margin: 0 !important; }

/* Zapisany artykuł — jak w [pb_udostepnij]: ramka i ikona w kolorze akcentu. */
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn.bff-active {
	border-color: var(--pbes-akcent, #2f5d8c) !important;
	color: var(--pbes-akcent, #2f5d8c) !important;
}

.pbes-kompakt .pbes-kompakt__ikona {
	position: relative;
	display: inline-flex;
}

/* Licznik komentarzy w kółku na ikonie. */
.pbes-kompakt .pbes-kompakt__licznik {
	position: absolute;
	top: -9px;
	right: -11px;
	box-sizing: border-box;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 999px;
	background: var(--pbes-akcent, #2f5d8c);
	color: var(--pbes-przycisk-tekst, #fff);
	box-shadow: 0 0 0 2px var(--pbes-tlo, #fff);
	font-size: 10px;
	font-weight: 700;
	line-height: 16px;
	text-align: center;
}

/* Ikony domknięte przed regułami motywu.
   
   Przycisk komentarzy jest odsyłaczem w treści wpisu, a motyw Newspaper
   nadaje elementom w odsyłaczach własne wymiary i wypełnienie. Ikona
   obrysowa z `fill` ustawionym przez motyw albo z zerową szerokością
   po prostu znika. */
.pbes-kompakt .pbes-ikona,
.pbes-kompakt .pbes-kompakt__zakladka .pb-zakladki-btn svg {
	display: block !important;
	flex: 0 0 auto !important;
	width: 16px !important;
	min-width: 16px !important;
	height: 16px !important;
	max-width: none !important;
	margin: 0 !important;
	opacity: 1 !important;
	visibility: visible !important;
	overflow: visible !important;
}

.pbes-kompakt .pbes-kompakt__btn--komentarze .pbes-ikona,
.pbes-kompakt .pbes-kompakt__btn--komentarze .pbes-ikona path {
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2px !important;
}

.pbes-kompakt .pbes-kompakt__ikona {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	line-height: 0 !important;
}

/* Ikona w pigułce „Udostępnij" szara, napis w kolorze tekstu — jak przycisk
   „Udostępnij" w [pb_udostepnij] na telefonie. */
.pbes-kompakt .pbes-kompakt__btn--udostepnij .pbes-ikona { color: var(--pbes-tekst-wyciszony, #5b6570); }

/* --- Dymek z sieciami (komputer) ----------------------------------------- */

.pbes-kompakt .pbes-kompakt__udostepnianie { position: relative; display: inline-flex; }

.pbes-dymek.pbes-dymek {
	/* Położenie (top, left) liczy skrypt — dymek stoi w <body>, nad całą
	   treścią, poza kontekstami nakładania bloków motywu. Pod paskiem
	   paywalla (99990) i kartą (100000), nad menu dolnym (9997). */
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99980;
	box-sizing: border-box;
	width: 210px;
	padding: 12px;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif);
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4);
	border-radius: 18px;
	background: var(--pbes-tlo, #fff);
	box-shadow: 0 6px 22px rgba(20, 26, 33, .14);
}

.pbes-dymek.pbes-dymek[hidden] { display: none !important; }

.pbes-dymek.pbes-dymek::before {
	content: '';
	position: absolute;
	top: -7px;
	left: var(--pbes-strzalka, 50%);
	width: 12px;
	height: 12px;
	transform: translateX(-50%) rotate(45deg);
	border-left: 1px solid var(--pbes-tematy-ramka, #c4cbd4);
	border-top: 1px solid var(--pbes-tematy-ramka, #c4cbd4);
	background: var(--pbes-tlo, #fff);
}

body .pbes-dymek ul.pbes-dymek__lista {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

body .pbes-dymek ul.pbes-dymek__lista li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
body .pbes-dymek ul.pbes-dymek__lista li::before,
body .pbes-dymek ul.pbes-dymek__lista li::marker { content: none !important; display: none !important; }

/* Pozycje dymku: pigułki z szarą ikoną; przy najechaniu kolor sieci —
   to samo zachowanie co okrągłe przyciski w [pb_udostepnij]. */
body .pbes-dymek .pbes-dymek__siec {
	display: flex !important;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	box-sizing: border-box !important;
	width: 100% !important;
	height: var(--pbes-k-h, 36px) !important;
	margin: 0 !important;
	padding: 0 14px !important;
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4) !important;
	border-radius: 999px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--pbes-tematy-tekst, #1a1a1a) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	cursor: pointer;
	transition: color .15s ease, background-color .15s ease, border-color .15s ease;
}

body .pbes-dymek .pbes-dymek__siec .pbes-ikona {
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	color: var(--pbes-tekst-wyciszony, #5b6570);
	transition: color .15s ease;
}

body .pbes-dymek .pbes-dymek__siec:hover,
body .pbes-dymek .pbes-dymek__siec:focus-visible,
body .pbes-dymek .pbes-dymek__siec:hover .pbes-ikona,
body .pbes-dymek .pbes-dymek__siec:focus-visible .pbes-ikona { color: #fff !important; }

body .pbes-dymek .pbes-dymek__siec--facebook:hover,
body .pbes-dymek .pbes-dymek__siec--facebook:focus-visible { background: #1877f2 !important; border-color: #1877f2 !important; }
body .pbes-dymek .pbes-dymek__siec--x:hover,
body .pbes-dymek .pbes-dymek__siec--x:focus-visible { background: #000 !important; border-color: #000 !important; }
body .pbes-dymek .pbes-dymek__siec--linkedin:hover,
body .pbes-dymek .pbes-dymek__siec--linkedin:focus-visible { background: #0a66c2 !important; border-color: #0a66c2 !important; }
body .pbes-dymek .pbes-dymek__siec--whatsapp:hover,
body .pbes-dymek .pbes-dymek__siec--whatsapp:focus-visible { background: #25d366 !important; border-color: #25d366 !important; }
body .pbes-dymek .pbes-dymek__siec--kopiuj:hover,
body .pbes-dymek .pbes-dymek__siec--kopiuj:focus-visible { background: var(--pbes-tekst, #1b1f24) !important; border-color: var(--pbes-tekst, #1b1f24) !important; }
body .pbes-dymek .pbes-dymek__siec--kopiuj:hover,
body .pbes-dymek .pbes-dymek__siec--kopiuj:hover .pbes-ikona { color: var(--pbes-tlo, #fff) !important; }

body .pbes-dymek .pbes-dymek__siec--kopiuj.is-skopiowano,
body .pbes-dymek .pbes-dymek__siec--kopiuj.is-skopiowano .pbes-ikona {
	background: var(--pbes-sukces, #1f7a4d) !important;
	border-color: var(--pbes-sukces, #1f7a4d) !important;
	color: #fff !important;
}

body .pbes-dymek .pbes-dymek__potwierdzenie {
	display: block;
	margin-top: 8px;
	text-align: center;
	font-size: 13px;
	color: var(--pbes-sukces, #1f7a4d);
}
body .pbes-dymek .pbes-dymek__potwierdzenie:empty { display: none; }

/* Na telefonie dymek nigdy się nie pokazuje — skrypt otwiera kartę. */
@media (max-width: 782px) {
	.pbes-dymek.pbes-dymek { display: none !important; }
}

/* =========================================================================
   Powiązane artykuły ([irp] → „Przeczytaj także")
   =========================================================================
   Szare pole z zaokrągleniem, nagłówek z krótką kreską akcentu pod spodem
   i linią przez całą szerokość, pod nim pozycje: miniatura + tytuł.
   Blok stoi w treści wpisu, więc krój, wielkości i marginesy są domknięte
   przed regułami `.td-post-content` motywu. */

/* Wartości domyślne = paleta portalu. Ustawienia z panelu nadpisuje
   <style id="pbes-irp-kolory"> wypisywany przy pierwszym bloku. */
:root {
	--pbes-irp-tlo: #f6f7f9;
	--pbes-irp-ramka: #dfe3e8;
	--pbes-irp-akcent: #2f5d8c;
	--pbes-irp-tekst: #1b1f24;
	--pbes-irp-font-naglowek: 18px;
	--pbes-irp-font-tytul: 16px;
	--pbes-irp-font-punkt: 16px;
}

html.pb-uw-motyw-ciemny {
	--pbes-irp-tlo: #1a1f26;
	--pbes-irp-ramka: #2c343e;
	--pbes-irp-akcent: #6ea3d4;
	--pbes-irp-tekst: #e8ebef;
}

.pbes-irp.pbes-irp {
	display: block;
	box-sizing: border-box;
	clear: both;
	margin: 1.75rem 0 !important;
	padding: 0 0 6px !important;
	border: 1px solid var(--pbes-irp-ramka, #dfe3e8) !important;
	border-radius: 14px;
	background: var(--pbes-irp-tlo, #f6f7f9);
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
}

.pbes-irp .pbes-irp__naglowek {
	position: relative;
	margin: 0 !important;
	padding: 22px 28px 14px !important;
	border-bottom: 1px solid var(--pbes-irp-ramka, #dfe3e8);
	line-height: 1.2 !important;
}

.pbes-irp .pbes-irp__tytul {
	position: relative;
	display: inline-block;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: var(--pbes-irp-font-naglowek, 18px) !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}

/* Kreska akcentu — leży na linii działowej, pod początkiem nagłówka. */
.pbes-irp .pbes-irp__tytul::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -16px;
	width: 70px;
	height: 4px;
	border-radius: 2px;
	background: var(--pbes-irp-akcent, #2f5d8c);
}

.pbes-irp ul.pbes-irp__lista {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 !important;
	padding: 20px 28px 16px !important;
	list-style: none !important;
}

.pbes-irp li.pbes-irp__pozycja {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	line-height: 1.3 !important;
}

.pbes-irp li.pbes-irp__pozycja::before,
.pbes-irp li.pbes-irp__pozycja::marker {
	content: none !important;
	display: none !important;
}

.pbes-irp a.pbes-irp__link {
	display: flex !important;
	align-items: center;
	gap: 22px;
	padding: 8px 0;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

.pbes-irp .pbes-irp__miniatura {
	flex: 0 0 auto;
	display: block;
	width: 190px;
	/* 5:3 zamiast 4:3 — miniatura o 20% niższa przy tej samej szerokości.
	   Pozycja nie jest wtedy wyższa niż dwa–trzy wiersze tytułu, więc blok
	   nie rośnie z powodu obrazka. Kadr środkowy (`object-fit: cover`). */
	aspect-ratio: 5 / 3;
	overflow: hidden;
	border-radius: 10px;
	background: var(--pbes-irp-ramka, #dfe3e8);
}

.pbes-irp .pbes-irp__miniatura img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	object-fit: cover;
	border-radius: 0 !important;
	transition: transform .25s ease;
}

.pbes-irp .pbes-irp__tekst {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: var(--pbes-irp-font-tytul, 16px) !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	color: inherit !important;
}

/* Autorzy pod tytułem (1.15.0): mniejsze pismo, kapitaliki, bez pogrubienia. */
.pbes-irp .pbes-irp__autorzy {
	display: block;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .8em !important;
	font-weight: 400 !important;
	font-variant: small-caps !important;
	letter-spacing: .04em;
	line-height: 1.3 !important;
	text-transform: none !important;
	color: inherit !important;
	opacity: .75;
}

.pbes-irp a.pbes-irp__link:hover .pbes-irp__tytul-art,
.pbes-irp a.pbes-irp__link:focus-visible .pbes-irp__tytul-art {
	text-decoration: underline !important;
	text-decoration-thickness: 2px !important;
	text-underline-offset: 3px;
}

.pbes-irp a.pbes-irp__link:hover .pbes-irp__miniatura img { transform: scale(1.04); }

.pbes-irp a.pbes-irp__link:focus-visible {
	outline: 2px solid var(--pbes-irp-akcent, #2f5d8c);
	outline-offset: 4px;
	border-radius: 10px;
}

@media (prefers-reduced-motion: reduce) {
	.pbes-irp .pbes-irp__miniatura img { transition: none; }
}

@media (max-width: 782px) {
	.pbes-irp.pbes-irp { border-radius: 12px; }
	.pbes-irp .pbes-irp__naglowek { padding: 16px 16px 12px !important; }
	.pbes-irp .pbes-irp__tytul { font-size: calc(var(--pbes-irp-font-naglowek, 18px) * .88) !important; }
	.pbes-irp .pbes-irp__tytul::after { bottom: -14px; width: 56px; }
	.pbes-irp ul.pbes-irp__lista { padding: 14px 16px 10px !important; gap: 4px; }
	.pbes-irp a.pbes-irp__link { gap: 14px; }
	.pbes-irp .pbes-irp__miniatura { width: 110px; border-radius: 8px; }
	.pbes-irp .pbes-irp__tekst { font-size: calc(var(--pbes-irp-font-tytul, 16px) * .88) !important; line-height: 1.3 !important; }
}

/* =========================================================================
   Podsumowanie artykułu ([pb_podsumowanie] → „W tym artykule przeczytasz:")
   =========================================================================
   Bez tła, ramki i linii: okrągłe znaczniki punktów w kolorze
   `--pbes-pod-linia` (wersja jasna i ciemna w ustawieniach). Tekst pogrubiony, kolor tekstu
   wspólny z „Przeczytaj także" (`--pbes-irp-tekst`). */

.pbes-pod.pbes-pod {
	display: block;
	box-sizing: border-box;
	clear: both;
	margin: 1.75rem 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--pbes-irp-tekst, #1b1f24);
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
}

.pbes-pod p.pbes-pod__naglowek {
	margin: 0 0 14px !important;
	padding: 0 !important;
	border: 0 !important;
	line-height: 1.2 !important;
}

.pbes-pod .pbes-pod__tytul {
	display: inline-block;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: var(--pbes-irp-font-naglowek, 18px) !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}

.pbes-pod ul.pbes-pod__lista {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.pbes-pod li.pbes-pod__punkt {
	position: relative;
	margin: 0 !important;
	padding: 0 0 0 30px !important;
	list-style: none !important;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: var(--pbes-irp-font-punkt, 16px) !important;
	font-weight: 700 !important;
	line-height: 1.6 !important;
}

.pbes-pod li.pbes-pod__punkt::marker { content: none !important; }

/* Znacznik: okrągły punkt na wysokości pierwszego wiersza. */
.pbes-pod li.pbes-pod__punkt::before {
	content: '' !important;
	position: absolute;
	left: 6px;
	top: calc(.8em - 4px);
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pbes-pod-linia, #e30613);
}

@media (max-width: 782px) {
	.pbes-pod .pbes-pod__tytul { font-size: calc(var(--pbes-irp-font-naglowek, 18px) * .88) !important; }
	.pbes-pod ul.pbes-pod__lista { gap: 12px; }
	.pbes-pod li.pbes-pod__punkt { font-size: calc(var(--pbes-irp-font-punkt, 16px) * .92) !important; padding-left: 24px !important; }
	.pbes-pod li.pbes-pod__punkt::before { left: 4px; width: 7px; height: 7px; top: calc(.8em - 3.5px); }
}

/* =========================================================================
   Sonda „pytanie do artykułu” ([pb_sonda])
   =========================================================================
   Pytanie, pod nim TAK [pasek] NIE; po głosie procenty zamiast odpowiedzi
   i pasek przesunięty do wyniku. TAK — kolor ciemniejszy (lewa część
   paska), NIE — jaśniejszy (`--pbes-son-tak`, `--pbes-son-nie`, wersja
   jasna i ciemna w ustawieniach). Napis NIE dostaje domieszkę koloru
   tekstu — sam jasny odcień paska byłby na białym tle nieczytelny.
   Pole opinii i przycisk w palecie panelu logowania (zmienne paywalla). */

.pbes-son.pbes-son {
	display: block;
	box-sizing: border-box;
	clear: both;
	margin: 2rem 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	color: var(--pbes-irp-tekst, #1b1f24);
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
}

.pbes-son p.pbes-son__pytanie {
	margin: 0 0 1rem !important;
	padding: 0 !important;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: var(--pbes-irp-font-pytanie, 20px) !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}

.pbes-son .pbes-son__glosowanie {
	display: flex;
	align-items: center;
	gap: 18px;
	width: 100%;
}

.pbes-son button.pbes-son__opcja {
	display: inline-flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 4.2em;
	margin: 0 !important;
	padding: 4px 2px !important;
	border: 0 !important;
	border-radius: 6px !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 30px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	letter-spacing: .01em !important;
	text-transform: none !important;
	cursor: pointer;
	transition: transform .15s, opacity .15s;
}

.pbes-son button.pbes-son__opcja--tak { color: var(--pbes-son-tak, #2f5d8c) !important; }
.pbes-son button.pbes-son__opcja--nie {
	color: var(--pbes-son-nie, #a9c0d9) !important;
	color: color-mix(in srgb, var(--pbes-son-nie, #a9c0d9) 72%, var(--pbes-irp-tekst, #1b1f24)) !important;
}

.pbes-son:not(.is-wyniki) button.pbes-son__opcja:hover { transform: translateY(-1px) scale(1.06); }
.pbes-son button.pbes-son__opcja:focus-visible {
	outline: 2px solid var(--pbes-son-tak, #2f5d8c) !important;
	outline-offset: 3px;
}
.pbes-son.is-trwa button.pbes-son__opcja { opacity: .55; cursor: progress; }

.pbes-son .pbes-son__procent { display: none; }

/* Po głosie: procent dużym pismem, odpowiedź nad nim małymi wersalikami. */
.pbes-son.is-wyniki button.pbes-son__opcja { cursor: default; opacity: 1; }
.pbes-son.is-wyniki .pbes-son__procent { display: block; font-size: 38px; font-weight: 800; line-height: 1; }
.pbes-son.is-wyniki .pbes-son__etykieta {
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
}
.pbes-son.is-wyniki .pbes-son__opcja.is-wybrany .pbes-son__etykieta::after { content: ' ✓'; }

.pbes-son .pbes-son__pasek {
	position: relative;
	flex: 1 1 auto;
	min-width: 60px;
	height: 10px;
	border-radius: 5px;
	background: var(--pbes-son-nie, #a9c0d9);
	overflow: hidden;
}

.pbes-son .pbes-son__pasek-tak {
	display: block;
	height: 100%;
	background: var(--pbes-son-tak, #2f5d8c);
	transition: width .7s cubic-bezier(.2, .8, .2, 1);
}

.pbes-son p.pbes-son__status {
	min-height: 1.2em;
	margin: .5rem 0 0 !important;
	padding: 0 !important;
	color: var(--pbes-tekst-wyciszony, #5b6570) !important;
	font-size: 13px !important;
	line-height: 1.4 !important;
	text-align: center;
}
.pbes-son p.pbes-son__status:empty { min-height: 0; margin: 0 !important; }
.pbes-son p.pbes-son__status.is-blad { color: var(--pbes-blad, #a33236) !important; }

/* Gość: komunikat z odsyłaczem logowania. */
.pbes-son p.pbes-son__gosc {
	margin: 1rem 0 0 !important;
	padding: 12px 16px !important;
	border: 1px solid var(--pbes-ramka-panelu, #dfe3e8);
	border-radius: var(--pbes-radius-maly, 6px);
	background: var(--pbes-tlo-panelu, #f6f7f9);
	color: var(--pbes-tekst, #1b1f24) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	text-align: center;
}
.pbes-son a.pbes-son__zaloguj {
	color: var(--pbes-link, #2f5d8c) !important;
	font-weight: 700;
	text-decoration: underline !important;
	white-space: nowrap;
	box-shadow: none !important;
}
.pbes-son p.pbes-son__gosc.is-podswietlony { animation: pbes-son-podswietl 1.1s ease-out; }
@keyframes pbes-son-podswietl {
	0%, 35% { border-color: var(--pbes-akcent, #2f5d8c); box-shadow: 0 0 0 3px var(--pbes-akcent-jasny, #eaf1f8); }
	100% { box-shadow: 0 0 0 0 transparent; }
}

/* Opinia. */
.pbes-son form.pbes-son__opinia { margin: 1.25rem 0 0 !important; padding: 0 !important; }

.pbes-son .pbes-son__sr {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.pbes-son textarea.pbes-son__pole {
	display: block;
	box-sizing: border-box !important;
	width: 100% !important;
	min-height: 88px;
	margin: 0 !important;
	padding: 10px 12px !important;
	border: 1px solid var(--pbes-ramka-mocna, #c4cbd4) !important;
	border-radius: var(--pbes-radius-maly, 6px) !important;
	background: var(--pbes-tlo-pola, #ffffff) !important;
	color: var(--pbes-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	box-shadow: none !important;
	resize: vertical;
	transition: border-color .15s, box-shadow .15s;
}
.pbes-son textarea.pbes-son__pole::placeholder { color: var(--pbes-tekst-wyciszony, #5b6570); font-style: italic; opacity: 1; }
.pbes-son textarea.pbes-son__pole:focus {
	outline: none !important;
	border-color: var(--pbes-akcent, #2f5d8c) !important;
	box-shadow: 0 0 0 3px var(--pbes-akcent-jasny, #eaf1f8) !important;
}

.pbes-son .pbes-son__stopka {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 8px;
}

.pbes-son .pbes-son__autor {
	min-width: 0;
	color: var(--pbes-tekst-wyciszony, #5b6570);
	font-size: 13px;
	line-height: 1.4;
}
.pbes-son .pbes-son__autor strong { color: var(--pbes-tekst, #1b1f24); font-weight: 700; }

.pbes-son button.pbes-son__wyslij {
	flex: 0 0 auto;
	min-width: 140px;
	height: var(--pbes-pole-h, 38px) !important;
	margin: 0 !important;
	padding: 0 1.25rem !important;
	border: 0 !important;
	border-radius: var(--pbes-radius-maly, 6px) !important;
	background: var(--pbes-przycisk, #2f5d8c) !important;
	color: var(--pbes-przycisk-tekst, #ffffff) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: .85rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: filter .15s;
}
.pbes-son button.pbes-son__wyslij:hover:not([disabled]) { filter: brightness(.94); }
.pbes-son button.pbes-son__wyslij[disabled] { opacity: .55; cursor: progress; }

.pbes-son p.pbes-son__komunikat {
	margin: .5rem 0 0 !important;
	padding: 0 !important;
	color: var(--pbes-tekst-wyciszony, #5b6570) !important;
	font-size: 14px !important;
	line-height: 1.4 !important;
}
.pbes-son p.pbes-son__komunikat:empty { display: none; }
.pbes-son p.pbes-son__komunikat.is-ok { color: var(--pbes-sukces, #1f7a4d) !important; }
.pbes-son p.pbes-son__komunikat.is-blad { color: var(--pbes-blad, #a33236) !important; }

@media (max-width: 782px) {
	.pbes-son p.pbes-son__pytanie { font-size: calc(var(--pbes-irp-font-pytanie, 20px) * .9) !important; }
	.pbes-son .pbes-son__glosowanie { gap: 12px; }
	.pbes-son button.pbes-son__opcja { font-size: 24px !important; min-width: 3.6em; }
	.pbes-son.is-wyniki .pbes-son__procent { font-size: 30px; }
	.pbes-son .pbes-son__pasek { height: 8px; }
	.pbes-son .pbes-son__stopka { flex-direction: column; align-items: stretch; }
	.pbes-son button.pbes-son__wyslij { width: 100%; }
}

/* =========================================================================
   „Jak cytować ten artykuł” — [pb_cytowanie] (1.19.0)
   Zwijany <details> pod artykułem; kolory wspólne z „Przeczytaj także”
   (--pbes-irp-*, także z panelu i w trybie ciemnym). Bez JS formaty stoją
   jeden pod drugim z nazwą; skrypt dokłada zakładki (.is-zakladki).
   ========================================================================= */

.pbes-cyt.pbes-cyt {
	display: block;
	box-sizing: border-box;
	clear: both;
	margin: 1.75rem 0 !important;
	padding: 0 !important;
	border: 1px solid var(--pbes-irp-ramka, #dfe3e8) !important;
	border-radius: 12px;
	background: var(--pbes-irp-tlo, #f6f7f9);
	color: var(--pbes-irp-tekst, #1b1f24);
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 15px;
	line-height: 1.5;
}

.pbes-cyt *,
.pbes-cyt *::before,
.pbes-cyt *::after { box-sizing: border-box; }

.pbes-cyt [hidden] { display: none !important; }

.pbes-cyt summary.pbes-cyt__naglowek {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 !important;
	padding: 14px 52px 14px 20px !important;
	list-style: none !important;
	cursor: pointer;
	border-radius: 12px;
	-webkit-user-select: none;
	user-select: none;
}

.pbes-cyt summary.pbes-cyt__naglowek::-webkit-details-marker { display: none; }
.pbes-cyt summary.pbes-cyt__naglowek::marker { content: ''; }

/* Znak cudzysłowu przed nagłówkiem — rysowany CSS-em, bez czcionki ikon. */
.pbes-cyt summary.pbes-cyt__naglowek::before {
	content: '\201D';
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--pbes-irp-akcent, #2f5d8c);
	color: var(--pbes-irp-tlo, #ffffff);
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 1;
	padding-top: 9px;
}

/* Strzałka (chevron) po prawej. */
.pbes-cyt summary.pbes-cyt__naglowek::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 22px;
	width: 9px;
	height: 9px;
	margin-top: -7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform .2s ease, margin-top .2s ease;
	opacity: .7;
}
.pbes-cyt[open] > summary.pbes-cyt__naglowek::after { transform: rotate(-135deg); margin-top: -2px; }

.pbes-cyt summary.pbes-cyt__naglowek:hover .pbes-cyt__tytul { text-decoration: underline; text-underline-offset: 3px; }
.pbes-cyt summary.pbes-cyt__naglowek:focus-visible {
	outline: 2px solid var(--pbes-irp-akcent, #2f5d8c);
	outline-offset: 2px;
}

.pbes-cyt .pbes-cyt__tytul {
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}

.pbes-cyt .pbes-cyt__tresc {
	padding: 4px 20px 18px;
	border-top: 1px solid var(--pbes-irp-ramka, #dfe3e8);
}

.pbes-cyt p.pbes-cyt__wstep {
	margin: 12px 0 0 !important;
	padding: 0 !important;
	color: var(--pbes-tekst-wyciszony, #5b6570) !important;
	font-size: 14px !important;
}

/* Zakładki — pigułki jak w chmurze tematów; na telefonie przewijane. */
.pbes-cyt .pbes-cyt__zakladki {
	display: flex;
	flex-wrap: nowrap;
	gap: 6px;
	margin: 14px 0 12px;
	padding: 2px;
	overflow-x: auto;
	scrollbar-width: none;
}
.pbes-cyt .pbes-cyt__zakladki::-webkit-scrollbar { display: none; }

.pbes-cyt button.pbes-cyt__zakladka {
	flex: 0 0 auto;
	height: 32px !important;
	margin: 0 !important;
	padding: 0 14px !important;
	border: 1px solid var(--pbes-tematy-ramka, #c4cbd4) !important;
	border-radius: 16px !important;
	background: transparent !important;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	white-space: nowrap;
	box-shadow: none !important;
	cursor: pointer;
}
.pbes-cyt button.pbes-cyt__zakladka:hover { border-color: var(--pbes-tematy-ramka-hover, #8a94a0) !important; }
.pbes-cyt button.pbes-cyt__zakladka.is-aktywna,
.pbes-cyt button.pbes-cyt__zakladka[aria-selected="true"] {
	border-color: var(--pbes-irp-akcent, #2f5d8c) !important;
	background: var(--pbes-irp-akcent, #2f5d8c) !important;
	color: var(--pbes-irp-tlo, #ffffff) !important;
	font-weight: 700 !important;
}
.pbes-cyt button.pbes-cyt__zakladka:focus-visible {
	outline: 2px solid var(--pbes-irp-akcent, #2f5d8c) !important;
	outline-offset: 2px;
}

/* Panele. Bez zakładek (bez JS): nazwa formatu nad opisem. */
.pbes-cyt .pbes-cyt__panel { margin: 0; padding: 0; }
.pbes-cyt .pbes-cyt__panel:focus-visible { outline: 2px solid var(--pbes-irp-akcent, #2f5d8c); outline-offset: 4px; border-radius: 6px; }
.pbes-cyt:not(.is-zakladki) .pbes-cyt__panel + .pbes-cyt__panel { margin-top: 16px; }

.pbes-cyt p.pbes-cyt__format {
	margin: 14px 0 6px !important;
	padding: 0 !important;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
}
.pbes-cyt.is-zakladki p.pbes-cyt__format { display: none !important; }

.pbes-cyt .pbes-cyt__wpis + .pbes-cyt__wpis { margin-top: 14px; }

.pbes-cyt p.pbes-cyt__etykieta {
	margin: 0 0 4px !important;
	padding: 0 !important;
	color: var(--pbes-tekst-wyciszony, #5b6570) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: .06em;
	line-height: 1.3 !important;
	text-transform: uppercase !important;
}

.pbes-cyt .pbes-cyt__opis {
	margin: 0 !important;
	padding: 12px 14px !important;
	border: 1px solid var(--pbes-irp-ramka, #dfe3e8) !important;
	border-radius: 8px;
	background: var(--pbes-tlo-pola, #ffffff) !important;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
	overflow-wrap: anywhere;
	-webkit-user-select: text;
	user-select: text;
}
.pbes-cyt .pbes-cyt__opis i { font-style: italic !important; }

/* APA: odwołanie w tekście jest krótkie — mniejsze pole. Chicago ma dwa równorzędne wpisy. */
.pbes-cyt [data-format="apa"] .pbes-cyt__wpis--dodatkowy .pbes-cyt__opis { padding: 8px 14px !important; font-size: 14px !important; }

.pbes-cyt pre.pbes-cyt__opis--kod {
	max-height: 340px;
	overflow: auto;
	white-space: pre !important;
	overflow-wrap: normal;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	tab-size: 2;
}

.pbes-cyt p.pbes-cyt__akcje {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 8px 0 0 !important;
	padding: 0 !important;
}

.pbes-cyt button.pbes-cyt__btn {
	display: inline-flex;
	align-items: center;
	height: 32px !important;
	margin: 0 !important;
	padding: 0 14px !important;
	border: 1px solid var(--pbes-irp-akcent, #2f5d8c) !important;
	border-radius: 16px !important;
	background: transparent !important;
	color: var(--pbes-irp-akcent, #2f5d8c) !important;
	font-family: var(--pbes-font, Verdana, Geneva, sans-serif) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: background-color .15s, color .15s;
}
.pbes-cyt button.pbes-cyt__btn:hover,
.pbes-cyt button.pbes-cyt__btn.is-ok {
	background: var(--pbes-irp-akcent, #2f5d8c) !important;
	color: var(--pbes-irp-tlo, #ffffff) !important;
}
.pbes-cyt button.pbes-cyt__btn--pobierz {
	border-color: var(--pbes-tematy-ramka, #c4cbd4) !important;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
	font-weight: 400 !important;
}
.pbes-cyt button.pbes-cyt__btn--pobierz:hover {
	border-color: var(--pbes-tematy-ramka-hover, #8a94a0) !important;
	background: var(--pbes-tematy-hover, #f2f2f2) !important;
	color: var(--pbes-irp-tekst, #1b1f24) !important;
}
.pbes-cyt button.pbes-cyt__btn:focus-visible {
	outline: 2px solid var(--pbes-irp-akcent, #2f5d8c) !important;
	outline-offset: 2px;
}

/* Status dla czytników ekranu; widoczny tylko przy błędzie kopiowania. */
.pbes-cyt p.pbes-cyt__status {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.pbes-cyt p.pbes-cyt__status.is-blad {
	position: static !important;
	width: auto;
	height: auto;
	margin: 10px 0 0 !important;
	overflow: visible;
	clip: auto;
	white-space: normal;
	color: var(--pbes-blad, #a33236) !important;
	font-size: 13px !important;
}

@media (prefers-reduced-motion: reduce) {
	.pbes-cyt summary.pbes-cyt__naglowek::after { transition: none; }
}

@media (max-width: 782px) {
	.pbes-cyt summary.pbes-cyt__naglowek { padding: 12px 44px 12px 14px !important; }
	.pbes-cyt summary.pbes-cyt__naglowek::after { right: 18px; }
	.pbes-cyt .pbes-cyt__tytul { font-size: 15px !important; }
	.pbes-cyt .pbes-cyt__tresc { padding: 2px 14px 14px; }
	.pbes-cyt .pbes-cyt__opis { font-size: 14px !important; padding: 10px 12px !important; }
	.pbes-cyt pre.pbes-cyt__opis--kod { font-size: 12px !important; }
	.pbes-cyt button.pbes-cyt__btn { height: 36px !important; }
}

@media print {
	.pbes-cyt.pbes-cyt { display: none !important; }
}