/**
 * Seat-assignment accordion on the checkout page.
 *
 * Renders one collapsible <details> section per team-tier line item, with N
 * input rows per tier matching the cart quantity.
 */

.caeps-seat-assignment {
	margin: 0 0 32px;
	padding: 24px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
}

.caeps-seat-assignment__heading {
	margin: 0 0 16px;
	padding: 0 0 12px;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-bottom: 1px solid #e5e5e5;
}

/* ── Tier accordion ─────────────────────────────────────────────────────── */

.caeps-seat-tier {
	margin: 0 0 16px;
	padding: 0;
	background: #fff;
	border: 1px solid #e5e5e5;
	border-radius: 4px;
}

.caeps-seat-tier:last-of-type {
	margin-bottom: 0;
}

.caeps-seat-tier__summary {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px;
	padding: 14px 16px;
	cursor: pointer;
	font-weight: 600;
	list-style: none;
	user-select: none;
}

.caeps-seat-tier__summary::-webkit-details-marker {
	display: none;
}

.caeps-seat-tier__summary::before {
	content: "▸";
	display: inline-block;
	margin-right: 6px;
	font-size: 12px;
	transition: transform 0.15s ease;
}

.caeps-seat-tier[open] > .caeps-seat-tier__summary::before {
	transform: rotate(90deg);
}

.caeps-seat-tier__name {
	font-size: 16px;
}

.caeps-seat-tier__count {
	font-size: 13px;
	font-weight: 400;
	color: #666;
}

/* ── Bulk-fill controls (per accordion) ─────────────────────────────────── */

.caeps-seat-tier__bulk {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 12px 16px 20px;
	padding: 14px 16px;
	background: #f5f7fa;
	border: 1px solid #e3e7ec;
	border-radius: 6px;
}

.caeps-seat-tier__bulk-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 1 1 auto;
	min-width: 200px;
}

.caeps-seat-tier__bulk-title {
	font-size: 14px;
	font-weight: 600;
	color: #1f2937;
}

.caeps-seat-tier__bulk-subtitle {
	font-size: 12px;
	color: #6b7280;
}

.caeps-seat-tier__bulk-actions {
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 0 0 auto;
}

.caeps-seat-tier__template {
	font-size: 13px;
	color: #2271b1;
	text-decoration: underline;
	white-space: nowrap;
}

.caeps-seat-tier__template:hover {
	color: #135e96;
}

.caeps-seat-tier__upload {
	display: inline-block;
}

.caeps-seat-tier__upload-input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	overflow: hidden;
}

/* Keep the hidden file input really 1px and inside its label.
   Impreza's `input:not([type="submit"]) { width: 100% }` outranks the
   single class above, so the input was as wide as the page section and,
   positioned from the Upload CSV button, ran far past the right edge of
   the screen. On phones and tablets that made the whole page scroll
   sideways and look zoomed in / cut off. */
.caeps-seat-tier__upload {
	position: relative;
}

.caeps-seat-tier__upload .caeps-seat-tier__upload-input {
	top: 0;
	left: 0;
	width: 1px;
	height: 1px;
	padding: 0;
	border: 0;
	clip-path: inset(50%);
}

.caeps-seat-tier__upload-button {
	display: inline-block;
	padding: 7px 16px;
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	background: #2271b1;
	border: 1px solid #2271b1;
	border-radius: 3px;
	cursor: pointer;
	transition: background 0.12s ease;
	white-space: nowrap;
}

.caeps-seat-tier__upload:hover .caeps-seat-tier__upload-button,
.caeps-seat-tier__upload-input:focus + .caeps-seat-tier__upload-button {
	background: #135e96;
	border-color: #135e96;
}

.caeps-seat-tier__bulk-result {
	flex: 1 1 100%;
	margin: 4px 0 0;
	padding: 8px 12px;
	font-size: 13px;
	line-height: 1.5;
	border-radius: 3px;
}

.caeps-seat-tier__bulk-result--success {
	background: #dcfce7;
	border: 1px solid #86efac;
	color: #166534;
}

.caeps-seat-tier__bulk-result--info {
	background: #e0f2fe;
	border: 1px solid #bae6fd;
	color: #075985;
}

.caeps-seat-tier__bulk-result--error {
	background: #fef2f2;
	border: 1px solid #fecaca;
	color: #7f1d1d;
}

.caeps-seat-tier__bulk-result--warning {
	background: #fff7ed;
	border: 1px solid #fed7aa;
	color: #7c2d12;
}

.caeps-seat-tier__bulk-overage-warning {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 8px 0 0;
	padding: 8px 12px;
	background: #fef3c7;
	border-left: 4px solid #d97706;
	border-radius: 3px;
	font-weight: 600;
	color: #78350f;
}

