@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
    .content-auto { content-visibility: auto; }
    .scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
    .scrollbar-hide::-webkit-scrollbar { display: none; }
    .table-cell-nowrap { white-space: nowrap; }
    .table-cell-fixed { width: 100px; }
    .table-row-fixed { height: 48px; }
}

:root {
    --primary: #10B981;
    --secondary: #3B82F6;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
    --light: #F3F4F6;
    --dark: #1F2937;
}

.dark {
    color-scheme: dark;
}

@layer base {
    .dark body {
        background-color: #111827;
    }
    
    .dark .bg-white {
        background-color: #1f2937 !important;
    }
    
    .dark .bg-gray-50 {
        background-color: #111827 !important;
    }
    
    .dark .bg-gray-100 {
        background-color: #374151 !important;
    }
    
    .dark .bg-gray-200 {
        background-color: #4b5563 !important;
    }
    
    .dark .text-gray-500 {
        color: #9ca3af !important;
    }
    
    .dark .text-gray-600 {
        color: #d1d5db !important;
    }
    
    .dark .text-gray-700 {
        color: #e5e7eb !important;
    }
    
    .dark .text-gray-800 {
        color: #f3f4f6 !important;
    }
    
    .dark .text-gray-900 {
        color: #ffffff !important;
    }
    
    .dark .border-gray-200 {
        border-color: #374151 !important;
    }
    
    .dark .border-gray-300 {
        border-color: #4b5563 !important;
    }
    
    .dark .divide-gray-200 > * + * {
        border-color: #374151 !important;
    }
    
    .dark .hover\:bg-gray-100:hover {
        background-color: #374151 !important;
    }
    
    .dark .hover\:bg-gray-200:hover {
        background-color: #4b5563 !important;
    }
    
    .dark .hover\:text-gray-700:hover {
        color: #e5e7eb !important;
    }
    
    .dark .hover\:text-gray-900:hover {
        color: #ffffff !important;
    }
    
    .dark .focus\:ring-gray-200:focus {
        --tw-ring-color: #4b5563 !important;
    }
    
    .dark input[type="text"],
    .dark input[type="number"],
    .dark input[type="date"],
    .dark select {
        background-color: #374151 !important;
        border-color: #4b5563 !important;
        color: #f3f4f6 !important;
    }
    
    .dark input[type="date"]::-webkit-calendar-picker-indicator {
        filter: invert(1);
        cursor: pointer;
    }
    
    .dark input[type="date"]::-webkit-datetime-edit {
        color: #f3f4f6;
    }
    
    .dark input[type="date"]::-webkit-datetime-edit-fields-wrapper {
        background-color: #374151;
    }
    
    .dark input[type="date"]::-webkit-datetime-edit-text {
        color: #9ca3af;
    }
    
    .dark input[type="date"]::-webkit-datetime-edit-month-field,
    .dark input[type="date"]::-webkit-datetime-edit-day-field,
    .dark input[type="date"]::-webkit-datetime-edit-year-field {
        color: #f3f4f6;
    }
    
    .dark input[type="date"]::-webkit-datetime-edit-month-field:focus,
    .dark input[type="date"]::-webkit-datetime-edit-day-field:focus,
    .dark input[type="date"]::-webkit-datetime-edit-year-field:focus {
        background-color: #4b5563;
        color: #ffffff;
    }
    
    .dark input[type="checkbox"] {
        accent-color: #10B981;
    }
    
    .dark table thead {
        background-color: #374151 !important;
    }
    
    .dark table th {
        color: #f3f4f6 !important;
        border-color: #4b5563 !important;
    }
    
    .dark table td {
        border-color: #374151 !important;
    }
    
    .dark table tbody tr:hover {
        background-color: #374151 !important;
    }
    
    .dark .shadow {
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.3) !important;
    }
    
    .dark .shadow-md {
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.3) !important;
    }
    
    .dark .shadow-lg {
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.3) !important;
    }
}