/* Aparat Shorts Pro v6.3 */
.asp-root{
  --asp-accent:#ed145b;
  --asp-h:740px;
  --asp-w:360px;
  --asp-cols:3;
  --asp-radius:18px;
  --asp-fit:cover;
  --asp-ratio:9/16;
  --asp-btn-bg:rgba(20,20,24,.55);
  --asp-btn-fg:#fff;
  --asp-icon-size:22px;
  --asp-icon-color:#ffffff;
  --asp-rail-bg:rgba(0,0,0,.35);
  --asp-chrome-bg:linear-gradient(180deg,rgba(0,0,0,.45) 0%,transparent 28%,transparent 55%,rgba(0,0,0,.75) 100%);
  --asp-progress:#ffffff;
  --asp-title:#ffffff;
  --asp-ch:rgba(255,255,255,.88);
  --asp-bg:#05060a;
  --asp-overlay:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.72));
  direction:rtl;
  font-family:Vazirmatn,Tahoma,system-ui,-apple-system,sans-serif;
  color:#fff;
  max-width:100%;
}
.asp-root[data-theme=tiktok]{--asp-accent:#fe2c55;--asp-radius:16px}
.asp-root[data-theme=instagram]{--asp-accent:#ff0069;--asp-radius:24px}
.asp-root[data-theme=youtube]{--asp-accent:#ff0033;--asp-radius:12px}
.asp-root[data-theme=glass]{--asp-accent:#7c5cff;--asp-btn-bg:rgba(255,255,255,.18);--asp-rail-bg:rgba(255,255,255,.15)}
.asp-root[data-theme=neon]{--asp-accent:#00f0ff;--asp-btn-bg:rgba(0,240,255,.22);--asp-rail-bg:rgba(0,240,255,.15)}

.asp-empty{padding:28px 20px;border-radius:16px;background:linear-gradient(135deg,#1a1b26,#2a1734);color:#e5e7eb;text-align:center;font-size:14px;line-height:1.9}
.asp-empty-icon{display:inline-block;font-size:32px;margin-bottom:8px}
.asp-empty-aparat_short,.asp-empty-aparat_video,.asp-empty-aparat{border-right:4px solid #e93a3a}
.asp-empty-instagram{border-right:4px solid #E1306C}
.asp-empty-youtube,.asp-empty-youtube_video{border-right:4px solid #FF0000}
.asp-empty-tiktok{border-right:4px solid #000}
.asp-empty-rubika{border-right:4px solid #e62b77}
.asp-empty-direct{border-right:4px solid #10b981}

.asp-switch{display:flex;gap:8px;margin:0 0 14px;justify-content:var(--asp-align,center)}
.asp-switch button{border:0;border-radius:999px;padding:8px 18px;cursor:pointer;background:#1b2030;color:#d7dce8;font:inherit;transition:.2s;font-weight:600}
.asp-switch button.is-on{background:var(--asp-accent);color:#fff}
.asp-switch button:hover{filter:brightness(1.1)}

/* Platform filter tabs */
.asp-platform-filter{display:flex;gap:6px;margin:0 0 12px;justify-content:center;flex-wrap:wrap}
.asp-platform-filter button{border:0;border-radius:999px;padding:6px 14px;cursor:pointer;background:#151823;color:#b3bccc;font:inherit;transition:.2s;font-size:12px;font-weight:600;position:relative;overflow:hidden}
.asp-platform-filter button.is-on{background:var(--asp-pf-color,var(--asp-accent));color:#fff}
.asp-platform-filter button:hover{filter:brightness(1.15)}

.asp-reels{
  position:relative;
  width:min(100%, var(--asp-w), calc(min(var(--asp-h), 86dvh) * 9 / 16));
  aspect-ratio: 9 / 16;
  height:auto;
  max-height:min(var(--asp-h), 86dvh);
  margin:0 auto;
  border-radius:var(--asp-radius);
  overflow:hidden;
  background:var(--asp-bg);
  box-shadow:0 18px 40px rgba(0,0,0,.35);
  isolation:isolate;
  outline:none;
  transition:width .3s ease, aspect-ratio .3s ease, max-width .3s ease;
}
.asp-root[data-ratio="4/5"] .asp-reels{aspect-ratio:4/5;width:min(100%,var(--asp-w),calc(min(var(--asp-h),86dvh)*4/5))}
.asp-root[data-ratio="1/1"] .asp-reels{aspect-ratio:1/1;width:min(100%,var(--asp-w),min(var(--asp-h),86dvh))}
.asp-root[data-ratio="16/9"] .asp-reels,.asp-reels.asp-stage-wide{aspect-ratio:16/9;width:min(100%,var(--asp-w));max-width:min(100%,900px)}
.asp-reels.asp-stage-tall{aspect-ratio:9/16;width:min(100%,var(--asp-w),calc(min(var(--asp-h),86dvh)*9/16))}
.asp-root[data-align=right] .asp-reels{margin-left:auto;margin-right:0}
.asp-root[data-align=left] .asp-reels{margin-right:auto;margin-left:0}

.asp-reels-track{height:100%;position:relative;z-index:1}
.asp-slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .25s ease}
.asp-slide.is-on{opacity:1;pointer-events:auto}

.asp-frame-wrap,.asp-lazy,.asp-video{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.asp-video{object-fit:var(--asp-fit);pointer-events:none;background:#000}
.asp-iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}

/* Platform badge */
.asp-platform-badge{position:absolute;top:12px;right:12px;z-index:10;color:#fff;font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 4px 14px rgba(0,0,0,.3);letter-spacing:.3px}

.asp-blur{position:absolute;inset:-20px;background-size:cover;background-position:center;filter:blur(32px) saturate(1.2);opacity:.45;z-index:0}
.asp-lazy{display:grid;place-items:center}
.asp-lazy img{width:100%;height:100%;object-fit:cover;opacity:.55}
.asp-shade{position:absolute;inset:0;background:var(--asp-chrome-bg);pointer-events:none;z-index:2}

.asp-buffering::before{
  content:"";position:absolute;inset:0;z-index:14;pointer-events:none;
  background:radial-gradient(circle at center,rgba(0,0,0,.25),transparent 60%);
}
.asp-buffering::after{
  content:"";position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;
  z-index:15;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;
  animation:asp-spin .8s linear infinite;pointer-events:none;
}
/* Error: only show after retries (JS sets .asp-error on persistent failure) */
.asp-root.asp-error .asp-frame-wrap::after{
  content:"⚠";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-size:42px;color:#fff;z-index:15;text-shadow:0 2px 12px #000;pointer-events:none;
}
.asp-root.asp-error .asp-center-icons{display:none}
@keyframes asp-spin{to{transform:rotate(360deg)}}

.asp-cover{position:absolute;inset:0;z-index:12;border:0;padding:0;cursor:pointer;background:#000 center/cover no-repeat;display:grid;place-items:center}
.asp-cover-play{
  width:80px;height:80px;border-radius:50%;background:var(--asp-accent);
  display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.45);
  transition:transform .2s;
}
.asp-cover-play svg{color:#fff}
.asp-cover:hover .asp-cover-play{transform:scale(1.08)}
.asp-root.is-playing .asp-cover{display:none}

.asp-hit{position:absolute;inset:0;z-index:4;cursor:pointer;background:transparent;border:0;padding:0}

.asp-center-icons{position:absolute;inset:0;pointer-events:none;z-index:5;display:grid;place-items:center}
.asp-center-icons > span{position:absolute;opacity:0;transform:scale(.6);transition:.25s}
.asp-center-icons .asp-pause-ico{
  width:80px;height:80px;border-radius:50%;background:rgba(0,0,0,.5);
  display:grid;place-items:center;color:#fff;
}
.asp-root.is-paused .asp-pause-ico{opacity:1;transform:scale(1)}
.asp-root:not(.is-paused) .asp-play-ico{display:none}
.asp-center-icons .asp-play-ico{
  width:80px;height:80px;border-radius:50%;background:rgba(0,0,0,.4);
  display:grid;place-items:center;color:#fff;
}
.asp-root.is-paused .asp-play-ico{display:none}
.asp-center-icons .asp-like-burst{font-size:84px;z-index:6}
.asp-center-icons .asp-like-burst.pop{opacity:1;transform:scale(1);animation:asp-heart .6s ease}
@keyframes asp-heart{
  0%{transform:scale(.4);opacity:0}
  30%{transform:scale(1.3);opacity:1}
  60%{transform:scale(1)}
  100%{transform:scale(1.2);opacity:0}
}
.asp-seek-flash{
  position:absolute;top:50%;transform:translateY(-50%);z-index:6;
  background:rgba(0,0,0,.55);color:#fff;padding:12px 16px;border-radius:999px;
  display:flex;align-items:center;gap:6px;font-size:14px;font-weight:700;
  opacity:0;pointer-events:none;
}
.asp-seek-flash svg{width:24px;height:24px}
.asp-seek-back-flash{left:24px}
.asp-seek-fwd-flash{right:24px}
.asp-seek-flash.flash{animation:asp-flash .55s ease}
@keyframes asp-flash{
  0%{opacity:0;transform:translateY(-50%) scale(.8)}
  30%{opacity:1;transform:translateY(-50%) scale(1.1)}
  70%{opacity:1;transform:translateY(-50%) scale(1)}
  100%{opacity:0;transform:translateY(-50%) scale(.9)}
}

.asp-chrome{position:absolute;inset:0;z-index:9;pointer-events:none;opacity:0;transition:opacity .25s ease}
.asp-root.asp-chrome-on .asp-chrome,.asp-root[data-chrome=always] .asp-chrome{opacity:1}
@media (hover:hover){.asp-reels:hover .asp-chrome{opacity:1}}
.asp-chrome .asp-rail,.asp-chrome .asp-nav-top,.asp-chrome .asp-progress,
.asp-chrome .asp-cta,.asp-chrome .asp-time,.asp-chrome .asp-speed,.asp-chrome .asp-wm{pointer-events:auto}

.asp-progress{position:absolute;left:12px;right:12px;bottom:10px;height:4px;z-index:8;background:rgba(255,255,255,.25);border-radius:99px;overflow:hidden;cursor:pointer;direction:ltr}
.asp-progress>i{display:block;height:100%;width:0;background:var(--asp-progress);transform-origin:left center;border-radius:99px;transition:background .2s}
.asp-progress:hover{height:6px}
.asp-time{position:absolute;left:12px;bottom:20px;font-size:11px;opacity:.9;z-index:8;text-shadow:0 1px 4px rgba(0,0,0,.7);font-variant-numeric:tabular-nums}

.asp-meta{position:absolute;right:14px;left:78px;bottom:30px;z-index:7;text-shadow:0 2px 10px rgba(0,0,0,.8);pointer-events:none}
.asp-meta h3{margin:6px 0 0;font-size:15px;font-weight:700;line-height:1.45;color:var(--asp-title)}
.asp-ch{opacity:.9;font-size:13px;color:var(--asp-ch);font-weight:600}

.asp-cta{position:absolute;right:14px;bottom:88px;z-index:10;background:var(--asp-accent);color:#fff;text-decoration:none;border-radius:999px;padding:9px 18px;font-size:14px;font-weight:700;box-shadow:0 6px 18px rgba(0,0,0,.35);transition:transform .15s}
.asp-cta:hover{transform:scale(1.05)}
.asp-wm{position:absolute;top:12px;right:12px;z-index:8;max-width:24%;opacity:.85;pointer-events:none}
.asp-wm img{width:100%;height:auto;display:block;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}

.asp-rail{position:absolute;bottom:60px;z-index:9;display:flex;flex-direction:column;gap:10px;left:10px}
.asp-root[data-rail=right] .asp-rail{left:auto;right:10px}
.asp-rail button,.asp-rail a{
  width:44px;height:44px;border:0;border-radius:50%;
  background:var(--asp-rail-bg);color:var(--asp-icon-color);cursor:pointer;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  display:grid;place-items:center;text-decoration:none;box-shadow:none;
  transition:transform .15s,background .15s;padding:0;
}
.asp-rail button svg,.asp-pause-ico svg,.asp-play-ico svg,.asp-cover-play svg,
.asp-seek-flash svg,.asp-modal-x svg{display:block;width:var(--asp-icon-size);height:var(--asp-icon-size)}
.asp-rail .asp-custom-icon{font-size:calc(var(--asp-icon-size) + 4px);line-height:1}
.asp-rail button:hover,.asp-rail a:hover{background:var(--asp-btn-bg);transform:scale(1.08)}
.asp-rail button:active,.asp-rail a:active{transform:scale(.95)}
.asp-rail .asp-lab{font-size:10px;margin-top:-4px;text-align:center;text-shadow:0 1px 4px #000;color:#fff}

.asp-nav-top{position:absolute;top:12px;left:12px;right:12px;z-index:9;display:flex;justify-content:space-between;gap:8px}
.asp-nav-top span{background:rgba(0,0,0,.4);border-radius:999px;padding:5px 12px;font-size:12px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

.asp-speed{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:10;display:flex;gap:4px;background:rgba(0,0,0,.4);padding:4px;border-radius:10px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.asp-speed button{border:0;border-radius:7px;padding:5px 9px;font-size:11px;background:transparent;color:#fff;cursor:pointer;font-weight:600;transition:.15s}
.asp-speed button.is-on{background:var(--asp-accent);color:#fff}
.asp-speed button:hover{background:rgba(255,255,255,.15)}

/* Grid */
.asp-grid{display:grid;grid-template-columns:repeat(var(--asp-cols),minmax(0,1fr));gap:14px}
.asp-card{border:0;padding:0;background:transparent;color:#fff;text-align:right;cursor:pointer;font:inherit;transition:transform .15s}
.asp-card:hover{transform:translateY(-2px)}
.asp-card-thumb{position:relative;display:block;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#121622}
.asp-root[data-ratio="16/9"] .asp-card-thumb,.asp-card[data-asp-platform="aparat_video"] .asp-card-thumb,
.asp-card[data-asp-platform="youtube_video"] .asp-card-thumb{aspect-ratio:16/9}
.asp-card-thumb img,.asp-ph{width:100%;height:100%;object-fit:cover;display:block}
.asp-ph{background:linear-gradient(160deg,#2a1430,#111);position:absolute;inset:0}
.asp-lazy img{display:block}
/* If a thumbnail fails to load, hide the broken-image glyph and show the black bg */
.asp-frame-wrap img,.asp-lazy img,.asp-blur,.asp-card-thumb img{color:transparent;font-size:0}
.asp-lazy img:-webkit-broken{display:none}
.asp-video{background:#000}
.asp-card-badge{position:absolute;top:8px;right:8px;z-index:3;color:#fff;font-size:10px;font-weight:700;padding:3px 8px;border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 2px 8px rgba(0,0,0,.3)}
.asp-card-dur{position:absolute;bottom:6px;left:6px;background:rgba(0,0,0,.6);color:#fff;font-size:11px;padding:2px 6px;border-radius:6px;font-variant-numeric:tabular-nums;z-index:2}
.asp-card-iframe-ico{position:absolute;top:8px;left:8px;color:#fff;font-size:11px;background:rgba(255,0,0,.8);padding:2px 6px;border-radius:4px;z-index:2}
.asp-play{
  position:absolute;inset:auto 50% 50% auto;transform:translate(50%,50%);
  width:48px;height:48px;border-radius:50%;background:var(--asp-accent);
  display:grid;place-items:center;color:#fff;transition:transform .2s;box-shadow:0 6px 20px rgba(0,0,0,.4);
  z-index:2;
}
.asp-play svg{width:20px;height:20px}
.asp-card:hover .asp-play{transform:translate(50%,50%) scale(1.1)}
.asp-card-title{display:block;margin-top:8px;font-size:13px;line-height:1.5;font-weight:600}
.asp-card-ch{display:block;opacity:.65;font-size:12px}

/* Modal */
.asp-modal[hidden]{display:none}
.asp-modal{position:fixed;inset:0;z-index:99999;direction:rtl}
.asp-modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.asp-modal-box{position:relative;width:min(var(--asp-w),92vw);height:min(86dvh,820px);margin:4vh auto;background:#000;border-radius:18px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.asp-modal-frame{position:absolute;inset:0}
.asp-modal-x{position:absolute;top:10px;left:10px;z-index:12;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.2);color:#fff;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:.2s}
.asp-modal-x:hover{background:rgba(255,255,255,.35);transform:rotate(90deg)}
.asp-modal-x svg{width:18px;height:18px}

.asp-toast{position:absolute;top:18%;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.78);padding:10px 16px;border-radius:12px;z-index:20;font-size:13px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);text-align:center;max-width:80%}

/* Responsive */
@media (max-width:720px){
  .asp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .asp-reels{width:100%;max-width:100%;border-radius:0}
  .asp-modal-box{width:100vw;height:100dvh;margin:0;border-radius:0;max-height:100dvh}
  .asp-cta{bottom:80px;padding:8px 14px;font-size:13px}
  .asp-meta{left:72px;bottom:26px}
}

.elementor-widget-aparat_shorts .asp-reels{max-width:100%}

/* RTL rail position fix */
.asp-root.asp-rail-right .asp-rail{right:10px;left:auto}
.asp-root.asp-rail-left .asp-rail{left:10px;right:auto}
