/* Floating Background Animation */ .bg-floating { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: -1; overflow: hidden; background: #e2e8f0; } .dark .bg-floating { background: #0f172a; } .bg-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.35; animation: float 20s infinite ease-in-out alternate; } .bg-orb-1 { width: 600px; height: 600px; top: -100px; left: -100px; background: radial-gradient(circle, rgba(16,185,129,0.3) 0%, rgba(16,185,129,0) 70%); animation-delay: 0s; } .bg-orb-2 { width: 500px; height: 500px; bottom: -50px; right: -50px; background: radial-gradient(circle, rgba(20,184,166,0.3) 0%, rgba(20,184,166,0) 70%); animation-delay: -5s; } .bg-orb-3 { width: 400px; height: 400px; top: 40%; left: 30%; background: radial-gradient(circle, rgba(56,189,248,0.2) 0%, rgba(56,189,248,0) 70%); animation-delay: -10s; } @keyframes float { 0% { transform: translate(0, 0) scale(1); } 33% { transform: translate(30px, -50px) scale(1.1); } 66% { transform: translate(-20px, 20px) scale(0.9); } 100% { transform: translate(0, 0) scale(1); } } /* Loading Spinner for Buttons */ .btn-loading { position: relative; pointer-events: none; opacity: 0.8; } .btn-loading .text { visibility: hidden; } .btn-loading::after { content: ""; position: absolute; width: 1.25rem; height: 1.25rem; top: 0; left: 0; bottom: 0; right: 0; margin: auto; border: 2px solid transparent; border-top-color: currentColor; border-radius: 50%; animation: spin 0.6s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } /* Page Transition */ .page-enter { animation: fadeUp 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards; } @keyframes fadeUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } /* Hide SweetAlert background blur conflicts */ .swal2-backdrop-show { backdrop-filter: blur(4px); background: rgba(0,0,0,0.4) !important; } .dark .swal2-popup { background: #1e293b; color: #f1f5f9; } .dark .swal2-title { color: #f8fafc; }