/**
 * WS Form Choice Limits — Frontend Styles
 *
 * Styles for:
 *   .wsf-cl-wording        — "X spots remaining" span appended to choice labels
 *   .wsf-cl-full           — row wrapper when a choice is fully booked (remaining = 0)
 *   .wsf-cl-qty-exceeded   — row wrapper when quantity entered exceeds remaining capacity
 */

/* ── Wording span ─────────────────────────────────────────────── */

.wsf-cl-wording {
	font-size: 0.85em;
	margin-left: 0.4em;
	opacity: 0.75;
	font-weight: normal;
}

/* ── Fully-booked row ─────────────────────────────────────────── */

[data-row-radio].wsf-cl-full,
[data-row-checkbox].wsf-cl-full,
li.wsf-cl-full {
	opacity: 0.55;
}

[data-row-radio].wsf-cl-full label,
[data-row-checkbox].wsf-cl-full label,
li.wsf-cl-full label {
	cursor: not-allowed;
}

[data-row-radio].wsf-cl-full .wsf-cl-wording,
[data-row-checkbox].wsf-cl-full .wsf-cl-wording,
li.wsf-cl-full .wsf-cl-wording {
	color: #c0392b;
	opacity: 1;
	font-weight: 600;
}

/* ── Quantity-exceeded row (not full, but qty > remaining) ─────── */

[data-row-radio].wsf-cl-qty-exceeded,
[data-row-checkbox].wsf-cl-qty-exceeded,
li.wsf-cl-qty-exceeded {
	opacity: 0.6;
}

[data-row-radio].wsf-cl-qty-exceeded label,
[data-row-checkbox].wsf-cl-qty-exceeded label,
li.wsf-cl-qty-exceeded label {
	cursor: not-allowed;
}

[data-row-radio].wsf-cl-qty-exceeded .wsf-cl-wording,
[data-row-checkbox].wsf-cl-qty-exceeded .wsf-cl-wording,
li.wsf-cl-qty-exceeded .wsf-cl-wording {
	color: #d97706;
	opacity: 1;
}

/* ── Disabled select options ──────────────────────────────────── */

select option.wsf-cl-full {
	color: #9ca3af;
	font-style: italic;
}

/* ── Inline quantity warning banner ───────────────────────────── */
/*
 * Shown when the entered quantity exceeds remaining capacity for the
 * currently selected time slot. Hidden by default; .wsf-cl-qty-warning--visible
 * is toggled by frontend.js in real time.
 */

.wsf-cl-qty-warning {
	display: none;
	background: #fef2f2;
	border-left: 3px solid #dc2626;
	color: #991b1b;
	padding: 10px 14px;
	margin: 8px 0 4px;
	font-size: 0.9em;
	line-height: 1.4;
}

.wsf-cl-qty-warning.wsf-cl-qty-warning--visible {
	display: block;
}

/* ── Sold-out message (replaces entire form) ─────────────── */

.wsf-cl-sold-out {
	padding: 24px;
	text-align: center;
	font-size: 1em;
	color: #666;
	background: #fafafa;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	line-height: 1.5;
}