/* FarsKids animated action icons. Loaded last; !important is needed to beat older icon rules in style.css. */
html body .fk-song-action-btn{--fk-ai-c:#c084fc;--fk-ai-glow:rgba(192,132,252,.38);transition:transform .25s cubic-bezier(.22,1.3,.36,1),color .2s ease!important;-webkit-tap-highlight-color:transparent}
html body .fk-song-action-btn:has(.fk-ai-comment){--fk-ai-c:#60a5fa;--fk-ai-glow:rgba(96,165,250,.38)}
html body .fk-song-action-btn:has(.fk-ai-share){--fk-ai-c:#34d399;--fk-ai-glow:rgba(52,211,153,.38)}
html body .fk-song-action-btn:has(.fk-ai-download){--fk-ai-c:#fbbf24;--fk-ai-glow:rgba(251,191,36,.38)}
html body .fk-song-action-btn:has(.fk-ai-save){--fk-ai-c:#c084fc;--fk-ai-glow:rgba(192,132,252,.42)}

/* soft glow disc behind every action button */
html body .fk-song-action-btn::before{content:"";position:absolute;inset:-3px;border-radius:50%;background:radial-gradient(circle,var(--fk-ai-glow),transparent 68%);opacity:0;transform:scale(.6);transition:opacity .25s ease,transform .3s cubic-bezier(.22,1.3,.36,1);pointer-events:none}
@media(hover:hover){
  html body .fk-song-action-btn:hover{transform:translateY(-2px);color:var(--fk-ai-c)!important}
  html body .fk-song-action-btn:hover::before{opacity:1;transform:scale(1)}
}
html body .fk-song-action-btn:focus-visible{color:var(--fk-ai-c)!important;outline:2px solid var(--fk-ai-c)!important;outline-offset:2px}
html body .fk-song-action-btn:active{transform:scale(.88)!important;transition-duration:.08s}

/* shared svg rules */
html body .fk-song-action-btn .fk-ai{width:23px!important;height:23px!important;display:block;overflow:visible;pointer-events:none;fill:none!important;stroke:currentColor!important;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
html body .fk-song-action-btn .fk-ai *{transform-box:fill-box;transform-origin:center}

/* ---------- SAVE (bookmark) ---------- */
.fk-ai-save .f{fill:var(--fk-ai-c)!important;stroke:none!important;transform:scale(1,0);transform-origin:50% 100%;opacity:0}
.fk-ai-save .pl{transition:opacity .2s,transform .3s cubic-bezier(.22,1.3,.36,1);transform-origin:center}
.fk-ai-save .ck{stroke:#1b1030!important;stroke-width:2.1;stroke-dasharray:14;stroke-dashoffset:14;opacity:0}
.fk-ai-save .d{fill:var(--fk-ai-c)!important;stroke:none!important;opacity:0}
@media(hover:hover){.fk-song-action-btn:hover .fk-ai-save .pl{transform:rotate(90deg) scale(1.15)}.fk-song-action-btn:hover .fk-ai-save{animation:fkAiBob .6s ease}}
.fk-song-action-btn.is-saved{color:var(--fk-ai-c)!important}
.fk-song-action-btn.is-saved .fk-ai-save .f{opacity:1;transform:scale(1,1);animation:fkAiFill .5s cubic-bezier(.22,1.2,.36,1) both}
.fk-song-action-btn.is-saved .fk-ai-save .pl{opacity:0;transform:rotate(180deg) scale(.2)}
.fk-song-action-btn.is-saved .fk-ai-save .ck{opacity:1;stroke-dashoffset:0;transition:stroke-dashoffset .35s .18s ease}
.fk-song-action-btn.is-saved .fk-ai-save{filter:drop-shadow(0 0 5px var(--fk-ai-glow));animation:fkAiPop .5s cubic-bezier(.22,1.4,.36,1)}
.fk-song-action-btn.is-saved .fk-ai-save .d{animation:fkAiSpark .65s ease-out both}
.fk-ai-save .d2{animation-delay:.04s!important}.fk-ai-save .d3{animation-delay:.08s!important}.fk-ai-save .d4{animation-delay:.12s!important}
@keyframes fkAiFill{0%{transform:scale(1,0)}100%{transform:scale(1,1)}}
@keyframes fkAiPop{0%{transform:scale(.7)}55%{transform:scale(1.25) rotate(-6deg)}100%{transform:scale(1)}}
@keyframes fkAiSpark{0%{opacity:1;transform:scale(.4)}100%{opacity:0;transform:scale(2.2)}}
@keyframes fkAiBob{0%,100%{transform:translateY(0)}40%{transform:translateY(-3px)}}

/* ---------- COMMENTS (typing bubble) ---------- */
.fk-ai-comment .f{fill:var(--fk-ai-c)!important;stroke:none!important;opacity:0;transition:opacity .25s}
.fk-ai-comment .dot{fill:currentColor!important;stroke:none!important;opacity:.85}
.fk-ai-comment{transform-origin:50% 80%}
@media(hover:hover){
  .fk-song-action-btn:hover .fk-ai-comment{animation:fkAiWobble .7s ease both}
  .fk-song-action-btn:hover .fk-ai-comment .f{opacity:.18}
  .fk-song-action-btn:hover .fk-ai-comment .dot{animation:fkAiDot .9s ease-in-out infinite}
  .fk-song-action-btn:hover .fk-ai-comment .d2{animation-delay:.15s}
  .fk-song-action-btn:hover .fk-ai-comment .d3{animation-delay:.3s}
}
.fk-song-action-btn:active .fk-ai-comment .dot{animation:fkAiDot .4s ease-in-out}
@keyframes fkAiWobble{0%{transform:rotate(0)}25%{transform:rotate(-9deg) scale(1.08)}55%{transform:rotate(7deg) scale(1.08)}100%{transform:rotate(0) scale(1)}}
@keyframes fkAiDot{0%,100%{transform:translateY(0)}40%{transform:translateY(-3px)}}

/* ---------- SHARE (connected nodes) ---------- */
.fk-ai-share .n{fill:transparent;transition:fill .25s}
.fk-ai-share .ln{stroke-dasharray:12;stroke-dashoffset:0}
.fk-ai-share .rg{stroke:var(--fk-ai-c)!important;stroke-width:1.2;opacity:0}
@media(hover:hover){
  .fk-song-action-btn:hover .fk-ai-share .n{fill:var(--fk-ai-c);animation:fkAiNode .7s ease both}
  .fk-song-action-btn:hover .fk-ai-share .n2{animation-delay:.08s}.fk-song-action-btn:hover .fk-ai-share .n3{animation-delay:.16s}
  .fk-song-action-btn:hover .fk-ai-share .ln{animation:fkAiLine .6s ease both}
}
.fk-song-action-btn.fk-copy-done{color:var(--fk-ai-c)!important}
.fk-song-action-btn.fk-copy-done .fk-ai-share .n{fill:var(--fk-ai-c);animation:fkAiNode .6s ease both}
.fk-song-action-btn.fk-copy-done .fk-ai-share .rg{animation:fkAiRing .8s ease-out both}
@keyframes fkAiNode{0%{transform:scale(1)}45%{transform:scale(1.45)}100%{transform:scale(1)}}
@keyframes fkAiLine{0%{stroke-dashoffset:12}100%{stroke-dashoffset:0}}
@keyframes fkAiRing{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(1.5)}}

/* ---------- DOWNLOAD ---------- */
.fk-ai-download .tray{transition:stroke .2s}
@media(hover:hover){
  .fk-song-action-btn:hover .fk-ai-download .ar{animation:fkAiArrow .9s ease-in-out infinite}
}
.fk-song-action-btn:active .fk-ai-download .ar{animation:fkAiArrowDrop .35s ease both}
@keyframes fkAiArrow{0%,100%{transform:translateY(-1px)}50%{transform:translateY(3px)}}
@keyframes fkAiArrowDrop{0%{transform:translateY(-3px)}60%{transform:translateY(4px)}100%{transform:translateY(0)}}

@media(prefers-reduced-motion:reduce){
  html body .fk-song-action-btn,html body .fk-song-action-btn *{animation:none!important;transition:none!important}
}
