/* ═══════════════════════════════════════════════════════════════════════
   Fastitem 7.2 — پوستهٔ مشترک همهٔ صفحات: توکن‌ها، حاشیهٔ فول‌واید، هدر، نوار دسته‌ها، فوتر
   (طرح Fastitem Header / Home Fullwidth — ۲۰۲۶-۰۹-۰۵). روی همهٔ صفحات لود می‌شود.
   ═══════════════════════════════════════════════════════════════════════ */

body {
  --fh-bg: #0f1116;
  --fh-bg2: #14161c;
  --fh-card: #181a21;
  --fh-card2: #1d2029;
  --fh-line: #262933;
  --fh-line2: #30343f;
  --fh-text: #e8eaf0;
  --fh-muted: #8b90a0;
  --fh-muted2: #5f6470;
  --fh-blue: #3d5afe;
  --fh-blue2: #2f48d6;
  --fh-green: #4ade80;
  --fh-orange: #f59e0b;
  --fh-red: #e0322d;
  --fh-yellow: #f2c230;
  --fh-radius: 14px;
  --fh-gutter: 24px; /* قاعدهٔ فول‌واید: ۲۴ → ۳۲ → ۴۸ با عرض صفحه */
}

body .fh-wrap {
  width: 100%;
  margin: 0;
  padding: 0 var(--fh-gutter) 40px;
  box-sizing: border-box;
}
@media (min-width: 1600px) { body { --fh-gutter: 32px; } }
@media (min-width: 2200px) { body { --fh-gutter: 48px; } }

