@import "tailwindcss"; :root, .light { --bg-primary: #f3f4f6; --bg-secondary: #ffffff; --bg-tertiary: #f9fafb; --text-primary: #1f2937; --text-secondary: #374151; --text-muted: #9ca3af; --border-color: #e5e7eb; --border-light: #f3f4f6; --accent-bg: #eff6ff; --accent-text: #1d4ed8; } .dark { --bg-primary: #111827; --bg-secondary: #1f2937; --bg-tertiary: #374151; --text-primary: #f9fafb; --text-secondary: #e5e7eb; --text-muted: #6b7280; --border-color: #374151; --border-light: #1f2937; --accent-bg: #1e3a5f; --accent-text: #60a5fa; } body { margin: 0; background-color: var(--bg-primary); color: var(--text-primary); } #root { height: 100vh; display: flex; } .dark .bg-white { background-color: var(--bg-secondary); } .dark .bg-gray-50 { background-color: var(--bg-tertiary); } .dark .bg-gray-100 { background-color: var(--bg-tertiary); } .dark .bg-gray-200 { background-color: var(--bg-tertiary); } .dark .bg-gray-300 { background-color: var(--bg-tertiary); } .dark .text-gray-300 { color: var(--text-muted); } .dark .text-gray-400 { color: var(--text-muted); } .dark .text-gray-500 { color: var(--text-muted); } .dark .text-gray-600 { color: var(--text-secondary); } .dark .text-gray-700 { color: var(--text-secondary); } .dark .text-gray-800 { color: var(--text-primary); } .dark .text-gray-900 { color: var(--text-primary); } .dark .bg-blue-50 { background-color: var(--accent-bg); } .dark .bg-blue-100 { background-color: var(--accent-bg); } .dark .text-blue-600 { color: var(--accent-text); } .dark .text-blue-700 { color: var(--accent-text); } .dark .border-blue-300 { border-color: var(--accent-text); } .dark .hover\:bg-blue-50:hover { background-color: var(--accent-bg); } .dark .bg-green-50 { background-color: #064e3b; } .dark .text-green-600 { color: #34d399; } .dark .text-green-700 { color: #34d399; } .dark .text-green-400 { color: #34d399; } .dark .bg-yellow-50 { background-color: #451a03; } .dark .text-yellow-700 { color: #fbbf24; } .dark .bg-purple-50 { background-color: #1e1b4b; } .dark .text-purple-700 { color: #a78bfa; } .dark .bg-red-50 { background-color: #450a0a; } .dark .text-red-700 { color: #f87171; } .dark .border-gray-100 { border-color: var(--border-light); } .dark .border-gray-200 { border-color: var(--border-color); } .dark .border-gray-300 { border-color: var(--border-color); } .dark .border-b { border-color: var(--border-color); } .dark .border-t { border-color: var(--border-color); } .dark .border-r { border-color: var(--border-color); } .dark .border-l { border-color: var(--border-color); } .dark .hover\:bg-gray-50:hover { background-color: var(--bg-tertiary); } .dark .hover\:bg-gray-100:hover { background-color: var(--bg-tertiary); } .dark .hover\:bg-gray-200:hover { background-color: var(--bg-tertiary); } .dark .hover\:text-gray-500:hover { color: var(--text-secondary); } .dark .hover\:text-gray-600:hover { color: var(--text-secondary); } .dark .hover\:text-gray-800:hover { color: var(--text-primary); } .dark .hover\:border-gray-300:hover { border-color: var(--border-color); } .dark .hover\:border-gray-400:hover { border-color: var(--border-color); } .dark .focus\:border-gray-300:focus { border-color: var(--border-color); } .dark ::selection { background-color: var(--accent-bg); color: var(--accent-text); } .dark input { background-color: var(--bg-secondary); color: var(--text-primary); } .dark select { background-color: var(--bg-secondary); color: var(--text-primary); } .dark textarea { background-color: var(--bg-secondary); color: var(--text-primary); } .dark .bg-transparent { background-color: transparent; }