/* =====================================================================
 * Mini Cart — Slide-in side panel
 * ===================================================================== */

/* ── Toggle button (floating) ── */
.c2w-mc-toggle {
	position: fixed;
	right: 20px;
	bottom: 90px;
	z-index: 99998;
	width: 68px;
	height: 68px;
	border-radius: 50%;
	background: var(--c2w-primary, var(--gold, var(--accent, #007BFF)));
	color: var(--c2w-light, #fff);
	border: none;
	cursor: pointer;
	box-shadow: 0 4px 18px rgba(0,0,0,.30);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	transition: transform .2s, background .2s;
}
.c2w-mc-toggle svg {
	width: 32px;
	height: 32px;
}
.c2w-mc-toggle:hover {
	transform: scale(1.08);
	background: var(--c2w-secondary, var(--primary, #0056b3));
}
.c2w-mc-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-mc-badge:empty { display: none; }

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

/* ── Panel ── */
.c2w-mc-panel {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 100000;
	width: 380px;
	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-mc-panel.open {
	transform: translateX(0);
}

/* ── Header ── */
.c2w-mc-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid #eee;
	flex-shrink: 0;
}
.c2w-mc-title {
	font-size: 18px;
	font-weight: 700;
	margin: 0;
	color: #222;
}
.c2w-mc-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-mc-close:hover { background: #e0e0e0; }

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

/* ── Single item card ── */
.c2w-mc-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 0;
	border-bottom: 1px solid #f0f0f0;
}
.c2w-mc-item:last-child { border-bottom: none; }
.c2w-mc-item-info { flex: 1; min-width: 0; }
.c2w-mc-item-name {
	font-weight: 600;
	font-size: 14px;
	color: #222;
	margin: 0 0 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.c2w-mc-item-meta {
	font-size: 12px;
	color: #888;
	margin: 0 0 8px;
}
.c2w-mc-item-price {
	font-weight: 700;
	font-size: 15px;
	color: var(--c2w-accent, var(--gold, var(--accent, #007BFF)));
	white-space: nowrap;
}

/* qty controls inside item */
.c2w-mc-qty {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
}
.c2w-mc-qty button {
	width: 28px;
	height: 28px;
	border-radius: 6px;
	border: 1px solid #ddd;
	background: #fafafa;
	cursor: pointer;
	font-size: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #333;
	transition: background .15s;
}
.c2w-mc-qty button:hover { background: #eee; }
.c2w-mc-qty span {
	min-width: 24px;
	text-align: center;
	font-weight: 600;
	font-size: 14px;
}

/* remove button */
.c2w-mc-remove {
	background: none;
	border: none;
	color: #ccc;
	cursor: pointer;
	font-size: 18px;
	padding: 4px;
	flex-shrink: 0;
	transition: color .15s;
}
.c2w-mc-remove:hover { color: #e74c3c; }

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

/* ── Footer ── */
.c2w-mc-footer {
	padding: 16px 20px;
	border-top: 1px solid #eee;
	flex-shrink: 0;
	background: #fafafa;
}
.c2w-mc-total-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 14px;
}
.c2w-mc-total-label {
	font-size: 15px;
	font-weight: 600;
	color: #444;
}
.c2w-mc-total-value {
	font-size: 20px;
	font-weight: 800;
	color: #222;
}
.c2w-mc-checkout-btn {
	display: block;
	width: 100%;
	padding: 14px;
	border: none;
	border-radius: 10px;
	background: var(--c2w-primary, var(--gold, var(--accent, #007BFF)));
	color: var(--c2w-light, #fff);
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	transition: background .2s;
}
.c2w-mc-checkout-btn:hover {
	background: var(--c2w-secondary, var(--primary, #0056b3));
	color: var(--c2w-light, #fff);
}

/* ── Product highlight badges on homepage ── */
.c2w-in-cart-badge {
	position: absolute;
	top: 8px;
	right: 8px;
	background: var(--c2w-primary, var(--gold, var(--accent, #007BFF)));
	color: var(--c2w-light, #fff);
	font-size: 11px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 10px;
	z-index: 5;
	pointer-events: none;
}

/* Badge placed inside price columns (Pro / Classic) — override absolute positioning */
.ticket-price .c2w-in-cart-badge,
.ticket-cost .c2w-in-cart-badge {
	position: relative;
	display: block;
	top: auto;
	right: auto;
	margin-top: 5px;
	text-align: center;
}

/* Badge placed between unit price and qty controls (Lite) */
.lite-tix-card > .c2w-in-cart-badge {
	position: relative;
	display: block;
	top: auto;
	right: auto;
	left: auto;
	margin: 4px auto 6px;
	width: fit-content;
}

/* Flash animation when item added */
@keyframes c2w-mc-flash {
	0%   { background: rgba(0,123,255,.12); }
	100% { background: transparent; }
}
.c2w-mc-item-flash {
	animation: c2w-mc-flash .6s ease-out;
}

/* ── Responsive ── */
@media (max-width: 420px) {
	.c2w-mc-panel { width: 100vw; max-width: 100vw; }
	.c2w-mc-toggle { right: 14px; bottom: 80px; width: 50px; height: 50px; font-size: 20px; }
}