| /* Custom styles that complement Tailwind */ | |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); | |
| body { | |
| font-family: 'Inter', sans-serif; | |
| } | |
| /* Chart container responsive behavior */ | |
| .chart-container { | |
| position: relative; | |
| height: 100%; | |
| width: 100%; | |
| } | |
| /* Smooth transitions for dark mode */ | |
| .dark .bg-white { | |
| background-color: #1f2937; | |
| } | |
| .dark .text-gray-800 { | |
| color: #f3f4f6; | |
| } | |
| .dark .text-gray-600 { | |
| color: #d1d5db; | |
| } | |
| .dark .border-gray-200 { | |
| border-color: #374151; | |
| } | |
| /* Table row hover effect */ | |
| tbody tr { | |
| transition: background-color 0.2s ease; | |
| } | |
| tbody tr:hover { | |
| background-color: rgba(59, 130, 246, 0.05); | |
| } | |
| .dark tbody tr:hover { | |
| background-color: rgba(59, 130, 246, 0.1); | |
| } | |
| /* Custom scrollbar */ | |
| ::-webkit-scrollbar { | |
| width: 8px; | |
| height: 8px; | |
| } | |
| ::-webkit-scrollbar-track { | |
| background: #f1f1f1; | |
| } | |
| .dark ::-webkit-scrollbar-track { | |
| background: #374151; | |
| } | |
| ::-webkit-scrollbar-thumb { | |
| background: #cbd5e0; | |
| border-radius: 4px; | |
| } | |
| .dark ::-webkit-scrollbar-thumb { | |
| background: #4b5563; | |
| } | |
| ::-webkit-scrollbar-thumb:hover { | |
| background: #a0aec0; | |
| } |