/* Crafden Raffles – front end. Override colours with:
   :root { --cr-accent: #e11d48; --cr-accent-text: #fff; } */
:root {
	--cr-accent: #111;
	--cr-accent-text: #fff;
	--cr-track: rgba(0, 0, 0, .08);
	--cr-border: rgba(0, 0, 0, .12);
	--cr-radius: 10px;
	--cr-good: #15803d;
	--cr-bad: #b91c1c;
}

.cr-box {
	border: 1px solid var(--cr-border);
	border-radius: var(--cr-radius);
	padding: 18px 20px;
	margin: 0 0 1.5em;
}
.cr-box__head {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
}
.cr-box__draw { font-size: .9em; opacity: .8; }
.cr-box__note { margin: 10px 0 6px; font-size: .9em; opacity: .8; }
.cr-box__closed { margin: 12px 0 0; font-weight: 600; }

/* Badges */
.cr-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: .75em;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	background: var(--cr-track);
}
.cr-badge--live { background: var(--cr-good); color: #fff; }
.cr-badge--sold_out, .cr-badge--ended { background: var(--cr-bad); color: #fff; }
.cr-badge--drawn { background: var(--cr-accent); color: var(--cr-accent-text); }

/* Countdown */
.cr-countdown { display: flex; gap: 8px; margin: 0 0 14px; }
.cr-countdown__unit {
	flex: 1 1 0;
	max-width: 84px;
	text-align: center;
	padding: 8px 4px;
	border-radius: 8px;
	background: var(--cr-accent);
	color: var(--cr-accent-text);
	line-height: 1.1;
}
.cr-countdown__unit b { display: block; font-size: 1.6em; font-variant-numeric: tabular-nums; }
.cr-countdown__unit small { font-size: .7em; letter-spacing: .08em; opacity: .75; }
.cr-countdown--compact { gap: 4px; margin: 6px 0 0; }
.cr-countdown--compact .cr-countdown__unit { padding: 4px 2px; border-radius: 5px; }
.cr-countdown--compact .cr-countdown__unit b { font-size: 1em; }
.cr-countdown--compact .cr-countdown__unit small { font-size: .6em; }

/* Progress */
.cr-progress { margin: 6px 0 4px; }
.cr-progress__bar {
	height: 10px;
	border-radius: 999px;
	background: var(--cr-track);
	overflow: hidden;
}
.cr-progress__bar span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--cr-accent);
	transition: width .6s ease;
}
.cr-progress__label {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	margin-top: 6px;
	font-size: .85em;
	opacity: .85;
}
.cr-loop { margin: 8px 0 10px; font-size: .9em; }
.cr-loop .cr-progress__label { font-size: .8em; }

/* Entry question */
.cr-question {
	border: 1px solid var(--cr-border);
	border-radius: var(--cr-radius);
	padding: 12px 16px 8px;
	margin: 0 0 1em;
	width: 100%;
}
.cr-question legend { font-weight: 700; padding: 0 6px; }
.cr-question__option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	margin: 0 0 6px;
	border: 1px solid var(--cr-border);
	border-radius: 8px;
	cursor: pointer;
}
.cr-question__option:has(input:checked) { border-color: var(--cr-accent); box-shadow: inset 0 0 0 1px var(--cr-accent); }
.cr-question__option input { margin: 0; }

/* Tickets */
.cr-ticket {
	display: inline-block;
	padding: 3px 10px;
	margin: 0 6px 6px 0;
	border-radius: 6px;
	background: var(--cr-accent);
	color: var(--cr-accent-text);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.cr-ticket--winner { background: #ca8a04; color: #fff; }
.cr-order-tickets { margin: 0 0 2em; }
.cr-ticket-card {
	border: 2px dashed var(--cr-border);
	border-radius: var(--cr-radius);
	padding: 14px 16px 8px;
	margin: 0 0 12px;
}
.cr-ticket-card__title {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
	align-items: center;
	margin-bottom: 10px;
	font-weight: 700;
}
.cr-ticket-card__title small { font-weight: 400; opacity: .75; }
.cr-order-tickets__note { font-size: .9em; opacity: .75; }

/* Winners */
.cr-winners { margin-top: 14px; }
.cr-winners h3 { margin: 0 0 6px; font-size: 1em; }
.cr-winners ol { margin: 0 0 0 1.2em; }

/* Entries list */
.cr-entries__search { display: flex; gap: 8px; margin: 0 0 12px; max-width: 420px; }
.cr-entries__search input { flex: 1; min-width: 0; }
.cr-entries__table td, .cr-entries__table th { padding: 8px 10px; }
.cr-entries__pages { margin-top: 10px; }
.cr-entries__pages .page-numbers { padding: 4px 8px; }

/* Ticket checker */
.cr-checker label { display: block; margin-bottom: 6px; }
.cr-checker__row { display: flex; flex-wrap: wrap; gap: 8px; }
.cr-checker__row input { flex: 1 1 220px; min-width: 0; }
.cr-notice { padding: 10px 14px; border-radius: 8px; background: rgba(21, 128, 61, .1); }
.cr-notice--error { background: rgba(185, 28, 28, .1); }

@media (max-width: 480px) {
	.cr-countdown__unit b { font-size: 1.3em; }
}

/* Quantity label */
.cr-qty-label { flex-basis: 100%; margin: 0 0 6px; font-weight: 700; }

/* Raffle buy form: question → label → quantity + button. !important beats page builders (Avada etc.)
   that lay the cart form out as one non-wrapping row. */
form.cart.cr-cart-form,
form.cart:has(.cr-qty-label) {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 10px !important;
}
form.cart .cr-question,
form.cart .cr-qty-label {
	flex: 0 0 100% !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
	order: 0 !important;
}
form.cart.cr-cart-form .quantity,
form.cart.cr-cart-form .single_add_to_cart_button,
form.cart:has(.cr-qty-label) .quantity,
form.cart:has(.cr-qty-label) .single_add_to_cart_button {
	flex: 0 0 auto !important;
	margin: 0 !important;
	float: none !important;
}
