/* Pasek zaufania pod karta widgetu - czesc wspolna stylow 1-5 (30.10, design-system presety-spec.md 6a; wartosci 1:1
   z proces-makiet/scripts/presety/tb/gen_tb*.py). Markup: public/partials/trust-badges.php (po </form>, poza Vue).
   Ladowany tylko przy tb > 0 razem z look/tb-<n>.css (CurdeWidgetLook::style_files). */
.vw-tb {
	--r-card: 8px;
	--r-tile: 8px;
	box-sizing: border-box;
	width: 100%;
	color: #303435;
}
.vw-tb.vw-p-sh-r4 { --r-card: 4px; --r-tile: 4px; }
.vw-tb.vw-p-sh-r12 { --r-card: 12px; --r-tile: 12px; }
.vw-tb.vw-p-sh-r16 { --r-card: 16px; --r-tile: 16px; }
.vw-tb.vw-p-sh-pill { --r-card: 20px; --r-tile: 16px; }
.vw-tb *,
.vw-tb *::before,
.vw-tb *::after {
	box-sizing: border-box;
}
.vw-tb p,
.vw-tb ul,
.vw-tb li {
	margin: 0;
	padding: 0;
}
.vw-tb svg {
	display: block;
	flex: none;
}

/* Rzad logotypow (role=img + aria-label z lista metod) */
.vw-tb__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 5px;
}
.vw-tb__l {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
}
.vw-tb__l--bank {
	gap: 4px;
}
.vw-tb__w {
	font-size: 11px;
	line-height: 14px;
	font-weight: 500;
	color: #303435;
	white-space: nowrap;
}

/* Kafelki 28 (TB-3, TB-2b) i male 24 (TB-1b, logo x 0,86) */
.vw-tb__row--tile .vw-tb__l,
.vw-tb__row--small .vw-tb__l {
	min-width: 42px;
	height: 28px;
	padding: 0 5px;
	border: 1px solid #EDEDED;
	border-radius: min(var(--r-tile), 6px);
	background: #fff;
}
.vw-tb__row--small {
	flex-wrap: nowrap;
	gap: 4px;
}
.vw-tb__row--small .vw-tb__l {
	min-width: 34px;
	height: 24px;
	padding: 0 4px;
}
.vw-tb__row--small .vw-tb__l--blik svg { width: 26px; height: 12.04px; }
.vw-tb__row--small .vw-tb__l--bank svg { width: 12.04px; height: 12.04px; }
.vw-tb__row--small .vw-tb__l--visa svg { width: 26.66px; height: 8.6px; }
.vw-tb__row--small .vw-tb__l--mc svg { width: 19.6px; height: 12.04px; }
.vw-tb__row--small .vw-tb__l--apple svg { width: 26.9px; height: 11.18px; }
.vw-tb__row--small .vw-tb__l--google svg { width: 28.3px; height: 11.18px; }

/* Szare logotypy bez kafelkow (TB-4, TB-5): kolor po najechaniu tylko na komputerze */
.vw-tb__row--mono {
	gap: 16px;
}
.vw-tb__row--mono svg {
	filter: grayscale(1);
	opacity: .5;
	transition: filter .2s cubic-bezier(.2, 0, 0, 1), opacity .2s cubic-bezier(.2, 0, 0, 1);
}
.vw-tb__row--mono .vw-tb__l--blik svg { width: 25.85px; height: 12px; }
.vw-tb__row--mono .vw-tb__l--mc svg { width: 19.54px; height: 12px; }
.vw-tb__row--mono .vw-tb__l--bank svg { width: 13px; height: 13px; }
@media (hover: hover) and (min-width: 768px) {
	.vw-tb__row--mono:hover svg {
		filter: none;
		opacity: 1;
	}
}
@media (prefers-reduced-motion: reduce) {
	.vw-tb__row--mono svg {
		transition: none;
	}
}

/* Kopia logotypow wstawiana przez motyw polskielajki (JS z <template id="plh-pay-tpl"> za .btn-atc) - pasek ja zastepuje. */
.btn-atc + .plh-pay {
	display: none !important;
}