/* Main Style File - Imports all CSS modules */

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* Theme: Light (default) */
@import url('light-theme.css');

/* Theme: Dark */
@import url('dark-theme.css');

/* Layout */
@import url('layout.css');

/* Components */
@import url('components.css');

/* Forms */
@import url('forms.css');

/* Toast Notifications */
@import url('toast.css');

/* Responsive */
@import url('responsive.css');

/* Base Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    background: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.6;
    overflow-x: hidden;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--bg-primary);
}

::-webkit-scrollbar-thumb {
    background: var(--gradient-primary);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #764ba2, #667eea);
}

/* Links */
a {
    color: #667eea;
    text-decoration: none;
    transition: all 0.3s;
}

a:hover {
    color: #764ba2;
}

/* Selection */
::selection {
    background: #667eea;
    color: #ffffff;
}

/* Loading */
.loading {
    opacity: 0.6;
    pointer-events: none;
}

/* Utility Classes */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }

.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mb-10 { margin-bottom: 10px; }
.mb-20 { margin-bottom: 20px; }
.mb-30 { margin-bottom: 30px; }

.flex { display: flex; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.gap-10 { gap: 10px; }
.gap-20 { gap: 20px; }

.w-full { width: 100%; }

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.animate-fadeIn {
    animation: fadeIn 0.5s ease;
}

.animate-slideUp {
    animation: slideUp 0.5s ease;
}