/* Notifi Dark Mode Styles */

/* Dark mode color scheme */
.dark {
    color-scheme: dark;
}

/* Base dark mode overrides */
.dark body {
    background: linear-gradient(135deg, #1e1b4b 0%, #111827 50%, #1e1b4b 100%) !important;
}

/* Cards and containers */
.dark .bg-white {
    background-color: #1f2937 !important;
}

.dark .bg-gray-50 {
    background-color: #374151 !important;
}

.dark .bg-gray-100 {
    background-color: #374151 !important;
}

/* Text colors */
.dark .text-gray-800 {
    color: #f3f4f6 !important;
}

.dark .text-gray-700 {
    color: #e5e7eb !important;
}

.dark .text-gray-600 {
    color: #d1d5db !important;
}

.dark .text-gray-500 {
    color: #9ca3af !important;
}

.dark .text-gray-400 {
    color: #9ca3af !important;
}

/* Borders */
.dark .border-gray-200 {
    border-color: #374151 !important;
}

.dark .border-gray-300 {
    border-color: #4b5563 !important;
}

/* Form inputs */
.dark input,
.dark select,
.dark textarea {
    background-color: #374151 !important;
    border-color: #4b5563 !important;
    color: #f3f4f6 !important;
}

.dark input::placeholder,
.dark textarea::placeholder {
    color: #9ca3af !important;
}

.dark input:focus,
.dark select:focus,
.dark textarea:focus {
    border-color: #6366f1 !important;
}

/* Disabled inputs */
.dark input:disabled,
.dark select:disabled,
.dark textarea:disabled {
    background-color: #1f2937 !important;
    color: #9ca3af !important;
}

/* Navigation */
.dark nav {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
}

/* Shadows - make them more subtle in dark mode */
.dark .shadow,
.dark .shadow-sm,
.dark .shadow-lg,
.dark .shadow-xl {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2) !important;
}

/* Tables */
.dark table thead {
    background-color: #374151 !important;
}

.dark table tbody tr:hover {
    background-color: #374151 !important;
}

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

/* Alert/notification backgrounds */
.dark .bg-green-50 {
    background-color: rgba(34, 197, 94, 0.1) !important;
}

.dark .bg-red-50 {
    background-color: rgba(239, 68, 68, 0.1) !important;
}

.dark .bg-yellow-50 {
    background-color: rgba(234, 179, 8, 0.1) !important;
}

.dark .bg-blue-50 {
    background-color: rgba(59, 130, 246, 0.1) !important;
}

.dark .bg-indigo-50 {
    background-color: rgba(99, 102, 241, 0.1) !important;
}

.dark .bg-purple-50 {
    background-color: rgba(168, 85, 247, 0.1) !important;
}

/* Status badges */
.dark .bg-green-100 {
    background-color: rgba(34, 197, 94, 0.2) !important;
}

.dark .bg-red-100 {
    background-color: rgba(239, 68, 68, 0.2) !important;
}

.dark .bg-yellow-100 {
    background-color: rgba(234, 179, 8, 0.2) !important;
}

.dark .bg-indigo-100 {
    background-color: rgba(99, 102, 241, 0.2) !important;
}

/* Gradient backgrounds - adjust for dark mode */
.dark .from-indigo-50 {
    --tw-gradient-from: #312e81 !important;
}

.dark .via-white {
    --tw-gradient-stops: var(--tw-gradient-from), #1f2937, var(--tw-gradient-to) !important;
}

.dark .to-purple-50 {
    --tw-gradient-to: #581c87 !important;
}

/* Hover states */
.dark .hover\:bg-gray-50:hover {
    background-color: #374151 !important;
}

.dark .hover\:bg-gray-100:hover {
    background-color: #4b5563 !important;
}

.dark .hover\:text-gray-800:hover {
    color: #f3f4f6 !important;
}

/* Links */
.dark a.text-indigo-600 {
    color: #818cf8 !important;
}

.dark a.text-indigo-600:hover,
.dark .hover\:text-indigo-800:hover {
    color: #a5b4fc !important;
}

/* Footer */
.dark footer {
    border-color: #374151 !important;
}

/* Modal/dialog backgrounds */
.dark .bg-black\/50 {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

/* Code blocks */
.dark code {
    background-color: #374151 !important;
    color: #e5e7eb !important;
}

/* Scrollbar styling for dark mode */
.dark ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.dark ::-webkit-scrollbar-track {
    background: #1f2937;
}

.dark ::-webkit-scrollbar-thumb {
    background: #4b5563;
    border-radius: 4px;
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: #6b7280;
}

/* Tab buttons */
.dark button[class*="border-b-2"][class*="border-indigo-500"] {
    border-color: #818cf8 !important;
    color: #818cf8 !important;
}

/* Gradient cards - keep gradients but darker */
.dark .from-indigo-500 {
    --tw-gradient-from: #4f46e5 !important;
}

.dark .to-purple-600 {
    --tw-gradient-to: #9333ea !important;
}

/* Category color strip at top of cards - don't override */
.dark .category-card .h-2 {
    /* Keep original category colors */
}

/* Fix specific problem areas */
.dark .bg-gradient-to-r.from-indigo-50.to-purple-50 {
    background: linear-gradient(to right, rgba(99, 102, 241, 0.15), rgba(168, 85, 247, 0.15)) !important;
}

/* Stats cards */
.dark .text-green-600 {
    color: #4ade80 !important;
}

.dark .text-red-600 {
    color: #f87171 !important;
}

.dark .text-indigo-600 {
    color: #818cf8 !important;
}

/* Cookie banner */
.dark #cookie-banner {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
}