/* Dark Mode Styles */
[data-theme="dark"] {
    /* Background colors */
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3d3d3d;
    --bg-card: #2a2a2a;
    --bg-input: #3a3a3a;
    
    /* Text colors */
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #888888;
    --text-link: #60a5fa;
    
    /* Border colors */
    --border-primary: #404040;
    --border-secondary: #505050;
    
    /* Shadow */
    --shadow-primary: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
    --shadow-secondary: 0 10px 15px -3px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

[data-theme="dark"] .bg-white {
    background-color: var(--bg-card) !important;
}

[data-theme="dark"] .text-gray-900 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .text-gray-600 {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .text-gray-500 {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .border {
    border-color: var(--border-primary) !important;
}

[data-theme="dark"] .border-gray-300 {
    border-color: var(--border-secondary) !important;
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
    background-color: var(--bg-input) !important;
    border-color: var(--border-secondary) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] select::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .shadow {
    box-shadow: var(--shadow-primary) !important;
}

[data-theme="dark"] .shadow-lg {
    box-shadow: var(--shadow-secondary) !important;
}

/* Navbar dark mode */
[data-theme="dark"] .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom-color: var(--border-primary) !important;
}

[data-theme="dark"] .navbar-brand {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .navbar-nav .nav-link {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .navbar-nav .nav-link:hover {
    color: var(--text-primary) !important;
}

/* Footer dark mode */
[data-theme="dark"] .footer {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .footer a {
    color: var(--text-link) !important;
}

/* Cards and containers */
[data-theme="dark"] .card {
    background-color: var(--bg-card) !important;
    border-color: var(--border-primary) !important;
}

[data-theme="dark"] .bg-gray-50 {
    background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .bg-gray-100 {
    background-color: var(--bg-secondary) !important;
}

/* Buttons */
[data-theme="dark"] .btn-secondary {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-secondary) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .btn-outline-secondary {
    border-color: var(--border-secondary) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
}

/* Dropdown menus */
[data-theme="dark"] .dropdown-menu {
    background-color: var(--bg-card) !important;
    border-color: var(--border-primary) !important;
}

[data-theme="dark"] .dropdown-item {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .dropdown-item:hover {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
}

/* Tables */
[data-theme="dark"] .table {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .table th {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-primary) !important;
}

[data-theme="dark"] .table td {
    border-color: var(--border-primary) !important;
}

/* Modal */
[data-theme="dark"] .modal-content {
    background-color: var(--bg-card) !important;
    border-color: var(--border-primary) !important;
}

[data-theme="dark"] .modal-header {
    border-bottom-color: var(--border-primary) !important;
}

[data-theme="dark"] .modal-footer {
    border-top-color: var(--border-primary) !important;
}

/* Alert messages */
[data-theme="dark"] .alert-success {
    background-color: #065f46 !important;
    border-color: #047857 !important;
    color: #d1fae5 !important;
}

[data-theme="dark"] .alert-danger {
    background-color: #7f1d1d !important;
    border-color: #991b1b !important;
    color: #fecaca !important;
}

[data-theme="dark"] .alert-warning {
    background-color: #78350f !important;
    border-color: #92400e !important;
    color: #fef3c7 !important;
}

[data-theme="dark"] .alert-info {
    background-color: #1e3a8a !important;
    border-color: #1d4ed8 !important;
    color: #dbeafe !important;
}

/* Form elements */
[data-theme="dark"] .form-control:focus {
    border-color: #60a5fa !important;
    box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.25) !important;
}

[data-theme="dark"] .form-select:focus {
    border-color: #60a5fa !important;
    box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.25) !important;
}

/* Links */
[data-theme="dark"] a {
    color: var(--text-link) !important;
}

[data-theme="dark"] a:hover {
    color: #93c5fd !important;
}

/* Code blocks */
[data-theme="dark"] pre,
[data-theme="dark"] code {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
}

/* Scrollbar */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--bg-secondary);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--border-secondary);
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: var(--text-muted);
}

/* Smooth transition for theme switching */
* {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Dark mode toggle animation */
[data-theme="dark"] .switch-toggle.success .switch-slider {
    background-color: #059669 !important;
}

/* Mobile menu dark mode */
[data-theme="dark"] .mobile-menu {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-primary) !important;
}

[data-theme="dark"] .mobile-menu-item {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .mobile-menu-item:hover {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
}