/* Banner container (Admin preview only) */
#pcdelicoba-preview .pcdelicoba-banner {
	background-color: var(--pcdelicoba-bg-color, #ffffff);
	color: var(--pcdelicoba-text-color, #000000);
	padding: 1em;
	text-align: center;
	border-radius: 6px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	margin: 0 auto;
}

/* Two-column grid for settings (left) and live preview (right) */
.pcdelicoba-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
	text-align: center;
	margin-top: 12px;
}

@media (max-width: 1024px) {
	.pcdelicoba-grid {
		grid-template-columns: 1fr;
	}
}

.pcdelicoba-grid-right {
	position: sticky;
	top: 20px;
}

.pcdelicoba-preview-title {
	margin-top: 0;
}

/* Preview container uses CSS variables fed from inline style */
#pcdelicoba-preview {
	--pcdelicoba-bg: #ffffff;
	--pcdelicoba-text: #000000;
	--pcdelicoba-acc-bg: #000000;
	--pcdelicoba-acc-text: #ffffff;
	--pcdelicoba-acc-hover-bg: #333333;
	--pcdelicoba-acc-hover-text: #ffffff;
	--pcdelicoba-rej-bg: #333333;
	--pcdelicoba-rej-text: #ffffff;
	--pcdelicoba-rej-hover-bg: #000000;
	--pcdelicoba-rej-hover-text: #ffffff;

	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 16px;
	background: var(--pcdelicoba-bg);
	color: var(--pcdelicoba-text);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* Mimic frontend banner for realistic preview */
.pcdelicoba-banner {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.pcdelicoba-message {
	margin: 0;
}

.pcdelicoba-message a {
	text-decoration: underline;
	color: inherit;
}

.pcdelicoba-buttons {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.5em;
}

/* General button base */
.pcdelicoba-btn {
	border: 1px solid transparent;
	border-radius: 4px;
	padding: 0.5em 1.2em;
	cursor: pointer;
	font-weight: 500;
	transition:
		background-color 0.3s ease,
		color 0.3s ease,
		border-color 0.3s ease;
}

/* Accept button */
.pcdelicoba-accept {
	background-color: var(--pcdelicoba-accept-bg, #000000);
	color: var(--pcdelicoba-accept-text, #ffffff);
	border-color: var(--pcdelicoba-accept-bg, #000000);
}

.pcdelicoba-accept:hover,
.pcdelicoba-accept:focus {
	background-color: var(--pcdelicoba-accept-hover-bg, #333333);
	border-color: var(--pcdelicoba-accept-hover-bg, #333333);
	color: var(--pcdelicoba-accept-hover-text, #ffffff);
	outline: none;
}

/* Reject button (fixed invalid color + contrast) */
.pcdelicoba-reject {
	background-color: var(--pcdelicoba-reject-bg, #333333);
	color: var(--pcdelicoba-reject-text, #ffffff);
	border-color: var(--pcdelicoba-reject-bg, #333333);
}

.pcdelicoba-reject:hover,
.pcdelicoba-reject:focus {
	background-color: var(--pcdelicoba-reject-hover-bg, #000000);
	border-color: var(--pcdelicoba-reject-hover-bg, #000000);
	color: var(--pcdelicoba-reject-hover-text, #ffffff);
	outline: none;
}

/* Position variants simulated in preview (visual hint only) */
.pcdelicoba-position-top .pcdelicoba-banner,
.pcdelicoba-position-middle .pcdelicoba-banner,
.pcdelicoba-position-bottom .pcdelicoba-banner {
	/* In admin preview we just render the block; no fixed positioning */
}