/* ===================================
   Dark Mode Styles
   =================================== */

[data-theme="dark"] {
    color-scheme: dark;
}

/* Dark Mode Background Gradients */
[data-theme="dark"] .bg-gradient-to-br {
    opacity: 0.8;
}

/* Dark Mode Cards */
[data-theme="dark"] .pricing-card,
[data-theme="dark"] .feature-card {
    background: linear-gradient(145deg, #1f2937, #111827);
    border: 1px solid #374151;
}

/* Dark Mode Inputs */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: #1f2937;
    border-color: #374151;
    color: #f9fafb;
}

[data-theme="dark"] input[type="text"]:focus,
[data-theme="dark"] input[type="email"]:focus,
[data-theme="dark"] input[type="password"]:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
    border-color: var(--quantum-purple);
    background-color: #111827;
}

/* Dark Mode Placeholders */
[data-theme="dark"] ::placeholder {
    color: #6b7280;
}

/* Dark Mode Tables */
[data-theme="dark"] table {
    background-color: #1f2937;
}

[data-theme="dark"] thead {
    background-color: #111827;
}

[data-theme="dark"] tbody tr:hover {
    background-color: #374151;
}

/* Dark Mode Dropdowns */
[data-theme="dark"] .dropdown-menu {
    background-color: #1f2937;
    border-color: #374151;
}

[data-theme="dark"] .dropdown-item:hover {
    background-color: #374151;
}

/* Dark Mode Modals */
[data-theme="dark"] .modal-content {
    background-color: #1f2937;
    border-color: #374151;
}

/* Dark Mode Alerts */
[data-theme="dark"] .alert {
    background-color: #1f2937;
    border-color: #374151;
}

/* Dark Mode Hero Section */
[data-theme="dark"] .hero-slider {
    background: linear-gradient(135deg, #111827 0%, #1f2937 50%, #111827 100%);
}

/* Dark Mode Pricing Section */
[data-theme="dark"] .pricing-section {
    background: linear-gradient(135deg, #111827 0%, #1f2937 50%, #111827 100%);
}

/* Dark Mode Shadows */
[data-theme="dark"] .shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .shadow-xl {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.5), 0 10px 10px -5px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .shadow-2xl {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.7);
}

/* Dark Mode Hover Effects */
[data-theme="dark"] .pricing-card:hover,
[data-theme="dark"] .feature-card:hover {
    box-shadow: 0 25px 50px -12px rgba(139, 92, 246, 0.3);
}

/* Dark Mode Code Blocks */
[data-theme="dark"] pre,
[data-theme="dark"] code {
    background-color: #111827;
    border-color: #374151;
}

/* Dark Mode Badges */
[data-theme="dark"] .badge {
    background-color: #374151;
    color: #f9fafb;
}

/* Dark Mode Borders */
[data-theme="dark"] .border {
    border-color: #374151 !important;
}

/* Dark Mode Text Selection */
[data-theme="dark"] ::selection {
    background-color: var(--quantum-blue);
    color: #ffffff;
}

[data-theme="dark"] ::-moz-selection {
    background-color: var(--quantum-blue);
    color: #ffffff;
}

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