/* همه سلکتورها با #audio-solar شروع می‌شوند تا CSS تیلویند و .sw-scope رویشان اثر نگذارد */
#audio-solar{
  --t:#00C6A9; --t2:#00a68e; --y:#F9E65C; --n1:#061a33; --n2:#0a2647; --n3:#12345f;
  position:relative; overflow:hidden; isolation:isolate;
  max-width:920px; margin:28px auto; padding:30px 32px 22px;
  border-radius:26px; color:#fff; direction:rtl; text-align:right;
  font-family:'Vazirmatn',system-ui,Tahoma,sans-serif;
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(0,198,169,.28) 0%, transparent 55%),
    linear-gradient(145deg, var(--n2) 0%, var(--n1) 70%);
  border:1px solid rgba(0,198,169,.28);
  box-shadow:0 24px 60px rgba(6,26,51,.35), inset 0 1px 0 rgba(255,255,255,.08);
}
#audio-solar *{box-sizing:border-box}

/* خورشید درخشان گوشه بالا + پرتوها */
#audio-solar .swp-sun{
  position:absolute; z-index:-1; top:-130px; left:-110px; width:360px; height:360px; border-radius:50%;
  background:
    radial-gradient(circle, rgba(249,230,92,.95) 0 14%, rgba(249,230,92,.35) 15% 32%, transparent 62%);
  filter:blur(6px); opacity:.55;
}
#audio-solar .swp-sun::after{
  content:""; position:absolute; inset:-40%; border-radius:50%;
  background:repeating-conic-gradient(from 0deg, rgba(249,230,92,.16) 0 4deg, transparent 4deg 18deg);
  -webkit-mask:radial-gradient(circle, #000 18%, transparent 62%);
          mask:radial-gradient(circle, #000 18%, transparent 62%);
  animation:swpRays 90s linear infinite;
}
@keyframes swpRays{to{transform:rotate(360deg)}}

/* شبکه ظریف شبیه پنل خورشیدی */
#audio-solar .swp-grid{
  position:absolute; z-index:-1; inset:0; opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:34px 34px;
  -webkit-mask:linear-gradient(to top, #000 0%, transparent 75%);
          mask:linear-gradient(to top, #000 0%, transparent 75%);
}

/* بالا: کاور + عنوان */
#audio-solar .swp-top{display:flex; align-items:center; gap:22px; margin-bottom:26px}
#audio-solar .swp-cover{
  position:relative; flex:0 0 132px; width:132px; height:132px; border-radius:22px;
  background:linear-gradient(135deg,var(--t),var(--n3)) center/cover no-repeat;
  box-shadow:0 14px 34px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.14);
}
#audio-solar .swp-ring{
  position:absolute; inset:-8px; border-radius:28px; border:2px solid var(--y); opacity:0; pointer-events:none;
}
#audio-solar.is-playing .swp-ring{animation:swpPulse 2.2s ease-out infinite}
@keyframes swpPulse{0%{opacity:.7;transform:scale(.96)}100%{opacity:0;transform:scale(1.1)}}

#audio-solar .swp-info{min-width:0; flex:1}
#audio-solar .swp-badge{
  display:inline-flex; align-items:center; gap:8px; padding:5px 13px; margin-bottom:12px;
  font-size:12.5px; font-weight:700; color:var(--y);
  background:rgba(249,230,92,.1); border:1px solid rgba(249,230,92,.3); border-radius:30px;
}
#audio-solar .swp-dot{width:7px; height:7px; border-radius:50%; background:#2ee6c5; box-shadow:0 0 10px #2ee6c5; display:inline-block}
#audio-solar .swp-title{margin:0 0 8px; padding:0; font-size:clamp(20px,3.4vw,27px); font-weight:900; line-height:1.55; color:#fff; border:0}
#audio-solar .swp-sub{font-size:14.5px; line-height:1.9; color:#bcd0e0; margin:0}

/* موج صوتی */
#audio-solar .swp-wave{
  display:flex; align-items:center; justify-content:space-between; gap:3px;
  height:72px; cursor:pointer; touch-action:none; user-select:none; -webkit-user-select:none;
  border-radius:12px; outline:none;
}
#audio-solar .swp-wave:focus-visible{box-shadow:0 0 0 3px rgba(249,230,92,.6)}
#audio-solar .swp-bar{
  flex:1; min-width:2px; border-radius:3px; background:rgba(255,255,255,.2);
  transition:background .15s, transform .15s;
}
#audio-solar .swp-bar.on{background:linear-gradient(to top,var(--t),var(--y))}
#audio-solar.is-playing .swp-bar.on:nth-last-of-type(n){}
#audio-solar .swp-bar.now{transform:scaleY(1.12); background:#fff; box-shadow:0 0 12px rgba(249,230,92,.8)}

#audio-solar .swp-times{
  display:flex; justify-content:space-between; margin:8px 2px 16px;
  font-size:13px; font-weight:700; color:#9fb6c9; font-variant-numeric:tabular-nums;
}

/* دکمه‌ها */
#audio-solar .swp-controls{display:flex; align-items:center; justify-content:center; gap:16px}
#audio-solar .swp-btn{
  appearance:none; -webkit-appearance:none; border:0; margin:0; padding:0; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; font-family:inherit;
  color:#fff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  text-decoration:none; transition:transform .2s, background .2s, border-color .2s;
}
#audio-solar .swp-btn:hover{background:rgba(255,255,255,.16); border-color:rgba(0,198,169,.6)}
#audio-solar .swp-btn:focus-visible{outline:3px solid rgba(249,230,92,.7); outline-offset:3px}
#audio-solar .swp-btn:active{transform:scale(.94)}

