.elementor-20228 .elementor-element.elementor-element-e9e795f{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20228 .elementor-element.elementor-element-e9e795f:not(.elementor-motion-effects-element-type-background), .elementor-20228 .elementor-element.elementor-element-e9e795f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-a384580 );}.elementor-20228 .elementor-element.elementor-element-072f435{--spacer-size:1px;}.elementor-20228 .elementor-element.elementor-element-288a4a1 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-20228 .elementor-element.elementor-element-f7a85c2{--display:flex;--min-height:100vh;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20228 .elementor-element.elementor-element-f7a85c2.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-20228 .elementor-element.elementor-element-281ebf4{--display:flex;--min-height:50vh;}.elementor-20228 .elementor-element.elementor-element-281ebf4:not(.elementor-motion-effects-element-type-background), .elementor-20228 .elementor-element.elementor-element-281ebf4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-a384580 );}.elementor-20228 .elementor-element.elementor-element-89e4dd6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20228 .elementor-element.elementor-element-08112bb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-20228 .elementor-element.elementor-element-9af2f58{--spacer-size:50px;}@media(max-width:767px){.elementor-20228 .elementor-element.elementor-element-e9e795f{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-20228 .elementor-element.elementor-element-072f435{--spacer-size:20px;}.elementor-20228 .elementor-element.elementor-element-288a4a1 > .elementor-widget-container{margin:0px 0px 0px 0px;}}/* Start custom CSS for container, class: .elementor-element-281ebf4 */html, body { overflow-x: clip; } /* جلوگیری از اسکرول افقی */

.rm-fullbleed{
  width: 100vw !important;                 /* تمام عرض ویوپورت */
  margin-left:  calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  background: #ffffff;                      /* پس‌زمینه سفیدِ تمام‌عرض */
}

/* متن و کانتنت داخلی همان محدودیت قبلی را حفظ کند */
.rm-fullbleed .rm-container{
  width: min(92vw, 1200px);
  margin-inline: auto;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-0574f86 *//* ====== [top_users] — CSS نهایی (لایت/دارک بدون تغییر چیدمان) ====== */

/* (اختیاری) اگر قبلاً ست نکرده‌ای */
:root{ --bg:#ffffff; --fg:#000000; }
:root[data-theme="dark"]{ --bg:#000000; --fg:#ffffff; }

/* === استایل اصلی شما === */
.top-users-table {
  min-width: 500px;
  max-width:1200px;
  display: grid;
  grid-template-columns: 1fr;
  font-family: 'Segoe UI', sans-serif;
  direction: rtl;
  font-size: 14px;
  color: #111;
}

.top-users-header,
.top-users-row {
  display: grid;
  grid-template-columns: 40px 1fr 90px 90px;
  align-items: center;
  padding: 10px 20px;
  border-bottom: 1px dotted #ccc;
  background: #fff;
  border-radius: 8px;
}

.top-users-header {
  font-weight: bold;
  color: #666;
}

.user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  background: #eee;
}

.user-name {
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
}

.pro-badge {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  background: #000;
  color: #fff;
}

.user-points {
  text-align: center;
  font-weight: 500;
  color: #333;
}

.view-button {
  padding: 6px 16px;
  background: none;
  border: none;
  font-size: 12px;
  color: #111;
  text-transform: uppercase;
  letter-spacing: 1px;
  cursor: pointer;
  position: relative;
}

.view-button::after {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: #111;
  margin-top: 2px;
  transition: 0.3s ease;
}

.view-button:hover::after {
  width: 0;
  background: transparent;
}

.more-users {
  text-align: center;
  font-size: 14px;
  margin-top: 30px;
  color: #444;
}

.more-users a {
  font-weight: bold;
  text-decoration: underline;
  margin-right: 4px;
}

/* 📱 موبایل */
@media (max-width: 768px) {
  .top-users-table { min-width: 360px; }

  .top-users-header,
  .top-users-row { grid-template-columns: 40px 1fr 50px 50px !important; }

  .top-users-row > div {
    display: flex;
    align-items: right;
    justify-content: right;
  }

  .user-name {
    justify-content: flex-start;
    font-size: 10px;
    gap: 6px;
  }

  .user-points { font-size: 14px; }

  .view-button {
    font-size: 10px;
    padding: 5px 10px;
    white-space: nowrap;
  }
}

/* === Theme bridge (افزوده؛ فقط رنگ‌ها را تم-آگاه می‌کند) === */
.top-users-table{
  --tu-bg: var(--bg, #ffffff);
  --tu-fg: var(--fg, #000000);

  --tu-ink: #111;
  --tu-muted: #666;
  --tu-border: #ccc;
  --tu-card: #fff;
  --tu-subtle: #eee;
  --tu-chip-bg: #000;
  --tu-chip-fg: #fff;
  --tu-link: #111;
}

/* اگر data-theme روی :root یا html یا body ست شود، همه پوشش داده می‌شود */
:is(:root, html, body)[data-theme="dark"] .top-users-table{
  --tu-bg: var(--bg, #000000);
  --tu-fg: var(--fg, #ffffff);

  --tu-ink: #ffffff;
  --tu-muted: #aaaaaa;
  --tu-border: #222222;
  --tu-card: #0f0f0f;   /* اگر می‌خواهی کارت‌ها در دارک هم سفید بمانند، این را #fff بگذار */
  --tu-subtle: #1a1a1a;
  --tu-chip-bg: #ffffff;
  --tu-chip-fg: #000000;
  --tu-link: #ffffff;
}

/* اعمال توکن‌ها — فقط رنگ‌ها (بدون تغییر چیدمان) */
.top-users-table{ color: var(--tu-ink) !important; }

.top-users-header,
.top-users-row{
  background: var(--tu-card) !important;
  border-bottom-color: var(--tu-border) !important;
}

.top-users-header{ color: var(--tu-muted) !important; }
.user-avatar{ background: var(--tu-subtle) !important; }
.user-name{ color: var(--tu-ink) !important; }

.pro-badge{
  background: var(--tu-chip-bg) !important;
  color: var(--tu-chip-fg) !important;
}

.user-points{ color: var(--tu-ink) !important; }

.view-button{ color: var(--tu-link) !important; }
.view-button::after{ background: currentColor !important; }

.more-users{ color: var(--tu-muted) !important; }
.more-users a{ color: var(--tu-link) !important; }

/* اگر فید داری، با تم هماهنگ شود */
.with-fade::after{
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, var(--tu-bg) 100%) !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ad69e34 */.top-users-row.limited { display: none; } .top-users-row.limited { display: none; } .top-users-row.show { display: grid; } .with-fade { position: relative; } .with-fade { position: relative; } .with-fade::after { content: ''; position: absolute; bottom: 45px; left: 0; right: 0; height: 80px; background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #fff 100%); pointer-events: none; z-index: 10; } .with-fade.expanded::after { display: none; }/* End custom CSS */