/**
 * Context Components - Shared Styles
 *
 * Base chrome for all context components: section headers, spacing, layout.
 * Uses existing --plexa-chat-* CSS variables from chat-layout.css.
 */

/* ==========================================================================
   COMPONENT WRAPPER
   ========================================================================== */

.plexa-chat-context-component {
	margin-bottom: 16px;
}

.plexa-chat-context-component:last-child {
	margin-bottom: 0;
}

/* ==========================================================================
   COMPONENT HEADER
   ========================================================================== */

.plexa-chat-context-component__header {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--plexa-chat-text-muted, #888888);
	padding: 0 0 8px 0;
	margin-bottom: 8px;
	border-bottom: 1px solid var(--plexa-chat-border, #333333);
}

/* ==========================================================================
   COMPONENT BODY
   ========================================================================== */

.plexa-chat-context-component__body {
	font-size: 13px;
	line-height: 1.5;
	color: var(--plexa-chat-text, #ffffff);
}

/* ==========================================================================
   EMPTY STATE
   ========================================================================== */

.plexa-chat-context-component__empty {
	color: var(--plexa-chat-text-muted, #888888);
	font-style: italic;
	font-size: 12px;
	padding: 8px 0;
}