/* =====================================================================
 * Basket Ticket Tracker — Floating panel
 * ===================================================================== */

/* ── Toggle button (floating) ── */
.c2w-bt-toggle {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99998;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--c2w-accent, #5865f2);
	color: #fff;
	border: none;
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(0,0,0,.25);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	transition: transform .2s, background .2s;
}
.c2w-bt-toggle:hover {
	transform: scale(1.08);
	background: var(--c2w-primary, #4752c4);
}
.c2w-bt-badge {
	position: absolute;
	top: -4px;
	right: -4px;
	min-width: 22px;
	height: 22px;
	border-radius: 11px;
	background: #e74c3c;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 5px;
	line-height: 1;
}
.c2w-bt-badge:empty { display: none; }

/* ── Overlay ── */
.c2w-bt-overlay {
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: rgba(0,0,0,.45);
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s, visibility .3s;
}
.c2w-bt-overlay.open {
	opacity: 1;
	visibility: visible;
}

/* ── Panel ── */
.c2w-bt-panel {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 100000;
	width: 390px;
	max-width: 92vw;
	height: 100vh;
	height: 100dvh;
	background: #fff;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform .35s cubic-bezier(.4,0,.2,1);
	box-shadow: -4px 0 24px rgba(0,0,0,.15);
}
.c2w-bt-panel.open {
	transform: translateX(0);
}

/* ── Header ── */
.c2w-bt-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid #eee;
	flex-shrink: 0;
}
.c2w-bt-title {
	font-size: 18px;
	font-weight: 700;
	margin: 0;
	color: #222;
}
.c2w-bt-close {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: none;
	background: #f5f5f5;
	cursor: pointer;
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #555;
	transition: background .15s;
}
.c2w-bt-close:hover { background: #e0e0e0; }

/* ── Ticket Summary Bar ── */
.c2w-bt-summary {
	display: flex;
	gap: 0;
	padding: 0;
	border-bottom: 1px solid #eee;
	flex-shrink: 0;
	background: #f8f9fa;
}
.c2w-bt-stat {
	flex: 1;
	text-align: center;
	padding: 14px 8px;
	border-right: 1px solid #eee;
}
.c2w-bt-stat:last-child { border-right: none; }
.c2w-bt-stat-value {
	display: block;
	font-size: 22px;
	font-weight: 800;
	color: #222;
	line-height: 1.2;
}
.c2w-bt-stat-label {
	display: block;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: #888;
	margin-top: 4px;
}

/* Remaining highlight states */
.c2w-bt-stat--remaining .c2w-bt-stat-value {
	color: #e67e22;
}
.c2w-bt-stat--remaining.all-done .c2w-bt-stat-value {
	color: #27ae60;
}

/* ── Progress bar ── */
.c2w-bt-progress {
	padding: 12px 20px;
	border-bottom: 1px solid #eee;
	flex-shrink: 0;
}
.c2w-bt-progress-bar {
	width: 100%;
	height: 8px;
	border-radius: 4px;
	background: #e9ecef;
	overflow: hidden;
}
.c2w-bt-progress-fill {
	height: 100%;
	border-radius: 4px;
	background: var(--c2w-accent, #5865f2);
	transition: width .4s ease;
}
.c2w-bt-progress-fill.complete {
	background: #27ae60;
}
.c2w-bt-progress-text {
	font-size: 12px;
	color: #888;
	margin-top: 6px;
	text-align: center;
}

/* ── Items list ── */
.c2w-bt-items {
	flex: 1;
	overflow-y: auto;
	padding: 16px 20px;
}

/* ── Single item (read-only) ── */
.c2w-bt-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid #f0f0f0;
}
.c2w-bt-item:last-child { border-bottom: none; }
.c2w-bt-item-info { flex: 1; min-width: 0; }
.c2w-bt-item-name {
	font-weight: 600;
	font-size: 14px;
	color: #222;
	margin: 0 0 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.c2w-bt-item-meta {
	font-size: 12px;
	color: #888;
	margin: 0;
}
.c2w-bt-item-tickets {
	font-weight: 700;
	font-size: 14px;
	color: var(--c2w-accent, #5865f2);
	white-space: nowrap;
	flex-shrink: 0;
}

/* ── Empty state ── */
.c2w-bt-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: #aaa;
	text-align: center;
	padding: 40px 20px;
}
.c2w-bt-empty-icon { font-size: 48px; margin-bottom: 12px; }
.c2w-bt-empty p { font-size: 15px; margin: 0; }

/* ── Section labels (Ticket Packages / Prize Baskets) ── */
.c2w-bt-section-label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	color: #94a3b8;
	padding: 10px 0 6px;
	margin-top: 4px;
}
.c2w-bt-section-label--baskets {
	margin-top: 8px;
	padding-top: 12px;
	border-top: 1px solid #e2e8f0;
	color: #22c55e;
}

/* ── Basket item variant ── */
.c2w-bt-item--basket {
	background: #f0fdf4;
	border-radius: 8px;
	padding: 10px 12px;
	margin-bottom: 4px;
	border-bottom: none;
}
.c2w-bt-item--basket .c2w-bt-item-tickets {
	color: #16a34a;
}

/* ── Footer ── */
.c2w-bt-footer {
	padding: 16px 20px;
	border-top: 1px solid #eee;
	flex-shrink: 0;
	background: #fafafa;
}
.c2w-bt-checkout-btn {
	display: block;
	width: 100%;
	padding: 14px;
	border: none;
	border-radius: 10px;
	background: #adb5bd;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	cursor: default;
	text-align: center;
	text-decoration: none;
	transition: background .3s, transform .2s;
	pointer-events: none;
}
.c2w-bt-checkout-btn.ready {
	background: var(--c2w-accent, #5865f2);
	cursor: pointer;
	pointer-events: auto;
	animation: c2w-bt-pulse 1.5s ease-in-out 2;
}
.c2w-bt-checkout-btn.ready:hover {
	background: var(--c2w-primary, #4752c4);
	color: #fff;
	transform: scale(1.02);
}

@keyframes c2w-bt-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(88,101,242,.4); }
	50% { box-shadow: 0 0 0 10px rgba(88,101,242,0); }
}

/* ── Responsive ── */
@media (max-width: 480px) {
	.c2w-bt-panel { width: 100vw; max-width: 100vw; }
	.c2w-bt-stat-value { font-size: 18px; }
}