#audio-solar .swp-skip{position:relative; width:50px; height:50px; border-radius:50%}
#audio-solar .swp-skip span{position:absolute; font-size:10px; font-weight:900; margin-top:1px}
#audio-solar .swp-skip svg{opacity:.95}
#audio-solar .swp-speed{min-width:52px; height:36px; padding:0 10px; border-radius:20px; font-size:13px; font-weight:800; color:var(--y)}
#audio-solar .swp-dl{width:44px; height:44px; border-radius:50%}

#audio-solar .swp-play{
  position:relative; width:74px; height:74px; border-radius:50%; color:var(--n1);
  background:linear-gradient(135deg,var(--y) 0%,#ffd84a 100%); border:0;
  box-shadow:0 12px 30px rgba(249,230,92,.35), 0 0 0 7px rgba(249,230,92,.12);
}
#audio-solar .swp-play:hover{background:linear-gradient(135deg,#fff08a,#ffd84a); transform:translateY(-2px)}
#audio-solar .swp-play .i-pause,#audio-solar .swp-play .swp-spin{display:none}
#audio-solar.is-playing .swp-play .i-play{display:none}
#audio-solar.is-playing .swp-play .i-pause{display:block}
#audio-solar .swp-play .i-play{margin-right:-3px} /* بالانس نوری مثلث */
#audio-solar.is-loading .swp-play svg{display:none !important}
#audio-solar.is-loading .swp-play .swp-spin{
  display:block; width:28px; height:28px; border-radius:50%;
  border:3px solid rgba(6,26,51,.25); border-top-color:var(--n1); animation:swpSpin .8s linear infinite;
}
@keyframes swpSpin{to{transform:rotate(360deg)}}

/* پیام خطا */
#audio-solar .swp-msg{
  margin:16px auto 0; max-width:560px; padding:10px 16px; border-radius:12px; text-align:center;
  font-size:13.5px; line-height:1.9; color:#ffe9a8; background:rgba(249,230,92,.1); border:1px solid rgba(249,230,92,.3);
}
#audio-solar .swp-msg[hidden]{display:none}

/* متن گفتار */
#audio-solar .swp-trans-btn{
  appearance:none; -webkit-appearance:none; cursor:pointer; font-family:inherit; margin:22px 0 0; padding:11px 18px;
  display:flex; align-items:center; justify-content:space-between; width:100%;
  font-size:14.5px; font-weight:800; color:#fff; background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14); border-radius:14px; transition:background .2s,border-color .2s;
}
#audio-solar .swp-trans-btn:hover{background:rgba(255,255,255,.12); border-color:rgba(0,198,169,.55)}
#audio-solar .swp-trans-btn:focus-visible{outline:3px solid rgba(249,230,92,.7); outline-offset:2px}
#audio-solar .swp-trans-btn svg{transition:transform .3s}
#audio-solar .swp-trans-btn[aria-expanded="true"] svg{transform:rotate(180deg)}

#audio-solar .swp-trans{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease}
#audio-solar .swp-trans.open{grid-template-rows:1fr}
#audio-solar .swp-trans-in{overflow:hidden; min-height:0}
#audio-solar .swp-t-head{margin-top:16px; padding-right:12px; border-right:4px solid var(--t); font-size:15.5px; font-weight:900; color:#fff}
#audio-solar .swp-t-item{margin-top:14px; font-size:14.5px; line-height:2.05; color:#d3e0eb}
#audio-solar .swp-t-item b{color:var(--y); font-weight:800}
#audio-solar .swp-t-item ul{list-style:none; margin:6px 0 0; padding:0}
#audio-solar .swp-t-item li{position:relative; padding:2px 22px 2px 0; color:#d3e0eb}
#audio-solar .swp-t-item li::before{content:""; position:absolute; right:2px; top:14px; width:8px; height:8px; border-radius:2px; background:var(--t); transform:rotate(45deg)}

/* موبایل */
@media (max-width:640px){
  #audio-solar{padding:22px 16px 18px; border-radius:20px; margin:20px 0}
  #audio-solar .swp-top{gap:14px; margin-bottom:20px}
  #audio-solar .swp-cover{flex-basis:84px; width:84px; height:84px; border-radius:16px}
  #audio-solar .swp-ring{border-radius:22px}
  #audio-solar .swp-sub{font-size:13px; line-height:1.8}
  #audio-solar .swp-badge{font-size:11.5px; padding:4px 10px; margin-bottom:8px}
  #audio-solar .swp-wave{height:56px; gap:2px}
  #audio-solar .swp-controls{gap:10px}
  #audio-solar .swp-skip{width:44px; height:44px}
  #audio-solar .swp-play{width:66px; height:66px}
  #audio-solar .swp-dl{width:40px; height:40px}
  #audio-solar .swp-speed{min-width:46px; padding:0 8px}
}
@media (prefers-reduced-motion:reduce){
  #audio-solar .swp-sun::after,#audio-solar.is-playing .swp-ring{animation:none}
  #audio-solar .swp-trans{transition:none}
}