/* ============================================
   DARK THEME ROOT VARIABLES
   Customize these variables to match your brand
   ============================================ */
   :root {
    --dark-bg-primary: #011d3a;
    --dark-bg-secondary: #00264d;
    --dark-bg-tertiary: #013052;
    --dark-bg-input: #001a33;
    --dark-bg-hover: #014166;
    
    --dark-text-primary: #e0e0e0;
    --dark-text-secondary: #b0b0b0;
    --dark-text-muted: #808080;
    
    --dark-border-primary: #014166;
    --dark-border-secondary: #015280;
    
    --dark-accent-blue: #4a9eff;
    --dark-accent-blue-hover: #3a8eef;
    
    --dark-success: #4ade80;
    --dark-error: #ef4444;
    --dark-warning: #fbbf24;
    
    --dark-shadow: rgba(0, 0, 0, 0.5);
    --dark-shadow-light: rgba(0, 0, 0, 0.3);
}

/* ============================================
   DARK MODE BASE STYLES
   ============================================ */
body.solomon-dark-mode .solomon-chat-button {
    background: var(--dark-bg-secondary);
    box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 36px 0px, rgba(0, 0, 0, 0.2) 0px 0px 0px 1px;
}

body.solomon-dark-mode .solomon-mini-chatbot,
body.solomon-dark-mode .solomon-fullscreen-chatbot {
    background: var(--dark-bg-primary);
    border-color: var(--dark-border-primary);
    box-shadow: 0 8px 32px var(--dark-shadow);
}

/* ============================================
   DARK MODE HEADERS
   ============================================ */
body.solomon-dark-mode .solomon-mini-chatbot-header,
body.solomon-dark-mode .solomon-fullscreen-chatbot-header,
body.solomon-dark-mode .solomon-fullscreen-chatbot-wrapper {
    background-color: var(--dark-bg-primary);
    border-color: var(--dark-border-primary);
}

body.solomon-dark-mode .solomon-mini-chatbot-header h4,
body.solomon-dark-mode .solomon-fullscreen-chatbot-header h4 {
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .online-text {
    color: var(--dark-text-secondary);
}

/* ============================================
   DARK MODE BUTTONS
   ============================================ */
body.solomon-dark-mode .solomon-clear-btn,
body.solomon-dark-mode .solomon-expand-btn,
body.solomon-dark-mode .solomon-minimize-btn,
body.solomon-dark-mode .solomon-close-btn,
body.solomon-dark-mode .solomon-theme-btn {
    background: none;
    border-color: var(--dark-border-secondary);
    color: var(--dark-accent-blue);
}

body.solomon-dark-mode .solomon-clear-btn:hover,
body.solomon-dark-mode .solomon-expand-btn:hover,
body.solomon-dark-mode .solomon-minimize-btn:hover,
body.solomon-dark-mode .solomon-close-btn:hover,
body.solomon-dark-mode .solomon-theme-btn:hover {
    background: var(--dark-bg-hover);
}

body.solomon-dark-mode .solomon-send-btn {
    background-color: var(--dark-bg-secondary);
}

body.solomon-dark-mode .solomon-send-btn:hover {
    background: var(--dark-bg-hover);
}

/* ============================================
   DARK MODE MESSAGES
   ============================================ */
body.solomon-dark-mode .solomon-mini-chatbot-messages,
body.solomon-dark-mode .solomon-fullscreen-chatbot-messages {
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

body.solomon-dark-mode .solomon-mini-chatbot-messages::-webkit-scrollbar-thumb,
body.solomon-dark-mode .solomon-fullscreen-chatbot-messages::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
}

body.solomon-dark-mode .solomon-mini-chatbot-messages::-webkit-scrollbar-thumb:hover,
body.solomon-dark-mode .solomon-fullscreen-chatbot-messages::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.35);
}

body.solomon-dark-mode .solomon-user-message .solomon-message-content {
    background: var(--dark-accent-blue);
    color: white;
}

