/*
 * Live Preview (WordPress Playground): the notice above "Connect with Google" and the waiting panel under it
 * (wpsslc-live-preview.js). Direction-neutral, so it serves right-to-left sites as it is.
 */
.wpsslc-live-preview-notice {
	box-sizing: border-box;
	max-width: 640px;
	margin: 0 0 14px !important;
	padding: 10px 14px;
	border: 1px solid #bfdbfe;
	border-radius: 8px;
	background: #eff6ff;
	color: #1e3a8a !important;
	font-size: 13px !important;
	line-height: 1.55 !important;
}

.wpsslc-live-preview {
	box-sizing: border-box;
	max-width: 640px;
	margin-top: 14px;
	padding: 14px 16px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	background: #f8fafc;
	color: #334155;
	font-size: 13px;
	line-height: 1.55;
}

.wpsslc-live-preview p {
	margin: 0 0 10px !important;
	color: inherit !important;
	font-size: 13px !important;
	line-height: 1.55 !important;
}

.wpsslc-live-preview__label {
	display: block;
	margin: 0 0 6px;
	font-weight: 600;
}

.wpsslc-live-preview__row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.wpsslc-live-preview__row input {
	flex: 1 1 220px;
	min-width: 0;
	padding: 8px 10px;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	background: #fff;
	font: 13px/1.4 ui-monospace, Menlo, Consolas, monospace;
}

.wpsslc-live-preview__row button {
	padding: 8px 14px;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	background: #fff;
	color: #1e293b;
	font-weight: 600;
	cursor: pointer;
}

.wpsslc-live-preview__row .wpsslc-live-preview__paste {
	border-color: #4169e1;
	background: #4169e1;
	color: #fff;
}

.wpsslc-live-preview__row button:disabled {
	opacity: 0.6;
	cursor: progress;
}

.wpsslc-live-preview .wpsslc-live-preview__error {
	margin: 10px 0 0 !important;
	color: #b91c1c !important;
	font-weight: 600;
}