/* Money Rankings 1.4.13 — zamrożony wzorzec bloków (konta osobiste).
   Krój z motywu. Jedna kreska: --mr-line.
   Kolor: ustawienia (dzień/noc) → --mr-theme-line (JS) → --mr-active-line
   → mix 18% czcionki. Nigdy --cs-color-contrast.
   Skala: etykiety i kwoty 0.875rem (14px). */

:root {
	--mr-active-line: var(--mr-line-day, color-mix(in srgb, currentColor 18%, transparent));
}

@media (prefers-color-scheme: dark) {
	:root {
		--mr-active-line: var(--mr-line-night, var(--mr-line-day, color-mix(in srgb, currentColor 18%, transparent)));
	}
}

@supports (color: light-dark(#fff, #000)) {
	:root {
		--mr-active-line: light-dark(
			var(--mr-line-day, color-mix(in srgb, currentColor 18%, transparent)),
			var(--mr-line-night, var(--mr-line-day, color-mix(in srgb, currentColor 18%, transparent)))
		);
	}
}

html[data-theme="dzien"],
html[data-theme="light"],
html[data-color-scheme="light"],
html[data-x-color-scheme="light"] {
	--mr-active-line: var(--mr-line-day, color-mix(in srgb, currentColor 18%, transparent));
}

html[data-theme="noc"],
html[data-theme="dark"],
html[data-color-scheme="dark"],
html[data-x-color-scheme="dark"],
html.dark,
html.cs-dark,
body.dark,
body.cs-dark,
body.is-dark-theme,
.dark-mode {
	--mr-active-line: var(--mr-line-night, var(--mr-line-day, color-mix(in srgb, currentColor 18%, transparent)));
}

.mr-unit,
.mr-card,
.mr-list,
.mr-table-wrap,
.mr-slider,
.mr-empty,
.mr-tip__bubble {
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.45;
	color: inherit;
	color-scheme: inherit;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	--mr-line: var(--mr-theme-line, var(--mr-active-line, color-mix(in srgb, currentColor 18%, transparent)));
}

.mr-unit *,
.mr-list *,
.mr-table-wrap * {
	box-sizing: border-box;
}

.mr-empty { margin: 1em 0; }

/* Szerokość alignwide/alignfull ustawia motyw. Nie wolno tu max-width:100%
   — z ujemnym margin-left (typowe .alignfull) blok zjeżdża w lewo i nie rośnie w prawo. */
.mr-block {
	box-sizing: border-box;
}

.mr-unit {
	display: block;
	width: 100%;
	margin: 1.25em 0;
	isolation: isolate;
	container-type: inline-size;
	container-name: mr;
}

.mr-card p,
.mr-card header {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	text-align: left;
}

.mr-card ul,
.mr-card ol,
.mr-list {
	list-style: none !important;
	margin: 0;
	padding: 0;
}

.mr-card li,
.mr-list li {
	list-style: none !important;
	margin: 0;
}

.mr-card img,
.mr-list img {
	border: 0 !important;
	box-shadow: none !important;
	background: none !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* 1.2.11 — lead: flex, wysokość = logo, tytuł w pionowym środku */
.mr-card {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin: 0;
	padding: 1.25em 1.15em 1.2em;
	background: transparent;
	border: 1px solid var(--mr-line);
}

.mr-card.is-empty {
	min-height: 8rem;
	justify-content: center;
}

.mr-card.is-empty .mr-empty {
	margin: 0;
	opacity: 0.65;
}

.mr-card__lead {
	display: flex;
	flex-direction: row;
	align-items: center;
	height: 3.5rem;
	column-gap: 0.9em;
	width: 100%;
}

.mr-card img.mr-card__logo,
.mr-block img.mr-card__logo,
.mr-block.alignwide img.mr-card__logo,
.mr-block.alignfull img.mr-card__logo,
.alignwide .mr-card img.mr-card__logo,
.alignfull .mr-card img.mr-card__logo {
	order: 2;
	flex: 0 0 5.5rem !important;
	flex-grow: 0 !important;
	flex-shrink: 0 !important;
	display: block !important;
	box-sizing: border-box !important;
	width: 5.5rem !important;
	max-width: 5.5rem !important;
	min-width: 5.5rem !important;
	height: 3.5rem !important;
	max-height: 3.5rem !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	object-fit: contain !important;
	object-position: right center;
}

.mr-card__title {
	order: 1;
	flex: 1 1 0% !important;
	display: flex !important;
	align-items: center;
	min-width: 8rem;
	height: 3.5rem;
	margin: 0 !important;
	padding: 0 !important;
	font-family: inherit;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	color: inherit;
}

.mr-card__title span {
	min-width: 0;
	overflow-wrap: anywhere;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.mr-score--lead {
	order: 3;
	display: none !important;
}

.mr-card__fees {
	display: flex;
	flex-direction: column;
	gap: 0;
	width: 100%;
	margin-top: 1.75em;
}

.mr-fee {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 0.75em;
	height: 2.64em;
	border-top: 1px solid var(--mr-line);
}

.mr-fee__label {
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

.mr-fee__value {
	display: inline-flex;
	align-items: center;
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	font-size: 0.875rem;
	white-space: nowrap;
}

.mr-fee--hero .mr-fee__value {
	font-weight: 700;
}

.mr-card__foot {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	column-gap: 0.5em;
	row-gap: 0.9em;
	width: 100%;
	margin-top: 1.1em;
}

.mr-card__more-btn {
	grid-column: 1;
	grid-row: 2;
	display: flex;
	align-items: center;
	align-self: stretch;
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	padding: 0;
	border: 0 !important;
	border-radius: 0 !important;
	outline: none;
	background: none !important;
	background-color: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-decoration: none !important;
	color: inherit !important;
	cursor: pointer;
	text-align: left;
	line-height: 1;
	min-height: 0;
	justify-self: start;
}

.mr-card__more-btn:hover,
.mr-card__more-btn:focus,
.mr-card__more-btn:focus-visible,
.mr-card__more-btn:active {
	background: none !important;
	background-color: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	border: 0 !important;
	color: inherit !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	text-decoration: none !important;
}

.mr-card__foot .mr-score {
	grid-column: 2;
	grid-row: 2;
	margin: 0;
	flex: 0 0 auto;
	justify-self: end;
	align-self: stretch;
	display: flex;
	align-items: center;
}

.mr-card__foot:not(:has(.mr-card__more-btn)) .mr-score {
	grid-column: 2;
	grid-row: 2;
}

.mr-card .wp-block-button {
	grid-column: 1 / -1;
	grid-row: 1;
	justify-self: stretch;
	margin: 0;
	width: 100%;
}

.mr-card .wp-block-button__link {
	display: block;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
}

.mr-card__more-panel {
	grid-column: 1 / -1;
	grid-row: 3;
	width: 100%;
	padding-top: 0.9em;
	border-top: 1px solid var(--mr-line);
}

.mr-card__more-panel dl { margin: 0; display: grid; gap: 0.75em; }
.mr-card__more-panel dt {
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	margin-bottom: 0.15em;
}
.mr-card__more-panel dd {
	margin: 0;
	white-space: pre-line;
	font-size: 0.875rem;
	line-height: 1.5;
}

@container mr (min-width: 40em) {
	.mr-card {
		padding: 1.4em 1.35em 1.3em;
	}

	.mr-card__lead {
		height: 4.75rem;
		gap: 1.2em;
	}

	.mr-card img.mr-card__logo,
	.mr-block img.mr-card__logo,
	.mr-block.alignwide img.mr-card__logo,
	.mr-block.alignfull img.mr-card__logo {
		order: 1;
		flex: 0 0 8.5rem !important;
		flex-grow: 0 !important;
		flex-shrink: 0 !important;
		width: 8.5rem !important;
		max-width: 8.5rem !important;
		min-width: 8.5rem !important;
		height: 4.75rem !important;
		max-height: 4.75rem !important;
		object-position: left center;
	}

	.mr-card__title {
		order: 2;
		height: 4.75rem;
		font-size: 1.125rem;
	}

	.mr-score.mr-score--lead {
		display: flex !important;
		position: relative;
		order: 3;
		flex: 0 0 auto;
		align-items: center;
		align-self: center;
		margin: 0;
		padding: 0;
		font-size: 1rem;
		line-height: 1;
		gap: 0.3em;
		height: 1rem;
		overflow: visible;
	}

	.mr-score--lead .mr-score__star {
		width: 1rem;
		height: 1rem;
	}

	.mr-score--lead strong {
		display: inline;
		font-size: 0.875rem;
		font-weight: 700;
		font-variant-numeric: tabular-nums;
		line-height: 1;
	}

	.mr-score--lead .mr-score__label {
		position: absolute;
		top: 100%;
		right: 0;
		left: auto;
		order: 0;
		margin: 0.12em 0 0;
		font-size: 0.75rem;
		font-weight: 400;
		line-height: 1;
		pointer-events: none;
	}

	.mr-card.is-tile .mr-card__lead {
		height: 3.5rem;
	}

	.mr-card.is-tile img.mr-card__logo,
	.mr-block .mr-card.is-tile img.mr-card__logo {
		order: 2;
		flex: 0 0 5.5rem !important;
		flex-grow: 0 !important;
		flex-shrink: 0 !important;
		width: 5.5rem !important;
		max-width: 5.5rem !important;
		min-width: 5.5rem !important;
		height: 3.5rem !important;
		max-height: 3.5rem !important;
		object-position: right center;
	}

	.mr-card.is-tile .mr-card__title {
		order: 1;
		height: 3.5rem;
		font-size: 1rem;
	}

	.mr-card.is-tile .mr-score--lead {
		display: none !important;
	}

	.mr-score--foot {
		display: none !important;
	}

	.mr-card__fees {
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 0.9em 1.1em;
		margin-top: 0.9em;
		padding-top: 0.9em;
		border-top: 1px solid var(--mr-line);
	}

	.mr-card__fees .mr-fee {
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		height: auto;
		border: 0;
		gap: 0.2em;
	}

	.mr-card__foot {
		grid-template-columns: 1fr auto;
		margin-top: 0.9em;
		padding-top: 0.9em;
		border-top: 1px solid var(--mr-line);
		row-gap: 0.75em;
	}

	.mr-card__more-btn {
		grid-column: 1;
		grid-row: 1;
	}

	.mr-card .wp-block-button {
		grid-column: 2;
		grid-row: 1;
		justify-self: end;
		width: auto;
	}

	.mr-card .wp-block-button__link {
		display: inline-block;
		width: auto;
	}

	.mr-card__more-panel {
		grid-row: 2;
	}
}

.mr-tip {
	position: relative;
	display: inline-block;
	width: 0;
	height: 1em;
	overflow: visible;
	vertical-align: top;
}

.mr-tip__btn {
	position: absolute;
	left: 0.18em;
	top: 50%;
	translate: 0 -50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 0.71rem;
	height: 0.71rem;
	padding: 0;
	font-family: inherit;
	font-size: 8px;
	font-weight: 700;
	line-height: 1;
	border-radius: 999px;
	border: 1px solid var(--mr-line);
	background: transparent;
	color: inherit;
	opacity: 0.65;
}

.mr-tip__btn:hover,
.mr-tip.is-open .mr-tip__btn { opacity: 1; }

.mr-tip__bubble {
	display: none;
	position: fixed;
	z-index: 10000;
	width: min(18rem, calc(100vw - 1.5rem));
	padding: 0.7em 0.8em;
	font-size: 0.8125rem;
	font-weight: 400;
	line-height: 1.45;
	text-align: left;
	white-space: pre-line;
	color: var(--wp--preset--color--contrast, CanvasText);
	background: var(--wp--preset--color--base, Canvas);
	border: 1px solid var(--mr-line);
	box-shadow: 0 0.6em 1.6em color-mix(in srgb, currentColor 16%, Canvas);
}

.mr-tip.is-open .mr-tip__bubble,
.mr-tip__bubble.is-open { display: block; }

.mr-cta.wp-block-button { margin: 0; }

/* ——— lista ——— */
.mr-list {
	container-type: inline-size;
	container-name: mr-list;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	margin: 1.25em 0;
	padding: 0;
	font-size: 0.875rem;
	border-width: 0;
}

.mr-list__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 5.5rem;
	grid-template-areas:
		"who logo"
		"premia premia"
		"cta cta";
	column-gap: 0.9em;
	row-gap: 0;
	align-items: center;
	padding: 1.25em 1.15em 1.2em;
	background: transparent;
	border: 1px solid var(--mr-line);
}

.mr-list__rank {
	display: none;
	grid-area: rank;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	opacity: 0.35;
	text-align: center;
}

.mr-list__mark {
	grid-area: logo;
	width: 5.5rem;
	height: 3.5rem;
	display: grid;
	place-items: center;
}

.mr-list__mark img,
.mr-block.alignwide .mr-list__mark img,
.mr-block.alignfull .mr-list__mark img {
	width: auto !important;
	height: auto !important;
	max-width: 5.5rem !important;
	max-height: 3.5rem !important;
	object-fit: contain !important;
	object-position: right center;
}

.mr-list__who {
	grid-area: who;
	min-width: 0;
	display: flex;
	align-items: center;
	height: 3.5rem;
}
.mr-list__who strong {
	min-width: 0;
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.2;
	overflow-wrap: anywhere;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
.mr-list__who span {
	display: block;
	font-size: 0.875rem;
	opacity: 0.6;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mr-list__num {
	grid-area: premia;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 0.75em;
	height: 2.4em;
	margin-top: 1.75em;
	border-top: 1px solid var(--mr-line);
}

.mr-list__num em {
	font-style: normal;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	font-size: 0.875rem;
	white-space: nowrap;
}

.mr-list__num span {
	order: -1;
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

.mr-list .mr-cta {
	grid-area: cta;
	width: 100%;
	margin: 1.1em 0 0;
}

.mr-list .wp-block-button__link {
	display: block;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
}

@container mr-list (min-width: 40em) {
	.mr-list {
		display: block;
		gap: 0;
		border-top: 1px solid var(--mr-line);
	}
	.mr-list__row {
		grid-template-columns: 1.5em 4.75rem minmax(0, 1fr) 5.5rem auto;
		grid-template-areas: "rank logo who premia cta";
		column-gap: 0.7em;
		row-gap: 0;
		padding: 1.5em 0;
		border: 0;
		border-bottom: 1px solid var(--mr-line);
	}
	.mr-list__rank { display: block; }
	.mr-list__mark {
		width: 4.75rem;
		height: 2.5rem;
	}
	.mr-list__mark img {
		max-width: 4.5rem !important;
		max-height: 2.4rem !important;
		object-position: center;
	}
	.mr-list__who {
		display: block;
		height: auto;
	}
	.mr-list__who strong {
		font-size: inherit;
		line-height: 1.3;
		display: block;
		-webkit-line-clamp: unset;
		overflow: visible;
	}
	.mr-list__num {
		display: grid;
		justify-items: end;
		height: auto;
		margin-top: 0;
		border-top: 0;
		gap: 0.05em;
	}
	.mr-list__num em { font-weight: 400; }
	.mr-list__num span { order: 0; }
	.mr-list .mr-cta {
		width: auto;
		margin: 0;
	}
	.mr-list .wp-block-button__link {
		display: inline-block;
		width: auto;
	}
}

/* ——— tabela ——— */
.mr-table-wrap {
	width: 100%;
	overflow-x: auto;
	margin: 1.25em 0;
	border: 1px solid var(--mr-line);
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.mr-table-wrap::-webkit-scrollbar { display: none; }

.mr-table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	font-family: inherit;
	font-size: 0.875rem;
	color: inherit;
	background: transparent;
}

.mr-table th,
.mr-table td {
	padding: 0.924em 0.9em;
	text-align: left;
	vertical-align: middle;
	border: 0;
	border-bottom: 1px solid var(--mr-line);
	background: transparent;
	white-space: nowrap;
	font-family: inherit;
}

.mr-table thead th:first-child,
.mr-table tbody th {
	width: auto;
	white-space: nowrap;
	min-width: 16rem;
}

.mr-table tbody th {
	font-weight: 700;
}

.mr-table thead th:not(:first-child),
.mr-table td {
	width: 1%;
	white-space: nowrap;
}

.mr-table tbody tr:last-child th,
.mr-table tbody tr:last-child td { border-bottom: 0; }

.mr-table thead th {
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

.mr-table td {
	font-weight: 400;
	font-size: 0.875rem;
	font-variant-numeric: tabular-nums;
}

.mr-table__link {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
	white-space: nowrap;
}

/* ——— ocena ——— */
.mr-score {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: nowrap;
	gap: 0.35em;
	margin: 0;
	font-size: 0.875rem;
}
.mr-score__label {
	order: -1;
	font-size: 0.75rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	opacity: 0.55;
	white-space: nowrap;
	line-height: 1;
}
.mr-score__stars { display: inline-flex; gap: 0.04em; }
.mr-score__star {
	position: relative;
	display: inline-grid;
	width: 1em;
	height: 1em;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
}
.mr-score__star svg {
	width: 1em;
	height: 1em;
	display: block;
	fill: color-mix(in srgb, currentColor 20%, Canvas);
}
.mr-score__star.is-full svg,
.mr-score__star.is-partial svg:last-child { fill: currentColor; }
.mr-score__star.is-partial svg:last-child {
	position: absolute;
	inset: 0;
	clip-path: inset(0 calc(100% - var(--fill, 50%)) 0 0);
}
.mr-score strong {
	font-size: 0.875rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1;
}

/* ——— slider: zawsze pionowa karta ——— */
.mr-slider {
	margin: 1.25em 0;
}
.mr-slider__track {
	display: flex;
	align-items: flex-start;
	gap: 0.85rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 1px;
}
.mr-slider__track::-webkit-scrollbar { display: none; }
.mr-slider__slide {
	flex: 0 0 min(20rem, 100%);
	scroll-snap-align: start;
	min-width: 0;
	display: flex;
}
.mr-slider .mr-unit {
	margin: 0;
	width: 100%;
	display: flex;
}
.mr-slider .mr-card {
	flex: 1 1 auto;
	width: 100%;
}
.mr-slider .mr-score--lead {
	display: none !important;
}
.mr-slider .mr-score--foot {
	display: flex !important;
}

/* Jedna kreska: zawsze --mr-line (kolor obramowania motywu albo mix 18%).
   !important, żeby motyw nie malował tabel swoim --cs-color-contrast. */
.mr-card,
.mr-fee,
.mr-card__fees,
.mr-card__foot,
.mr-card__more-panel,
.mr-list,
.mr-list__row,
.mr-list__num,
.mr-table-wrap,
.mr-table th,
.mr-table td,
.mr-tip__btn,
.mr-tip__bubble {
	border-color: var(--mr-line) !important;
}
