/* ══════════════════════════════════════════════════
   تأثيرات زخرفة الاسم المتحركة — Name Decoration Effects
   ══════════════════════════════════════════════════ */

/* --- أساسي: التأثير اللوني --- */
[data-name-effect] {
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  color: transparent !important;
  background-size: 200% 200%;
  animation: nameEffectShift 3s ease infinite;
}

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

/* 🔥 نار */
[data-name-effect="hellfire"] {
  background-image: linear-gradient(90deg, #ff4500, #ff8c00, #ffd700, #ff4500);
}
[data-name-effect="blood_ruby"] {
  background-image: linear-gradient(90deg, #8b0000, #dc143c, #ff6347, #8b0000);
}
[data-name-effect="burning_sun"] {
  background-image: linear-gradient(90deg, #ff6b35, #ffa500, #ffd700, #ff6b35);
}
[data-name-effect="glowing_ember"] {
  background-image: linear-gradient(90deg, #b22222, #ff4500, #ff8c00, #b22222);
}

/* 🌊 ماء */
[data-name-effect="deep_ocean"] {
  background-image: linear-gradient(90deg, #000080, #0066cc, #00bfff, #000080);
}
[data-name-effect="blue_sapphire"] {
  background-image: linear-gradient(90deg, #082567, #1e90ff, #87ceeb, #082567);
}

/* 🌿 طبيعة */
[data-name-effect="nature_green"] {
  background-image: linear-gradient(90deg, #006400, #32cd32, #98fb98, #006400);
}

/* 🌌 كون */
[data-name-effect="cosmic"] {
  background-image: linear-gradient(90deg, #4b0082, #8a2be2, #da70d6, #ff69b4, #4b0082);
}

/* ⚙️ معادن */
[data-name-effect="gold_metal"] {
  background-image: linear-gradient(90deg, #b8860b, #ffd700, #f0e68c, #b8860b);
}
[data-name-effect="silver_metal"] {
  background-image: linear-gradient(90deg, #696969, #c0c0c0, #f5f5f5, #696969);
}

/* ⚡ كهرباء */
[data-name-effect="electric"] {
  background-image: linear-gradient(90deg, #00ffff, #7b68ee, #ff00ff, #00ffff);
  animation-duration: 1.5s;
}

/* --- حركات الاسم --- */
[data-name-anim="entrance"] {
  animation: nameEntrance 1s ease forwards;
}
@keyframes nameEntrance {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}

[data-name-anim="exit"] {
  animation: nameExit 1s ease forwards;
}
@keyframes nameExit {
  from { opacity: 1; transform: translateX(0); }
  to { opacity: 0; transform: translateX(-20px); }
}

[data-name-anim="explode"] {
  animation: nameExplode 0.8s ease infinite;
}
@keyframes nameExplode {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}

[data-name-anim="crawl"] {
  animation: nameCrawl 3s linear infinite;
}
@keyframes nameCrawl {
  0% { transform: translateX(0); }
  50% { transform: translateX(-5px); }
  100% { transform: translateX(0); }
}

[data-name-anim="shake"] {
  animation: nameShake 0.5s ease infinite;
}
@keyframes nameShake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-3px); }
  75% { transform: translateX(3px); }
}

[data-name-anim="bounce"] {
  animation: nameBounce 1s ease infinite;
}
@keyframes nameBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

[data-name-anim="fly"] {
  animation: nameFly 2s ease infinite;
}
@keyframes nameFly {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  25% { transform: translateY(-4px) rotate(-2deg); }
  75% { transform: translateY(2px) rotate(2deg); }
}

/* تأثير + حركة معاً: من لديه الاثنان */
[data-name-effect][data-name-anim] {
  display: inline-block;
}
