/* chat.css — AI chat page */

/* Theme variables */
html {
  /* Dark mode (default) */
  --chat-send-icon: #0f0f0f;
  --chat-icon-color: #888;
  --chat-bg: #0f0f0f;
  --chat-sidebar-bg: #171717;
  --chat-sidebar-border: #1e1e1e;
  --chat-surface: #2a2a2a;
  --chat-surface-hover: #242424;
  --chat-surface-hover-dark: #0f0f0f;
  --chat-border: #2e2e2e;
  --chat-border-subtle: #1e1e1e;
  --chat-text: #f0f0f0;
  --chat-text-muted: #666;
  --chat-text-faint: #444;
  --chat-text-dim: #717171;
  --chat-link: #999;
  --chat-link-hover: #f0f0f0;
  --chat-accent: #e8e8e8;
  --chat-accent-hover: #ffffff;
  --chat-user-text: #fff;
  --chat-assistant-bg: #1a1a1a;
  --chat-assistant-text: #e8e8e8;
  --chat-assistant-border: #2a2a2a;
  --chat-input-bg: #242424;
  --chat-scrollbar: #2a2a2a;
  --chat-typing-dot: #555;
  --chat-error-bg: #2a1515;
  --chat-error-border: #5a2020;
  --chat-error-text: #f08080;
  --chat-starter-bg: #1a1a1a;
  --chat-starter-text: #bbb;
}

html[data-theme="light"] {
  --chat-send-icon: #ffffff;
  --chat-icon-color: #555;
  --chat-bg: #ffffff;
  --chat-sidebar-bg: #f5f5f5;
  --chat-sidebar-border: #e8e8e8;
  --chat-surface: #ebebeb;
  --chat-surface-hover: #e2e2e2;
  --chat-surface-hover-dark: #e2e2e2;
  --chat-border: #e0e0e0;
  --chat-border-subtle: #ebebeb;
  --chat-text: #1a1a1a;
  --chat-text-muted: #6b6b6b;
  --chat-text-faint: #b0b0b0;
  --chat-text-dim: #717171;
  --chat-link: #555;
  --chat-link-hover: #1a1a1a;
  --chat-accent: #1a1a1a;
  --chat-accent-hover: #333333;
  --chat-user-text: #fff;
  --chat-assistant-bg: #f0f0f0;
  --chat-assistant-text: #1a1a1a;
  --chat-assistant-border: #e0e0e0;
  --chat-input-bg: #ffffff;
  --chat-scrollbar: #d0d0d0;
  --chat-typing-dot: #aaa;
  --chat-error-bg: #fff0f0;
  --chat-error-border: #ffcdd2;
  --chat-error-text: #c62828;
  --chat-starter-bg: #f0f0f0;
  --chat-starter-text: #555;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  height: 100%;
}

body.chat-page {
  font-family: var(--font-sans);
  background-color: var(--chat-bg);
  background-image: none;
  color: var(--chat-text);
  display: flex;
  flex-direction: row;
  height: 100dvh;
  overflow: hidden;
  transition:
    background-color 0.2s,
    color 0.2s;
}