/* BP Sports widgets. Only structure lives here: colour, size and spacing come from the
   Elementor controls so the client can change them from the panel. */

/* Marquee ---------------------------------------------------------------- */
.bpw-marquee {
	overflow: hidden;
}

.bpw-marquee-track {
	display: flex;
	white-space: nowrap;
	width: max-content;
	animation: bpw-slide 32s linear infinite;
}

.bpw-marquee.is-reverse .bpw-marquee-track {
	animation-direction: reverse;
}

.bpw-marquee-group {
	display: flex;
	align-items: center;
	gap: 64px;
}

/* the group's gap does the spacing; the item only has to carry its trailing dot */
.bpw-marquee-item {
	display: flex;
	align-items: center;
	gap: inherit;
	line-height: 1;
}

.bpw-marquee-item::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	flex: none;
}

@keyframes bpw-slide {
	to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.bpw-marquee-track { animation: none; }
}

/* the editor renders the widget inside a narrow preview: keep it from forcing scroll */
.elementor-editor-active .bpw-marquee { max-width: 100%; }

/* Ghost text ------------------------------------------------------------- */
.bpw-ghost {
	font-family: inherit;
	line-height: .8;
	white-space: nowrap;
	pointer-events: none;
	user-select: none;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.bpw-ghost--left   { text-align: left; }
.bpw-ghost--center { text-align: center; }
.bpw-ghost--right  { text-align: right; }

/* Definition rows -------------------------------------------------------- */
.bpw-rows {
	border-top: 1px solid rgba(255, 255, 255, .1);
	margin: 0;
	column-gap: 60px;
}

.bpw-rows-row {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 22px;
	align-items: baseline;
	padding-block: 20px;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	break-inside: avoid;
}

.bpw-rows.is-terms-only .bpw-rows-row {
	grid-template-columns: 1fr;
}

.bpw-rows-term {
	margin: 0;
	min-width: 0;
}

.bpw-rows-desc {
	margin: 0;
}

@media (max-width: 767px) {
	.bpw-rows { columns: 1 !important; }
	.bpw-rows-row { grid-template-columns: 1fr !important; gap: 8px; }
}