/**
 * Info: štítok repasu, H1, logo značky, krátky popis.
 * Podľa React Default šablóny (Heading 3xl/800, fontSize base 2.2rem / sm 2.6rem / md 3.6rem, lineHeight 1.25).
 */
.wa-pa__refurbished {
	color: var(--wa-pa-muted);
}

.wa-pa__title {
	margin: 0;
	padding: 0;
	font-family: var(--wa-pa-font-heading);
	font-size: 2.2rem;
	font-weight: 800;
	line-height: 1.25;
	color: var(--wa-pa-gray-900);
	letter-spacing: normal;
	text-transform: none;
}

.wa-pa__title-dot {
	color: var(--wa-pa-pink-500);
}

@media (min-width: 480px) {
	.wa-pa__title {
		font-size: 2.6rem;
	}
}

@media (min-width: 768px) {
	.wa-pa__title {
		font-size: 3.6rem;
	}
}

.wa-pa__brand {
	display: block;
	margin-top: 1.2rem;
	width: auto;
	height: 3.2rem;
}

.wa-pa__desc {
	position: relative;
	margin-top: 1.2rem;
	color: var(--wa-pa-gray-900);
}

/* Ako React (sx p.mt 0): spodný okraj odseku ostáva (globálne štýly webu), pri krátkom popise sa zlúči s okrajom ďalšieho bloku */
.wa-pa__desc-text p {
	margin-top: 0;
}

/* Dlhý popis: zbalený na 7,5rem s prechodom do bielej (Chakra Collapse startingHeight) */
.wa-pa__desc--long .wa-pa__desc-collapse {
	height: 7.5rem;
	overflow: hidden;
	transition: height 200ms ease-out;
}

.wa-pa__desc--long::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2.4rem;
	opacity: 1;
	pointer-events: none;
	transition: opacity 300ms ease-in-out;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.25) -200%, #FFFFFF 75%);
}

.wa-pa__desc--long.is-expanded::after {
	opacity: 0;
}

.wa-pa__desc-toggle {
	display: inline-flex;
	align-items: center;
	margin: 1rem 0 0;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-size: 1.4rem;
	font-weight: 400;
	line-height: normal;
	color: var(--primary);
	text-decoration: underline;
	cursor: pointer;
}

.wa-pa__desc-toggle:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.wa-pa__desc--long .wa-pa__desc-collapse,
	.wa-pa__desc--long::after {
		transition: none;
	}
}