body.solomon-dark-mode .solomon-bot-message .solomon-message-content {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .solomon-message-content h1,
body.solomon-dark-mode .solomon-message-content h2,
body.solomon-dark-mode .solomon-message-content h3 {
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .solomon-message-content a {
    color: var(--dark-accent-blue);
}

body.solomon-dark-mode .solomon-message-content pre {
    background: var(--dark-bg-tertiary);
    color: var(--dark-text-primary);
}

/* ============================================
   DARK MODE INPUT
   ============================================ */
body.solomon-dark-mode .solomon-mini-chatbot-input,
body.solomon-dark-mode .solomon-fullscreen-chatbot-input {
    border-color: var(--dark-border-primary);
}

body.solomon-dark-mode #solomon-mini-user-input,
body.solomon-dark-mode #solomon-fullscreen-user-input {
    background: var(--dark-bg-input);
    border-color: var(--dark-border-secondary);
    color: var(--dark-text-primary);
}

body.solomon-dark-mode #solomon-mini-user-input::placeholder,
body.solomon-dark-mode #solomon-fullscreen-user-input::placeholder {
    color: var(--dark-text-muted);
}

/* ============================================
   DARK MODE FEEDBACK BUTTONS
   ============================================ */
body.solomon-dark-mode .solomon-feedback-buttons {
    background-color: var(--dark-bg-tertiary);
    border-color: var(--dark-border-secondary);
}

body.solomon-dark-mode .solomon-feedback-btn {
    color: var(--dark-text-muted);
}

body.solomon-dark-mode .solomon-feedback-btn:hover:not(:disabled) {
    color: var(--dark-accent-blue);
}

body.solomon-dark-mode .solomon-feedback-btn.active-positive {
    color: var(--dark-success) !important;
}

body.solomon-dark-mode .solomon-feedback-btn.active-negative {
    color: var(--dark-error) !important;
}

/* ============================================
   DARK MODE AI DETAILS
   ============================================ */
body.solomon-dark-mode .solomon-ai-details-toggle {
    background-color: var(--dark-bg-tertiary);
    border-color: var(--dark-border-secondary);
    color: var(--dark-text-secondary);
}

body.solomon-dark-mode .solomon-ai-details-toggle:hover {
    background: var(--dark-bg-hover);
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .solomon-ai-details-content {
    background-color: var(--dark-bg-tertiary);
    border-color: var(--dark-error);
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .solomon-ai-detail-item strong {
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .solomon-sources-list li {
    color: var(--dark-text-secondary);
}

body.solomon-dark-mode .solomon-sources-list a {
    color: var(--dark-accent-blue);
}

/* ============================================
   DARK MODE SCROLL TO BOTTOM
   ============================================ */
body.solomon-dark-mode .solomon-scroll-to-bottom {
    background: var(--dark-accent-blue);
}

body.solomon-dark-mode .solomon-scroll-to-bottom:hover {
    background: var(--dark-accent-blue-hover);
}

/* ============================================
   DARK MODE MODAL
   ============================================ */
body.solomon-dark-mode .solomon-modal-overlay {
    background: rgba(0, 0, 0, 0.7);
}

body.solomon-dark-mode .solomon-modal-content {
    background: var(--dark-bg-secondary);
    box-shadow: 0 8px 32px var(--dark-shadow);
}

body.solomon-dark-mode .solomon-modal-content h3 {
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .solomon-modal-content p {
    color: var(--dark-text-secondary);
}

body.solomon-dark-mode .solomon-btn-cancel {
    background: var(--dark-bg-tertiary);
    color: var(--dark-text-primary);
}

body.solomon-dark-mode .solomon-btn-cancel:hover {
    background: var(--dark-bg-hover);
}

body.solomon-dark-mode .solomon-btn-danger {
    background: var(--dark-error);
}

body.solomon-dark-mode .solomon-btn-danger:hover {
    background: #dc2626;
}

/* ============================================
   DARK MODE ERROR MESSAGE
   ============================================ */
body.solomon-dark-mode .solomon-error-message {
    background: rgba(239, 68, 68, 0.2);
    color: var(--dark-error);
    border: 1px solid var(--dark-error);
}

/* ============================================
   DARK MODE TYPING INDICATOR
   ============================================ */
body.solomon-dark-mode .solomon-typing-indicator span {
    background-color: var(--dark-accent-blue);
}