/**
 * EC Punchcards Frontend Styles
 */

/* Feedback Buttons */
.ec-punchcard-love {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	max-width: 100%;
	margin: 0;
	padding: 3px 4px 3px 10px;
	border-radius: 9px;
	background: #eee6ff;
	font-size: 0.9rem;
	color: #5e17eb;
	font-weight: 800;
}

.ec-punchcard-love__label {
	white-space: nowrap;
}

.ec-feedback-result {
	color: #287a3c;
	font-weight: 700;
	overflow-wrap: anywhere;
}

.ec-feedback-result:empty {
	display: none;
}

.ec-thumb-btn {
	position: static !important;
	inset: auto !important;
	float: none !important;
	margin: 0 !important;
	background: rgba(255, 255, 255, .72);
	border: 1px solid #d8c9fb;
	border-radius: 50%;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
	cursor: pointer;
	transition: all 0.2s ease;
	padding: 0;
}

.ec-punchcard-love > .ec-thumb-btn[data-type="up"],
.ec-punchcard-love > .ec-thumb-btn[data-type="down"] {
	display: inline-flex !important;
	position: static !important;
	inset: auto !important;
	float: none !important;
	flex: 0 0 32px !important;
	margin: 0 !important;
	transform: none;
}

.ec-thumb-btn:hover {
	transform: scale(1.1);
	border-color: #5e17eb;
}

.ec-thumb-btn.voted {
	background: #5e17eb;
	border-color: #5e17eb;
	box-shadow: 0 2px 8px rgba(94, 23, 235, 0.3);
}

.ec-thumb-btn.processing {
	opacity: 0.6;
	cursor: not-allowed;
}

.ec-thumb-btn.ec-thumb-btn--up.voted {
	background: #10b981;
	border-color: #10b981;
}

.ec-thumb-btn.ec-thumb-btn--down.voted {
	background: #ef4444;
	border-color: #ef4444;
}

#ec-punchcard-review {
	scroll-margin-top: 150px;
}

.ec-punchcards-review--login,
.ec-punchcards-review--notice {
	max-width: 720px;
	padding: 22px;
	border: 2px solid #e6ddfb;
	border-radius: 18px;
	background: #fbf9ff;
}

.ec-punchcards-review--login h2,
.ec-punchcards-review--notice h2 {
	margin: 0 0 8px !important;
	color: #5e17eb;
	font-size: clamp(1.35rem, 2.8vw, 1.8rem) !important;
	line-height: 1.2 !important;
}

.ec-punchcards-review--login p,
.ec-punchcards-review--notice p {
	margin: 0 0 14px !important;
	font-size: .96rem !important;
	line-height: 1.5 !important;
}

.ec-punchcards-review-login {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	justify-content: center;
	padding: 10px 18px;
	border-radius: 999px;
	background: #5e17eb;
	color: #fff !important;
	font-size: .94rem !important;
	font-weight: 800;
	line-height: 1.2 !important;
	text-decoration: none !important;
}

/* Check-in controls, including Bricks-rendered button shortcodes. */
.ec-punchcards-checkin-controls {
	width: min(100%, 480px);
	margin: 16px 0;
	padding: 18px;
	border: 2px solid #e1d6fa;
	border-radius: 18px;
	background: linear-gradient(135deg, #fff 0%, #f8f4ff 100%);
	box-shadow: 0 10px 26px rgba(48, 28, 94, .09);
	box-sizing: border-box;
}

.ec-punchcards-checkin-form,
.ec-punchcards-checkin-login-form,
.ec-punchcards-checkin-backup-form {
	margin: 0;
}

.ec-punchcards-checkin-context {
	display: flex;
	align-items: baseline;
	gap: 6px;
	margin: 0 0 12px;
	color: #655e76;
	font-size: .9rem;
	line-height: 1.3;
}

.ec-punchcards-checkin-context strong {
	color: #302b42;
	font-size: 1.02rem;
	font-weight: 850;
	overflow-wrap: anywhere;
}

.ec-punchcards-qr-card h1 {
	margin: 8px 0 12px;
	color: #5e17eb !important;
	font-size: clamp(2rem, 6vw, 3rem) !important;
	font-weight: 850;
	line-height: 1.08 !important;
	overflow-wrap: anywhere;
}

.ec-punchcards-qr-instructions {
	margin: 0 0 20px;
	color: #514967;
	font-size: 1rem;
	line-height: 1.55;
}

.ec-punchcards-qr-card .ec-punchcards-checkin-controls {
	width: 100%;
	margin: 0;
}

.ec-punchcards-checkin-method-note {
	padding: 18px;
	border: 2px solid #e1d6fa;
	border-radius: 16px;
	background: #f8f4ff;
}

.ec-punchcards-checkin-method-note strong {
	color: #5e17eb;
	font-size: 1.05rem;
}

.ec-punchcards-checkin-method-note p {
	margin: 7px 0 0;
	font-size: .98rem;
	line-height: 1.5;
}

.ec-event-checkin__code-alternative {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #ded4f7;
}

.ec-event-checkin__code-alternative > p {
	margin: 0 0 10px;
	color: #514967;
	font-size: .94rem;
	line-height: 1.45;
}

.ec-event-checkin__code-alternative > p strong {
	color: #5e17eb;
}

.ec-event-checkin__code-alternative label {
	display: inline-block;
	margin-bottom: 6px;
	color: #302b42;
	font-size: .9rem;
	font-weight: 800;
}

.ec-event-checkin__code-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 10px;
}

