/* ============================================
   Floodle Dark Theme - Soft & Elegant
   ============================================ */

/* Main background */
body.dark-mode {
    background: #0B1121;
    color: #E5E7EB;
}

/* Cards & containers */
body.dark-mode .bg-white,
body.dark-mode .bg-gray-50,
body.dark-mode .bg-gray-100,
body.dark-mode .bg-gray-200,
body.dark-mode .glass-card {
    background-color: #1E293B !important;
}

/* Borders */
body.dark-mode .border-gray-100,
body.dark-mode .border-gray-200,
body.dark-mode .border-gray-300 {
    border-color: #334155 !important;
}

/* Text colors */
body.dark-mode .text-gray-400,
body.dark-mode .text-gray-500,
body.dark-mode .text-gray-600 {
    color: #94A3B8 !important;
}

body.dark-mode .text-gray-700,
body.dark-mode .text-gray-800,
body.dark-mode .text-gray-900 {
    color: #CBD5E1 !important;
}

body.dark-mode .text-gray-300 {
    color: #64748B !important;
}

/* Input fields */
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
    background-color: #0F172A !important;
    border-color: #334155 !important;
    color: #F1F5F9 !important;
}

body.dark-mode input:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
    background-color: #1E293B !important;
    border-color: #3B82F6 !important;
    outline: none;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
    color: #475569 !important;
}

/* Buttons */
body.dark-mode button.bg-gray-200,
body.dark-mode .bg-gray-200 {
    background-color: #334155 !important;
    color: #CBD5E1 !important;
}

body.dark-mode button.bg-gray-200:hover,
body.dark-mode .bg-gray-200:hover {
    background-color: #475569 !important;
}

/* Dropdown menu */
body.dark-mode .dropdown-content,
body.dark-mode #export-menu,
body.dark-mode .absolute.bg-white {
    background-color: #1E293B !important;
    border-color: #334155 !important;
}

body.dark-mode .dropdown-content a,
body.dark-mode #export-menu a {
    color: #CBD5E1 !important;
    border-bottom-color: #334155 !important;
}

body.dark-mode .dropdown-content a:hover,
body.dark-mode #export-menu a:hover {
    background-color: #334155 !important;
    color: #60A5FA !important;
}

/* Tags & badges */
body.dark-mode .bg-gray-100 {
    background-color: #334155 !important;
    color: #94A3B8 !important;
}

body.dark-mode .bg-red-100 {
    background-color: rgba(239, 68, 68, 0.15) !important;
    color: #F87171 !important;
}

body.dark-mode .bg-orange-100 {
    background-color: rgba(245, 158, 11, 0.15) !important;
    color: #FBBF24 !important;
}

body.dark-mode .bg-green-100 {
    background-color: rgba(16, 185, 129, 0.15) !important;
    color: #34D399 !important;
}

body.dark-mode .bg-blue-100 {
    background-color: rgba(59, 130, 246, 0.15) !important;
    color: #60A5FA !important;
}

/* Gradients */
body.dark-mode .bg-gradient-to-r {
    background: linear-gradient(135deg, #1E3A8A, #312E81) !important;
}

body.dark-mode .bg-primary\/10 {
    background-color: rgba(59, 130, 246, 0.1) !important;
}

body.dark-mode .bg-primary\/5 {
    background-color: rgba(59, 130, 246, 0.05) !important;
}

/* Note cards */
body.dark-mode .note-card,
body.dark-mode .bg-white.rounded-lg,
body.dark-mode .bg-white.rounded-2xl,
body.dark-mode .chat-messages .message-in {
    background-color: #1E293B !important;
}

body.dark-mode .message-out {
    background: #3B82F6 !important;
    color: white !important;
}

body.dark-mode .chat-messages .text-xs.text-gray-400 {
    color: #64748B !important;
}

body.dark-mode .profile-dropdown .w-9.h-9 {
    background: linear-gradient(135deg, #3B82F6, #1E40AF) !important;
}

/* Scrollbar */
body.dark-mode ::-webkit-scrollbar-track {
    background: #0F172A;
}

body.dark-mode ::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 4px;
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: #475569;
}

/* Canvas background */
body.dark-mode canvas {
    background-color: #0F172A !important;
}

/* Auth pages (login/register) */
body.dark-mode .bg-white.rounded-2xl,
body.dark-mode .bg-white.rounded-xl {
    background-color: #1E293B !important;
}

body.dark-mode .bg-gray-50\/80,
body.dark-mode .bg-gray-50 {
    background-color: #0F172A !important;
}

body.dark-mode .border-gray-100,
body.dark-mode .border-gray-200 {
    border-color: #334155 !important;
}

/* Пояснительный блок в тёмной теме */
body.dark-mode .bg-blue-50 {
    background-color: rgba(59, 130, 246, 0.15) !important;
}

body.dark-mode .bg-blue-50 .text-gray-800 {
    color: #E2E8F0 !important;
}

body.dark-mode .bg-blue-50 .text-gray-500 {
    color: #94A3B8 !important;
}

body.dark-mode .bg-blue-50 .border-primary {
    border-left-color: #60A5FA !important;
}