/* ───────────────────────── هدر (ری‌استایل، مارکاپ همان است) ───────────────────────── */
body .TopHeader {
  background: var(--fh-bg2);
  border-bottom: 1px solid var(--fh-line);
  padding: 12px 0;
}
body .TopHeader .container-fluid { max-width: none; margin: 0; padding: 0 var(--fh-gutter); }
body .TopHeader .row { display: flex; align-items: center; }
body .TopHeader .row > [class*="col-"] { float: none; }
body .TopHeader .col-lg-9 { display: flex; align-items: center; gap: 10px; flex: 1 1 auto; }
body .TopHeader .col-lg-3 { flex: 0 0 auto; margin-right: auto; }
body .logo { margin: 0 12px 0 0; width: auto; float: none; }
body .logo img { height: 34px; width: auto; display: block; }
body .HeaderCard,
body .HeaderWallet {
  float: none;
  margin: 0;
  width: auto;
  background: var(--fh-card);
  border: 1px solid var(--fh-line);
  border-radius: 10px;
  height: 42px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  box-sizing: border-box;
}
body .HeaderCard a { display: flex; align-items: center; }
body .HeaderCard img { padding: 0; width: 18px; height: auto; opacity: .9; }
body .HeaderCard span { float: none; padding: 0; font-size: 15px; font-weight: 700; color: var(--fh-text); line-height: 1; font-family: iransansx; }
body .HeaderWallet { direction: rtl; gap: 10px; padding: 0 6px 0 12px; }
body .HeaderWallet .Mablagh { margin: 0; display: flex; align-items: baseline; gap: 6px; }
body .HeaderWallet b { font-size: 15px; font-weight: 700; font-family: iransansx; }
body .HeaderWallet .WalletUnit { font-size: 11px; color: var(--fh-muted); }
body .HeaderWallet .WalletCharge {
  width: 28px; height: 28px; border-radius: 8px; background: #22c55e; color: #052e16;
  display: inline-flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; line-height: 1;
  text-decoration: none; transition: background .2s;
}
body .HeaderWallet .WalletCharge:hover { background: #4ade80; }

body .HeaderMenu { display: flex; align-items: center; gap: 8px; }
body .HeaderMenu .uk-inline { order: 1; }
body .HeaderMenu .LoginButton {
  background: var(--fh-card); border: 1px solid var(--fh-line); border-radius: 10px; height: 42px;
  padding: 0 10px 0 14px; color: var(--fh-text); font-family: iransansx; font-size: 13px; font-weight: 700;
  display: flex; align-items: center; gap: 8px; text-transform: none;
}
body .HeaderMenu .LoginButton:hover { background: var(--fh-card2); }
body .HeaderMenu .LoginButton img { width: 28px; height: 28px; border-radius: 8px; margin: 0; }
body .HeaderMenu .LoginButton .uk-icon { color: var(--fh-muted); }
body .HeaderMenu .HeaderProfileSetting {
  order: 2; width: 42px; height: 42px; border-radius: 10px; background: var(--fh-card); border: 1px solid var(--fh-line);
  display: inline-flex; align-items: center; justify-content: center; margin: 0;
}
body .HeaderMenu .HeaderProfileSetting:hover { background: var(--fh-card2); }
body .HeaderMenu .HeaderProfileSetting img { width: 20px; height: auto; margin: 0; border-radius: 0; opacity: .85; }
body .HeaderMenu #HeaderBuyFromUser { order: 3; }
body .TopHeader .addtocart.GreenButtton {
  width: auto; margin: 0; float: none;
  display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px; border-radius: 10px;
  background: #22c55e; color: #052e16; font-weight: 700; font-size: 14px; text-decoration: none;
}

/* ── مطابقت با طرح «Fastitem Header — نسخهٔ کار» ── */
/* چیپ سبد/اینونتوری: اول عدد، بعد آیکون */
body .HeaderCard { flex-direction: row-reverse; }
body .HeaderCard .clear { display: none; }
/* چیپ کاربر: آواتار راست، نام + شناسه در دو خط، فلش چپ */
body .HeaderMenu .LoginButton { height: 46px; padding: 0 8px 0 12px; gap: 10px; }
body .HeaderMenu .LoginButton img { width: 30px; height: 30px; }
body .HeaderMenu .LoginButton .fsi-uname { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.25; text-align: right; }
body .HeaderMenu .LoginButton .fsi-uid { display: block; font-size: 10px; font-weight: 500; color: var(--fh-muted); font-family: 'Rajdhani', iransansx, sans-serif; letter-spacing: .02em; }
body .HeaderMenu .HeaderProfileSetting { width: 46px; height: 46px; position: relative; }
/* آیکون تنظیمات (چرخ‌دنده) به‌جای عکس پروفایل، و آیکون خطی «کاربر به کاربر» به‌جای شعله */
body .HeaderMenu .HeaderProfileSetting img { display: none; }
body .HeaderMenu .HeaderProfileSetting::before {
  content: ''; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-position: center; opacity: .85;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9cdd8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='3'/><path d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z'/></svg>");
}
body .HeaderMenu #HeaderBuyFromUser::before {
  width: 22px; height: 22px; opacity: 1;
  /* آیکون «تبادل / معامله» — انتخاب کاربر ۲۰۲۶-۰۹-۰۵ (همان روی دکمهٔ کارت‌ها هم هست) */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 8h14'/><path d='M14 4l4 4-4 4'/><path d='M20 16H6'/><path d='M10 12l-4 4 4 4'/></svg>");
}
/* ترتیب سمت راست: کاربر → خرید مستقیم → تنظیمات */
body .HeaderMenu .uk-inline { order: 1; }
body .HeaderMenu #HeaderBuyFromUser { order: 2; }
body .HeaderMenu .HeaderProfileSetting:not(#HeaderBuyFromUser) { order: 3; }
/* نشان نارنجی تعداد خریدهای مستقیم در جریان روی آیکون «خرید مستقیم از کاربر» (مطابق طرح) */
body .HeaderMenu #HeaderBuyFromUser .fsi-fbbadge {
  position: absolute; top: -7px; right: -7px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: var(--fh-orange); color: #1a1204; font-size: 11px; font-weight: 800; line-height: 18px; text-align: center; font-family: iransansx;
  box-shadow: 0 0 0 2px var(--fh-bg2);
}

