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

body { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

.sidebar-link { transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
.sidebar-link:hover { transform: translateX(4px); }
.nav-active { background: rgba(59, 130, 246, 0.1) !important; color: #3b82f6 !important; font-weight: 600; }

.card-hover { transition: all 0.3s cubic-bezier(0.4, 0.0, 0.2, 1); }
.card-hover:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1); }

.page { animation: fadeIn 0.3s ease-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.auth-transition { transition: opacity 0.4s ease, visibility 0.4s ease; }
.auth-form-fade { animation: fadeIn 0.4s ease-out forwards; }

@keyframes blob { 
    0%, 100% { transform: translate(0, 0) scale(1); } 
    33% { transform: translate(30px, -50px) scale(1.1); } 
    66% { transform: translate(-20px, 20px) scale(0.9); } 
}
.animate-blob { animation: blob 7s infinite; }
.animation-delay-2000 { animation-delay: 2s; }
.animation-delay-4000 { animation-delay: 4s; }

#toast-container { position: fixed; bottom: 24px; right: 24px; z-index: 9999; display: flex; flex-direction: column; gap: 10px; }
.toast { background: white; border: 1px solid #e5e7eb; border-radius: 16px; padding: 14px 20px; display: flex; align-items: center; gap: 12px; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12); animation: toastIn 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); min-width: 280px; }
.dark .toast { background: #1f2937; border-color: #374151; }
@keyframes toastIn { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: translateX(0); } }

.toggle-switch { position: relative; width: 44px; height: 24px; cursor: pointer; flex-shrink: 0; }
.toggle-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.toggle-track { position: absolute; inset: 0; background: #d1d5db; border-radius: 999px; transition: background 0.2s; }
.dark .toggle-track { background: #4b5563; }
.toggle-switch input:checked + .toggle-track { background: #3b82f6; }
.toggle-thumb { position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; background: white; border-radius: 50%; transition: transform 0.2s; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); }
.toggle-switch input:checked ~ .toggle-thumb { transform: translateX(20px); }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }
.dark ::-webkit-scrollbar-thumb { background: #374151; }

