/* Bitcoin Membership Registration: front-end styles.
   Every visual choice is a CSS custom property set inline from the admin Design tab. */

.bmr-wrap {
	--bmr-primary: #4f46e5; --bmr-accent: #f7931a; --bmr-btn-text: #fff;
	--bmr-bg: #f1f5f9; --bmr-card: #fff; --bmr-input-bg: #fff;
	--bmr-text: #0f172a; --bmr-muted: #64748b; --bmr-border: #e2e8f0;
	--bmr-error: #dc2626; --bmr-success: #16a34a;
	--bmr-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--bmr-font-heading: var(--bmr-font-body);
	--bmr-fs: 16px; --bmr-title-fs: 32px; --bmr-h-fs: 18px; --bmr-h-weight: 700; --bmr-l-weight: 600;
	--bmr-maxw: 760px; --bmr-radius: 14px; --bmr-gap: 18px; --bmr-pad: 32px; --bmr-qr: 180px;

	container-type: inline-size;
	box-sizing: border-box;
	width: 100%;
	padding: clamp(12px, 4cqw, 40px);
	background: var(--bmr-bg);
	border-radius: var(--bmr-radius);
	font-family: var(--bmr-font-body);
	font-size: var(--bmr-fs);
	line-height: 1.5;
	color: var(--bmr-text);
	-webkit-font-smoothing: antialiased;
}
.bmr-wrap *, .bmr-wrap *::before, .bmr-wrap *::after { box-sizing: border-box; }
.bmr-wrap [hidden] { display: none !important; }

/* ---- Card ---- */
.bmr-card {
	max-width: var(--bmr-maxw);
	margin: 0 auto;
	padding: var(--bmr-pad);
	background: var(--bmr-card);
	border-radius: var(--bmr-radius);
}
.bmr-card-shadow .bmr-card { box-shadow: 0 1px 2px rgba(15,23,42,.06), 0 12px 32px -8px rgba(15,23,42,.14); }
.bmr-card-outline .bmr-card { border: 1px solid var(--bmr-border); }
.bmr-card-flat .bmr-card { box-shadow: none; }

/* ---- Header ---- */
.bmr-header { margin-bottom: calc(var(--bmr-pad) * .75); }
.bmr-align-center .bmr-header { text-align: center; }
.bmr-wrap .bmr-title {
	margin: 0 0 .35em; padding: 0; border: 0;
	font-family: var(--bmr-font-heading); font-size: var(--bmr-title-fs); font-weight: var(--bmr-h-weight);
	line-height: 1.15; letter-spacing: -.02em; color: var(--bmr-text);
}
.bmr-wrap .bmr-subtitle { margin: 0; color: var(--bmr-muted); font-size: 1em; }

/* ---- Sections ---- */
.bmr-form { counter-reset: bmr-step; margin: 0; }
.bmr-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.bmr-section { counter-increment: bmr-step; margin: 0 0 calc(var(--bmr-pad) * .9); }
.bmr-wrap .bmr-section-title {
	display: flex; align-items: center; gap: .6em;
	margin: 0 0 var(--bmr-gap); padding: 0 0 .7em; border: 0; border-bottom: 1px solid var(--bmr-border);
	font-family: var(--bmr-font-heading); font-size: var(--bmr-h-fs); font-weight: var(--bmr-h-weight);
	line-height: 1.25; color: var(--bmr-text);
}
.bmr-step {
	flex: none; display: inline-grid; place-items: center;
	width: 1.7em; height: 1.7em; border-radius: 50%;
	background: var(--bmr-primary); color: var(--bmr-btn-text);
	font-family: var(--bmr-font-body); font-size: .72em; font-weight: 700;
}
.bmr-step::before { content: counter(bmr-step); }

/* ---- Fields ---- */
.bmr-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--bmr-gap); }
.bmr-field { min-width: 0; }
.bmr-wrap .bmr-label { display: block; margin: 0 0 .4em; font-size: .9em; font-weight: var(--bmr-l-weight); color: var(--bmr-text); }
.bmr-req { color: var(--bmr-error); }
.bmr-opt { font-weight: 400; color: var(--bmr-muted); font-size: .9em; }
.bmr-hint { margin: .35em 0 0; font-size: .8em; color: var(--bmr-muted); }

.bmr-wrap .bmr-input {
	display: block; width: 100%; margin: 0; min-height: 2.9em;
	padding: .7em .9em;
	font: inherit; color: var(--bmr-text);
	background: var(--bmr-input-bg);
	border: 1.5px solid var(--bmr-border);
	border-radius: calc(var(--bmr-radius) * .65);
	box-shadow: none; outline: 0;
	transition: border-color .15s, box-shadow .15s, background-color .15s;
	appearance: none; -webkit-appearance: none;
}
.bmr-wrap textarea.bmr-input { resize: vertical; min-height: 5.5em; }
.bmr-wrap .bmr-input::placeholder { color: var(--bmr-muted); opacity: .7; }
.bmr-wrap .bmr-input:hover { border-color: color-mix(in srgb, var(--bmr-primary) 40%, var(--bmr-border)); }
.bmr-wrap .bmr-input:focus {
	border-color: var(--bmr-primary);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--bmr-primary) 18%, transparent);
}
.bmr-field.has-error .bmr-input { border-color: var(--bmr-error); }
.bmr-field.has-error .bmr-input:focus { box-shadow: 0 0 0 4px color-mix(in srgb, var(--bmr-error) 18%, transparent); }

