:root {
    --bg-primary: #1e1e2e;
    --bg-secondary: #252536;
    --bg-tertiary: #2d2d44;
    --text-primary: #cdd6f4;
    --text-secondary: #a6adc8;
    --accent-primary: #89b4fa;
    --accent-secondary: #cba6f7;
    --border-color: #45475a;
    --success: #a6e3a1;
    --warning: #f9e2af;
    --error: #f38ba8;
    --line-number: #6c7086;
    --autocomplete-bg: #313244;
    --autocomplete-hover: #45475a;
}

body.light-theme {
    --bg-primary: #ffffff;
    --bg-secondary: #f5f5f5;
    --bg-tertiary: #e9e9e9;
    --text-primary: #333333;
    --text-secondary: #666666;
    --accent-primary: #4285f4;
    --accent-secondary: #9b72cb;
    --border-color: #dddddd;
    --success: #34a853;
    --warning: #fbbc05;
    --error: #ea4335;
    --line-number: #999999;
    --autocomplete-bg: #ffffff;
    --autocomplete-hover: #f0f0f0;
}

body {
    font-family: 'Nata Sans', sans-serif;
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Outfit', sans-serif;
}

button {
    font-family: 'Mozilla Text', sans-serif;
}

code, pre {
    font-family: 'Google Sans Code', monospace;
}

/* Custom Tailwind classes */
.bg-bg-primary { background-color: var(--bg-primary); }
.bg-bg-secondary { background-color: var(--bg-secondary); }
.bg-bg-tertiary { background-color: var(--bg-tertiary); }
.text-text-primary { color: var(--text-primary); }
.text-text-secondary { color: var(--text-secondary); }
.border-border-color { border-color: var(--border-color); }
.accent-primary { color: var(--accent-primary); }
.accent-secondary { color: var(--accent-secondary); }
.bg-accent-primary { background-color: var(--accent-primary); }
.bg-accent-secondary { background-color: var(--accent-secondary); }

@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.animate-marquee {
    animation: marquee 20s linear infinite;
    display: inline-block;
}

/* Hover Effects */
.hover-glow {
    transition: all 0.3s ease;
    box-shadow: 0 0 0px var(--accent-primary);
}

.hover-glow:hover {
    box-shadow: 0 0 15px var(--accent-primary);
}

a.hover-glow-text {
    transition: all 0.3s ease;
    text-shadow: 0 0 0px var(--accent-primary);
}

a.hover-glow-text:hover {
    text-shadow: 0 0 8px var(--accent-primary);
}