/**
 * CT Live — Subscribe strip ([ctlive_subscribe]).
 *
 * A dark YouTube-style channel unit: avatar + name + live subscriber count +
 * a red Subscribe pill. Sizes are in px/em on purpose: Leadville's root is
 * 10px, so rem would mislead. Font is inherited from the page (no AI-tiny
 * defaults). Fixed dark colors (not the shared --ltf-ct-* theme vars) — this
 * strip models YouTube's own subscribe unit, not the leaderboard palette.
 */

.ltf-ct-sub {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px 14px;
	flex-wrap: wrap;
	padding: 9px 14px;
	background: #231f20;
	border-radius: 10px;
	font-family: inherit;
	box-sizing: border-box;
}

.ltf-ct-sub *,
.ltf-ct-sub *::before,
.ltf-ct-sub *::after {
	box-sizing: border-box;
}

/* Attaches beneath a gold section bar (page content, not this module's): square
   top corners, rounded bottom. */
.ltf-ct-sub--attached {
	border-radius: 0 0 10px 10px;
}

.ltf-ct-sub__id {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.ltf-ct-sub__avatar {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #fff;
	flex: 0 0 auto;
}

.ltf-ct-sub__meta {
	line-height: 1.15;
	min-width: 0;
}

.ltf-ct-sub__name {
	display: block;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: #fff;
}

.ltf-ct-sub__count {
	display: block;
	font-size: 11px;
	font-weight: 600;
	color: #bdbdbd;
	margin-top: 2px;
}

.ltf-ct-sub__pill {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 18px;
	background: #f00;
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 999px;
	white-space: nowrap;
}

.ltf-ct-sub__pill:hover,
.ltf-ct-sub__pill:focus {
	background: #c00;
	color: #fff;
}

.ltf-ct-sub__tri {
	font-size: 9px;
	line-height: 1;
}

@media ( max-width: 480px ) {
	.ltf-ct-sub__pill {
		padding: 8px 15px;
	}

	.ltf-ct-sub__name {
		font-size: 12px;
	}
}