/* Custom Animations */
@keyframes glow {
    0%, 100% { box-shadow: 0 0 20px rgba(124, 58, 237, 0.3); }
    50% { box-shadow: 0 0 40px rgba(124, 58, 237, 0.6); }
}

@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

@keyframes pulse-slow {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 0.8; }
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-8px); }
    75% { transform: translateX(8px); }
}

@keyframes gradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.animate-shake { animation: shake 0.4s ease-in-out; }
.animate-glow { animation: glow 4s infinite; }
.animate-float { animation: float 6s ease-in-out infinite; }
.animate-pulse-slow { animation: pulse-slow 8s ease-in-out infinite; }

/* Glassmorphism */
.glass {
    background: rgba(22, 22, 24, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.glass-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: all 0.3s ease;
}

.glass-card:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(124, 58, 237, 0.4);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

/* Typography */
.text-gradient {
    background: linear-gradient(135deg, #FFFFFF 0%, #AEAEB2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-neon-purple {
    color: #A78BFA;
    text-shadow: 0 0 10px rgba(167, 139, 250, 0.5);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #0A0A0B;
}
::-webkit-scrollbar-thumb {
    background: #27272A;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #3F3F46;
}

/* Hero Light Effects */
.light-orb {
    position: absolute;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    filter: blur(100px);
    z-index: -1;
    pointer-events: none;
}

.orb-purple { background: rgba(124, 58, 237, 0.15); }
.orb-blue { background: rgba(0, 122, 255, 0.1); }

/* Grid Background */
.bg-grid {
    background-image: radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 40px 40px;
}

/* Responsive shell safeguards */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
}

*, *::before, *::after {
    box-sizing: border-box;
}

img, video, canvas, svg, iframe {
    max-width: 100%;
}

#app, nav, footer {
    min-width: 0;
}

#app .grid > *,
#app .flex > * {
    min-width: 0;
}

#app .overflow-x-auto,
#app .table-responsive,
#app .follow-up-table-scroll {
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
}

#app .overflow-x-auto table,
#app .table-responsive table,
#app .follow-up-table-scroll table {
    min-width: 720px;
}

#app .truncate,
#app .text-xs,
#app .text-sm,
#app .text-base,
#app .text-lg {
    overflow-wrap: anywhere;
}

#app input,
#app select,
#app textarea,
#app button {
    max-width: 100%;
}

.notification-panel {
    max-height: calc(100dvh - 6rem);
}

@media (max-width: 767px) {
    #backToTop {
        right: 1rem;
        bottom: 1rem;
    }

    .glass-card,
    .modal-content {
        border-radius: 1.5rem !important;
    }

    .fixed.inset-0 .glass-card,
    .fixed.inset-0 .modal-content {
        width: calc(100vw - 1rem);
        max-width: calc(100vw - 1rem);
        max-height: calc(100dvh - 1rem);
        overflow-y: auto;
    }

    #app .overflow-x-auto table,
    #app .table-responsive table,
    #app .follow-up-table-scroll table {
        min-width: 640px;
    }

    #mobileMenu a {
        max-width: calc(100vw - 2rem);
        text-align: center;
        word-break: break-word;
    }

    .notification-panel {
        width: calc(100vw - 1rem) !important;
        max-width: calc(100vw - 1rem) !important;
        left: 0.5rem !important;
        right: 0.5rem !important;
    }
}
