/* Heart Raffle public styles — brand-matched to the marketing site. */
.hr-app { --hr-red:#c0242b; --hr-red-dark:#8f1d21; --hr-black:#131316; --hr-gray:#6c6c70; --hr-line:#e6e4e0; --hr-paper:#fbfaf9;
	font-family:'Manrope','Helvetica Neue',Arial,sans-serif; color:var(--hr-black); line-height:1.6; max-width:1080px; margin:0 auto; }
.hr-app *, .hr-app *::before, .hr-app *::after { box-sizing:border-box; }
.hr-app [hidden] { display:none !important; }
.hr-app h3 { font-size:20px; margin:0 0 6px; font-weight:800; text-transform:uppercase; letter-spacing:.03em; }
.hr-muted { color:var(--hr-gray); font-size:14px; margin:0 0 10px; }
.hr-fine { font-size:11.5px; color:#a7a7ab; margin-top:12px; }

.hr-card { background:#fff; border:1px solid var(--hr-line); border-radius:14px; padding:26px; box-shadow:0 6px 20px rgba(10,10,11,.05); margin-bottom:18px; }
.hr-card.hr-dark { background:linear-gradient(160deg,#1c1c20,#0c0c0e 70%); color:#fff; border:none; }
.hr-card.hr-dark h3 { color:#e3c384; }
.hr-card.hr-dark p { color:#a7a7ab; font-size:14px; }
.hr-card.hr-dark input { background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.2); color:#fff; }
.hr-closed { text-align:center; padding:48px 30px; }

.hr-steps { display:flex; gap:6px; margin:6px 0 20px; }
.hr-step { flex:1; text-align:center; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#a7a7ab; padding:9px 4px 11px; border-bottom:3px solid #ddd9d3; white-space:nowrap; overflow:hidden; }
.hr-step.is-active { color:var(--hr-red); border-color:var(--hr-red); }
.hr-step.is-done { color:#1e7a3c; border-color:#1e7a3c; }

.hr-cols { display:grid; grid-template-columns:1fr 340px; gap:22px; align-items:start; }
.hr-panel { display:none; }
.hr-panel.is-active { display:block; }
.hr-actions { display:flex; justify-content:space-between; gap:12px; }

.hr-app label { display:block; font-size:11.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--hr-gray); margin-top:12px; }
.hr-app input[type=text], .hr-app input[type=tel], .hr-app input[type=email] { width:100%; padding:12px 14px; font:inherit; font-size:15px; border:1.5px solid #d5d3ce; border-radius:10px; background:var(--hr-paper); color:inherit; margin-top:5px; }
.hr-app input:focus { outline:none; border-color:var(--hr-red); box-shadow:0 0 0 3px rgba(192,36,43,.12); }
.hr-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:0 14px; }
.hr-grid3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:0 14px; }
.hr-check { display:flex; gap:10px; align-items:flex-start; font-size:14px !important; font-weight:600 !important; letter-spacing:0 !important; text-transform:none !important; color:var(--hr-black) !important; margin-top:16px !important; }
.hr-check input { width:17px !important; height:17px; accent-color:var(--hr-red); margin-top:3px; }
.hr-secure { font-size:12.5px; color:var(--hr-gray); margin-top:14px; }
.hr-error { background:#fdeaea; color:var(--hr-red-dark); border-radius:10px; padding:12px 15px; font-size:14px; margin-top:14px; }

.hr-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:linear-gradient(135deg,#e0313a,var(--hr-red) 55%,#8f171d); color:#fff !important; text-decoration:none !important; font-weight:800; font-size:13.5px; letter-spacing:.08em; text-transform:uppercase; padding:14px 30px; border-radius:999px; border:none; cursor:pointer; box-shadow:0 8px 24px rgba(192,36,43,.3); transition:transform .15s,filter .15s; }
.hr-btn:hover { transform:translateY(-1px); filter:brightness(1.07); }
.hr-btn:disabled { opacity:.5; cursor:wait; transform:none; }
.hr-btn-ghost { background:transparent; color:var(--hr-black) !important; border:1.5px solid #c9c7c2; box-shadow:none; }
.hr-btn-sm { padding:11px 20px; font-size:11.5px; }
.hr-btn-block { width:100%; margin-top:10px; }

.hr-qty-row { display:flex; align-items:center; gap:20px; margin-top:14px; }
.hr-stepper { display:flex; align-items:center; border:1.5px solid #d5d3ce; border-radius:999px; overflow:hidden; background:var(--hr-paper); }
.hr-stepper button { width:50px; height:50px; border:none; background:transparent; cursor:pointer; font-size:24px; color:var(--hr-red); }
.hr-stepper #hr-qty { width:56px; text-align:center; font-size:26px; font-weight:800; }
.hr-qty-total strong { font-size:26px; }
.hr-qty-total small { display:block; font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--hr-gray); }

.hr-inline { display:flex; gap:10px; align-items:center; margin-top:12px; }
.hr-inline input { margin-top:0 !important; }
.hr-lk-msg { margin-top:10px; font-size:13.5px; color:#e3c384; min-height:18px; }
#hr-lookup .hr-lk-msg { color:var(--hr-red-dark); }
.hr-lk-orders a { display:block; margin-top:10px; color:var(--hr-red); font-weight:700; }

.hr-holder-card h3 span { color:var(--hr-red); }
.hr-holder-tag { float:right; font-size:12px; font-weight:800; color:#a7a7ab; letter-spacing:.06em; }
.hr-holder-row { display:grid; grid-template-columns:1fr 1fr 110px; gap:0 14px; align-items:end; }
.hr-qty-mini { display:flex; align-items:center; border:1.5px solid #d5d3ce; border-radius:10px; background:var(--hr-paper); margin-top:5px; overflow:hidden; }
.hr-qty-mini button { width:34px; height:44px; border:none; background:transparent; cursor:pointer; font-size:18px; color:var(--hr-red); }
.hr-qty-mini input { width:100%; border:none !important; background:transparent !important; text-align:center; font-weight:800; font-size:16px; padding:0 !important; margin:0 !important; }
.hr-qty-mini input:focus { box-shadow:none !important; }
.hr-remove-person { background:none; border:none; color:var(--hr-red); font-size:12.5px; font-weight:700; cursor:pointer; padding:0; margin-top:10px; }
#hr-split-foot { display:flex; align-items:center; gap:16px; margin:-6px 0 16px; }
#hr-split-foot[hidden] { display:none; }
.hr-split-status { font-size:13.5px; font-weight:700; color:var(--hr-gray); }
.hr-split-status.ok { color:#1e7a3c; }
.hr-split-status.over { color:var(--hr-red-dark); }
@media (max-width:820px) { .hr-holder-row { grid-template-columns:1fr 1fr; } }

.hr-summary { position:sticky; top:20px; }
.hr-sum-row { display:flex; justify-content:space-between; padding:9px 0; font-size:14.5px; border-bottom:1px dashed var(--hr-line); }
.hr-sum-total { border-bottom:none; font-size:22px; font-weight:800; padding-top:12px; }
.hr-cause { margin-top:14px; padding:12px 14px; background:#fdf3f3; border-radius:10px; font-size:13px; color:var(--hr-red-dark); }

/* confirmation */
.hr-confirm-hero { text-align:center; padding:14px 0 8px; }
.hr-badge { width:70px; height:70px; margin:0 auto 14px; border-radius:50%; background:#e3f1e7; color:#1e7a3c; font-size:34px; line-height:70px; text-align:center; }
.hr-confirm-hero h2 { font-size:clamp(28px,5vw,42px); margin:0 0 8px; text-transform:uppercase; }
.hr-confirm-hero p { color:var(--hr-gray); }
.hr-ticket-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
.hr-mini-ticket { border:1.5px dashed #cfccc6; border-radius:12px; background:var(--hr-paper); padding:14px 16px; border-left:5px solid var(--hr-red); }
.hr-mini-ticket.is-void { opacity:.5; }
.hr-mt-no { font-size:18px; font-weight:800; }
.hr-mt-name { font-weight:700; font-size:14px; }
.hr-mt-ph { font-size:12.5px; color:var(--hr-gray); }
.hr-email-note { margin-top:16px; background:#f6ecd9; border-radius:12px; padding:13px 15px; font-size:13.5px; color:#6b5222; }

/* receipt: hidden until View Receipt opens it on screen */
body.hr-view-receipt .hr-print-receipt { display:block; background:#fff; color:#222; border-radius:14px;
	padding:22px 24px; margin:20px 0 0; font:14px/1.6 Georgia, "Times New Roman", serif;
	box-shadow:0 10px 30px rgba(0,0,0,.25); }
.hr-print-receipt .hr-pr-toolbar { display:flex; gap:10px; justify-content:flex-end; margin-bottom:14px; }
.hr-print-receipt .hr-pr-org { font-size:20px; font-weight:800; border-bottom:3px solid #8f1d21; padding-bottom:4px; }
.hr-print-receipt .hr-pr-sub { font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#777; margin:4px 0 12px; }
.hr-print-receipt table { width:100%; border-collapse:collapse; margin-top:8px; }
.hr-print-receipt th { text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#888; border-bottom:1px solid #ddd; padding:6px 4px; }
.hr-print-receipt td { padding:6px 4px; border-bottom:1px solid #eee; }
.hr-print-receipt tfoot td { border-top:2px solid #333; border-bottom:0; font-size:14px; padding-top:8px; }
.hr-print-receipt .hr-pr-fine { margin-top:14px; font-size:10.5px; color:#888; }

/* print: business-card tickets only */
.hr-print-sheet, .hr-print-receipt { display:none; }
@media print {
	@page { margin: 0.5in; }
	html, body { background:#fff !important; height:auto !important; }
	/* Theme chrome (site header/footer, any sibling sections) prints nothing
	   and takes no space — this is what keeps mobile prints white and the
	   page count honest. Browsers without :has() fall back to the
	   visibility rules below (white page, possibly extra blank pages). */
	body > *:not(:has(.hr-app)) { display:none !important; }
	/* …and every sibling along the WHOLE ancestor chain (Elementor sections,
	   page heroes, sticky bars living deep inside the page wrapper) — only
	   the path down to the app survives. */
	body :has(.hr-app) > *:not(:has(.hr-app)):not(.hr-app) { display:none !important; }
	/* collapse the wrappers between body and the app — no forced heights,
	   spacing, or dark backgrounds left to print */
	body :has(.hr-app) { min-height:0 !important; height:auto !important; margin:0 !important;
		padding:0 !important; background:transparent !important; }
	.hr-confirm > *:not(.hr-print-sheet):not(.hr-print-receipt) { display:none !important; }
	body * { visibility:hidden; background:transparent !important; }
	.hr-print-sheet, .hr-print-sheet * { visibility:visible; }
	/* phone numbers get auto-linked on mobile — keep them looking like text */
	.hr-print-sheet a, .hr-print-receipt a { color:inherit !important; text-decoration:none !important; }
	body.hr-mode-receipt .hr-print-sheet { display:none !important; }
	body.hr-mode-receipt .hr-print-receipt, body.hr-mode-receipt .hr-print-receipt * { visibility:visible; }
	body.hr-mode-receipt .hr-print-receipt { display:block; width:100%; background:#fff !important;
		position:absolute; left:0; top:0; padding:24px;
		font:13px/1.6 Georgia, serif; color:#222; box-sizing:border-box; }
	.hr-print-receipt .hr-pr-org { font-size:20px; font-weight:800; border-bottom:3px solid #8f1d21; padding-bottom:4px; }
	.hr-print-receipt .hr-pr-sub { font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#777; margin:4px 0 12px; }
	.hr-print-receipt table { width:100%; border-collapse:collapse; margin-top:8px; }
	.hr-print-receipt th { text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#888; border-bottom:1px solid #ddd; padding:6px 4px; }
	.hr-print-receipt td { padding:6px 4px; border-bottom:1px solid #eee; }
	.hr-print-receipt .hr-pr-fine { margin-top:14px; font-size:10.5px; color:#888; }
	.hr-print-receipt { max-width:7.5in; margin:0 auto; box-shadow:none; border-radius:0; }
	.hr-pr-toolbar { display:none !important; }
	.hr-print-receipt tfoot td { border-top:2px solid #333; border-bottom:0; font-size:14px; padding-top:8px; }
	.hr-print-sheet { display:grid; grid-template-columns:repeat(2,3.5in); justify-content:center; width:100%;
		background:#fff !important; position:absolute; left:0; top:0; }
	/* in modern browsers the theme chrome is display:none, so the sheets can
	   flow normally — correct page count, proper page breaks */
	@supports selector(:has(a)) {
		.hr-print-sheet, body.hr-mode-receipt .hr-print-receipt { position:static; padding-top:0; }
	}
	/* Narrow paper (phones): plain block stacking — Safari ignores
	   break-inside:avoid for grid items, so grid tickets split across
	   pages; block-level cards paginate whole. */
	@media (max-width: 7.2in) {
		.hr-print-sheet { display:block; }
		.hr-print-sheet .hr-pt { margin:0 auto .15in; break-inside:avoid; page-break-inside:avoid; }
	}
	.hr-pt { width:3.5in; height:2in; border:1px dashed #999; padding:.18in .22in; display:flex; flex-direction:column; justify-content:space-between; page-break-inside:avoid; }
	.hr-pt-head { display:flex; justify-content:space-between; align-items:baseline; }
	.hr-pt-title { font-weight:800; font-size:11pt; }
	.hr-pt-no { font-weight:800; font-size:16pt; color:#8f1d21; }
	.hr-pt-who { font-size:11pt; font-weight:700; }
	.hr-pt-ph { font-size:9pt; color:#555; }
	.hr-pt-org { font-size:6.3pt; color:#888; letter-spacing:.06em; text-transform:uppercase; }
}

@media (max-width:820px) {
	.hr-cols { grid-template-columns:1fr; }
	.hr-summary { position:static; order:-1; }
	/* …but on the confirmation page the ticket numbers come FIRST — the
	   print buttons can wait below them. */
	.hr-confirm .hr-summary { order:0; }
	.hr-grid3 { grid-template-columns:1fr 1fr; }
	.hr-ticket-grid { grid-template-columns:1fr; }
	.hr-steps { overflow-x:auto; }
}

/* field-level validation */
.hr-app input.hr-field-missing { border-color:#c0242b !important; background:#fdf4f4; }
.hr-app label.hr-label-missing { color:#c0242b; }