/* TriVector Technologies - Custom Styles */

html { scroll-behavior: smooth; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #000; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #06b6d4, #9333ea); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #0891b2, #7e22ce); }

@keyframes gradient { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
.animate-gradient { background-size: 200% auto; animation: gradient 8s linear infinite; }

#header.scrolled { background-color: rgba(0, 0, 0, 0.8); backdrop-filter: blur(20px); border-bottom: 1px solid rgba(6, 182, 212, 0.2); box-shadow: 0 4px 6px -1px rgba(6, 182, 212, 0.05); }

button, a[class*="bg-gradient"] { transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.3s ease; }
button:hover:not(:disabled), a[class*="bg-gradient"]:hover { transform: translateY(-2px); }
button:active:not(:disabled), a[class*="bg-gradient"]:active { transform: translateY(0); }

a { transition: color 0.2s ease, border-color 0.2s ease; }

.toast { position: fixed; top: 20px; right: 20px; background: rgba(0, 0, 0, 0.9); border: 1px solid rgba(6, 182, 212, 0.5); border-radius: 0.5rem; padding: 1rem 1.5rem; color: white; z-index: 9999; animation: slideIn 0.3s ease-out; }
@keyframes slideIn { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
.toast.success { border-color: rgba(34, 197, 94, 0.5); }
.toast.error { border-color: rgba(239, 68, 68, 0.5); }

.spinner { border: 3px solid rgba(6, 182, 212, 0.3); border-top: 3px solid #06b6d4; border-radius: 50%; width: 20px; height: 20px; animation: spin 1s linear infinite; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

input:focus, textarea:focus, select:focus { outline: none; border-color: #06b6d4 !important; box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.1); }

@media (max-width: 768px) { h1 { font-size: 2.5rem; } }