/* Animations & Custom Styles */
@layer utilities {
    .glass-effect {
        @apply bg-white/10 backdrop-blur-md border border-white/20;
    }
    
    .no-scrollbar::-webkit-scrollbar {
        display: none;
    }
    .no-scrollbar {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
}

html {
    scroll-behavior: smooth;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Animations navbar */
#navbar.scrolled {
    @apply bg-white text-gray-900 shadow-md;
}
#navbar.scrolled .text-white {
    @apply text-gray-900;
}
#navbar.scrolled .bg-white\/10 {
    @apply bg-brand-50 text-brand-600;
}

/* Modal styles */
.modal-overlay {
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
}

/* Toast */
.toast {
    animation: slideIn 0.3s ease-out forwards;
}
.toast.hide {
    animation: slideOut 0.3s ease-in forwards;
}
@keyframes slideIn {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}
@keyframes slideOut {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(100%); opacity: 0; }
}
@keyframes modalIn {
    from { transform: scale(0.95) translateY(10px); opacity: 0; }
    to { transform: scale(1) translateY(0); opacity: 1; }
}