.ec-event-checkin__code-row input {
	min-width: 0;
}

.ec-event-checkin__code-row .ec-punchcards-checkin-backup-button {
	min-height: 48px;
	padding: 10px 16px;
	border: 0;
	border-radius: 12px;
	background: #5e17eb;
	color: #fff;
	font-size: .94rem;
	font-weight: 800;
	cursor: pointer;
}

.ec-punchcards-checkin-form p,
.ec-punchcards-checkin-login-form p,
.ec-punchcards-checkin-backup-form p {
	margin: 0 0 12px;
}

.ec-punchcards-checkin-form label,
.ec-punchcards-checkin-login-form label {
	display: inline-block;
	margin-bottom: 6px;
	color: #302b42;
	font-weight: 800;
}

.ec-punchcards-checkin-form input[type="text"],
.ec-punchcards-checkin-backup-form input[type="password"],
.ec-punchcards-checkin-login-form input[type="email"] {
	width: 100% !important;
	max-width: 100%;
	min-height: 48px;
	padding: 10px 13px;
	border: 2px solid #d8cdf1;
	border-radius: 12px;
	background: #fff;
	box-sizing: border-box;
	font-size: 1rem;
}

.ec-punchcards-checkin-button,
.ec-punchcards-checkin-login {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 11px 20px;
	border: 0;
	border-radius: 12px;
	background: #5e17eb;
	color: #fff !important;
	font-size: 1rem;
	font-weight: 850;
	text-decoration: none !important;
	cursor: pointer;
	box-shadow: 0 8px 20px rgba(94, 23, 235, .2);
}

.ec-punchcards-checkin-controls .ec-punchcards-checkin-button,
.ec-punchcards-checkin-controls .ec-punchcards-checkin-login {
	width: 100%;
}

.ec-punchcards-checkin-backup-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 8px;
	margin-top: 10px;
	padding: 0;
	border: 0;
}

.ec-punchcards-checkin-backup-form label {
	grid-column: 1 / -1;
	color: #302b42;
	font-size: .84rem;
	font-weight: 750;
}

.ec-punchcards-staff-verification {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid #e5ddf5;
}

.ec-punchcards-staff-verification > summary,
.ec-punchcards-dashboard-approval > summary {
	color: #5e17eb;
	font-size: .9rem;
	font-weight: 800;
	line-height: 1.3;
	cursor: pointer;
}

.ec-punchcards-staff-verification > p,
.ec-punchcards-dashboard-approval > p {
	margin: 7px 0 0;
	color: #655e76;
	font-size: .88rem;
	font-weight: 650;
	line-height: 1.3;
}

.ec-punchcards-dashboard-approval {
	margin-top: 12px;
	padding-top: 9px;
	border-top: 1px dashed #ddd3ef;
}

.ec-punchcards-dashboard-approval > summary {
	color: #655e76;
	font-size: .78rem;
	font-weight: 700;
}

.ec-punchcards-dashboard-approval form {
	margin: 8px 0 0;
}

.ec-punchcards-dashboard-approval button {
	padding: 0;
	border: 0;
	background: transparent;
	color: #5e17eb;
	font-family: inherit;
	font-size: .78rem;
	font-weight: 750;
	line-height: 1.3;
	text-decoration: underline;
	cursor: pointer;
}

/* Message Cards (Check-in confirmations) */
.ec-punchcard-message-card {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

.ec-punchcard-message-body > p:first-child {
	margin-top: 0;
}

.ec-punchcards-confirmation-lead {
	margin: 0 0 24px;
	color: #5a586d;
	font-size: 1.12rem;
}

.ec-punchcards-confirmation-location {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0 0 18px;
}

.ec-punchcards-confirmation-location span {
	color: #6b687e;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.ec-punchcards-confirmation-location strong {
	color: #29273a;
	font-size: 1.35rem;
	line-height: 1.25;
	overflow-wrap: anywhere;
}

.ec-punchcards-confirmation-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 12px;
	margin: 0 0 24px;
}

.ec-punchcards-confirmation-stat {
	padding: 18px;
	border: 2px solid #e8ddff;
	border-radius: 18px;
	background: #f8f5ff;
}

.ec-punchcards-confirmation-stat strong,
.ec-punchcards-confirmation-stat span {
	display: block;
}

.ec-punchcards-confirmation-stat strong {
	color: #5e17eb;
	font-size: clamp(1.8rem, 5vw, 2.5rem);
	font-weight: 850;
	letter-spacing: -.03em;
	line-height: 1;
}

.ec-punchcards-confirmation-stat span {
	margin-top: 8px;
	color: #4a475d;
	font-size: .95rem;
	font-weight: 700;
}

.ec-punchcards-confirmation-reward {
	display: flex;
	flex-direction: column;
	gap: 3px;
	margin: 0 0 20px;
	padding: 16px 18px;
	border: 2px solid #f0c650;
	border-radius: 16px;
	background: #fff7d8;
	color: #332800;
}

