/* HashOne Stripe Pay — override the variables in your theme to restyle */
.hsp-wrap {
	--hsp-accent: #635bff;
	--hsp-accent-hover: #4b44d6;
	--hsp-text: #1a1f36;
	--hsp-muted: #6b7280;
	--hsp-border: #e3e6ee;
	--hsp-bg: #ffffff;
	--hsp-radius: 10px;
	max-width: 480px;
	font-family: inherit;
	color: var(--hsp-text);
}

.hsp-wrap *,
.hsp-wrap *::before,
.hsp-wrap *::after { box-sizing: border-box; }

.hsp-open,
.hsp-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 28px;
	border: 0;
	border-radius: var(--hsp-radius);
	background: var(--hsp-accent);
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background .2s ease, transform .15s ease, box-shadow .2s ease;
	box-shadow: 0 4px 14px rgba(99, 91, 255, .25);
}
.hsp-open:hover,
.hsp-submit:hover { background: var(--hsp-accent-hover); transform: translateY(-1px); }
.hsp-open:focus-visible,
.hsp-submit:focus-visible { outline: 3px solid rgba(99, 91, 255, .4); outline-offset: 2px; }
.hsp-submit { width: 100%; margin-top: 8px; }
.hsp-submit:disabled { opacity: .7; cursor: wait; transform: none; }

.hsp-panel { margin-top: 16px; }
.hsp-panel[hidden] { display: none; }

.hsp-form {
	background: var(--hsp-bg);
	border: 1px solid var(--hsp-border);
	border-radius: calc(var(--hsp-radius) + 4px);
	padding: 24px;
	box-shadow: 0 10px 30px rgba(26, 31, 54, .06);
	animation: hspIn .25s ease;
}
@keyframes hspIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

.hsp-title { margin: 0 0 16px; font-size: 20px; line-height: 1.3; }

.hsp-field { margin-bottom: 16px; }
.hsp-field label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; }
.hsp-req { color: #df1b41; }

.hsp-field input[type="text"],
.hsp-field input[type="email"],
.hsp-field input[type="number"] {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--hsp-border);
	border-radius: var(--hsp-radius);
	background: #fff;
	font-size: 16px;
	color: var(--hsp-text);
	transition: border-color .2s, box-shadow .2s;
}
.hsp-field input:focus {
	outline: none;
	border-color: var(--hsp-accent);
	box-shadow: 0 0 0 3px rgba(99, 91, 255, .15);
}

.hsp-amount { display: flex; align-items: stretch; }
.hsp-amount-cur {
	display: flex;
	align-items: center;
	padding: 0 14px;
	border: 1px solid var(--hsp-border);
	border-right: 0;
	border-radius: var(--hsp-radius) 0 0 var(--hsp-radius);
	background: #f6f8fb;
	font-weight: 600;
	font-size: 14px;
	color: var(--hsp-muted);
}
.hsp-amount input[type="number"] {
	border-radius: 0 var(--hsp-radius) var(--hsp-radius) 0;
	font-size: 20px;
	font-weight: 600;
}
.hsp-help { display: block; margin-top: 6px; font-size: 12px; color: var(--hsp-muted); }

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

.hsp-msg { margin: 10px 0 0; font-size: 14px; min-height: 1em; }
.hsp-msg--error { color: #df1b41; }

.hsp-secure { margin: 12px 0 0; font-size: 12px; color: var(--hsp-muted); text-align: center; }
.hsp-secure::before { content: "\1F512\00a0"; }

.hsp-testmode {
	margin: 0 0 16px;
	padding: 8px 12px;
	border-radius: 8px;
	background: #fff8e6;
	color: #8a5a00;
	font-size: 13px;
}

.hsp-notice {
	margin-bottom: 16px;
	padding: 14px 16px;
	border-radius: var(--hsp-radius);
	font-size: 15px;
	border-left: 4px solid;
}
.hsp-notice--success { background: #e9f9ef; border-color: #1a9f53; color: #0f5b30; }
.hsp-notice--info    { background: #eef4ff; border-color: #3b6fd8; color: #1f3f80; }
.hsp-notice--warning { background: #fff8e6; border-color: #d99a00; color: #7a5200; }
.hsp-notice--error   { background: #fdecef; border-color: #df1b41; color: #8c0f28; }

@media (max-width: 480px) {
	.hsp-form { padding: 18px; }
	.hsp-open { width: 100%; }
}