/* نوار دستهٔ بازی‌ها → چیپ با نشان رنگی */
body .GameCatTop { max-width: none; margin: 0 -15px; padding: 0 var(--fh-gutter); border-bottom: 1px solid var(--fh-line); background: var(--fh-bg2); }
body .GameCatTop > ul,
body .container-fluid > .GameCatTop ul { display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 0; }
body .GameCatTop ul li { float: none; }
body .GameCatTop ul li a {
  background: var(--fh-card); border: 1px solid var(--fh-line); border-radius: 10px; height: 36px; padding: 0 12px 0 14px;
  display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--fh-text); margin: 0; box-shadow: none;
}
body .GameCatTop ul li a:hover { background: var(--fh-card2); border-color: var(--fh-line2); box-shadow: none; }
body .GameCatTop ul li a img { display: none; }
body .GameCatTop ul li a::before {
  content: ''; width: 18px; height: 18px; border-radius: 5px; font-family: 'Rajdhani', sans-serif; font-size: 10px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; color: #0b0c10; line-height: 1;
}
body .GameCatTop ul li:nth-child(1) a::before { content: 'D2'; background: var(--fh-red); color: #fff; }
body .GameCatTop ul li:nth-child(2) a::before { content: 'CS'; background: var(--fh-yellow); }
body .GameCatTop ul li:nth-child(3) a::before { content: 'TF'; background: #d97a3a; color: #fff; }
body .GameCatTop ul li:nth-child(4) a::before { content: 'R';  background: #e8622a; color: #fff; }
body .GameCatTop ul li:nth-child(5) a::before { content: 'S';  background: #3b82f6; color: #fff; }
body .GameCatTop ul li:nth-child(6) a::before { content: 'B';  background: #4b5563; color: #fff; }
body .GameCatTop ul li.FastTutsssss { margin-right: auto; }
body .GameCatTop ul li.FastTutsssss a { background: transparent; border-color: var(--fh-line2); color: var(--fh-muted); }
body .GameCatTop ul li.FastTutsssss a::before {
  content: ''; background: transparent; border: 1.5px solid var(--fh-muted); border-radius: 50%; width: 14px; height: 14px; box-sizing: border-box;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238b90a0'><path d='M9 7l8 5-8 5z'/></svg>");
  background-size: 12px; background-position: center; background-repeat: no-repeat;
}
body .GameCatTop ul li.FastTutsssss a:hover { color: var(--fh-text); }

/* ───────────────────────── فوتر ───────────────────────── */
body .fh-footer { background: var(--fh-bg2); border-top: 1px solid var(--fh-line); margin-top: 0; }
body .fh-footer .fh-wrap { padding-top: 32px; padding-bottom: 0; }
body .fh-fgrid { display: grid; grid-template-columns: 2fr repeat(4, 1fr); gap: 24px; padding-bottom: 28px; width: 100%; }
body .fh-brand img { height: 30px; width: auto; display: block; margin-bottom: 12px; }
body .fh-brand p { margin: 0 0 14px; font-size: 12px; color: var(--fh-muted); line-height: 1.9; max-width: 420px; }
body .fh-brand .fh-fbtns { display: flex; gap: 8px; flex-wrap: wrap; }
body .fh-fbtn {
  display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 9px; border: 1px solid var(--fh-line2);
  color: var(--fh-text); font-size: 12px; font-weight: 700; text-decoration: none; background: var(--fh-card); transition: background .2s;
}
body .fh-fbtn:hover { background: var(--fh-card2); color: #fff; }
body .fh-fbtn svg { width: 15px; height: 15px; }
body .fh-fcol h4 { margin: 4px 0 12px; font-size: 14px; font-weight: 800; color: var(--fh-text); }
body .fh-fcol ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
body .fh-fcol a { font-size: 13px; color: var(--fh-muted); text-decoration: none; transition: color .2s; }
body .fh-fcol a:hover { color: #fff; }
body .fh-fbottom { border-top: 1px solid var(--fh-line); padding: 16px 0 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
body .fh-fbottom p { margin: 0; font-size: 12px; color: var(--fh-muted); }
body .fh-seals { display: flex; gap: 8px; }
body .fh-seals a { width: 60px; height: 60px; border-radius: 10px; border: 1px solid var(--fh-line); background: var(--fh-card); display: inline-flex; align-items: center; justify-content: center; overflow: hidden; }
body .fh-seals img { max-width: 48px; max-height: 48px; }
body .fh-footer .footerPM { margin: 0 0 16px; }

/* ───────────────────────── ریسپانسیو (هدر/فوتر) ───────────────────────── */
@media (max-width: 991px) {
  body .fh-fgrid { grid-template-columns: 1fr 1fr; }
  body .fh-brand { grid-column: span 2; }
}
@media (max-width: 600px) {
  body { --fh-gutter: 12px; }
  body .fh-wrap { padding-bottom: 30px; }
  body .fh-fgrid { grid-template-columns: 1fr; }
  body .fh-brand { grid-column: span 1; }
  body .fh-fbottom { flex-direction: column; align-items: flex-start; }
}

/* ═══════════ منوی موبایل (۲۰۲۶-۰۹-۰۶): شیت پایینی مطابق طرح کاربر ═══════════ */
body #offcanvas-nav-primary { left: 0 !important; right: 0 !important; width: auto !important; }
body #offcanvas-nav-primary.uk-offcanvas-overlay::before { background: rgba(0,0,0,.6) !important; }
body #offcanvas-nav-primary .uk-offcanvas-bar.fsi-mm {
  position: fixed !important; left: 0 !important; right: 0 !important; top: auto !important; bottom: 0 !important;
  width: 100% !important; max-width: none !important; height: auto !important; max-height: 92vh;
  padding: 8px 16px 0 !important; background: #14161c !important; border-radius: 22px 22px 0 0; direction: rtl;
  box-shadow: 0 -12px 40px rgba(0,0,0,.5); overflow: hidden !important; display: flex !important; flex-direction: column;
  transform: translateY(100%) !important; transition: transform .32s cubic-bezier(.2,.8,.2,1) !important; color: var(--fh-text);
}
body #offcanvas-nav-primary.uk-open .uk-offcanvas-bar.fsi-mm { transform: translateY(0) !important; }
body .fsi-mm-handle { display: block; width: 44px; height: 4px; border-radius: 2px; background: #3a3f4b; margin: 6px auto 12px; flex: 0 0 auto; }
/* هدر: آواتار + نام + شناسه + دکمهٔ بستن (شورون چپ) */
body .fsi-mm-head { display: flex; align-items: center; gap: 12px; padding: 0 0 14px; flex: 0 0 auto; }
body .fsi-mm-avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; background: #1d2029; flex: 0 0 auto; }
body .fsi-mm-who { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
body .fsi-mm-who b { font-family: 'Rajdhani', iransansx, sans-serif; font-size: 20px; font-weight: 700; color: #fff; letter-spacing: .02em; text-transform: uppercase; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body .fsi-mm-who small { font-family: 'Rajdhani', iransansx, sans-serif; font-size: 13px; color: var(--fh-muted); direction: ltr; text-align: right; }
body .fsi-mm-close { position: static !important; margin-right: auto; width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; color: var(--fh-muted); display: inline-flex; align-items: center; justify-content: center; padding: 0 !important; cursor: pointer; }
body .fsi-mm-close svg { width: 18px; height: 18px; }
body .fsi-mm-close:hover { color: #fff; background: rgba(255,255,255,.06); }
/* بدنهٔ اسکرول‌شونده */
body .fsi-mm-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: none; margin: 0 -16px; padding: 0 16px; }
body .fsi-mm-body::-webkit-scrollbar { display: none; }
/* کیف پول */
body .fsi-mm-wallet { display: flex; align-items: center; gap: 12px; height: 52px; padding: 0 8px 0 14px; border-radius: 12px; background: #1b1e26; border: 1px solid var(--fh-line); margin: 0 0 12px; }
body .fsi-mm-charge { width: 34px; height: 34px; border-radius: 9px; background: #22c55e; color: #052e16 !important; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
body .fsi-mm-charge svg { width: 16px; height: 16px; }
body .fsi-mm-bal { display: flex; align-items: baseline; gap: 6px; }
body .fsi-mm-bal b { font-size: 17px; font-weight: 800; color: #fff; }
body .fsi-mm-bal span { font-size: 12px; color: var(--fh-muted); }
/* چیپ‌های بازی‌ها */
body .fsi-mm-games { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0 0 12px; }
body .fsi-mm-games a { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 40px; border-radius: 10px; background: #1b1e26; border: 1px solid var(--fh-line); color: #fff !important; font-family: 'Rajdhani', iransansx, sans-serif; font-size: 14px; font-weight: 700; text-decoration: none; white-space: nowrap; }
body .fsi-mm-games a:hover { border-color: var(--fh-line2); }
body .fsi-mm-gb { width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 10px; font-weight: 700; color: #0b0c10; flex: 0 0 auto; }
body .fsi-mm-gb-d2 { background: var(--fh-red); color: #fff; }
body .fsi-mm-gb-cs { background: var(--fh-yellow); }
body .fsi-mm-gb-tf { background: #d97a3a; color: #fff; }
body .fsi-mm-gb-r { background: #e8622a; color: #fff; }
/* گرید ۲ستونهٔ لینک‌ها */
body .fsi-mm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0 0 14px; }
body .fsi-mm-grid a { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 10px 0 12px; border-radius: 10px; background: #1b1e26; border: 1px solid var(--fh-line); color: var(--fh-text) !important; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; overflow: hidden; }
body .fsi-mm-grid a:hover { border-color: var(--fh-line2); color: #fff !important; }
body .fsi-mm-grid a i { width: 24px; height: 24px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; color: #c3ccd8; flex: 0 0 auto; }
body .fsi-mm-grid a i svg { width: 17px; height: 17px; }
body .fsi-mm-grid a.fsi-mm-wide { grid-column: 1 / -1; }
/* پایین: پشتیبانی و خروج */
body .fsi-mm-foot { flex: 0 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 8px 0 16px; background: #14161c; }
body .fsi-mm-foot a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; border-radius: 11px; font-size: 14px; font-weight: 800; text-decoration: none; }
body .fsi-mm-foot a svg { width: 17px; height: 17px; }
body .fsi-mm-support { background: #1b1e26; border: 1px solid var(--fh-line2); color: #fff !important; }
body .fsi-mm-logout { background: rgba(224,50,45,.14); border: 1px solid rgba(224,50,45,.55); color: #f87171 !important; }
body .fsi-mm-logout:hover { background: rgba(224,50,45,.24); }
@media (min-width: 992px) { body #offcanvas-nav-primary { display: none !important; } }

/* ═══════════ پنل «آیتم‌های خرید مستقیم» (۲۰۲۶-۰۹-۰۶، طرح کاربر: دسکتاپ کشوی راست، موبایل تمام‌عرض) ═══════════ */
body #offcanvas-nav-primary1 { left: 0 !important; right: 0 !important; width: auto !important; }
body #offcanvas-nav-primary1.uk-offcanvas-overlay::before { background: rgba(0,0,0,.6) !important; }
body #offcanvas-nav-primary1 .uk-offcanvas-bar.FsiFbBar {
  width: 360px !important; max-width: 100vw; padding: 0 !important; background: #14161c !important; color: var(--fh-text);
  border-radius: 0 16px 16px 0; display: flex !important; flex-direction: column; overflow: hidden !important; direction: rtl;
}
body .FsiFbHead { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 18px 14px; border-bottom: 1px solid var(--fh-line); flex: 0 0 auto; }
body .FsiFbHead h4 { margin: 0 !important; font-size: 17px !important; font-weight: 800 !important; color: #fff !important; }
body .FsiFbHead p { margin: 4px 0 0 !important; font-size: 12.5px !important; color: var(--fh-muted) !important; }
body .FsiFbClose { position: static !important; width: 34px; height: 34px; border-radius: 9px; border: 0; background: #1f232c; color: #c3ccd8; display: inline-flex; align-items: center; justify-content: center; padding: 0 !important; cursor: pointer; flex: 0 0 auto; }
body .FsiFbClose svg { width: 15px; height: 15px; }
body .FsiFbClose:hover { background: #2a2f3a; color: #fff; }
body .FsiFbScroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 14px 14px 20px; scrollbar-width: thin; scrollbar-color: var(--fh-line2) transparent; }
body .FsiFbList { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
body .FsiFbCard { display: block !important; border-radius: 14px; background: var(--fh-card); border: 1px solid var(--fh-line); padding: 12px; margin: 0; overflow: hidden; }
body .FsiFbCard.fb-item { border-right-width: 1px !important; }
body .fb-row { display: flex; align-items: center; gap: 12px; }
body .fb-thumb { position: relative; width: 62px; height: 56px; border-radius: 10px; background: #1b1e26; border: 1px solid var(--fh-line2); overflow: hidden; flex: 0 0 auto; }
body .fb-thumb img { width: 100%; height: 100%; object-fit: contain; padding: 5px; display: block; }
body .fb-thumb i { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--fh-line2); }
body .fb-done .fb-thumb i { background: #4ade80; } body .fb-pending .fb-thumb i { background: #ffb547; } body .fb-offer .fb-thumb i { background: #22c55e; }
body .fb-info { flex: 1 1 auto; min-width: 0; text-align: right; }
body .fb-name { font-size: 14px; font-weight: 800; color: #fff; line-height: 1.6; direction: ltr; text-align: right; }
body .fb-name .fb-wear { font-size: 12.5px; font-weight: 600; color: var(--fh-muted); }
body .fb-pre-st { color: #cf6a32; } body .fb-pre-sv { color: #ffd700; } body .fb-pre-star { color: #8650ac; }
body .fb-sub { margin-top: 3px; font-size: 12px; color: var(--fh-muted); }
body .fb-sub .fb-price { color: #c9cdd8; font-weight: 700; }
body .fb-sub .fb-dot { opacity: .6; margin: 0 3px; }
/* برچسب وضعیت (سمت چپ کارت) */
body .fb-badge { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 8px; border: 1px solid; font-size: 12.5px; font-weight: 800; white-space: nowrap; flex: 0 0 auto; background: transparent; }
body .fb-badge svg { width: 14px; height: 14px; }
body .fb-badge-done { color: #4ade80; border-color: rgba(74,222,128,.7); }
body .fb-badge-wait { color: #ffb547; border-color: rgba(255,181,71,.7); }
body .fb-badge-refund { color: var(--fh-muted); border-color: var(--fh-line2); }
/* کارت آفر فعال */
body .FsiFbCard.fb-offer { background: rgba(34,197,94,.08); border: 1px solid #22c55e !important; padding: 12px 12px 12px; }
body .fb-otop { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
body .fb-obell { display: inline-flex; align-items: center; gap: 7px; color: #4ade80; font-size: 13px; font-weight: 800; }
body .fb-obell svg { width: 15px; height: 15px; }
body .fb-oclock { font-family: 'Rajdhani', iransansx, sans-serif; font-size: 15px; font-weight: 700; color: #fff; direction: ltr; }
body .fb-offer .fb-row { padding: 0 2px; }
body .fb-obtn { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; margin: 12px 0 10px; border-radius: 10px; background: #22c55e; color: #052e16 !important; font-size: 14px; font-weight: 800; text-decoration: none !important; }
body .fb-obtn svg { width: 16px; height: 16px; }
body .fb-obtn:hover { background: #4ade80; }
body .fb-onote { margin: 0 !important; font-size: 11.5px; color: #7fe39c; opacity: .85; text-align: center; }
body .FsiFbEmpty, body .FsiFbLoading { color: var(--fh-muted); }
@media (max-width: 600px) {
  body #offcanvas-nav-primary1 .uk-offcanvas-bar.FsiFbBar { width: 100% !important; border-radius: 0; }
}
/* پنل خرید مستقیم: جمع‌وجورتر تا نام در دو خط جا شود (مثل طرح) */
body .fb-thumb { width: 56px; height: 50px; }
body .fb-row { gap: 10px; }
body .fb-name { font-size: 13.5px; line-height: 1.55; }
body .fb-sub { white-space: nowrap; }
body .fb-badge { height: 28px; padding: 0 9px; font-size: 12px; gap: 5px; }
body .fb-badge svg { width: 13px; height: 13px; }
body .FsiFbHead { background: #14161c !important; }
body .FsiFbScroll { -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
/* کارت آفر: دو دکمه — دریافت در برنامهٔ استیم / دریافت از سایت — و شمارش معکوس مهلت */
body .fb-obtns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0 10px; }
body .fb-obtns .fb-obtn { margin: 0; gap: 7px; font-size: 13px; }
body .fb-obtn2 { background: rgba(34,197,94,.10) !important; border: 1px solid rgba(34,197,94,.7); color: #4ade80 !important; }
body .fb-obtn2:hover { background: rgba(34,197,94,.2) !important; }
body .fb-oclock .FsiFbCount { font-variant-numeric: tabular-nums; }
body .fb-oclock.FsiFbChip--expired { color: var(--fh-muted); font-size: 12px; }
/* کارت آفر (طرح نهایی): آیکون ساعت کنار شمارش معکوس، دکمه‌های بلندتر، برچسب‌های کامل */
body .fb-oclock { display: inline-flex; align-items: center; gap: 5px; font-size: 14px; }
body .fb-oclock .fb-oclk { width: 14px; height: 14px; color: #c3ccd8; }
body .fb-obtns { gap: 10px; margin: 14px 0 12px; }
body .fb-obtns .fb-obtn { height: 46px; font-size: 14px; border-radius: 11px; }
body .fb-obtns .fb-obtn svg { width: 18px; height: 18px; }
body .fb-badge { height: 30px; padding: 0 10px; font-size: 12px; white-space: nowrap; }
body .fb-item .fb-row { gap: 8px; }
body .fb-item .fb-badge { font-size: 11.5px; padding: 0 8px; gap: 4px; }
body .fb-item .fb-thumb { width: 52px; height: 48px; }
body .fb-item .fb-name { font-size: 13px; }
/* تطبیق نهایی با تصویر: بدون خط رنگی زیر تصویر، یادداشت راست‌چین، آیکون ساعت سمت چپ عدد، نام ۱۴px در کارت آفر */
body .fb-thumb i { display: none; }
body .fb-thumb { background: #1b1e26; border-color: #2f333d; }
body .fb-onote { text-align: right; padding: 0 2px; }
body .fb-oclock { direction: ltr; }
body .fb-offer .fb-name { font-size: 14px; }
body .fb-offer .fb-sub .fb-price { color: #fff; }
body .fb-obtns .fb-obtn { height: 44px; border-radius: 10px; }
body .fb-obtn2 { background: rgba(34,197,94,.08) !important; }
body .FsiFbClose { background: #262a33; }
body .fb-badge-expired { color: var(--fh-muted); border-color: var(--fh-line2); }
body .fb-expired .fb-thumb { opacity: .7; }

/* ═══════════ نوار پایین موبایل (۲۰۲۶-۰۹-۰۷، طرح کاربر) ═══════════ */
body .FooterMobile.fsi-tb { position: fixed; left: 0; right: 0; bottom: 0; z-index: 990; background: #14161c !important; border-top: 1px solid var(--fh-line); border-radius: 16px 16px 0 0; padding: 0 !important; margin: 0 !important; height: auto !important; box-shadow: 0 -8px 30px rgba(0,0,0,.35); }
body .fsi-tb .fsi-tabbar { display: flex; align-items: stretch; height: 66px; padding: 0 6px calc(env(safe-area-inset-bottom, 0px) * .5); }
body .fsi-tb .fsi-tab { flex: 1 1 0; display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 8px 0 6px !important; margin: 0 !important; color: #aeb6c4 !important; background: transparent !important; border-radius: 12px; text-decoration: none !important; }
body .fsi-tb .fsi-tab:active { background: rgba(255,255,255,.05) !important; }
body .fsi-tb .fsi-tab.on { color: #fff !important; }
body .fsi-tb .fsi-tab.on .fsi-tab-ico svg { color: #fff; }
body .fsi-tb .fsi-tab-ico { position: relative; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; padding: 0 !important; }
body .fsi-tb .fsi-tab-ico svg { width: 24px; height: 24px; color: #c3ccd8; }
body .fsi-tb .fsi-tab-lbl { font-size: 11px; font-weight: 600; line-height: 1; color: inherit; padding: 0 !important; }
body .fsi-tb .fsi-tab-badge { position: absolute; top: -7px; right: -9px; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box; border-radius: 9px; background: #22c55e; color: #052e16; font-family: 'Rajdhani', iransansx, sans-serif; font-size: 11px; line-height: 18px; font-weight: 700; font-style: normal; text-align: center; white-space: nowrap; box-shadow: 0 0 0 2px #14161c; }
body .fsi-tb .fsi-tab-badge.pill { right: -14px; top: -8px; padding: 0 6px; }
body .fsi-tb .fsi-tab-badge.warn { background: #ffb547; color: #1a1a1a; }
body .fsi-tb .fsi-tab-badge[hidden] { display: none; }
body .fsi-tb .fsi-tab.AddtoCartAnimate { background: rgba(34,197,94,.16) !important; }
@media (max-width: 991px) { body { padding-bottom: 76px !important; } }
/* خرید فوری در نوار پایین: همان آیکون «تبادل» نارنجی هدر دسکتاپ */
body .fsi-tb .fsi-tab-ico svg.fsi-tab-swap { color: #f59e0b; }

/* 2026-09-07: دکمهٔ «ورود با استیم» دسکتاپ چسبیده به راست */
body .TopHeader .row > .fsi-login-col { width: auto; flex: 0 0 auto; margin-left: auto; margin-right: 0; display: flex; justify-content: flex-end; padding-right: 0; }
body .TopHeader .row > .fsi-login-col .addtocart.GreenButtton { cursor: pointer; }
