/* ===== Theme Styles ===== */

/* Dark Mode Base */
body.dark-mode {
  background: #121212;
  color: #e0e0e0;
}

body.dark-mode .sidebar {
  background: #1e1e1e;
  border-right: 1px solid #333;
}

body.dark-mode .main {
  background: #121212;
}

body.dark-mode .chat-header {
  background: #1e1e1e;
  border-bottom: 1px solid #333;
}

body.dark-mode .chat-header .mode-select {
  background-color: #2d2d2d;
  border-color: #444;
  color: #e0e0e0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}

body.dark-mode .chat-header .mode-select:hover {
  background-color: #3d3d3d;
  border-color: #555;
}

body.dark-mode .chat-header .mode-select:focus {
  border-color: #667eea;
  background-color: #2d2d2d;
}

body.dark-mode .chat-input-area {
  background: #1e1e1e;
  border-top: 1px solid #333;
}

body.dark-mode .chat-input-wrapper input {
  background: #2d2d2d;
  border: 1px solid #444;
  color: #e0e0e0;
}

body.dark-mode .chat-input-wrapper input:focus {
  border-color: #667eea;
}

body.dark-mode .message.assistant .bubble {
  background: #1e1e1e;
  border: 1px solid #333;
}

body.dark-mode .message.assistant .bubble.collapsed::after {
  background: linear-gradient(to bottom, rgba(30, 30, 30, 0), rgba(30, 30, 30, 1));
}

body.dark-mode .message-actions {
  border-top: 1px solid #333;
}

body.dark-mode .message-actions button:hover {
  background: #333;
}

/* Sidebar Dark Mode */
body.dark-mode .sidebar .btn-logout {
  background: #2d2d2d;
  border: 1px solid #444;
}

body.dark-mode .sidebar .btn-logout:hover {
  background: #3d3d3d;
}

body.dark-mode .sidebar hr {
  border-top: 1px solid #333;
}

body.dark-mode .sidebar select {
  background: #2d2d2d;
  border: 1px solid #444;
  color: #e0e0e0;
}

body.dark-mode .sidebar .btn-clear {
  background: #3d2d2d;
  border: 1px solid #5d3d3d;
  color: #ff9999;
}

body.dark-mode .sidebar .btn-clear:hover {
  background: #4d3d3d;
}

body.dark-mode .sidebar .mode-radio label:hover {
  background: #2d2d2d;
}

body.dark-mode .sidebar .sidebar-footer {
  background: #1e1e1e;
  border-top: 1px solid #333;
}

body.dark-mode .sidebar .sidebar-footer .user-info h3 {
  color: #e0e0e0;
}

body.dark-mode .sidebar .sidebar-footer .user-info span {
  color: #aaa;
}

body.dark-mode .sidebar .sidebar-footer .btn-logout {
  background: #2d2d2d;
  border: 1px solid #444;
  color: #e0e0e0;
}

body.dark-mode .sidebar .sidebar-footer .btn-logout:hover {
  background: #3d3d3d;
}

body.dark-mode .sidebar .sidebar-footer .footer-text {
  color: #888;
}

/* Theme Menu Dark Mode */
body.dark-mode .theme-menu {
  background: #1e1e1e;
  border: 1px solid #333;
}

body.dark-mode .theme-option:hover {
  background: #2d2d2d;
}

body.dark-mode .theme-option.active {
  background: #2d2d3d;
  color: #8899ff;
}