.ksos-chat-widget {
  --ksos-primary: #1a5fa8;
  --ksos-primary-dark: #0f3d72;
  --ksos-bg: #f0f4fa;
  --ksos-card: #ffffff;
  --ksos-border: #d0ddf0;
  --ksos-text: #1a1a2e;
  --ksos-text-light: #667;
  font-family: 'Segoe UI', system-ui, sans-serif;
  color: var(--ksos-text);
  box-sizing: border-box;
}
.ksos-chat-widget * { box-sizing: border-box; }

/* Inline (shortcode) layout */
.ksos-chat-widget.ksos-chat-inline-mode {
  border: 1px solid var(--ksos-border);
  border-radius: 12px;
  background: var(--ksos-card);
  max-width: 640px;
  display: flex;
  flex-direction: column;
  height: 480px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

/* Floating bubble layout */
#ksos-chat-float-root { position: fixed; bottom: 20px; right: 20px; z-index: 9999; }

.ksos-chat-fab-wrap { position: relative; width: 51px; height: 51px; }

/* Radiating rings — draw the eye without being obnoxious once opened */
.ksos-chat-fab-wrap::before,
.ksos-chat-fab-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: var(--ksos-primary);
  opacity: 0.55;
  animation: ksos-chat-pulse 2.2s ease-out infinite;
  pointer-events: none;
}
.ksos-chat-fab-wrap::after { animation-delay: 1.1s; }
.ksos-chat-fab-wrap.open::before,
.ksos-chat-fab-wrap.open::after { animation-play-state: paused; opacity: 0; }

@keyframes ksos-chat-pulse {
  0%   { transform: scale(0.85); opacity: 0.55; }
  70%  { transform: scale(1.9); opacity: 0; }
  100% { transform: scale(1.9); opacity: 0; }
}

.ksos-chat-fab {
  position: relative;
  width: 51px; height: 51px; border-radius: 50%;
  background: linear-gradient(135deg, var(--ksos-primary-dark), var(--ksos-primary) 55%, #2f8fd6);
  color: #fff; border: none; cursor: pointer;
  box-shadow: 0 4px 16px rgba(15,61,114,0.45), 0 2px 6px rgba(0,0,0,0.25);
  display: flex; align-items: center; justify-content: center;
  transition: transform 0.15s ease;
}
.ksos-chat-fab:hover { transform: scale(1.06); }
.ksos-chat-fab:active { transform: scale(0.95); }
.ksos-chat-fab svg { width: 24px; height: 24px; }

/* Small "live" accent dot — reinforces "this is active/available" */
.ksos-chat-fab-dot {
  position: absolute; top: 2px; right: 2px;
  width: 10px; height: 10px; border-radius: 50%;
  background: #29c46f; border: 2px solid #fff;
}
.ksos-chat-widget.ksos-chat-floating-mode {
  position: fixed; bottom: 88px; right: 20px;
  width: min(360px, calc(100vw - 40px));
  height: min(520px, calc(100vh - 140px));
  border: 1px solid var(--ksos-border);
  border-radius: 12px;
  background: var(--ksos-card);
  display: none;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(0,0,0,0.2);
}
.ksos-chat-widget.ksos-chat-floating-mode.open { display: flex; }

.ksos-chat-header {
  background: linear-gradient(135deg, var(--ksos-primary-dark), var(--ksos-primary));
  color: #fff; padding: 10px 14px; font-size: 14px; font-weight: 700;
  display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
}
.ksos-chat-header-actions { display: flex; align-items: center; gap: 10px; }
.ksos-chat-header button { background: none; border: none; color: #fff; font-size: 18px; cursor: pointer; }
.ksos-chat-clear {
  font-size: 11px !important; font-weight: 600 !important;
  opacity: 0.85; text-decoration: underline; text-underline-offset: 2px;
}
.ksos-chat-clear:hover { opacity: 1; }

.ksos-chat-messages { flex: 1; overflow-y: auto; padding: 12px; background: var(--ksos-bg); }
.ksos-chat-msg { margin-bottom: 10px; max-width: 88%; padding: 8px 12px; border-radius: 10px; font-size: 13px; line-height: 1.5; }
.ksos-chat-msg.user { background: var(--ksos-primary); color: #fff; margin-left: auto; border-bottom-right-radius: 2px; }
.ksos-chat-msg.bot { background: var(--ksos-card); border: 1px solid var(--ksos-border); margin-right: auto; border-bottom-left-radius: 2px; }

.ksos-chat-msg p { margin: 0 0 6px; }
.ksos-chat-msg p:last-child { margin-bottom: 0; }
.ksos-chat-msg ul { margin: 2px 0 8px; padding-left: 18px; }
.ksos-chat-msg ul:last-child { margin-bottom: 0; }
.ksos-chat-msg li { margin-bottom: 3px; }
.ksos-chat-msg strong { font-weight: 700; color: var(--ksos-primary-dark); }
.ksos-chat-msg table.ksos-chat-table { border-collapse: collapse; width: 100%; margin: 4px 0 8px; font-size: 12px; }
.ksos-chat-msg table.ksos-chat-table th,
.ksos-chat-msg table.ksos-chat-table td { border: 1px solid var(--ksos-border); padding: 4px 6px; text-align: left; }
.ksos-chat-msg table.ksos-chat-table th { background: var(--ksos-bg); }

/* Typing indicator */
.ksos-chat-msg.pending { display: inline-flex; gap: 4px; align-items: center; padding: 12px 14px; }
.ksos-chat-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ksos-text-light); animation: ksos-chat-dot-bounce 1.2s infinite ease-in-out; }
.ksos-chat-dot:nth-child(2) { animation-delay: 0.15s; }
.ksos-chat-dot:nth-child(3) { animation-delay: 0.3s; }
@keyframes ksos-chat-dot-bounce {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
  30% { transform: translateY(-4px); opacity: 1; }
}

.ksos-chat-sources { margin-top: 6px; font-size: 11px; color: var(--ksos-text-light); }
.ksos-chat-sources-label { font-weight: 600; }
.ksos-chat-sources a { color: var(--ksos-primary); text-decoration: none; }
.ksos-chat-sources a:hover { text-decoration: underline; }
.ksos-chat-sources-sep { margin: 0 6px; opacity: 0.6; }

.ksos-chat-inputrow { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--ksos-border); flex-shrink: 0; background: var(--ksos-card); }
.ksos-chat-inputrow input { flex: 1; border: 1px solid var(--ksos-border); border-radius: 8px; padding: 8px 10px; font-size: 13px; }
.ksos-chat-inputrow button {
  background: var(--ksos-primary); color: #fff; border: none; border-radius: 8px;
  padding: 8px 14px; font-size: 14px; cursor: pointer;
}
.ksos-chat-inputrow button:disabled { background: #c5cfe8; cursor: not-allowed; }