/* 用户等级颜色样式 */

/* 基础样式 */
.user-name {
    transition: all 0.3s ease;
}

/* 用户姓名元素的基础样式 */
.user-details h2,
#user-name,
.user-name {
    transition: all 0.3s ease;
}

/* VIP会员 - 绿色系 */
.user-name.vip {
    background: linear-gradient(135deg, #57b401 0%, #4a9c01 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

/* SVIP会员 - 红色系 */
.user-name.svip {
    background: linear-gradient(135deg, #f56c6c 0%, #e74c3c 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

/* 大会员 - 橙色系 */
.user-name.annual {
    background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

/* 企业会员 - 咖啡色+金色渐变 */
.user-name.enterprise {
    background: linear-gradient(135deg, #5f3c30 0%, #8b4513 50%, #d4af37 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.3);
}

/* 管理员 - 高端紫色渐变 */
.user-name.admin {
    background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
    text-shadow: 0 0 15px rgba(106, 17, 203, 0.4);
}

/* 超级管理员 - 高端金色渐变 */
.user-name.super-admin {
    background: linear-gradient(135deg, #ffd700 0%, #ffed4e 50%, #ff6b35 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
    animation: superAdminGlow 2s ease-in-out infinite alternate;
}

/* 超级管理员发光动画 */
@keyframes superAdminGlow {
    from {
        filter: drop-shadow(0 0 5px rgba(255, 215, 0, 0.3));
    }
    to {
        filter: drop-shadow(0 0 15px rgba(255, 215, 0, 0.6));
    }
}

/* 深色主题适配 */
[data-theme="dark"] .user-name.vip {
    background: linear-gradient(135deg, #4caf50 0%, #388e3c 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] .user-name.svip {
    background: linear-gradient(135deg, #f44336 0%, #d32f2f 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] .user-name.annual {
    background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] .user-name.enterprise {
    background: linear-gradient(135deg, #8d6e63 0%, #a1887f 50%, #ffd54f 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] .user-name.admin {
    background: linear-gradient(135deg, #7b1fa2 0%, #512da8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] .user-name.super-admin {
    background: linear-gradient(135deg, #ffc107 0%, #ffeb3b 50%, #ff5722 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* 兼容性处理 - 对于不支持渐变文本的浏览器 */
@supports not (-webkit-background-clip: text) {
    .user-name.vip {
        color: #57b401;
        font-weight: 600;
    }
    
    .user-name.svip {
        color: #f56c6c;
        font-weight: 600;
    }
    
    .user-name.annual {
        color: #ff9800;
        font-weight: 600;
    }
    
    .user-name.enterprise {
        color: #8b4513;
        font-weight: 700;
    }
    
    .user-name.admin {
        color: #6a11cb;
        font-weight: 700;
    }
    
    .user-name.super-admin {
        color: #ffd700;
        font-weight: 800;
    }
}