.ec-punchcards-confirmation-reward--completion {
	border-color: #bdf5b8;
	background: linear-gradient(135deg, #f1fff0 0%, #f8f4ff 100%);
	color: #2f2348;
}

.ec-punchcards-confirmation-reward--completion strong {
	color: #188628;
}

.ec-punchcards-confetti {
	position: fixed;
	inset: 0;
	z-index: 99999;
	pointer-events: none;
	overflow: hidden;
}

.ec-punchcards-confetti i {
	position: absolute;
	top: -24px;
	left: var(--ec-confetti-x);
	display: block;
	width: 10px;
	height: 18px;
	border-radius: 2px;
	background: var(--ec-confetti-color);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
	animation: ec-punchcards-confetti-fall var(--ec-confetti-duration) cubic-bezier(.18, .68, .35, 1) var(--ec-confetti-delay) both;
}

.ec-punchcards-confetti i:nth-child(3n) {
	width: 9px;
	height: 9px;
	border-radius: 50%;
}

.ec-punchcards-confetti i:nth-child(4n) {
	width: 14px;
	height: 7px;
}

@keyframes ec-punchcards-confetti-fall {
	0% {
		opacity: 0;
		transform: translate3d(0, -5vh, 0) rotate(0deg);
	}
	8% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		transform: translate3d(var(--ec-confetti-drift), 108vh, 0) rotate(var(--ec-confetti-rotation));
	}
}

@media (prefers-reduced-motion: reduce) {
	.ec-punchcards-confetti {
		display: none;
	}
}

.ec-punchcards-confirmation-reward strong {
	font-size: 1.05rem;
}

.ec-punchcards-confirmation-reward small {
	margin-top: 4px;
}

.ec-punchcards-confirmation-actions {
	display: grid;
	gap: 12px;
	margin-top: 28px;
}

.ec-punchcards-confirmation-bonuses {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 14px 0 18px;
}

.ec-punchcards-confirmation-bonus-intro {
	margin-top: 24px;
}

.ec-punchcards-confirmation-bonus-intro h3 {
	margin: 0 0 10px;
	color: #302b42;
	font-size: 1.2rem;
	font-weight: 900;
	line-height: 1.25;
}

