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

body { font-family: 'Inter', sans-serif; transition: background-color 0.3s, color 0.3s; }

/* Animation Classes */
.fade-in { animation: fadeIn 0.4s ease-out forwards; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.pop-in { animation: popIn 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55) forwards; }
@keyframes popIn { from { opacity: 0; transform: scale(0.8) translateY(20px); } to { opacity: 1; transform: scale(1) translateY(0); } }

.animate-slide-in { animation: slideIn 0.4s ease-out forwards; }
@keyframes slideIn { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: translateX(0); } }

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.dark ::-webkit-scrollbar-thumb { background: #334155; }
.dark ::-webkit-scrollbar-thumb:hover { background: #475569; }

/* Tab Active State */
.nav-btn.active { color: #0d9488; border-bottom: 2px solid #0d9488; font-weight: 700; }
.dark .nav-btn.active { color: #2dd4bf; border-bottom: 2px solid #2dd4bf; }

/* Glass Class Utility */
.glass {
    background: rgba(255, 255, 255, 0.8); 
    backdrop-filter: blur(12px); 
    border: 1px solid rgba(226, 232, 240, 0.8); 
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.dark .glass {
    background: rgba(30, 41, 59, 0.5);
    border-color: rgba(255, 255, 255, 0.05);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}