.caeps-seat-tier__bulk-overage-warning::before {
	content: "⚠";
	font-size: 16px;
}

.caeps-seat-tier__bulk-overage-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 8px 0 0;
}

.caeps-seat-tier__bulk-overage-btn {
	display: inline-block;
	padding: 6px 12px;
	font-size: 12px;
	font-weight: 600;
	color: #2271b1;
	background: #fff;
	border: 1px solid #2271b1;
	border-radius: 3px;
	cursor: pointer;
	transition: background 0.12s ease;
}

.caeps-seat-tier__bulk-overage-btn:hover,
.caeps-seat-tier__bulk-overage-btn:focus {
	background: #f0f6fc;
}

.caeps-seat-tier__bulk-overage-btn--primary {
	color: #fff;
	background: #2271b1;
}

.caeps-seat-tier__bulk-overage-btn--primary:hover,
.caeps-seat-tier__bulk-overage-btn--primary:focus {
	background: #135e96;
}

.caeps-seat-tier__bulk-overage-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* ── Row layout ─────────────────────────────────────────────────────────── */

.caeps-seat-tier__rows {
	padding: 0 16px 8px;
	border-top: 1px solid #f0f0f0;
}

.caeps-seat-row {
	display: grid;
	grid-template-columns: 80px 1fr auto;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #f5f5f5;
}

.caeps-seat-row__remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	font-size: 18px;
	line-height: 1;
	color: #6b7280;
	background: transparent;
	border: 1px solid #d1d5db;
	border-radius: 50%;
	cursor: pointer;
	transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}

.caeps-seat-row__remove:hover,
.caeps-seat-row__remove:focus {
	color: #d63638;
	border-color: #d63638;
	background: #fef2f2;
	outline: 0;
}

.caeps-seat-row__remove:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.caeps-seat-row:last-child {
	border-bottom: 0;
}

.caeps-seat-row__label {
	font-size: 13px;
	font-weight: 600;
	color: #555;
}

.caeps-seat-row__fields {
	display: grid;
	grid-template-columns: 1fr 1fr 1.4fr;
	gap: 8px;
}

.caeps-seat-row__field {
	display: block;
	margin: 0;
}

.caeps-seat-row__field input {
	width: 100%;
	padding: 8px 10px;
	font-size: 14px;
	line-height: 1.4;
	border: 1px solid #ccc;
	border-radius: 3px;
	background: #fff;
	box-sizing: border-box;
}

.caeps-seat-row__field input:focus {
	border-color: #2271b1;
	outline: 2px solid rgba( 34, 113, 177, 0.25 );
	outline-offset: 0;
}

.caeps-seat-row.is-error .caeps-seat-row__field input {
	border-color: #d63638;
	background: #fcf0f1;
}

/* ── Add seat button ────────────────────────────────────────────────────── */

.caeps-seat-tier__add {
	display: inline-block;
	margin: 8px 16px 16px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 500;
	color: #2271b1;
	background: transparent;
	border: 1px dashed #2271b1;
	border-radius: 3px;
	cursor: pointer;
	transition: background 0.12s ease;
}

.caeps-seat-tier__add:hover,
.caeps-seat-tier__add:focus {
	background: #f0f6fc;
	color: #135e96;
	border-style: solid;
	outline: 0;
}

/* ── Tip footer ─────────────────────────────────────────────────────────── */

.caeps-seat-assignment__tip {
	margin: 16px 0 18px;
	padding: 12px 14px;
	background: #fff8e5;
	border-left: 3px solid #f0b849;
	font-size: 13px;
	color: #5b4a1c;
	border-radius: 0 3px 3px 0;
}

.caeps-seat-assignment__notice {
	margin: 0 0 18px;
	padding: 12px 14px;
	background: #eff6ff;
	border-left: 3px solid #2271b1;
	font-size: 13px;
	color: #1e3a5f;
	line-height: 1.5;
	border-radius: 0 3px 3px 0;
}

.caeps-seat-assignment__notice strong {
	display: block;
	margin-bottom: 4px;
	color: #0b2c54;
}

/* ── Team roster (order-received / view-order) ──────────────────────────── */

.caeps-team-roster {
	margin: 28px 0;
	padding: 20px 24px;
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 6px;
}

.caeps-team-roster__heading {
	margin: 0 0 6px;
	font-size: 18px;
	font-weight: 600;
}

.caeps-team-roster__summary {
	margin: 0 0 16px;
	font-size: 14px;
	color: #555;
}

.caeps-team-roster__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.caeps-team-roster__table th,
.caeps-team-roster__table td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid #f0f0f0;
}

.caeps-team-roster__table th {
	font-weight: 600;
	color: #555;
	background: #fafafa;
	border-bottom: 1px solid #e3e3e3;
}

