/**
 * vmz-pwa.css — 0.10.52
 *
 * Cosmetic chrome for the front-end PWA UX: offline indicator pill,
 * notification-prefs status text. Loaded on every front-end pageview
 * by class-pwa.php / class-push-prefs.php.
 */

/* ---------- Offline pill (top centre of viewport while disconnected) ---- */
.vmz-offline-pill {
	position: fixed;
	left: 50%;
	top: 0;
	transform: translate(-50%, -110%);
	z-index: 9999;
	padding: 8px 14px;
	margin: 0;
	background: #B7300C;          /* WDL red for "attention" */
	color: #fff;
	font-family: 'Prometo', 'Lato', system-ui, -apple-system, sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.01em;
	border-radius: 0 0 12px 12px;
	box-shadow: 0 4px 12px rgba(14, 0, 60, 0.18);
	opacity: 0;
	pointer-events: none;
	transition: transform 240ms ease, opacity 240ms ease;
}
.vmz-offline-pill.is-visible {
	transform: translate(-50%, 0);
	opacity: 1;
}

/* ---------- Push-prefs save status (on /settings/) ---------------------- */
.vmz-pref-status {
	min-height: 1.4em;
}
.vmz-pref-status.vmz-ok  { color: #0a7a3b; }
.vmz-pref-status.vmz-err { color: #B7300C; }

/* ---------- Inline draft-restore message styling (question form) -------- */
.vmz-form-feedback.vmz-info {
	color: var(--fg-2, #0E003C);
	background: rgba(0, 91, 172, 0.08);
	padding: 8px 12px;
	border-radius: 6px;
}