.bmr-input-filled .bmr-input { background: color-mix(in srgb, var(--bmr-text) 5%, var(--bmr-card)); border-color: transparent; }
.bmr-input-underline .bmr-input { border-width: 0 0 2px; border-radius: 0; padding-left: .1em; padding-right: .1em; background: transparent; }
.bmr-input-underline .bmr-input:focus { box-shadow: none; }

.bmr-wrap .bmr-error { margin: .4em 0 0; font-size: .82em; font-weight: 500; color: var(--bmr-error); }

.bmr-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---- Payment ---- */
.bmr-wrap .bmr-lead { margin: 0 0 var(--bmr-gap); color: var(--bmr-muted); }
.bmr-pay {
	display: grid; grid-template-columns: minmax(0, 1fr); gap: calc(var(--bmr-gap) * 1.2);
	padding: calc(var(--bmr-pad) * .6);
	background: color-mix(in srgb, var(--bmr-accent) 7%, var(--bmr-card));
	border: 1px solid color-mix(in srgb, var(--bmr-accent) 28%, var(--bmr-border));
	border-radius: calc(var(--bmr-radius) * .85);
	justify-items: center;
}
.bmr-qr { width: var(--bmr-qr); max-width: 100%; aspect-ratio: 1; padding: 10px; background: #fff; border-radius: calc(var(--bmr-radius) * .6); box-shadow: 0 1px 3px rgba(15,23,42,.12); }
.bmr-qr svg, .bmr-qr-img { display: block; width: 100%; height: 100%; object-fit: contain; }
.bmr-no-qr .bmr-qr { display: none; }
.bmr-pay-info { width: 100%; min-width: 0; }
.bmr-coin { display: flex; align-items: center; gap: .55em; font-weight: 700; margin-bottom: .6em; }
.bmr-coin-badge { display: inline-grid; place-items: center; width: 1.9em; height: 1.9em; border-radius: 50%; background: var(--bmr-accent); color: #fff; font-size: 1.05em; line-height: 1; }
.bmr-wrap .bmr-fee { margin: 0 0 .25em; font-size: 1.15em; font-weight: 700; }
.bmr-wrap .bmr-amount { margin: 0 0 .7em; color: var(--bmr-muted); }
.bmr-addr-label { display: block; margin-bottom: .35em; font-size: .78em; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bmr-muted); }
.bmr-addr-box { display: flex; align-items: stretch; gap: .5em; padding: .35em .35em .35em .85em; background: var(--bmr-card); border: 1.5px dashed color-mix(in srgb, var(--bmr-accent) 55%, var(--bmr-border)); border-radius: calc(var(--bmr-radius) * .6); }
.bmr-wrap .bmr-addr { flex: 1; align-self: center; min-width: 0; padding: 0; background: none; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85em; line-height: 1.4; color: var(--bmr-text); word-break: break-all; user-select: all; }
.bmr-wrap .bmr-copy {
	flex: none; margin: 0; padding: .55em 1em; cursor: pointer;
	font: inherit; font-size: .85em; font-weight: 600; color: var(--bmr-btn-text);
	background: var(--bmr-primary); border: 0; border-radius: calc(var(--bmr-radius) * .45);
	transition: filter .15s, transform .1s;
}
.bmr-wrap .bmr-copy:hover { filter: brightness(1.08); }
.bmr-wrap .bmr-copy:active { transform: scale(.97); }
.bmr-wrap .bmr-copy.is-copied { background: var(--bmr-success); }
.bmr-wrap .bmr-note { margin: .8em 0 0; font-size: .85em; color: var(--bmr-muted); }

/* ---- Upload ---- */
.bmr-drop { position: relative; }
.bmr-file { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 1; }
.bmr-drop-inner {
	display: flex; flex-direction: column; align-items: center; gap: .35em; text-align: center;
	padding: calc(var(--bmr-pad) * .8) 1em;
	color: var(--bmr-muted);
	background: color-mix(in srgb, var(--bmr-text) 2.5%, var(--bmr-card));
	border: 2px dashed var(--bmr-border);
	border-radius: calc(var(--bmr-radius) * .85);
	transition: border-color .15s, background-color .15s, color .15s;
}
.bmr-drop-inner strong { color: var(--bmr-text); font-weight: 600; }
.bmr-drop-icon { color: var(--bmr-primary); }
.bmr-drop-help { font-size: .82em; }
.bmr-drop:hover .bmr-drop-inner, .bmr-drop.is-drag .bmr-drop-inner { border-color: var(--bmr-primary); background: color-mix(in srgb, var(--bmr-primary) 6%, var(--bmr-card)); }
.bmr-drop:focus-within .bmr-drop-inner { border-color: var(--bmr-primary); box-shadow: 0 0 0 4px color-mix(in srgb, var(--bmr-primary) 18%, transparent); }
.bmr-field.has-error .bmr-drop-inner { border-color: var(--bmr-error); }
.bmr-drop.has-file .bmr-drop-inner { display: none; }
.bmr-file-preview { position: relative; z-index: 2; display: flex; align-items: center; gap: .8em; padding: .7em .9em; background: var(--bmr-input-bg); border: 1.5px solid var(--bmr-border); border-radius: calc(var(--bmr-radius) * .65); }
.bmr-file-preview img { width: 56px; height: 56px; object-fit: cover; border-radius: calc(var(--bmr-radius) * .4); }
.bmr-file-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.bmr-wrap .bmr-file-remove { flex: none; width: 2em; height: 2em; padding: 0; cursor: pointer; font-size: 1.2em; line-height: 1; color: var(--bmr-muted); background: transparent; border: 0; border-radius: 50%; }
.bmr-wrap .bmr-file-remove:hover { background: color-mix(in srgb, var(--bmr-error) 12%, transparent); color: var(--bmr-error); }

/* ---- Button ---- */
.bmr-actions { margin-top: calc(var(--bmr-gap) * 1.2); display: flex; }
.bmr-wrap .bmr-submit {
	position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .6em;
	margin: 0; padding: .95em 1.8em; cursor: pointer;
	font: inherit; font-weight: 700; letter-spacing: .01em; color: var(--bmr-btn-text);
	background: var(--bmr-primary); border: 0; border-radius: calc(var(--bmr-radius) * .7);
	box-shadow: 0 6px 16px -6px color-mix(in srgb, var(--bmr-primary) 70%, transparent);
	transition: filter .15s, transform .12s, box-shadow .15s;
}
.bmr-btn-full .bmr-submit { width: 100%; }
.bmr-wrap .bmr-submit:hover { filter: brightness(1.08); transform: translateY(-1px); }
.bmr-wrap .bmr-submit:active { transform: translateY(0); }
.bmr-wrap .bmr-submit:focus-visible, .bmr-wrap .bmr-copy:focus-visible { outline: 3px solid color-mix(in srgb, var(--bmr-primary) 45%, transparent); outline-offset: 2px; }
.bmr-wrap .bmr-submit[disabled] { opacity: .7; cursor: progress; transform: none; }
.bmr-spinner { display: none; width: 1.1em; height: 1.1em; border: 2.5px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: bmr-spin .7s linear infinite; }
.is-loading .bmr-spinner { display: inline-block; }
@keyframes bmr-spin { to { transform: rotate(360deg); } }

/* ---- Alerts / success ---- */
.bmr-alert { margin: 0 0 var(--bmr-gap); padding: .85em 1em; font-size: .92em; font-weight: 500; border-radius: calc(var(--bmr-radius) * .6); }
.bmr-alert-error { color: var(--bmr-error); background: color-mix(in srgb, var(--bmr-error) 9%, var(--bmr-card)); border: 1px solid color-mix(in srgb, var(--bmr-error) 30%, transparent); }
.bmr-success { padding: calc(var(--bmr-pad) * .8) 0; text-align: center; }
.bmr-success-icon { display: inline-grid; place-items: center; width: 64px; height: 64px; margin-bottom: 1em; color: #fff; background: var(--bmr-success); border-radius: 50%; box-shadow: 0 0 0 10px color-mix(in srgb, var(--bmr-success) 16%, transparent); animation: bmr-pop .45s cubic-bezier(.2,1.4,.4,1); }
.bmr-wrap .bmr-success-title { margin: 0 0 .4em; font-family: var(--bmr-font-heading); font-size: calc(var(--bmr-title-fs) * .8); font-weight: var(--bmr-h-weight); color: var(--bmr-text); }
.bmr-wrap .bmr-success-msg { max-width: 34em; margin: 0 auto; color: var(--bmr-muted); }
@keyframes bmr-pop { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* ---- Responsive: container queries, so it adapts to the column it sits in ---- */
@container (min-width: 560px) {
	.bmr-cols-2 .bmr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bmr-cols-2 .bmr-grid .bmr-full { grid-column: 1 / -1; }
	.bmr-pay { grid-template-columns: auto minmax(0, 1fr); justify-items: stretch; align-items: center; }
	.bmr-pay .bmr-qr { justify-self: center; }
}
@container (max-width: 420px) {
	.bmr-addr-box { flex-direction: column; padding: .7em; }
	.bmr-wrap .bmr-copy { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.bmr-wrap *, .bmr-wrap *::before, .bmr-wrap *::after { animation: none !important; transition: none !important; }
}