/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 25 2026 | 16:56:35 */
/**
 * BLG Phone Verify — styling for the inline verifier UI.
 *
 * Mobile-first: button stacks below the field. ≥ 600px, actions sit inline.
 * Inherits theme color tokens via --blg-pv-* with sensible fallbacks.
 */

.blg-pv-wrap {
	--blg-pv-accent:    var(--blg-accent,  #2563eb);
	--blg-pv-ok:        var(--blg-ok,      #16a34a);
	--blg-pv-error:     var(--blg-error,   #dc2626);
	--blg-pv-muted:     var(--blg-muted,   #6b7280);
	--blg-pv-bg-soft:   var(--blg-bg-soft, #f3f4f6);
	--blg-pv-border:    var(--blg-border,  #d1d5db);
	--blg-pv-radius:    var(--blg-radius,  6px);

	margin-top: 0.5rem;
	font-size: 0.95rem;
	line-height: 1.4;
}

/* ---- Actions row (Send / Resend / Verified badge) ---------------------- */

.blg-pv-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: center;
}

.blg-pv-actions[aria-hidden="true"] { display: none; }

.blg-pv-send-btn {
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	min-height: 44px;
	padding: 0.5rem 1rem;
	border: 1px solid var(--blg-pv-accent);
	background: var(--blg-pv-accent);
	color: #fff;
	border-radius: var(--blg-pv-radius);
	font: inherit;
	font-weight: 600;
	transition: opacity 0.15s ease, background 0.15s ease;
	width: 100%;
}

.blg-pv-send-btn:hover:not([disabled]) { opacity: 0.92; }

.blg-pv-send-btn[disabled] {
	opacity: 0.55;
	cursor: not-allowed;
}

/* ---- Code panel -------------------------------------------------------- */

.blg-pv-code-panel {
	margin-top: 0.75rem;
	padding: 0.75rem;
	background: var(--blg-pv-bg-soft);
	border: 1px solid var(--blg-pv-border);
	border-radius: var(--blg-pv-radius);
}

.blg-pv-code-panel[aria-hidden="true"] { display: none; }

.blg-pv-code-label {
	display: block;
	font-size: 0.9rem;
	color: var(--blg-pv-muted);
	margin-bottom: 0.4rem;
}

.blg-pv-code-row {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.blg-pv-code-input {
	font: inherit;
	font-size: 1.25rem;
	letter-spacing: 0.2em;
	text-align: center;
	min-height: 44px;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--blg-pv-border);
	border-radius: var(--blg-pv-radius);
	background: #fff;
	width: 100%;
}

.blg-pv-code-input:focus {
	outline: 2px solid var(--blg-pv-accent);
	outline-offset: 1px;
	border-color: var(--blg-pv-accent);
}

.blg-pv-confirm-btn {
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	min-height: 44px;
	padding: 0.5rem 1rem;
	border: 1px solid var(--blg-pv-accent);
	background: #fff;
	color: var(--blg-pv-accent);
	border-radius: var(--blg-pv-radius);
	font: inherit;
	font-weight: 600;
	width: 100%;
}

.blg-pv-confirm-btn:hover:not([disabled]) { background: var(--blg-pv-accent); color: #fff; }
.blg-pv-confirm-btn[disabled] { opacity: 0.55; cursor: not-allowed; }

/* ---- Status / errors --------------------------------------------------- */

.blg-pv-status {
	margin-top: 0.5rem;
	min-height: 1.2em;
	font-size: 0.9rem;
}

.blg-pv-status:empty { margin-top: 0; }

.blg-pv-status--error {
	color: var(--blg-pv-error);
}

/* ---- Verified state ---------------------------------------------------- */

.blg-pv-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.4rem 0.75rem;
	border-radius: var(--blg-pv-radius);
	font-weight: 600;
	font-size: 0.95rem;
}

.blg-pv-badge--ok {
	background: color-mix(in srgb, var(--blg-pv-ok) 15%, transparent);
	color: var(--blg-pv-ok);
}

/* Fallback for browsers without color-mix. */
@supports not (background: color-mix(in srgb, red, blue)) {
	.blg-pv-badge--ok {
		background: #dcfce7;
	}
}

.blg-pv-check {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.2em;
	height: 1.2em;
	border-radius: 50%;
	background: var(--blg-pv-ok);
	color: #fff;
	font-size: 0.8em;
	font-weight: 700;
	line-height: 1;
}

.blg-pv-edit-link {
	appearance: none;
	-webkit-appearance: none;
	background: none;
	border: none;
	padding: 0.25rem 0.5rem;
	color: var(--blg-pv-muted);
	font: inherit;
	font-size: 0.85rem;
	cursor: pointer;
	text-decoration: underline;
}

.blg-pv-edit-link:hover { color: var(--blg-pv-accent); }

/* Locked phone input cue */
input.blg-pv-locked {
	background-color: var(--blg-pv-bg-soft) !important;
	color: var(--blg-pv-muted) !important;
	cursor: not-allowed !important;
}

/* ---- ≥ 600px: side-by-side action layout, side-by-side code+confirm ---- */

@media (min-width: 600px) {
	.blg-pv-send-btn {
		width: auto;
		min-width: 10rem;
	}

	.blg-pv-confirm-btn {
		width: auto;
		min-width: 8rem;
		flex: 0 0 auto;
	}

	.blg-pv-code-row {
		flex-direction: row;
		align-items: stretch;
	}

	.blg-pv-code-input {
		flex: 1 1 auto;
		text-align: left;
		letter-spacing: 0.15em;
	}
}