/* CSCNL Chatbot — scoped under .cscnl-chat so theme styles don't leak in or out. */
.cscnl-chat {
	--cscnl-primary: #0b6e99;
	--cscnl-text: #1f2937;
	--cscnl-muted: #6b7280;
	--cscnl-line: #e5e7eb;
	--cscnl-bg: #f7fafc;
	font-family: Inter, "Segoe UI", Tahoma, sans-serif;
	font-size: 14px;
	line-height: 1.45;
	font-weight: 400 !important; /* the theme sets bold on body */
	color: var(--cscnl-text);
	box-sizing: border-box;
}
.cscnl-chat *, .cscnl-chat *::before, .cscnl-chat *::after { box-sizing: border-box; }

/* Themes often set large sizes/fonts on p, li, a, h*; keep the chat's own type scale. */
.cscnl-chat p, .cscnl-chat li, .cscnl-chat ul, .cscnl-chat ol, .cscnl-chat a,
.cscnl-chat strong, .cscnl-chat em, .cscnl-chat span, .cscnl-chat div,
.cscnl-chat button, .cscnl-chat textarea {
	font-family: Inter, "Segoe UI", Tahoma, sans-serif !important;
	letter-spacing: normal !important;
	text-transform: none;
}
.cscnl-msg, .cscnl-msg p, .cscnl-msg li, .cscnl-msg a, .cscnl-msg strong, .cscnl-msg em {
	font-size: 14px !important;
	line-height: 1.45 !important;
}
.cscnl-msg p, .cscnl-msg li { font-weight: 400 !important; color: inherit !important; margin: 0 0 8px !important; }
.cscnl-msg p:last-child { margin-bottom: 0 !important; }
.cscnl-msg strong { font-weight: 700 !important; }
.cscnl-msg a { font-weight: 600 !important; }
.cscnl-msg li { margin-bottom: 6px !important; }

/* Floating launcher */
.cscnl-chat--floating { position: fixed; right: 20px; bottom: 20px; z-index: 99999; }
.cscnl-launcher {
	width: 60px; height: 60px; border-radius: 50%; border: 0; cursor: pointer;
	background: var(--cscnl-primary); color: #fff;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 10px 25px rgba(0,0,0,.2); transition: transform .2s ease;
	padding: 0; margin: 0;
}
.cscnl-launcher:hover { transform: translateY(-2px); }
.cscnl-launcher:focus-visible, .cscnl-chat button:focus-visible, .cscnl-chat a:focus-visible {
	outline: 2px solid #0ea5e9; outline-offset: 2px;
}
.cscnl-chat--floating .cscnl-panel {
	position: absolute; right: 0; bottom: 76px;
	width: min(400px, calc(100vw - 32px)); height: min(620px, calc(100vh - 120px));
}
.cscnl-chat--floating.is-open .cscnl-launcher { transform: scale(.92); }

/* Inline (shortcode) */
.cscnl-chat--inline .cscnl-panel { width: 100%; max-width: 820px; height: 640px; margin: 0 auto; }

