/* ============================================================
   SZD MEGAMENU — gouache icons + REAL 2-frame hover actions (دور ۹۳)
   Desktop only (≥992px). JS injects per item: frame A (.szd-mi__obj)
   + frame B (.szd-mi__obj2) + fx. Rest = static frame A.
   Hover = the icon performs its real action by swapping A↔B
   (teddy raises arm, scissors open, book opens, dice rolls, wand
   glows…). Car is special (drive + spinning wheels + smoke).
   No box/card. Fluid size.
   ============================================================ */
@media (min-width: 992px) {

  #st_mega_menu_wrap a.ma_level_0::before { display: none !important; content: none !important; }

  #st_mega_menu_wrap .szd-mi {
    position: relative; display: block;
    width: clamp(58px, 5.2vw, 96px); height: clamp(58px, 5.2vw, 96px);
    margin: 0 auto; pointer-events: none;
  }
  #st_mega_menu_wrap .szd-mi__obj,
  #st_mega_menu_wrap .szd-mi__obj2 { position: absolute; inset: 0; transform-origin: 50% 72%; }
  #st_mega_menu_wrap .szd-mi__obj2 { opacity: 0; }
  #st_mega_menu_wrap .szd-mi__img { width: 100%; height: 100%; object-fit: contain; display: block;
    filter: drop-shadow(0 5px 5px rgba(150, 90, 110, .14)); }

  /* car wheels */
  #st_mega_menu_wrap .szd-mi__wheel { position: absolute; width: 14.2%; aspect-ratio: 1; transform: translate(-50%, -50%); }
  #st_mega_menu_wrap .szd-mi__wheel img { width: 100%; display: block; }
  #st_mega_menu_wrap .szd-mi--car .szd-mi__wheel--1 { left: 15.8%; top: 74.2%; }
  #st_mega_menu_wrap .szd-mi--car .szd-mi__wheel--2 { left: 50.8%; top: 77.9%; }

  /* fx layer */
  #st_mega_menu_wrap .szd-mi__fx { position: absolute; inset: 0; pointer-events: none; }
  #st_mega_menu_wrap .szd-mi__fx i { position: absolute; opacity: 0; }
  #st_mega_menu_wrap .szd-mi:not(.szd-mi--car) .szd-mi__fx i {
    width: 10%; height: 10%; border-radius: 50%;
    background: radial-gradient(circle, #fff 0 26%, rgba(255,205,100,.95) 30% 52%, rgba(255,205,100,0) 70%);
    transform: scale(.3);
  }
  #st_mega_menu_wrap .szd-mi__fx i:nth-child(1) { left: 6%;  top: 10%; }
  #st_mega_menu_wrap .szd-mi__fx i:nth-child(2) { left: 84%; top: 20%; width: 8%; height: 8%; }
  #st_mega_menu_wrap .szd-mi__fx i:nth-child(3) { left: 70%; top: 4%;  width: 8%; height: 8%; }
  #st_mega_menu_wrap .szd-mi--car .szd-mi__fx i {
    width: 13%; height: 13%; left: 8%; top: 64%; border-radius: 50%;
    background: radial-gradient(circle, #fff 0 30%, rgba(208,198,203,.6) 55%, rgba(208,198,203,0) 72%);
    transform: translate(-50%, -50%) scale(.2);
  }

  /* ===== keyframes ===== */
  @keyframes szdSpin  { to { transform: rotate(-360deg); } }
  @keyframes szdDrive { 0%{transform:translateX(0) rotate(0)} 12%{transform:translateX(-4%) rotate(-2deg)} 48%{transform:translateX(13%) rotate(2deg)} 80%{transform:translateX(4%) rotate(.5deg)} 100%{transform:translateX(0) rotate(0)} }
  @keyframes szdPuff  { 0%{opacity:0;transform:translate(-50%,-50%) scale(.2)} 20%{opacity:.85} 100%{opacity:0;transform:translate(-210%,-190%) scale(1.5)} }
  @keyframes szdTw    { 0%,100%{opacity:0;transform:scale(.3)} 45%{opacity:1;transform:scale(1.1)} }
  @keyframes szdSwapHard { 0%,49%{opacity:0} 50%,100%{opacity:1} }   /* hard A/B alternation */
  @keyframes szdSwapFade { 0%,100%{opacity:0} 50%{opacity:1} }       /* smooth A↔B crossfade */

  /* ===== hover triggers ===== */
  /* sparkles for all non-car icons */
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi:not(.szd-mi--car) .szd-mi__fx i { animation: szdTw 1.1s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi__fx i:nth-child(2) { animation-delay: .25s; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi__fx i:nth-child(3) { animation-delay: .5s; }

  /* CAR — drive + wheels spin + smoke */
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--car .szd-mi__obj { animation: szdDrive 1.05s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--car .szd-mi__wheel img { animation: szdSpin .5s linear infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--car .szd-mi__fx i { animation: szdPuff 1.05s ease-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--car .szd-mi__fx i:nth-child(2) { animation-delay: .35s; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--car .szd-mi__fx i:nth-child(3) { animation-delay: .7s; }

  /* 2-frame real actions — fast hard alternation (repetitive motions) */
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--doll  .szd-mi__obj2 { animation: szdSwapHard .52s steps(1) infinite; }  /* wave */
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--craft .szd-mi__obj2 { animation: szdSwapHard .42s steps(1) infinite; }  /* snip */
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--board .szd-mi__obj2 { animation: szdSwapHard .60s steps(1) infinite; }  /* dice roll */
  /* 2-frame real actions — smooth crossfade (open/glow/appear) */
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--books      .szd-mi__obj2 { animation: szdSwapFade 1.1s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--babybook   .szd-mi__obj2 { animation: szdSwapFade 1.1s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--brain      .szd-mi__obj2 { animation: szdSwapFade .75s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--lego       .szd-mi__obj2 { animation: szdSwapFade .9s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--science    .szd-mi__obj2 { animation: szdSwapFade 1.0s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--roleplay   .szd-mi__obj2 { animation: szdSwapFade 1.0s ease-in-out infinite; }
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi--stationery .szd-mi__obj2 { animation: szdSwapFade .9s ease-in-out infinite; }

  /* gentle lift + pink label on hover (no box) */
  #st_mega_menu_wrap li.ml_level_0:hover .szd-mi { filter: drop-shadow(0 8px 10px rgba(224,86,139,.18)); }
  #st_mega_menu_wrap li.ml_level_0:hover > .ma_level_0 { color: #E0568B !important; }
}
