/* استایل های باکس دانلود */
/* ——— Download boxes ——— */
.dlbox-group { margin-top: 1.25rem; }
.dlbox-group-title { font-weight:700; margin-bottom:.5rem; }

.dlbox { margin-bottom: 1rem; }
.dlbox-head { font-weight:600; margin-bottom:.5rem; }

.dlcard {
  position: relative;
  display: block;               /* کل کارت کلیک‌پذیر */
  background: #eaf8e9;
  border-radius: 14px;
  padding: 1rem 3.25rem 1rem 4.25rem; /* راست جا برای آیکون؛ چپ جا برای پِل */
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  color: #0a0a0a;
  text-decoration: none;
}
.dlcard + .dlcard { margin-top: .65rem; }
.dlcard:hover { filter: brightness(0.98); }

.dlcard-updated { box-shadow: 0 8px 22px rgba(220,38,38,.18); }

/* پِل نوع فایل: بالا-چپ */
.dlcard-pill{
  position:absolute; top:-.6rem; left:.6rem;
  background:#a4c639; color:#015623;
  border-radius: 999px;
  font-size:.78rem; font-weight:700;
  padding:.25rem .6rem;
}
[dir="rtl"] .dlcard-pill { left:.6rem; right:auto; } /* اجباری برای RTL: بالا-چپ بماند */

/* برچسب «به‌روز شده»: هم‌ارتفاع کارت و ریسپانسیو */
.dlcard-ribbon{
  position: absolute;
  /* از بالای کارت تا پایین کارت کش بده */
  top: 0;
  bottom: 0;

  /* بچسب به لبه‌ی راست کارت (خارج یا مماس) */
  right: -0.55rem;                /* اگر خواستی کاملاً روی لبه باشد: 0 بگذار */
  /* برای مرورگرهای جدید میشه از inset-inline-end هم استفاده کرد */
  /* inset-inline-end: -0.55rem; */

  width: 23px;                    /* پهنای نوار عمودی */
  background: #dc2626;
  color: #fff;
  border-radius: 8px 0 0 8px;     /* گوشه‌های نرم سمت داخل کارت */
  box-shadow: 0 4px 16px rgba(220,38,38,.25);

  /* متن را وسطِ نوار عمودی نگه دار */
  display: flex;
  align-items: center;
  justify-content: center;

  /* نوشتار عمودی مثل نمونه */
  writing-mode: vertical-rl;
  transform: rotate(180deg);

  font-size: .78rem;
  font-weight: 700;
  z-index: 2;                     /* روی بدنه کارت باشد */
}

/* سازگاری RTL (اگر dir="rtl" داری) */
[dir="rtl"] .dlcard-ribbon{
  right: -0.55rem;  /* همان راست */
  left: auto;
}

/* برای موبایل کمی باریک‌تر */
@media (max-width: 576px){
  .dlcard-ribbon{ width: 23px; }
}


/* آیکون دانلود: سمت راست کارت، وسط عمودی */

.dlcard-icon{
  position:absolute; top:50%; right:1rem;
  transform: translateY(-50%);
  width:42px; height:42px;
  background:#16a34a; color:#fff;
  border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size: 20px;
  pointer-events:none;  /* کل کارت لینک است؛ آیکون فقط نمایشی */
}
[dir="rtl"] .dlcard-icon{ right:1.3rem; left:auto; }

.icon-download{
  display: block;
  width: 20px;            /* با ابعاد HTML سینک بماند */
  height: 20px;
  fill: #ffffff;             /* ← آیکون سفید */
}

/* متن با فاصلهٔ کافی از ریبون و آیکون و پِل */
.dlcard-body{
  display:block;
  /* فاصله از آیکون سمت راست و پِل سمت چپ */
  padding-right: 2.5rem;  /* جا برای dlcard-icon */
  padding-left: 2.25rem;   /* جا برای dlcard-pill */
}
[dir="rtl"] .dlcard-body{
  padding-right: 1.15rem;  /* آیکون دانلود راست */
  padding-left: 1.15rem;   /* پِل چپ */
}

.dlcard-title{
  font-weight:600; margin-bottom:.25rem;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.dlcard-meta{
  display:flex; gap:.75rem; flex-wrap:wrap;
  font-size:.86rem; color:#1f2937;
}

.dlbox-empty {
  padding:.9rem; background:#f8f9fa;
  border-radius:12px; text-align:center; color:#6b7280;
}

@media (max-width: 576px){
  .dlcard { padding: .85rem 2.5rem .85rem 1.75rem; }
  .dlcard-icon{ width:38px; height:38px; right:.75rem; }
  [dir="rtl"] .dlcard-icon{ right:.75rem; }
  .dlcard-body{ padding-right: 3rem; padding-left: 3.75rem; }
}

/* استایل اختصاصی هدِر هر باکس */
.dlbox--original .dlbox-head { color: #0b5; }
.dlbox--mod      .dlbox-head { color: #06c; }
.dlbox--unlocked .dlbox-head { color: #a40; }
.dlbox--beta     .dlbox-head { color: #b0b; }

/* (اختیاری) خود کارت‌ها */
.dlcard--mod      { /* مثلا */ /* border: 1px dashed #06c; */ }
.dlcard--beta     { /* مثلا */ /* opacity: .97; */ }