/* Dark Mode Styles für Tailwind CSS */

html.dark body {
    background-color: #0f172a;
    color: #e2e8f0
}

html.dark .bg-white {
    background-color: #1e293b !important
}

html.dark .bg-gray-50 {
    background-color: #263348 !important
}

html.dark .bg-gray-100 {
    background-color: #0f172a !important
}

html.dark .bg-gray-200 {
    background-color: #334155 !important
}

html.dark .text-gray-900 {
    color: #f8fafc !important
}

html.dark .text-gray-800 {
    color: #f1f5f9 !important
}

html.dark .text-gray-700 {
    color: #e2e8f0 !important
}

html.dark .text-gray-600 {
    color: #cbd5e1 !important
}

html.dark .text-gray-500 {
    color: #94a3b8 !important
}

html.dark .text-gray-400 {
    color: #64748b !important
}

html.dark .border-gray-100 {
    border-color: #263348 !important
}

html.dark .border-gray-200 {
    border-color: #334155 !important
}

html.dark .border-gray-300 {
    border-color: #475569 !important
}

html.dark .divide-gray-50>*+* {
    border-color: #263348 !important
}

html.dark .divide-gray-100>*+* {
    border-color: #263348 !important
}

html.dark .divide-gray-200>*+* {
    border-color: #334155 !important
}

html.dark .hover\:bg-gray-50:hover {
    background-color: #334155 !important
}

html.dark .hover\:bg-gray-100:hover {
    background-color: #334155 !important
}

html.dark .shadow {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .5), 0 1px 2px -1px rgba(0, 0, 0, .5) !important
}

html.dark .shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .6), 0 4px 6px -4px rgba(0, 0, 0, .6) !important
}

html.dark input:not([type=checkbox]):not([type=radio]),
html.dark select,
html.dark textarea {
    background-color: #1e293b !important;
    border-color: #475569 !important;
    color: #f1f5f9 !important
}

html.dark input::placeholder,
html.dark textarea::placeholder {
    color: #64748b !important
}