/* 简化的霓虹效果 - 草绿色和红色配色 */

/* 基础霓虹文字效果 */
.neon-text {
    color: var(--primary-green);
}

.neon-text.gold,
.neon-text.green {
    color: var(--primary-green);
}

.neon-text.red {
    color: var(--primary-red);
}

.neon-pink {
    color: var(--primary-red-light);
}

.neon-blue {
    color: var(--primary-green-light);
}

.neon-purple {
    color: var(--primary-green);
}

/* 霓虹按钮效果 - 简化版 */
.neon-btn {
    background: var(--primary-green);
    border: none;
    color: #000;
    position: relative;
    overflow: hidden;
    box-shadow: var(--shadow-green);
    transition: all 0.2s ease;
    font-weight: 600;
}

.neon-btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-green-hover);
    background: var(--primary-green-light);
}

.neon-btn:active {
    transform: translateY(0);
}

.neon-btn span {
    position: relative;
    z-index: 2;
}

/* 不同颜色的霓虹按钮 */
.neon-btn.red {
    background: var(--primary-red);
    color: #fff;
    box-shadow: var(--shadow-red);
}

.neon-btn.red:hover {
    background: var(--primary-red-light);
    box-shadow: var(--shadow-red-hover);
}

.neon-btn.blue,
.neon-btn.purple,
.neon-btn.pink {
    background: var(--primary-green);
    color: #000;
    box-shadow: var(--shadow-green);
}

.neon-btn.blue:hover,
.neon-btn.purple:hover,
.neon-btn.pink:hover {
    background: var(--primary-green-light);
    box-shadow: var(--shadow-green-hover);
}

/* 简化的边框效果 */
.neon-border-box {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border-green);
}

/* 涟漪效果 - 保留但简化 */
.ripple-effect {
    position: relative;
    overflow: hidden;
}

.ripple-effect::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: radial-gradient(circle, var(--primary-green-glow) 0%, transparent 70%);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.5s ease;
}

.ripple-effect:hover::after {
    width: 200px;
    height: 200px;
}
