/**
 * Theme isolation for the modal + chat shell only (#jp-gerd-modal-overlay…).
 *
 * Loads after jp-gerd-chat.css. Block themes and plugins often ship global rules for
 * `button`, `a`, inputs, or link colors — including `!important` — which override
 * the plugin palette. Repeat the same CSS variables already set on the overlay,
 * but with ID-scoped specificity and !important where themes typically win.
 */

#jp-gerd-modal-overlay.jp-gerd-overlay {
	background: var(--jp-gerd-overlay-color, rgba(0, 0, 0, 0.6)) !important;
	font-family:
		system-ui,
		-apple-system,
		'Segoe UI',
		Roboto,
		Helvetica,
		Arial,
		sans-serif !important;
	/* Stacking: --jp-gerd-z is set inline by JS; !important beats many theme modal layers */
	z-index: var(--jp-gerd-z, 999999) !important;
	transform: translateZ(0) !important;
	-webkit-transform: translateZ(0) !important;
}

#jp-gerd-modal-overlay .jp-gerd-modal {
	background-color: var(--jp-gerd-modal-bg, #ffffff) !important;
	background: var(--jp-gerd-modal-bg, #ffffff) !important;
}

#jp-gerd-modal-overlay .jp-gerd-modal-header {
	background-color: var(--jp-gerd-header-bg, #0f172a) !important;
	background: var(--jp-gerd-header-bg, #0f172a) !important;
	color: var(--jp-gerd-header-text, #ffffff) !important;
}

#jp-gerd-modal-overlay .jp-gerd-bot-name {
	color: inherit !important;
}

#jp-gerd-modal-overlay .jp-gerd-modal-header .jp-gerd-system-note,
#jp-gerd-modal-overlay .jp-gerd-modal-header #jp-gerd-system-note {
	color: var(--jp-gerd-system-note-color, rgba(255, 255, 255, 0.72)) !important;
	font-size: var(--jp-gerd-system-note-font-size, 12px) !important;
}

#jp-gerd-modal-overlay .jp-gerd-step-counter {
	color: inherit !important;
}

