/* Custom Scrollbar for secondary menu */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Three.js Container */
#three-canvas-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    /* Let clicks pass through to slider elements */
    z-index: 10;
}

/* Neon Pulse Animation for Text */
@keyframes neon-pulse {
    0% {
        text-shadow: 0 0 10px rgba(255, 0, 0, 0.2), 0 0 20px rgba(255, 0, 0, 0.1);
        stroke: rgba(255, 0, 0, 0.3);
        color: rgba(255, 0, 0, 0.05);
        -webkit-text-stroke: 2px rgba(255, 0, 0, 0.3);
    }

    20% {
        text-shadow: 0 0 20px rgba(255, 165, 0, 0.6), 0 0 40px rgba(255, 165, 0, 0.4);
        stroke: rgba(255, 165, 0, 0.8);
        color: rgba(255, 165, 0, 0.1);
        -webkit-text-stroke: 2px rgba(255, 165, 0, 0.8);
    }

    40% {
        text-shadow: 0 0 20px rgba(255, 255, 0, 0.6), 0 0 40px rgba(255, 255, 0, 0.4);
        stroke: rgba(255, 255, 0, 0.8);
        color: rgba(255, 255, 0, 0.1);
        -webkit-text-stroke: 2px rgba(255, 255, 0, 0.8);
    }

    60% {
        text-shadow: 0 0 20px rgba(0, 128, 0, 0.6), 0 0 40px rgba(0, 128, 0, 0.4);
        stroke: rgba(0, 128, 0, 0.8);
        color: rgba(0, 128, 0, 0.1);
        -webkit-text-stroke: 2px rgba(0, 128, 0, 0.8);
    }

    80% {
        text-shadow: 0 0 20px rgba(0, 0, 255, 0.6), 0 0 40px rgba(0, 0, 255, 0.4);
        stroke: rgba(0, 0, 255, 0.8);
        color: rgba(0, 0, 255, 0.1);
        -webkit-text-stroke: 2px rgba(0, 0, 255, 0.8);
    }

    100% {
        text-shadow: 0 0 10px rgba(238, 130, 238, 0.2), 0 0 20px rgba(238, 130, 238, 0.1);
        stroke: rgba(238, 130, 238, 0.3);
        color: rgba(238, 130, 238, 0.05);
        -webkit-text-stroke: 2px rgba(238, 130, 238, 0.3);
    }
}

@keyframes rainbow-border {
    0% {
        border-color: #ef4444;
    }

    14% {
        border-color: #f97316;
    }

    28% {
        border-color: #eab308;
    }

    42% {
        border-color: #22c55e;
    }

    57% {
        border-color: #06b6d4;
    }

    71% {
        border-color: #3b82f6;
    }

    85% {
        border-color: #a855f7;
    }

    100% {
        border-color: #ef4444;
    }
}

.animate-rainbow-border {
    border-width: 4px;
    border-style: solid;
    animation: rainbow-border 4s linear infinite;
}

.animate-pulse-color {
    animation: neon-pulse 3s infinite ease-in-out;
    -webkit-text-stroke: 2px rgba(16, 185, 129, 0.3);
    /* Emerald stroke */
}

.stroke-text {
    -webkit-text-stroke: 1px currentColor;
    color: transparent;
}

/* Crystal Glass Shine Effect */
@keyframes crystal-shine {
    0% {
        left: -100%;
    }

    20% {
        left: 100%;
    }

    100% {
        left: 100%;
    }
}

.animate-crystal-shine {
    position: relative;
    overflow: hidden;
}

.animate-crystal-shine::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right,
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 0.4) 50%,
            rgba(255, 255, 255, 0) 100%);
    transform: skewX(-25deg);
    animation: crystal-shine 4s cubic-bezier(0.19, 1, 0.22, 1) infinite;
    pointer-events: none;
    z-index: 10;
}