.caeps-team-roster__table tr:last-child td {
	border-bottom: 0;
}

.caeps-team-roster__status {
	display: inline-block;
	padding: 3px 8px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
	border-radius: 3px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.caeps-team-roster__status--caeps_inactive {
	background: #fef0c7;
	color: #6b4f0a;
}

.caeps-team-roster__status--pending {
	background: #e0f2fe;
	color: #075985;
}

.caeps-team-roster__status--active {
	background: #dcfce7;
	color: #166534;
}

.caeps-team-roster__status--paused,
.caeps-team-roster__status--expired,
.caeps-team-roster__status--cancelled,
.caeps-team-roster__status--unassigned {
	background: #f3f4f6;
	color: #6b7280;
}

.caeps-team-roster__hint {
	margin: 16px 0 0;
	font-size: 13px;
	color: #777;
	font-style: italic;
}

/* ── Members column breakdown on /my-account/teams/ ─────────────────────── */

.caeps-team-member-count__breakdown {
	display: inline-block;
	margin-top: 4px;
	font-size: 12px;
	color: #6b7280;
	line-height: 1.5;
}

/* ── Request CAEPS Assignment page ──────────────────────────────────────── */

.caeps-request-assignment {
	margin: 24px 0;
	padding: 24px;
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 6px;
	max-width: 600px;
}

.caeps-request-assignment__heading {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 600;
}

.caeps-request-assignment__intro {
	margin: 0 0 12px;
	font-size: 14px;
	color: #555;
	line-height: 1.5;
}

.caeps-request-assignment__capacity {
	margin: 0 0 20px;
	padding: 10px 14px;
	background: #f9fafb;
	border: 1px solid #e3e3e3;
	border-radius: 4px;
	font-size: 13px;
	color: #555;
}

.caeps-request-assignment__no-seats {
	padding: 16px;
	background: #fef3f2;
	border: 1px solid #fecaca;
	border-radius: 4px;
	color: #7f1d1d;
}

.caeps-request-assignment__no-seats p {
	margin: 0;
	font-size: 14px;
}

.caeps-request-assignment__form .form-row {
	margin: 0 0 16px;
}

.caeps-request-assignment__form label {
	display: block;
	margin: 0 0 4px;
	font-weight: 500;
	font-size: 14px;
	color: #374151;
}

.caeps-request-assignment__form .required {
	color: #d63638;
}

.caeps-request-assignment__form input[type="text"],
.caeps-request-assignment__form input[type="email"],
.caeps-request-assignment__form textarea {
	width: 100%;
	padding: 9px 12px;
	font-size: 14px;
	line-height: 1.4;
	border: 1px solid #d1d5db;
	border-radius: 4px;
	background: #fff;
	box-sizing: border-box;
}

.caeps-request-assignment__form input:focus,
.caeps-request-assignment__form textarea:focus {
	border-color: #2271b1;
	outline: 2px solid rgba( 34, 113, 177, 0.2 );
	outline-offset: 0;
}

.caeps-request-assignment__form textarea {
	resize: vertical;
	min-height: 70px;
}

.caeps-request-assignment__result {
	margin-top: 12px;
	padding: 10px 14px;
	border-radius: 4px;
	font-size: 14px;
}

.caeps-request-assignment__result--success {
	background: #dcfce7;
	border: 1px solid #86efac;
	color: #166534;
}

.caeps-request-assignment__result--error {
	background: #fef3f2;
	border: 1px solid #fecaca;
	color: #7f1d1d;
}

/* ── Settings page: seat capacity panel ─────────────────────────────────── */

.caeps-seat-capacity {
	margin: 16px 0 32px;
	padding: 20px 24px;
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 6px;
	max-width: 600px;
}

.caeps-seat-capacity__summary {
	margin: 0 0 12px;
	padding: 10px 14px;
	background: #f9fafb;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 500;
	color: #374151;
}

.caeps-seat-capacity__intro {
	margin: 0 0 16px;
	font-size: 14px;
	color: #555;
	line-height: 1.5;
}

.caeps-seat-capacity__cta {
	margin: 0;
}

.caeps-seat-capacity__no-product {
	margin: 0;
	padding: 12px 16px;
	background: #fef3f2;
	border: 1px solid #fecaca;
	border-radius: 4px;
	color: #7f1d1d;
	font-size: 14px;
}

/* ── Buy-more-seats CTA on the Add Member page ─────────────────────────── */

.caeps-buy-more-seats-cta {
	margin: 24px 0 0;
	padding: 18px 22px;
	background: #f5f7fa;
	border: 1px solid #e3e7ec;
	border-radius: 6px;
	max-width: 600px;
}

.caeps-buy-more-seats-cta__copy {
	margin: 0 0 14px;
	font-size: 14px;
	color: #374151;
	line-height: 1.5;
}

.caeps-buy-more-seats-cta__button {
	display: inline-block;
}

@media ( max-width: 640px ) {

	.caeps-team-roster {
		padding: 16px;
	}

	.caeps-team-roster__table {
		font-size: 13px;
	}

	.caeps-team-roster__table th,
	.caeps-team-roster__table td {
		padding: 8px 6px;
	}
}

/* ── Screen reader text ─────────────────────────────────────────────────── */

.caeps-seat-row .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	border: 0;
}

