/* <pc-webinar-occupancy>: person icons + "count/max" (+guests).
   The .pcx_load icon block was moved here from redesign.css; the legacy landing
   pages and the admin session grid still use it directly. */

.rd-webinar-occupancy {
	display: inline-flex;
	align-items: center;
	gap: var(--rd-spacing-x-sm);
	white-space: nowrap;
}

.rd-webinar-occupancy__label {
	font-size: var(--rd-fontsize-4);
	font-weight: 600;
	color: var(--rd-gray-500);
}

.rd-webinar-occupancy.is-full .rd-webinar-occupancy__label {
	color: var(--rd-primary-active);
}

.rd-webinar-occupancy__guests {
	font-size: var(--rd-fontsize-4);
	color: var(--rd-secondary-active);
	text-decoration: none;
}

.rd-webinar-occupancy__guests:hover {
	text-decoration: underline;
}

.pcx_load {
	display: inline-block;
	width: 44px;
	margin-left: 5.7px;
	white-space: nowrap;
}

.pcx_load>span {
	display: inline-block;
	width: 13px;
	height: 18px;
	background-image: url(/src/img/svg/af/person_gray.svg);
	background-position: center;
	background-repeat: no-repeat;
}

.pcx_load[data-load="1"]>span.u1,
.pcx_load[data-load="2"]>span.u1,
.pcx_load[data-load="3"]>span.u1,
.pcx_load[data-load="2"]>span.u2,
.pcx_load[data-load="3"]>span.u2,
.pcx_load[data-load="3"]>span.u3 {
	background-image: url(/src/img/svg/af/person_pink.svg);
}