.ec-punchcards-confirmation-guide {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 14px;
	border: 2px solid #cfc0f7;
	border-left: 7px solid #39e639;
	border-radius: 16px;
	background: linear-gradient(135deg, #f8f4ff 0%, #fff 100%);
}

.ec-punchcards-confirmation-guide strong {
	flex: 0 0 auto;
	color: #5e17eb;
	font-size: .94rem;
	font-weight: 850;
	line-height: 1.25;
	white-space: nowrap;
}

.ec-punchcards-confirmation-guide p {
	margin: 0;
	color: #4f4960;
	font-size: .88rem;
	line-height: 1.38;
}

.ec-punchcards-confirmation-bonus-link,
.ec-punchcards-confirmation-bonus-link:visited {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 9px 15px;
	border-radius: 12px;
	background: #5e17eb;
	color: #fff;
	font-size: .9rem;
	font-weight: 800;
	line-height: 1.25;
	text-decoration: none;
}

.ec-punchcards-confirmation-bonus-link:hover,
.ec-punchcards-confirmation-bonus-link:focus-visible {
	background: #4710bb;
	color: #fff;
}

.ec-punchcards-confirmation-bonus-link.is-complete {
	background: #e7fbe5;
	color: #247a32;
}

.ec-punchcards-confirmation-bonus-link.is-pending {
	background: #eee6ff;
	color: #686278;
}

.ec-punchcards-confirmation-bonuses .ec-punchcard-love {
	flex: 0 0 auto;
	flex-wrap: nowrap;
	width: auto;
	padding: 4px 6px 4px 14px;
	border-radius: 12px;
	background: #5e17eb;
	color: #fff;
}

.ec-punchcards-confirmation-bonuses .ec-thumb-btn {
	flex: 0 0 32px;
	background: rgba(255, 255, 255, .16);
	border-color: rgba(255, 255, 255, .7);
}

.ec-punchcards-confirmation-bonuses .ec-thumb-btn:hover,
.ec-punchcards-confirmation-bonuses .ec-thumb-btn:focus-visible {
	background: rgba(255, 255, 255, .28);
	border-color: #fff;
}

.ec-punchcards-confirmation-button,
.ec-punchcards-confirmation-button:visited {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	padding: 13px 20px;
	border: 2px solid #5e17eb;
	border-radius: 14px;
	font-size: 1.05rem;
	font-weight: 800;
	line-height: 1.25;
	text-align: center;
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.ec-punchcards-confirmation-button--primary,
.ec-punchcards-confirmation-button--primary:visited {
	background: #5e17eb;
	color: #fff;
	box-shadow: 0 8px 20px rgba(94, 23, 235, .22);
}

.ec-punchcards-confirmation-button--secondary,
.ec-punchcards-confirmation-button--secondary:visited {
	background: #fff;
	color: #5e17eb;
}

.ec-punchcards-confirmation-button:hover,
.ec-punchcards-confirmation-button:focus-visible {
	transform: translateY(-1px);
	box-shadow: 0 10px 24px rgba(94, 23, 235, .2);
}

.ec-punchcards-confirmation-button--primary:hover,
.ec-punchcards-confirmation-button--primary:focus-visible {
	background: #4b0fc7;
	color: #fff;
}

/* Punch Card Progress */
.ec-card-progress {
	background: #f7f3ff;
	border: 2px solid #e6dbff;
	border-radius: 12px;
	padding: 16px;
	margin: 16px 0;
}

.ec-card-progress h3 {
	margin: 0 0 12px;
	color: #5e17eb;
	font-size: 1.1rem;
}

.ec-progress-bar {
	height: 24px;
	background: #e6dbff;
	border-radius: 12px;
	overflow: hidden;
	position: relative;
}

.ec-progress-fill {
	height: 100%;
	background: linear-gradient(90deg, #5e17eb, #8b5cf6);
	transition: width 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 0.85rem;
	font-weight: 600;
}

/* Business List */
.ec-business-list {
	list-style: none;
	padding: 0;
	margin: 20px 0;
}

.ec-business-item {
	background: white;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 12px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.ec-business-item.visited {
	border-color: #10b981;
	background: #f0fdf4;
}

.ec-business-item.visited::before {
	content: '✓';
	color: #10b981;
	font-weight: bold;
	margin-right: 8px;
}

/* Responsive */
@media (max-width: 640px) {
	.ec-punchcards-message-page {
		padding: 32px 14px !important;
	}

	.ec-punchcard-message-card {
		padding: 32px 22px !important;
		border-radius: 22px !important;
	}

	.ec-punchcards-confirmation-stats {
		grid-template-columns: 1fr;
	}

	.ec-thumb-btn {
		width: 32px;
		height: 32px;
		font-size: 1rem;
	}

	.ec-punchcard-love {
		width: auto;
		font-size: 0.85rem;
		gap: 6px;
	}

	.ec-feedback-result {
		flex: 1 0 100%;
	}

	.ec-punchcards-confirmation-actions,
	.ec-punchcards-confirmation-button {
		width: 100%;
	}

	.ec-punchcards-confirmation-bonuses {
		align-items: stretch;
	}

	.ec-punchcards-confirmation-guide {
		align-items: flex-start;
		flex-direction: column;
		gap: 4px;
		padding: 13px 14px;
	}

	.ec-punchcards-confirmation-guide strong {
		white-space: normal;
	}

	.ec-punchcards-confirmation-bonus-link {
		justify-content: center;
		flex: 1 1 100%;
	}

	.ec-punchcards-confirmation-bonuses .ec-punchcard-love {
		justify-content: center;
		width: 100%;
	}

	.ec-event-checkin__code-row {
		grid-template-columns: 1fr;
	}

	.ec-event-checkin__code-row .ec-punchcards-checkin-backup-button {
		width: 100%;
	}
}
.ec-punchcards-notice {
	width: min(100%, 720px);
	max-width: 720px;
	padding: 18px 20px;
	border: 1px solid #d9d0ff;
	border-radius: 14px;
	background: #f7f4ff;
	color: #37344a;
	box-sizing: border-box;
	overflow-wrap: anywhere;
}

.ec-punchcards-notice--success {
	border-color: #a9d7b2;
	background: #f1fbf3;
}

/* Social post submission */
.ec-punchcards-ugc-form {
	width: min(100%, 760px);
	max-width: 100%;
	margin: 24px auto;
	padding: clamp(24px, 4vw, 38px);
	border: 2px solid #ded2fb;
	border-radius: 26px;
	background: linear-gradient(135deg, #fff 0%, #f8f4ff 100%);
	box-shadow: 0 18px 44px rgba(48, 28, 94, .11);
	color: #343047;
	box-sizing: border-box;
	overflow-wrap: anywhere;
}

.ec-punchcards-ugc-form *,
.ec-punchcards-ranking-name * {
	box-sizing: border-box;
}

.ec-punchcards-ugc-form h2 {
	margin: 0 0 12px;
	color: #5e17eb;
	font-size: clamp(1.7rem, 4vw, 2.35rem);
	font-weight: 850;
	line-height: 1.15;
}

.ec-punchcards-ugc-form > p {
	font-size: 1rem;
	line-height: 1.6;
}

.ec-punchcards-social-status {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin: 20px 0;
}

.ec-punchcards-social-status > span {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 13px 14px;
	border: 2px solid #e1d7f8;
	border-radius: 14px;
	background: #fff;
	color: #6d667a;
	font-size: .86rem;
}

.ec-punchcards-social-status > span strong {
	color: #322d42;
	font-size: 1rem;
}

.ec-punchcards-social-status > span.is-approved {
	border-color: #9fe798;
	background: #f1fff0;
	color: #237229;
}

.ec-punchcards-social-status > span.is-pending {
	border-color: #d9c7ff;
	background: #f5f0ff;
	color: #5e17eb;
}

.ec-punchcards-ugc-form form {
	margin-top: 22px;
}

.ec-punchcards-ugc-form form > p:last-child {
	margin: 16px 0 0;
}

.ec-punchcards-ugc-form label {
	display: block;
	margin-bottom: 7px;
	font-size: 1rem;
	font-weight: 800;
}

.ec-punchcards-ugc-form input[type="url"] {
	width: 100% !important;
	max-width: 100% !important;
	min-height: 50px;
	padding: 11px 13px;
	border: 2px solid #d8cdf1;
	border-radius: 12px;
	background: #fff;
	font-size: 1rem;
}

.ec-punchcards-ugc-form button {
	min-height: 48px;
	padding: 11px 20px;
	border: 0;
	border-radius: 12px;
	background: #5e17eb;
	color: #fff;
	font-size: 1rem;
	font-weight: 850;
	cursor: pointer;
	box-shadow: 0 8px 20px rgba(94, 23, 235, .22);
}

/* One-time public leaderboard-name setup */
.ec-punchcards-ranking-name {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	gap: 20px;
	width: min(100%, 720px);
	margin: 0 auto 12px;
	padding: 24px;
	border: 2px solid #dcd0ff;
	border-radius: 22px;
	background: linear-gradient(135deg, #fff 0%, #f7f2ff 100%);
	box-shadow: 0 14px 34px rgba(48, 28, 94, .1);
	box-sizing: border-box;
	overflow-wrap: anywhere;
}

.ec-punchcards-ranking-name__accent {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 16px;
	background: #5e17eb;
	color: #43e536;
	font-size: 2rem;
	font-weight: 900;
	box-shadow: 0 8px 20px rgba(94, 23, 235, .22);
}

.ec-punchcards-ranking-name__eyebrow {
	margin: 0 0 3px;
	color: #5e17eb;
	font-size: .76rem;
	font-weight: 850;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.ec-punchcards-ranking-name label {
	display: block;
	margin: 0;
	color: #29263a;
	font-size: clamp(1.25rem, 3vw, 1.65rem);
	font-weight: 850;
	line-height: 1.2;
}

.ec-punchcards-ranking-name__intro {
	max-width: 570px;
	margin: 7px 0 16px;
	color: #5b566d;
	font-size: .98rem;
	line-height: 1.5;
}

.ec-punchcards-ranking-name__fields {
	display: flex;
	align-items: stretch;
	gap: 10px;
}

.ec-punchcards-ranking-name input[type="text"] {
	width: min(100%, 300px);
	min-height: 48px;
	padding: 10px 14px;
	border: 2px solid #cfc0f6;
	border-radius: 12px;
	background: #fff;
	color: #29263a;
	font-size: 1rem;
}

.ec-punchcards-ranking-name input[type="text"]:focus {
	border-color: #5e17eb;
	box-shadow: 0 0 0 3px rgba(94, 23, 235, .13);
	outline: 0;
}

.ec-punchcards-ranking-name button {
	min-height: 38px;
	padding: 7px 13px;
	border: 2px solid #5e17eb;
	border-radius: 12px;
	background: #5e17eb;
	color: #fff;
	font-size: .84rem;
	font-weight: 800;
	cursor: pointer;
}

.ec-punchcards-ranking-name button:hover,
.ec-punchcards-ranking-name button:focus-visible {
	background: #4a0fc4;
	box-shadow: 0 8px 18px rgba(94, 23, 235, .2);
}

.ec-punchcards-ranking-name .description {
	max-width: 570px;
	margin: 10px 0 0;
	color: #6a657c;
	font-size: .84rem;
	line-height: 1.45;
}

/* Business dashboard and staff check-in tools */
.ec-business-dashboard-metrics {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 18px 0;
}

.ec-business-dashboard-metrics > div {
	padding: 18px;
	border: 2px solid #eee8ff;
	border-radius: 16px;
	background: #fbf9ff;
}

.ec-business-dashboard-metrics span,
.ec-business-dashboard-metrics strong {
	display: block;
}

.ec-business-dashboard-metrics strong {
	margin-top: 4px;
	color: #5e17eb;
	font-size: 2rem;
}

.ec-business-dashboard-privacy {
	padding: 12px 14px;
	border-radius: 12px;
	background: #f2eff9;
	color: #5a586d;
	font-size: .9rem !important;
	line-height: 1.45 !important;
}

.ec-punchcards-business-checkin-settings {
	display: grid;
	gap: 14px;
	min-width: 0;
}

.ec-punchcards-pending-approvals,
.ec-punchcards-business-checkin-card {
	padding: 18px;
	border: 2px solid #eee8ff;
	border-radius: 16px;
	background: #fff;
	min-width: 0;
	overflow-wrap: anywhere;
}

.ec-business-dashboard,
.ec-business-dashboard * {
	box-sizing: border-box;
}

.ec-business-dashboard {
	max-width: 100%;
	overflow-x: hidden;
	color: #3d3a52;
	font-size: 16px !important;
	line-height: 1.5 !important;
}

.ec-business-dashboard-card {
	width: min(100%, 960px);
	min-width: 0;
}

.ec-business-dashboard .ec-business-dashboard-card > h2 {
	margin: 0 0 18px !important;
	color: #302d43;
	font-size: clamp(1.55rem, 2.4vw, 2rem) !important;
	line-height: 1.18 !important;
}

.ec-business-dashboard .ec-business-dashboard-section-title {
	margin: 28px 0 12px !important;
	color: #302d43;
	font-size: 1.35rem !important;
	line-height: 1.25 !important;
}

.ec-business-dashboard-card h2,
.ec-business-dashboard-card h3,
.ec-business-dashboard-card p {
	overflow-wrap: anywhere;
}

.ec-business-dashboard .ec-business-dashboard-empty {
	margin: 10px 0 4px !important;
	padding: 11px 13px;
	border-radius: 10px;
	background: #f7f5fb;
	color: #686577;
	font-size: .9rem !important;
	font-style: normal;
	line-height: 1.45 !important;
}

.ec-business-dashboard a,
.ec-business-dashboard button,
.ec-punchcards-business-checkin-card input,
.ec-punchcards-business-checkin-card select {
	max-width: 100%;
}

.ec-punchcards-approval-request {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 14px;
	border: 1px solid #f0cc7a;
	border-radius: 12px;
	background: #fff4dc;
}

.ec-punchcards-approval-request p {
	margin: 0;
}

.ec-punchcards-approval-request button,
.ec-punchcards-business-checkin-card button {
	border: 0;
	border-radius: 999px;
	padding: 10px 16px;
	background: #5e17eb;
	color: #fff;
	font-weight: 700;
}

.ec-business-dashboard .ec-punchcards-business-checkin-card {
	padding: 18px 20px;
}

.ec-business-dashboard .ec-punchcards-business-checkin-card h3 {
	margin: 0 0 10px !important;
	color: #302d43;
	font-size: 1.2rem !important;
	line-height: 1.25 !important;
}

.ec-business-dashboard .ec-punchcards-business-checkin-card p {
	margin: 6px 0 !important;
	color: #5d596c;
	font-size: .93rem !important;
	line-height: 1.45 !important;
}

.ec-business-dashboard .ec-punchcards-checkin-method,
.ec-business-dashboard .ec-punchcards-checkin-backup-status {
	display: inline-flex;
	gap: 5px;
	margin-right: 14px !important;
}

.ec-business-dashboard .ec-punchcards-checkin-help,
.ec-business-dashboard .ec-punchcards-checkin-note {
	max-width: 720px;
}

.ec-business-dashboard .ec-punchcards-checkin-note {
	color: #777286;
}

.ec-business-dashboard .ec-punchcards-today-code {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 7px;
	padding: 10px 12px;
	border-radius: 10px;
	background: #f5f0ff;
}

.ec-business-dashboard .ec-punchcards-today-code strong {
	color: #5e17eb;
	font-size: 1.35rem !important;
	letter-spacing: .08em;
	line-height: 1 !important;
}

.ec-business-dashboard .ec-punchcards-today-code small {
	color: #777286;
	font-size: .78rem !important;
}

.ec-business-dashboard .ec-business-flash-deals {
	margin-top: 24px;
	padding: 18px 20px;
	border: 2px solid #eee8ff;
	border-radius: 16px;
	background: #fff;
}

.ec-business-dashboard .ec-business-flash-deals h3 {
	margin: 0 0 12px !important;
	color: #302d43;
	font-size: 1.25rem !important;
	line-height: 1.25 !important;
}

.ec-business-dashboard .ec-business-flash-deals h4 {
	margin: 20px 0 8px !important;
	font-size: 1rem !important;
	line-height: 1.3 !important;
}

.ec-business-dashboard .ec-business-flash-toggle {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 14px;
}

.ec-business-dashboard .ec-business-flash-toggle label {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	color: #3d3a52;
	font-size: .94rem !important;
	font-weight: 700;
	line-height: 1.35 !important;
}

.ec-business-dashboard .ec-business-flash-toggle input[type="checkbox"] {
	width: 19px;
	height: 19px;
	margin: 0;
	accent-color: #5e17eb;
}

.ec-business-dashboard .ec-business-flash-deals button {
	min-height: 40px;
	padding: 9px 16px;
	border: 0;
	border-radius: 999px;
	background: #5e17eb;
	color: #fff;
	font-family: inherit;
	font-size: .9rem !important;
	font-weight: 750;
	line-height: 1.2 !important;
	text-transform: none;
	cursor: pointer;
}

.ec-business-dashboard .ec-business-flash-status {
	margin: 12px 0 0 !important;
	padding: 9px 11px;
	border-radius: 9px;
	background: #f7f5fb;
	color: #6b6678;
	font-size: .88rem !important;
	line-height: 1.4 !important;
}

.ec-business-dashboard .ec-business-flash-proposal p {
	margin: 12px 0 !important;
	font-size: .92rem !important;
	line-height: 1.45 !important;
}

.ec-business-dashboard .ec-business-flash-proposal input:not([type="hidden"]),
.ec-business-dashboard .ec-business-flash-proposal select,
.ec-business-dashboard .ec-business-flash-proposal textarea {
	width: min(100%, 560px);
	max-width: 100%;
	margin-top: 6px;
	padding: 10px 12px;
	border: 2px solid #ddd2f7;
	border-radius: 10px;
	background: #fff;
	color: #302d43;
	font: inherit;
}

.ec-punchcards-checkin-backup-button {
	width: auto;
	min-height: 38px;
	padding: 7px 12px;
	border: 1px solid #5e17eb;
	border-radius: 999px;
	background: #5e17eb;
	color: #fff;
	font-family: inherit;
	font-size: .88rem;
	font-weight: 750;
	line-height: 1.2;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
}

/* Method-aware event-page check-in control for Bricks business query loops. */
.ec-event-checkin-launcher {
	--ec-event-purple: #5e17eb;
	--ec-event-purple-dark: #4610b5;
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	gap: 9px;
	width: 100%;
	margin: 12px 0 0;
}

.ec-event-checkin-launcher,
.ec-event-checkin-launcher * {
	box-sizing: border-box;
}

.ec-event-checkin-launcher__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 7px 15px;
	border: 1px solid #5e17eb;
	border-radius: 9px;
	background: #5e17eb;
	box-shadow: rgba(0, 0, 0, .25) 0 14px 28px 0, rgba(0, 0, 0, .22) 0 10px 10px 0;
	color: #fff !important;
	font-family: inherit;
	font-size: .95rem !important;
	font-weight: 800;
	line-height: 1.2 !important;
	text-decoration: none !important;
}

.ec-event-checkin-launcher__button:hover,
.ec-event-checkin-launcher__button:focus-visible {
	background: var(--ec-event-purple-dark);
	box-shadow: rgba(0, 0, 0, .25) 0 14px 28px 0, rgba(0, 0, 0, .22) 0 10px 10px 0;
	transform: translateY(-1px);
}

.ec-event-checkin-launcher__login {
	color: #5e17eb !important;
	font-family: inherit;
	font-size: .9rem !important;
	font-weight: 750;
	line-height: 1.35 !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
}

.ec-event-checkin-launcher__purchase {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 7px 15px;
	border: 1px solid #5e17eb;
	border-radius: 9px;
	background: transparent;
	color: #5e17eb !important;
	font-family: inherit;
	font-size: .95rem !important;
	font-weight: 800;
	line-height: 1.2 !important;
	text-decoration: none !important;
}

.ec-event-checkin-launcher__purchase:hover,
.ec-event-checkin-launcher__purchase:focus-visible {
	background: #f3edff;
}

.ec-event-checkin-launcher__notice {
	margin: 0 !important;
	color: #686577;
	font-family: inherit;
	font-size: .88rem !important;
	line-height: 1.4 !important;
}

.ec-event-checkin-launcher__complete {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 40px;
	padding: 8px 13px;
	border: 1px solid #b9efb5;
	border-radius: 999px;
	background: #efffee;
	color: #197b29;
	font-family: inherit;
	font-size: .9rem !important;
	font-weight: 800;
	line-height: 1.2 !important;
}

.ec-event-checkin {
	--ec-event-purple: #5e17eb;
	--ec-event-purple-dark: #4610b5;
	--ec-event-green: #43e536;
	width: 100%;
	max-width: 100%;
	margin: 16px 0 0;
	padding: 18px;
	border: 2px solid #ded2fb;
	border-radius: 18px;
	background: linear-gradient(135deg, #fff 0%, #faf7ff 100%);
	box-shadow: 0 10px 26px rgba(48, 28, 94, .07);
	color: #302d43;
}

.ec-event-checkin,
.ec-event-checkin * {
	box-sizing: border-box;
}

.ec-event-checkin__heading {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 6px 10px;
	margin-bottom: 10px;
}

.ec-event-checkin__heading span {
	color: var(--ec-event-purple);
	font-size: .72rem !important;
	font-weight: 850;
	letter-spacing: .1em;
	line-height: 1.2 !important;
	text-transform: uppercase;
}

.ec-event-checkin__heading strong {
	color: #302d43;
	font-size: 1.05rem !important;
	font-weight: 850;
	line-height: 1.25 !important;
}

.ec-event-checkin > p,
.ec-event-checkin__instruction,
.ec-event-checkin__notice,
.ec-event-checkin__success {
	margin: 8px 0 12px !important;
	font-size: .94rem !important;
	line-height: 1.45 !important;
}

.ec-event-checkin__instruction strong {
	color: var(--ec-event-purple);
}

.ec-event-checkin__success {
	padding: 11px 13px;
	border: 1px solid #b9efb5;
	border-radius: 11px;
	background: #efffee;
	color: #197b29;
	font-weight: 800;
}

.ec-event-checkin__success span {
	display: inline-grid;
	width: 24px;
	height: 24px;
	margin-right: 5px;
	border-radius: 50%;
	background: var(--ec-event-green);
	color: #123819;
	place-items: center;
}

.ec-event-checkin__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 9px 16px;
	border-radius: 11px;
	background: var(--ec-event-purple);
	color: #fff !important;
	font-size: .92rem !important;
	font-weight: 800;
	line-height: 1.2 !important;
	text-decoration: none !important;
}

.ec-event-checkin__button:hover,
.ec-event-checkin__button:focus-visible {
	background: var(--ec-event-purple-dark);
}

.ec-event-checkin .ec-punchcards-checkin-controls {
	margin: 12px 0 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.ec-event-checkin .ec-punchcards-checkin-form {
	gap: 10px;
}

.ec-event-checkin .ec-punchcards-checkin-form p {
	margin: 0 !important;
}

.ec-event-checkin .ec-punchcards-checkin-form label {
	font-size: .9rem !important;
	line-height: 1.35 !important;
}

.ec-event-checkin .ec-punchcards-checkin-form input[type="text"] {
	min-height: 48px;
	font-size: 1.15rem !important;
	letter-spacing: .12em;
	text-align: center;
}

.ec-event-checkin .ec-punchcards-checkin-button {
	width: 100%;
	min-height: 44px;
	font-size: .94rem !important;
}

.ec-event-checkin .ec-punchcards-dashboard-approval,
.ec-event-checkin .ec-punchcards-staff-verification {
	font-size: .88rem !important;
	line-height: 1.4 !important;
}

.ec-campaign-checkin-page {
	min-height: 62vh;
	padding: clamp(36px, 7vw, 80px) 18px;
	background: linear-gradient(180deg, #fbf9ff 0%, #fff 100%);
}

.ec-campaign-checkin-page__card {
	width: min(100%, 620px);
	margin: 0 auto;
	padding: clamp(24px, 5vw, 42px);
	border: 2px solid #ded2fb;
	border-radius: 26px;
	background: #fff;
	box-shadow: 0 18px 42px rgba(48, 28, 94, .1);
}

.ec-campaign-checkin-page__campaign {
	display: inline-flex;
	margin-bottom: 12px;
	padding: 6px 12px;
	border-radius: 999px;
	background: #f1e8ff;
	color: #5e17eb;
	font-size: .75rem !important;
	font-weight: 850;
	letter-spacing: .08em;
	line-height: 1.2 !important;
	text-transform: uppercase;
}

.ec-campaign-checkin-page__card > h1 {
	margin: 0 0 18px !important;
	color: #5e17eb !important;
	font-size: clamp(1.65rem, 5vw, 2.35rem) !important;
	font-weight: 850 !important;
	line-height: 1.12 !important;
}

.ec-campaign-checkin-page__card .ec-event-checkin {
	margin-top: 0;
}

.ec-campaign-checkin-page__back {
	display: inline-flex;
	margin-top: 16px;
	color: #5e17eb !important;
	font-size: .92rem !important;
	font-weight: 750;
	line-height: 1.3 !important;
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 640px) {
	.ec-event-checkin {
		padding: 15px;
		border-radius: 15px;
	}

	.ec-event-checkin__heading {
		align-items: flex-start;
		flex-direction: column;
	}

	.ec-event-checkin__button {
		width: 100%;
	}
	.ec-punchcards-checkin-context {
		align-items: flex-start;
		flex-direction: column;
	}

	.ec-punchcards-checkin-backup-form {
		grid-template-columns: 1fr;
	}

	.ec-punchcards-checkin-backup-form label {
		grid-column: 1;
	}

	.ec-punchcards-checkin-backup-button {
		width: 100%;
	}

	.ec-punchcards-ugc-form {
		margin: 16px auto;
		padding: 24px 18px;
		border-radius: 22px;
	}

	.ec-punchcards-social-status {
		grid-template-columns: 1fr;
	}

	.ec-punchcards-ugc-form button {
		width: 100%;
	}
	.ec-punchcards-ranking-name {
		grid-template-columns: 1fr;
		gap: 14px;
		padding: 20px;
	}

	.ec-punchcards-ranking-name__accent {
		width: 48px;
		height: 48px;
	}

	.ec-punchcards-ranking-name__fields {
		align-items: stretch;
		flex-direction: column;
	}

	.ec-punchcards-ranking-name input[type="text"] {
		width: 100%;
	}

	.ec-business-dashboard-metrics {
		grid-template-columns: 1fr;
	}

	.ec-punchcards-approval-request {
		align-items: stretch;
		flex-direction: column;
	}

	.ec-punchcards-approval-request button,
	.ec-punchcards-business-checkin-card button {
		width: 100%;
		white-space: normal;
	}

	.ec-business-dashboard {
		padding: 20px 10px !important;
	}

	.ec-business-dashboard-card {
		padding: 24px 16px 22px !important;
		border-radius: 20px !important;
	}

	.ec-business-dashboard-card > div[style*="display:flex"] a {
		width: 100%;
		white-space: normal !important;
		text-align: center;
	}

	.ec-business-dashboard .ec-business-dashboard-section-title {
		margin-top: 22px !important;
		font-size: 1.2rem !important;
	}

	.ec-business-dashboard .ec-punchcards-business-checkin-card,
	.ec-business-dashboard .ec-business-flash-deals {
		padding: 16px;
	}

	.ec-business-dashboard .ec-punchcards-checkin-method,
	.ec-business-dashboard .ec-punchcards-checkin-backup-status {
		display: flex;
		margin-right: 0 !important;
	}

	.ec-business-dashboard .ec-business-flash-toggle {
		align-items: stretch;
		flex-direction: column;
	}

	.ec-business-dashboard .ec-business-flash-toggle button,
	.ec-business-dashboard .ec-business-flash-proposal button {
		width: 100%;
	}
}

@media (max-width: 380px) {
	.ec-punchcards-ranking-name,
	.ec-punchcards-ugc-form,
	.ec-punchcard-message-card {
		padding-right: 14px !important;
		padding-left: 14px !important;
	}
}

/* Campaign-scoped public leaderboards. Kept in the primary stylesheet so
 * Bricks Shortcode elements receive the same presentation as post content. */
.ec-leaderboard-wrap {
	width: 100%;
	max-width: 1100px;
	margin: 28px auto;
	padding: clamp(22px, 4vw, 42px);
	border: 3px solid #ded2ff;
	border-radius: 28px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(60, 24, 140, .1);
	color: #3d3b52;
}

.ec-leaderboard-title {
	margin: 0 0 8px;
	color: #5e17eb;
	font-size: clamp(1.65rem, 4vw, 2.5rem);
	line-height: 1.15;
}

.ec-leaderboard-desc {
	margin: 0 0 24px;
	font-size: 1rem;
	line-height: 1.55;
}

.ec-leaderboard-table-wrap {
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	border: 1px solid #e8e0ff;
	border-radius: 18px;
	-webkit-overflow-scrolling: touch;
}

.ec-leaderboard-table {
	width: 100%;
	min-width: 560px;
	margin: 0;
	border-collapse: collapse;
	background: #fff;
}

.ec-leaderboard-table th,
.ec-leaderboard-table td {
	padding: 15px 18px;
	border: 0;
	border-bottom: 1px solid #eee8ff;
	text-align: center;
	vertical-align: middle;
}

.ec-leaderboard-table th {
	background: #5e17eb;
	color: #fff;
	font-size: .82rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.ec-leaderboard-table td.ec-left,
.ec-leaderboard-table th:nth-child(2) {
	text-align: left;
}

.ec-leaderboard-table tbody tr:nth-child(even) {
	background: #faf8ff;
}

.ec-leaderboard-table tbody tr:last-child td {
	border-bottom: 0;
}

.ec-leaderboard-table a {
	color: #5e17eb;
	font-weight: 700;
	text-decoration: none;
}

.ec-leaderboard-table a:hover,
.ec-leaderboard-table a:focus-visible {
	text-decoration: underline;
}

@media (max-width: 640px) {
	.ec-leaderboard-wrap {
		padding: 20px 14px;
		border-radius: 22px;
	}

	.ec-leaderboard-table th,
	.ec-leaderboard-table td {
		padding: 12px 10px;
		font-size: .9rem;
	}
}