/* ── Responsive: stack fields below 600px ───────────────────────────────── */

@media ( max-width: 600px ) {

	.caeps-seat-assignment {
		padding: 16px;
	}

	.caeps-seat-row {
		grid-template-columns: 1fr auto;
		gap: 6px;
	}

	.caeps-seat-row__remove {
		grid-row: 1;
		grid-column: 2;
	}

	.caeps-seat-row__label {
		font-size: 12px;
	}

	.caeps-seat-row__fields {
		grid-template-columns: 1fr;
		gap: 8px;
	}
}

/* ── Team owner Add Members form (mirrors the checkout accordion) ───────── */

.caeps-add-members {
	margin: 0 0 24px;
	padding: 20px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
}

.caeps-add-members .caeps-seat-tier__bulk {
	margin: 0 0 16px;
}

.caeps-add-members__rows {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0 0 12px;
}

.caeps-add-members .caeps-seat-tier__add {
	margin: 0 0 16px;
}

.caeps-add-members__submit-wrap {
	margin: 8px 0 0;
	padding-top: 16px;
	border-top: 1px solid #e5e5e5;
}

.caeps-add-members__feedback {
	display: none;
	margin: 0 0 12px;
	padding: 10px 14px;
	font-size: 13px;
	line-height: 1.5;
	border-radius: 4px;
}

.caeps-add-members__feedback--success,
.caeps-add-members__feedback--warning,
.caeps-add-members__feedback--error {
	display: block;
}

.caeps-add-members__feedback--success {
	background: #dcfce7;
	border: 1px solid #86efac;
	color: #166534;
}

.caeps-add-members__feedback--warning {
	background: #fef3c7;
	border: 1px solid #fcd34d;
	color: #78350f;
}

.caeps-add-members__feedback--error {
	background: #fef2f2;
	border: 1px solid #fecaca;
	color: #7f1d1d;
}

.caeps-add-members__errors {
	margin: 6px 0 0 20px;
	padding: 0;
	font-size: 12px;
}

.caeps-add-members__feedback--info {
	background: #e0f2fe;
	border: 1px solid #bae6fd;
	color: #075985;
	display: block;
}

.caeps-add-members .caeps-seat-tier__add.is-disabled,
.caeps-add-members .caeps-seat-tier__add:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
}

.caeps-add-members__tier {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #6b7280;
}

.caeps-add-members__tier strong,
.caeps-add-members__tier a {
	display: block;
	margin-top: 4px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: normal;
	text-transform: none;
	color: #1f2937;
}

.caeps-add-members__tier a {
	color: #2271b1;
	text-decoration: none;
}

.caeps-add-members__tier a:hover {
	text-decoration: underline;
}

.caeps-add-members__buy-more {
	display: inline-block;
	margin-left: 6px;
	font-weight: 600;
	text-decoration: underline;
}

/* ── "Assign seats" button on the block cart (above Proceed to Checkout) ── */
.caeps-cart-assign {
	margin: 0 0 12px;
}

.caeps-cart-assign__btn,
.caeps-cart-assign__btn:visited {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	box-sizing: border-box;
	padding: 14px 20px;
	text-align: center;
	background: #66bb6a;
	color: #0f3d1f;
	font-weight: 600;
	line-height: 1.3;
	border-radius: 6px;
	text-decoration: none;
	transition: background 0.15s ease;
}

.caeps-cart-assign__btn:hover,
.caeps-cart-assign__btn:focus {
	background: #a5d6a7;
	color: #101e30;
	text-decoration: none;
}

.caeps-cart-assign__icon {
	flex: 0 0 auto;
	display: inline-block;
}

/* ── Standalone "Assign Group Seats" page ── */
.caeps-assign-page {
	max-width: 900px;
	margin: 0 auto;
}

.caeps-assign-page__actions {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
	flex-wrap: wrap;
}

.caeps-assign-page__continue {
	margin-left: auto;
}

@media (max-width: 560px) {
	.caeps-assign-page__actions {
		flex-direction: column-reverse;
		align-items: stretch;
	}
	.caeps-assign-page__continue {
		margin-left: 0;
	}
}
