 <style>
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
        body {
            font-family: 'Inter', sans-serif;
            background-color: #f7f7f7;
            transition: background-color 0.3s, color 0.3s;
        }
        .dark {
            background-color: #121212;
            color: #e0e0e0;
        }
        .dark .bg-white {
            background-color: #1e1e1e;
        }
        .dark .text-gray-800 {
            color: #e0e0e0;
        }
        .dark .text-gray-600 {
            color: #b0b0b0;
        }
        .dark .text-gray-400 {
            color: #808080;
        }
        .dark .bg-gray-100 {
            background-color: #121212;
        }
        .dark .bg-gray-200 {
            background-color: #2c2c2c;
        }
        .dark .shadow-sm, .dark .shadow-md, .dark .shadow-lg {
            box-shadow: 0 4px 6px -1px rgba(255, 255, 255, 0.1), 0 2px 4px -1px rgba(255, 255, 255, 0.06);
        }
        .dark input {
            background-color: #2c2c2c;
            border-color: #444;
            color: #e0e0e0;
        }
        .dark .hover\:text-green-600:hover {
            color: #10b981;
        }
        .dark .hover\:text-white:hover {
            color: #fff;
        }
    </style>