#jp-gerd-modal-overlay .jp-gerd-avatar {
	background-color: var(--jp-gerd-avatar-bg, #2563eb) !important;
	background: var(--jp-gerd-avatar-bg, #2563eb) !important;
	color: var(--jp-gerd-avatar-icon-color, #fff) !important;
}

#jp-gerd-modal-overlay .jp-gerd-progress-bar {
	background: var(--jp-gerd-progress-bg, rgba(255, 255, 255, 0.2)) !important;
	background-color: var(--jp-gerd-progress-bg, rgba(255, 255, 255, 0.2)) !important;
}

#jp-gerd-modal-overlay .jp-gerd-progress-bar::after {
	background: var(--jp-gerd-progress-color, #2563eb) !important;
	background-color: var(--jp-gerd-progress-color, #2563eb) !important;
}

#jp-gerd-modal-overlay .jp-gerd-close-btn {
	background: var(--jp-gerd-close-bg, transparent) !important;
	background-color: var(--jp-gerd-close-bg, transparent) !important;
	color: var(--jp-gerd-close-color, #94a3b8) !important;
	border: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-close-btn:hover {
	background: var(--jp-gerd-close-hover-bg, #f1f5f9) !important;
	background-color: var(--jp-gerd-close-hover-bg, #f1f5f9) !important;
	color: var(--jp-gerd-close-hover-color, #0f172a) !important;
}

#jp-gerd-modal-overlay .jp-gerd-chat-area {
	background-color: var(--jp-gerd-chat-area-bg, #f8fafc) !important;
	background: var(--jp-gerd-chat-area-bg, #f8fafc) !important;
}

#jp-gerd-modal-overlay .jp-gerd-msg-avatar {
	background-color: var(--jp-gerd-avatar-bg, #2563eb) !important;
	background: var(--jp-gerd-avatar-bg, #2563eb) !important;
	color: var(--jp-gerd-avatar-icon-color, #fff) !important;
}

#jp-gerd-modal-overlay .jp-gerd-msg-bubble {
	background-color: var(--jp-gerd-bot-bubble-bg, #f1f5f9) !important;
	background: var(--jp-gerd-bot-bubble-bg, #f1f5f9) !important;
	color: var(--jp-gerd-bot-bubble-text, #0f172a) !important;
	border: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-user-bubble {
	background-color: var(--jp-gerd-user-bubble-bg, #2563eb) !important;
	background: var(--jp-gerd-user-bubble-bg, #2563eb) !important;
	color: var(--jp-gerd-user-bubble-text, #ffffff) !important;
}

/* Hint: no !important on color/font-size so per-question inline overrides win over theme */
#jp-gerd-modal-overlay .jp-gerd-msg-bubble .jp-gerd-msg-hint {
	color: var(--jp-gerd-hint-color, #64748b);
	font-size: var(--jp-gerd-hint-font-size, 12px);
}

#jp-gerd-modal-overlay .jp-gerd-system-note-msg {
	color: var(--jp-gerd-system-note-color, #94a3b8) !important;
	font-size: var(--jp-gerd-system-note-font-size, 12px) !important;
}

#jp-gerd-modal-overlay .jp-gerd-option-btn {
	-webkit-appearance: none !important;
	appearance: none !important;
	background-color: var(--jp-gerd-option-bg, #ffffff) !important;
	background: var(--jp-gerd-option-bg, #ffffff) !important;
	color: var(--jp-gerd-option-text, #0f172a) !important;
	border-color: var(--jp-gerd-option-border, #cbd5e1) !important;
	border-style: solid !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-option-btn:hover:not(:disabled) {
	border-color: var(--jp-gerd-option-hover-border, var(--jp-gerd-primary, #2563eb)) !important;
	background-color: var(--jp-gerd-option-hover-bg, #eff6ff) !important;
	background: var(--jp-gerd-option-hover-bg, #eff6ff) !important;
	color: var(--jp-gerd-option-hover-text, #0f172a) !important;
}

#jp-gerd-modal-overlay .jp-gerd-option-btn.selected,
#jp-gerd-modal-overlay .jp-gerd-option-btn[aria-pressed='true'] {
	background-color: var(--jp-gerd-option-selected-bg, #2563eb) !important;
	background: var(--jp-gerd-option-selected-bg, #2563eb) !important;
	color: var(--jp-gerd-option-selected-text, #ffffff) !important;
	border-color: var(--jp-gerd-option-selected-bg, #2563eb) !important;
}

#jp-gerd-modal-overlay .jp-gerd-option-continue {
	-webkit-appearance: none !important;
	appearance: none !important;
	background-color: var(--jp-gerd-primary, #2563eb) !important;
	background: var(--jp-gerd-primary, #2563eb) !important;
	color: #fff !important;
	border: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-option-continue:not(:disabled):hover {
	background-color: var(--jp-gerd-welcome-hover-bg, #1d4ed8) !important;
	background: var(--jp-gerd-welcome-hover-bg, #1d4ed8) !important;
	color: var(--jp-gerd-welcome-hover-text, #ffffff) !important;
}

#jp-gerd-modal-overlay .jp-gerd-welcome-btn {
	-webkit-appearance: none !important;
	appearance: none !important;
	background-color: var(--jp-gerd-primary, #2563eb) !important;
	background: var(--jp-gerd-primary, #2563eb) !important;
	color: var(--jp-gerd-welcome-text, #ffffff) !important;
	border: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-welcome-btn:hover {
	background-color: var(--jp-gerd-welcome-hover-bg, #1d4ed8) !important;
	background: var(--jp-gerd-welcome-hover-bg, #1d4ed8) !important;
	color: var(--jp-gerd-welcome-hover-text, #ffffff) !important;
}

#jp-gerd-modal-overlay .jp-gerd-lead-card {
	background-color: #ffffff !important;
	background: #ffffff !important;
}

#jp-gerd-modal-overlay .jp-gerd-field-input {
	background-color: #fff !important;
	background: #fff !important;
	color: #0f172a !important;
	border-color: #d1d5db !important;
}

#jp-gerd-modal-overlay .jp-gerd-field-input:focus {
	border-color: var(--jp-gerd-primary, #2563eb) !important;
}

#jp-gerd-modal-overlay .jp-gerd-lead-submit {
	-webkit-appearance: none !important;
	appearance: none !important;
	background-color: var(--jp-gerd-lead-submit-bg, var(--jp-gerd-primary, #2563eb)) !important;
	background: var(--jp-gerd-lead-submit-bg, var(--jp-gerd-primary, #2563eb)) !important;
	color: var(--jp-gerd-lead-submit-fg, #ffffff) !important;
	border: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-lead-submit:hover:not(:disabled) {
	background-color: var(--jp-gerd-lead-submit-hover-bg, #1d4ed8) !important;
	background: var(--jp-gerd-lead-submit-hover-bg, #1d4ed8) !important;
	color: var(--jp-gerd-lead-submit-hover-fg, #ffffff) !important;
}

#jp-gerd-modal-overlay a.jp-gerd-cta-primary,
#jp-gerd-modal-overlay a.jp-gerd-cta-primary:visited {
	background-color: var(--jp-gerd-cta-p-bg, var(--jp-gerd-primary, #2563eb)) !important;
	background: var(--jp-gerd-cta-p-bg, var(--jp-gerd-primary, #2563eb)) !important;
	color: var(--jp-gerd-cta-p-fg, #ffffff) !important;
	border: none !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay a.jp-gerd-cta-primary:hover {
	background-color: var(--jp-gerd-cta-p-hover-bg, #1d4ed8) !important;
	background: var(--jp-gerd-cta-p-hover-bg, #1d4ed8) !important;
	color: var(--jp-gerd-cta-p-hover-fg, #ffffff) !important;
	text-decoration: none !important;
}

#jp-gerd-modal-overlay a.jp-gerd-cta-secondary,
#jp-gerd-modal-overlay a.jp-gerd-cta-secondary:visited {
	background-color: var(--jp-gerd-cta-s-bg, transparent) !important;
	background: var(--jp-gerd-cta-s-bg, transparent) !important;
	color: var(--jp-gerd-cta-s-fg, var(--jp-gerd-primary, #2563eb)) !important;
	border-color: var(--jp-gerd-cta-s-border, var(--jp-gerd-primary, #2563eb)) !important;
	border-style: solid !important;
	border-width: 1.5px !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay a.jp-gerd-cta-secondary:hover {
	background-color: var(--jp-gerd-cta-s-hover-bg, #eff6ff) !important;
	background: var(--jp-gerd-cta-s-hover-bg, #eff6ff) !important;
	color: var(--jp-gerd-cta-s-hover-fg, #1d4ed8) !important;
	border-color: var(--jp-gerd-cta-s-hover-border, var(--jp-gerd-primary, #2563eb)) !important;
	text-decoration: none !important;
}

#jp-gerd-modal-overlay a.jp-gerd-rf-cta {
	background-color: var(--jp-gerd-rf-cta-bg, #ea580c) !important;
	background: var(--jp-gerd-rf-cta-bg, #ea580c) !important;
	color: var(--jp-gerd-rf-cta-text, #ffffff) !important;
	border: none !important;
	text-decoration: none !important;
}

#jp-gerd-modal-overlay a.jp-gerd-rf-cta:hover {
	background-color: var(--jp-gerd-rf-cta-hover-bg, #c2410c) !important;
	background: var(--jp-gerd-rf-cta-hover-bg, #c2410c) !important;
	color: var(--jp-gerd-rf-cta-text, #ffffff) !important;
	text-decoration: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-call-now-btn {
	-webkit-appearance: none !important;
	appearance: none !important;
	background-color: var(--jp-gerd-cn-bg, #16a34a) !important;
	background: var(--jp-gerd-cn-bg, #16a34a) !important;
	color: var(--jp-gerd-cn-text, #ffffff) !important;
	border: none !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-call-now-btn:hover {
	background-color: var(--jp-gerd-cn-hover-bg, #15803d) !important;
	background: var(--jp-gerd-cn-hover-bg, #15803d) !important;
	color: var(--jp-gerd-cn-hover-text, #ffffff) !important;
}

#jp-gerd-modal-overlay .jp-gerd-modal-footer {
	background-color: var(--jp-gerd-footer-bg, #f8fafc) !important;
	background: var(--jp-gerd-footer-bg, #f8fafc) !important;
	color: var(--jp-gerd-footer-text, #94a3b8) !important;
	border-top-color: var(--jp-gerd-footer-border, #e2e8f0) !important;
}

#jp-gerd-modal-overlay .jp-gerd-modal-footer a,
#jp-gerd-modal-overlay .jp-gerd-modal-footer a:visited {
	color: var(--jp-gerd-footer-link, #2563eb) !important;
	text-decoration: underline !important;
}

#jp-gerd-modal-overlay .jp-gerd-copy-btn {
	background-color: #f8fafc !important;
	background: #f8fafc !important;
	color: #0f172a !important;
	border-color: var(--jp-gerd-border, #e2e8f0) !important;
	box-shadow: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-copy-btn:hover {
	background-color: #e2e8f0 !important;
	background: #e2e8f0 !important;
}

#jp-gerd-modal-overlay .jp-gerd-abandon-cancel {
	background-color: #f1f5f9 !important;
	background: #f1f5f9 !important;
	color: #0f172a !important;
	border: none !important;
}

#jp-gerd-modal-overlay .jp-gerd-abandon-confirm-btn {
	background-color: #dc2626 !important;
	background: #dc2626 !important;
	color: #fff !important;
	border: none !important;
}

/* Result cards — headings often inherit theme text colors */
#jp-gerd-modal-overlay .jp-gerd-rf-title {
	color: #9a3412 !important;
}

#jp-gerd-modal-overlay .jp-gerd-card-title {
	color: #0f172a !important;
}

#jp-gerd-modal-overlay .jp-gerd-pattern-tag {
	background-color: #eff6ff !important;
	color: #2563eb !important;
}

#jp-gerd-modal-overlay .jp-gerd-checkbox-label {
	color: #374151 !important;
}

#jp-gerd-modal-overlay .jp-gerd-disclaimer-text {
	color: #94a3b8 !important;
	line-height: 1.6 !important;
}

#jp-gerd-modal-overlay .jp-gerd-disclaimer-prefix {
	color: var(--jp-gerd-disclaimer-prefix-color, inherit) !important;
	font-size: var(--jp-gerd-disclaimer-prefix-font-size, 12px) !important;
	font-weight: 500 !important;
}

#jp-gerd-modal-overlay .jp-gerd-disclaimer-mandatory {
	color: #94a3b8 !important;
	font-size: 12px !important;
	font-weight: 400 !important;
}

/* Mobile: header system note is redundant with chat copy — hide even if theme forces display */
@media (max-width: 768px) {
	#jp-gerd-modal-overlay .jp-gerd-modal-header .jp-gerd-system-note,
	#jp-gerd-modal-overlay .jp-gerd-modal-header #jp-gerd-system-note {
		display: none !important;
		height: 0 !important;
		max-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
		visibility: hidden !important;
		pointer-events: none !important;
		border: none !important;
		line-height: 0 !important;
		font-size: 0 !important;
	}
}