/**
 * SI Chat Assistant — floating wrapper only.
 *
 * The RunBear SDK renders and styles the chat itself. To stop the SDK's
 * runtime-injected Tailwind (utilities AND its global `*,::before,::after`
 * reset) from bleeding onto the host page — and to stop host CSS leaking into
 * the widget — the SDK is mounted inside a Shadow DOM (see si-chat-embed.js).
 *
 * This file therefore styles ONLY the floating launcher + panel chrome that
 * lives in the light DOM around the shadow host. Rules here CANNOT reach the
 * SDK UI inside the shadow root; to restyle the SDK internals use the
 * `si_chat_shadow_css` PHP filter (its CSS is injected inside the shadow root).
 *
 * Theming: everything uses --si-chat-* custom properties. Because custom
 * properties inherit across the shadow boundary, setting any --si-chat-* value
 * on :root or .si-chat-embed also reaches the widget UI inside the shadow root
 * (where the si_chat_shadow_css filter CSS can consume it). See readme.txt.
 */

.si-chat-embed {
	/* Layout / chrome. */
	--si-chat-z: 99999;
	--si-chat-panel-width: 380px;
	--si-chat-panel-height: 560px;
	--si-chat-offset: 20px;
	--si-chat-radius: 8px;

	/* Theming (inherit into the shadow root; consume from si_chat_shadow_css). */
	--si-chat-font: inherit;
	--si-chat-surface: #fff;
	--si-chat-border: currentColor;
	--si-chat-launcher-bg: #fff;
	--si-chat-launcher-text: inherit;
	--si-chat-error-bg: #b3261e;
	--si-chat-error-text: #fff;
	--si-chat-notice-bg: #fff4ce;
	--si-chat-notice-text: #3d3d1f;
	--si-chat-notice-border: #d4b106;

	position: fixed;
	right: var(--si-chat-offset);
	bottom: var(--si-chat-offset);
	z-index: var(--si-chat-z);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
	font: var(--si-chat-font);
}

/*
 * Hidden until si-chat-embed.js confirms the SDK loaded (see the JS: the whole
 * widget degrades to nothing if the ~1.4MB SDK bundle fails to load). The
 * explicit rule is required because .si-chat-embed's display would otherwise
 * beat the UA [hidden] rule at equal specificity.
 */
.si-chat-embed[hidden] {
	display: none;
}

.si-chat-embed__launcher {
	cursor: pointer;
	border: 1px solid var(--si-chat-border);
	background: var(--si-chat-launcher-bg);
	color: var(--si-chat-launcher-text);
	padding: 10px 16px;
	border-radius: var(--si-chat-radius);
	font: inherit;
}

.si-chat-embed__panel {
	position: relative;
	width: var(--si-chat-panel-width);
	max-width: calc( 100vw - ( var(--si-chat-offset) * 2 ) );
	height: var(--si-chat-panel-height);
	max-height: calc( 100vh - ( var(--si-chat-offset) * 2 ) );
	background: var(--si-chat-surface);
	border: 1px solid var(--si-chat-border);
	border-radius: var(--si-chat-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.si-chat-embed__panel[hidden] {
	display: none;
}

.si-chat-embed__close {
	position: absolute;
	top: 4px;
	right: 6px;
	z-index: 1;
	cursor: pointer;
	border: 0;
	background: transparent;
	font: inherit;
	font-size: 1.25em;
	line-height: 1;
	padding: 2px 6px;
}

/*
 * Error banner. Hidden until si-chat-embed.js reveals it (proxy/RunBear error
 * or a failed SDK import). Structural only — restyle at the theme level.
 */
.si-chat-embed__error {
	margin: 0;
	padding: 10px 32px 10px 12px;
	background: var(--si-chat-error-bg);
	color: var(--si-chat-error-text);
	font: inherit;
	font-size: 0.875em;
	line-height: 1.4;
}

.si-chat-embed__error[hidden] {
	display: none;
}

/*
 * Admin-only diagnostic notice (rendered server-side only for administrators
 * when the widget is not production-ready). Never shown to visitors.
 */
.si-chat-embed__admin-notice {
	max-width: var(--si-chat-panel-width);
	margin: 0;
	padding: 8px 12px;
	background: var(--si-chat-notice-bg);
	color: var(--si-chat-notice-text);
	border: 1px solid var(--si-chat-notice-border);
	border-radius: var(--si-chat-radius);
	font: inherit;
	font-size: 0.8125em;
	line-height: 1.4;
	text-align: right;
}

/* Shadow host: let the SDK fill the panel. */
.si-chat-embed__mount {
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
	overflow: hidden;
}
