/* =============================================== */
/* == تحسينات متقدمة للهوية البصرية == */
/* =============================================== */

/* تأثيرات الإضاءة المتقدمة */
.neon-glow {
    text-shadow: 
        0 0 5px currentColor,
        0 0 10px currentColor,
        0 0 15px currentColor,
        0 0 20px var(--primary-color),
        0 0 35px var(--primary-color),
        0 0 40px var(--primary-color);
    animation: neonFlicker 2s ease-in-out infinite alternate;
}

@keyframes neonFlicker {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.8; }
}

/* تأثيرات الجسيمات */
.particles-bg {
    /* تم تعطيل تأثير الجسيمات */
    display: none !important; /* استخدام !important لضمان الإخفاء الكامل */
}

@keyframes particleFloat {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    33% { transform: translateY(-10px) rotate(120deg); }
    66% { transform: translateY(5px) rotate(240deg); }
}

/* تأثيرات الموجات */
.wave-effect {
    position: relative;
    overflow: hidden;
}

.wave-effect::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 200%;
    height: 20px;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(63, 81, 181, 0.3), 
        transparent, 
        rgba(233, 30, 99, 0.3), 
        transparent);
    animation: waveMove 4s linear infinite;
}

@keyframes waveMove {
    0% { transform: translateX(-50%); }
    100% { transform: translateX(0%); }
}

/* تأثيرات الهولوجرام */
.hologram-effect {
    background: linear-gradient(45deg, 
        transparent 30%, 
        rgba(255, 255, 255, 0.1) 50%, 
        transparent 70%);
    background-size: 20px 20px;
    animation: hologramShine 3s linear infinite;
    position: relative;
}

.hologram-effect::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(255, 255, 255, 0.4), 
        transparent);
    animation: hologramSweep 2s ease-in-out infinite;
}

@keyframes hologramShine {
    0% { background-position: 0 0; }
    100% { background-position: 20px 20px; }
}

@keyframes hologramSweep {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* تأثيرات الكريستال */
.crystal-effect {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.1) 0%,
        rgba(255, 255, 255, 0.05) 50%,
        rgba(255, 255, 255, 0.1) 100%);
    backdrop-filter: blur(10px) saturate(180%);
    -webkit-backdrop-filter: blur(10px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* تأثيرات الانعكاس */
.reflection-effect {
    position: relative;
}

.reflection-effect::after {
    content: '';
    position: absolute;
    bottom: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    background: inherit;
    transform: scaleY(-1);
    opacity: 0.3;
    mask: linear-gradient(to bottom, transparent 0%, black 100%);
    -webkit-mask: linear-gradient(to bottom, transparent 0%, black 100%);
    pointer-events: none;
}

/* تأثيرات الطيف */
.spectrum-effect {
    background: linear-gradient(45deg, 
        #ff0000, #ff8000, #ffff00, #80ff00, 
        #00ff00, #00ff80, #00ffff, #0080ff, 
        #0000ff, #8000ff, #ff00ff, #ff0080);
    background-size: 400% 400%;
    animation: spectrumShift 5s ease-in-out infinite;
}

@keyframes spectrumShift {
    0%, 100% { background-position: 0% 50%; }
    25% { background-position: 100% 50%; }
    50% { background-position: 100% 100%; }
    75% { background-position: 0% 100%; }
}

/* تأثيرات الذهب */
.gold-effect {
    background: linear-gradient(135deg, 
        #ffd700 0%, #ffed4e 25%, #fff200 50%, 
        #ffed4e 75%, #ffd700 100%);
    background-size: 200% 200%;
    animation: goldShimmer 3s ease-in-out infinite;
    color: #8b4513;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

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

/* تأثيرات الفضة */
.silver-effect {
    background: linear-gradient(135deg, 
        #c0c0c0 0%, #e8e8e8 25%, #ffffff 50%, 
        #e8e8e8 75%, #c0c0c0 100%);
    background-size: 200% 200%;
    animation: silverShimmer 2.5s ease-in-out infinite;
    color: #4a4a4a;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

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

/* تأثيرات الماس */
.diamond-effect {
    background: 
        radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.8) 0%, transparent 50%),
        radial-gradient(circle at 70% 70%, rgba(200, 200, 255, 0.6) 0%, transparent 50%),
        linear-gradient(135deg, #f0f0f0 0%, #ffffff 50%, #f0f0f0 100%);
    animation: diamondSparkle 4s ease-in-out infinite;
    box-shadow: 
        0 0 20px rgba(255, 255, 255, 0.5),
        inset 0 0 20px rgba(255, 255, 255, 0.2);
}

@keyframes diamondSparkle {
    0%, 100% { filter: brightness(1) contrast(1); }
    50% { filter: brightness(1.2) contrast(1.1); }
}

/* تأثيرات الطاقة */
.energy-effect {
    position: relative;
    overflow: hidden;
}

.energy-effect::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: 
        radial-gradient(circle, rgba(63, 81, 181, 0.1) 0%, transparent 70%),
        radial-gradient(circle, rgba(233, 30, 99, 0.1) 0%, transparent 70%);
    animation: energyPulse 3s ease-in-out infinite;
    pointer-events: none;
}

@keyframes energyPulse {
    0%, 100% { 
        transform: scale(0.8) rotate(0deg);
        opacity: 0.5;
    }
    50% { 
        transform: scale(1.2) rotate(180deg);
        opacity: 0.8;
    }
}

/* تأثيرات الكهرباء */
.electric-effect {
    position: relative;
    color: #00ffff;
    text-shadow: 
        0 0 5px #00ffff,
        0 0 10px #00ffff,
        0 0 15px #00ffff,
        0 0 20px #0080ff,
        0 0 35px #0080ff;
    animation: electricFlicker 0.1s linear infinite;
}

@keyframes electricFlicker {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.95; }
}

/* تأثيرات النار */
.fire-effect {
    background: linear-gradient(0deg, 
        #ff4500 0%, #ff6500 25%, #ff8500 50%, 
        #ffa500 75%, #ffff00 100%);
    background-size: 100% 200%;
    animation: fireFlicker 1.5s ease-in-out infinite alternate;
    color: #8b0000;
    text-shadow: 0 0 10px #ff4500;
}

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

/* تأثيرات الماء */
.water-effect {
    background: linear-gradient(45deg, 
        rgba(0, 150, 255, 0.1) 0%,
        rgba(0, 200, 255, 0.2) 50%,
        rgba(0, 150, 255, 0.1) 100%);
    background-size: 20px 20px;
    animation: waterFlow 4s linear infinite;
    position: relative;
}

.water-effect::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.2) 0%, transparent 50%);
    animation: waterBubbles 6s ease-in-out infinite;
    pointer-events: none;
}

@keyframes waterFlow {
    0% { background-position: 0 0; }
    100% { background-position: 20px 20px; }
}

@keyframes waterBubbles {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.1); }
}