/* Panel */
.cscnl-panel {
	display: flex; flex-direction: column; overflow: hidden;
	background: #fff; border-radius: 18px; border: 1px solid var(--cscnl-line);
	box-shadow: 0 20px 50px rgba(15,23,42,.18);
}
.cscnl-panel[hidden] { display: none; }
.cscnl-header {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	padding: 14px 16px; color: #fff;
	background: linear-gradient(135deg, var(--cscnl-primary), #074c6c);
}
.cscnl-title { font-weight: 700; font-size: 15px !important; line-height: 1.3 !important; color: #fff; }
.cscnl-header-actions { display: flex; gap: 4px; }
.cscnl-icon-btn {
	background: rgba(255,255,255,.15); color: #fff; border: 0; border-radius: 8px;
	width: 32px; height: 32px; font-size: 18px; line-height: 1; cursor: pointer; padding: 0; margin: 0;
}
.cscnl-icon-btn:hover { background: rgba(255,255,255,.28); }

.cscnl-log { flex: 1; overflow-y: auto; padding: 16px; background: var(--cscnl-bg); }
.cscnl-msg { max-width: 88%; margin: 0 0 12px; padding: 10px 14px; border-radius: 14px; word-wrap: break-word; }
.cscnl-msg p { margin: 0 0 8px; }
.cscnl-msg p:last-child { margin-bottom: 0; }
.cscnl-msg ul, .cscnl-msg ol { margin: 4px 0 8px 18px; padding: 0; }
.cscnl-msg li { margin: 0 0 6px; }
.cscnl-msg a { color: var(--cscnl-primary); text-decoration: underline; font-weight: 600; }
.cscnl-msg--user { font-weight: 400 !important; margin-left: auto; background: var(--cscnl-primary); color: #fff; border-bottom-right-radius: 4px; white-space: pre-wrap; }
.cscnl-msg--assistant { background: #fff; border: 1px solid var(--cscnl-line); border-bottom-left-radius: 4px; }

a.cscnl-cite {
	display: inline-block; min-width: 18px; height: 18px; padding: 0 4px; margin: 0 1px;
	font-size: 11px; line-height: 18px; text-align: center; vertical-align: super;
	border-radius: 9px; background: #e6f4fb; color: var(--cscnl-primary); text-decoration: none; font-weight: 700;
}

.cscnl-sources { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--cscnl-line); }
.cscnl-sources, .cscnl-sources a, .cscnl-source, .cscnl-source-n { font-size: 12.5px !important; line-height: 1.4 !important; }
.cscnl-source-from, .cscnl-source-from a { font-size: 11.5px !important; }
.cscnl-sources-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--cscnl-muted); margin-bottom: 6px; }
.cscnl-source { margin-bottom: 6px; }
.cscnl-source-n { color: var(--cscnl-muted); margin-right: 4px; }
.cscnl-source-from { font-size: 12px; color: var(--cscnl-muted); margin: 2px 0 0 18px; }
.cscnl-source-from a { font-weight: 400; }
.cscnl-tag {
	display: inline-block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
	padding: 1px 6px; border-radius: 999px; margin-right: 6px; background: #e6f4fb; color: var(--cscnl-primary);
}
/* Document file-type icons */
.cscnl-chat svg.cscnl-doc-icon {
	display: inline-block !important; flex-shrink: 0; overflow: visible;
	max-width: none !important; margin: 0 5px 0 0 !important; vertical-align: -4px !important;
}
.cscnl-msg a.cscnl-doclink { white-space: normal; }
.cscnl-doc-badge { display: inline-block; vertical-align: middle; margin-right: 4px; line-height: 0 !important; }
.cscnl-doc-badge svg.cscnl-doc-icon { vertical-align: middle !important; margin: 0 !important; }
.cscnl-tag--page { background: #eef2f7; color: #334155; }
.cscnl-tag--document { background: #fef3c7; color: #92400e; }
.cscnl-tag--job { background: #dcfce7; color: #166534; }
.cscnl-tag--volunteer { background: #fce7f3; color: #9d174d; }

.cscnl-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.cscnl-chip {
	background: #fff; border: 1px solid var(--cscnl-primary); color: var(--cscnl-primary);
	border-radius: 999px; padding: 5px 11px; font-size: 12.5px !important; cursor: pointer; font-family: inherit; line-height: 1.3; margin: 0;
}
.cscnl-chip:hover { background: #e6f4fb; }

.cscnl-typing { display: inline-flex; gap: 4px; }
.cscnl-typing span { width: 7px; height: 7px; border-radius: 50%; background: #94a3b8; animation: cscnl-bounce 1s infinite ease-in-out; }
.cscnl-typing span:nth-child(2) { animation-delay: .15s; }
.cscnl-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes cscnl-bounce { 0%, 80%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-5px); opacity: 1; } }

.cscnl-form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--cscnl-line); background: #fff; margin: 0; }
.cscnl-input {
	flex: 1; resize: none; border: 1px solid #d1d5db !important; border-radius: 12px !important;
	padding: 9px 12px !important; font: 14px/1.4 Inter, "Segoe UI", Tahoma, sans-serif !important; color: var(--cscnl-text) !important;
	background: #fff !important; min-height: 42px; max-height: 120px; margin: 0 !important; box-shadow: none !important;
}
.cscnl-input {
	font-weight: 400 !important; font-style: normal !important; text-transform: none !important;
	letter-spacing: normal !important; text-align: left !important; height: auto !important;
}
.cscnl-input::placeholder {
	font-family: Inter, "Segoe UI", Tahoma, sans-serif !important; font-size: 14px !important;
	font-weight: 400 !important; font-style: normal !important; text-transform: none !important;
	letter-spacing: normal !important; color: #8a94a3 !important; opacity: 1 !important;
}
.cscnl-input:focus { outline: none; border-color: #0ea5e9 !important; }
.cscnl-send {
	width: 44px; height: 44px; border: 0; border-radius: 12px; cursor: pointer; flex-shrink: 0;
	background: var(--cscnl-primary); color: #fff; display: flex; align-items: center; justify-content: center; padding: 0; margin: 0;
}
.cscnl-send:disabled { opacity: .5; cursor: wait; }
.cscnl-foot { font-size: 11px !important; font-weight: 400 !important; color: var(--cscnl-muted); text-align: center; padding: 0 12px 10px; background: #fff; }

@media (max-width: 480px) {
	.cscnl-chat--floating { right: 12px; bottom: 12px; }
	.cscnl-chat--floating .cscnl-panel { position: fixed; inset: 0; width: 100%; height: 100%; border-radius: 0; bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.cscnl-typing span, .cscnl-launcher { animation: none; transition: none; }
}