/* jp-gerd-public.css — Shared public base styles */
:root {
	--jp-gerd-primary: #2563eb;
	--jp-gerd-dark: #0f172a;
	--jp-gerd-success: #16a34a;
	--jp-gerd-danger: #dc2626;
	--jp-gerd-warning: #d97706;
	--jp-gerd-muted: #64748b;
	--jp-gerd-border: #e2e8f0;
}

/* Trigger button — wrapper stretches in flex layouts (Gutenberg/blocks) so align=center works */
.jp-gerd-btn-wrapper {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	align-self: stretch;
}

.jp-gerd-btn-wrapper--left {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.jp-gerd-btn-wrapper--center {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.jp-gerd-btn-wrapper--right {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
}

/* Block editor / site editor: shortcode block is often a flex item — take full cell width */
.editor-styles-wrapper .wp-block-shortcode,
.block-editor-iframe__body .wp-block-shortcode,
.block-editor-block-list__layout .wp-block-shortcode {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.editor-styles-wrapper .jp-gerd-btn-wrapper,
.block-editor-iframe__body .jp-gerd-btn-wrapper,
.wp-block-shortcode .jp-gerd-btn-wrapper,
[class*="block-editor"] .jp-gerd-btn-wrapper {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	align-self: stretch;
	flex: 1 1 100%;
}

/* Trigger button */
.jp-gerd-trigger-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: none;
	cursor: pointer;
	font-family: inherit;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.jp-gerd-trigger-btn:hover {
	background-color: var(--jp-gerd-hover-bg, #1e293b) !important;
	color: var(--jp-gerd-hover-color, #fff) !important;
}

.jp-gerd-trigger-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	cursor: pointer;
	font-family: inherit;
}

/* Inline icon span */
.jp-gerd-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

/* Inline results */
.jp-gerd-inline-results {
	max-width: 680px;
	margin: 0 auto;
	padding: 24px 16px;
}

.jp-gerd-inline-header {
	margin-bottom: 24px;
}

.jp-gerd-inline-title {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--jp-gerd-dark);
}

.jp-gerd-inline-card {
	background: #fff;
	border: 1px solid var(--jp-gerd-border);
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 16px;
}

.jp-gerd-inline-severity .jp-gerd-severity-badge {
	display: inline-block;
	padding: 4px 14px;
	border-radius: 999px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 12px;
}

.jp-gerd-severity-mild     { background: #dcfce7; color: #166534; }
.jp-gerd-severity-moderate { background: #e0f2fe; color: #075985; }
.jp-gerd-severity-significant { background: #fef3c7; color: #92400e; }
.jp-gerd-severity-severe   { background: #fee2e2; color: #991b1b; }

.jp-gerd-severity-bar-wrap {
	background: var(--jp-gerd-border);
	border-radius: 999px;
	height: 8px;
	overflow: hidden;
	margin-bottom: 8px;
}

.jp-gerd-severity-bar {
	height: 100%;
	background: var(--jp-gerd-primary);
	border-radius: 999px;
	transition: width 0.6s ease;
}

.jp-gerd-inline-rf-card {
	background: #fff7ed;
	border-color: #fed7aa;
}

.jp-gerd-inline-scheduling {
	background: #f0fdf4;
	border-color: #bbf7d0;
}

.jp-gerd-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	background: var(--jp-gerd-primary);
	color: #fff;
	border-radius: 10px;
	text-decoration: none;
	font-weight: 600;
	font-size: 15px;
	margin-top: 12px;
	transition: background 0.15s ease;
}

.jp-gerd-cta-btn:hover {
	background: #1d4ed8;
	color: #fff;
}

.jp-gerd-inline-disclaimer {
	background: #f8fafc;
	border: 1px solid var(--jp-gerd-border);
	border-radius: 8px;
	padding: 14px 16px;
	font-size: 13px;
	color: var(--jp-gerd-muted);
	margin-top: 8px;
}

.jp-gerd-inline-error {
	color: var(--jp-gerd-danger);
	font-style: italic;
}