body {
    font-family: 'Inter', sans-serif;
    transition: background-color 0.3s, color 0.3s;
}

.dark-mode {
    background-color: #121212;
    color: #e0e0e0;
}

.dark-mode .bg-white {
    background-color: #1e1e1e;
}

.dark-mode .bg-gray-100 {
    background-color: #2c2c2c;
}

.dark-mode .text-gray-900 {
    color: #f0f0f0;
}

.dark-mode .text-gray-500 {
    color: #b0b0b0;
}

.dark-mode .ring-gray-300 {
    --tw-ring-color: #4a4a4a;
}

.dark-mode input,
.dark-mode select {
    background-color: #3b3b3b;
    color: #e0e0e0;
    border-color: #4a4a4a;
}

.dark-mode input:focus,
.dark-mode select:focus {
    outline: none;
    border-color: #6a6a6a;
}