/* Theme Styles */

/* Dark theme overrides */
[data-theme="dark"] {
    /* Update gradients for dark theme */
    --gradient-primary: linear-gradient(135deg, #2563EB 0%, #3B82F6 100%);
    --gradient-hover: linear-gradient(135deg, #1E40AF 0%, #2563EB 100%);
    --gradient-text: linear-gradient(135deg, #60A5FA 0%, #93BBFC 100%);
}

/* Theme-specific animations */
[data-theme="dark"] .hero {
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.1) 0%, rgba(59, 130, 246, 0.1) 100%);
}

[data-theme="dark"] .hero::before {
    background: radial-gradient(circle at 30% 20%, rgba(37, 99, 235, 0.15) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(59, 130, 246, 0.15) 0%, transparent 50%);
}

/* Theme transition animations */
* {
    transition: background-color var(--transition-base), 
                color var(--transition-base), 
                border-color var(--transition-base);
}

/* Dark theme specific component adjustments */
[data-theme="dark"] .demo-placeholder {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

[data-theme="dark"] .chat-input input {
    background: var(--bg-color);
}

[data-theme="dark"] .download-link {
    background: var(--bg-color);
}

[data-theme="dark"] .download-link:hover {
    background: var(--primary-color);
}

[data-theme="dark"] .social-links a {
    background: var(--bg-color);
}

/* Theme toggle button specific styles */
.theme-toggle[data-theme="dark"] .theme-icon {
    transform: rotate(180deg);
}

/* Smooth theme transition */
html {
    transition: background-color var(--transition-base);
}

body {
    transition: background-color var(--transition-base), color var(--transition-base);
}

/* Custom scrollbar for dark theme */
[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-color);
    border-radius: 4px;
}

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

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

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

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

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

/* Theme-aware selection */
::selection {
    background: var(--primary-color);
    color: white;
}

::-moz-selection {
    background: var(--primary-color);
    color: white;
}

/* Theme transition for all interactive elements */
.header,
.nav-link,
.btn,
.card,
.download-link,
.tab-button,
.feature-item,
.use-case-card,
.model-item,
.download-card {
    transition: background-color var(--transition-base), 
                color var(--transition-base), 
                border-color var(--transition-base),
                box-shadow var(--transition-base);
}