/* ==================================================================
   استاندارد کارت مسابقه — عیناً مطابق SET Online (sportdata.org)
   منبع: modern.css → .event-list-new>.event-list>li  (+ اندازه‌گیری DOM)
   گرید: repeat(auto-fit, minmax(300px,1fr)) | gap 1rem | place-items center
   کارت: 300x300 ثابت | border-radius 10px | border rgba(93,102,162,.5)
         گرادیان عمودی شفاف → مشکی | padding 5px
   ================================================================== */

/* ---------- گرید کارت‌ها (مرجع: .event-list) ---------- */
.public-page .tour-blocks,
.public-page #tournaments-list .tour-blocks {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  justify-content: center;
  place-items: center;
  gap: 1rem;
  grid-auto-rows: 1fr;
  margin: 5px;
  padding: 5px;
  max-width: 1350px;   /* استاندارد مرجع: عرض ظرف گرید ۱۳۵۰px در ۱۴۴۰px */
}

/* ---------- خود کارت: ۳۰۰×۳۰۰ مثل مرجع، ولی گوشه‌ها گرد و تصویر بالا ---------- */
.public-page .tour-hero {
  width: 300px;
  height: 300px;
  min-height: 300px;
  padding: 5px;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(93, 102, 162, .5);
  background-color: var(--bg);
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #000 100%);
  box-shadow: none;
  margin: 0;
  transition: border-color .18s ease, transform .18s ease;
}
.public-page .tour-hero:hover {
  border-color: rgba(255, 255, 255, .35);
  transform: translateY(-2px);
}

/* تصویر پس‌زمینهٔ کارت — عیناً همان قاعدهٔ img مرجع:
   299×298، absolute، inset:0، object-fit:cover، z-index:-1، radius 10px  */
.public-page .tour-hero.has-poster::before {
  content: '';
  position: absolute;
  top: 1px; left: 1px; right: 1px; bottom: 1px;
  background-image: var(--hero-img);
  background-size: cover;
  background-position: center;
  border-radius: 10px;
  z-index: 0;
}
/* گرادیان مرجع روی تصویر (شفاف → مشکی) */
.public-page .tour-hero.has-poster::after {
  content: '';
  position: absolute;
  top: 1px; left: 1px; right: 1px; bottom: 1px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, .92) 78%);
  border-radius: 10px;
  z-index: 1;
}
.public-page .tour-hero > * { position: relative; z-index: 2; }

/* ---------- بج تاریخ: مرجع time → top:0 / width:80px / bg rgba(93,102,162,.7) ---------- */
.public-page .hero-date-badge {
  position: absolute;
  top: 10px;
  right: 15px;
  width: 80px;
  text-align: center;
  padding: 5px;
  border-radius: 10px;
  background: rgba(93, 102, 162, .7);
  z-index: 3;
}
.public-page .hero-date-badge .hb-month { display: block; font-size: 18.67px; font-weight: 600; line-height: 1.1; }
.public-page .hero-date-badge .hb-day   { display: block; font-size: 26.67px; font-weight: 300; line-height: 1.1; }
.public-page .hero-date-badge .hb-year  { display: block; font-size: 18.67px; font-weight: 300; line-height: 1.1; }

/* لوگو گوشهٔ کارت (معادل flag مرجع در بالای time) */
.public-page .hero-logo-badge {
  position: absolute;
  top: 10px;
  left: 15px;
  width: 48px; height: 48px;
  border-radius: 10px;
  object-fit: cover;
  z-index: 3;
  background: rgba(0, 0, 0, .35);
  border: 1px solid rgba(255, 255, 255, .18);
}

/* ---------- بلوک اطلاعات: مرجع info → absolute / bottom:10px / max-width:98% ---------- */
.public-page .tour-hero-main {
  position: absolute;
  bottom: 10px;
  left: 5px;
  right: 5px;
  max-width: 98%;
  padding: 0 5px 0 5px;
  display: block;
  z-index: 2;
}

/* تیتر کارت: مرجع .title → 18.67px / weight 500 / uppercase / max-height 85px / ellipsis */
.public-page .hero-title {
  font-size: 18.67px;
  font-weight: 700;
  line-height: 20.53px;
  margin: 0;
  max-height: 85px;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #fff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .85);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.public-page .hero-subtitle {
  font-size: 13px;
  line-height: 18.57px;
  color: rgba(255, 255, 255, .72);
  margin: 4px 0 0;
  max-height: 38px;
  overflow: hidden;
}

/* اطلاعات کوتاه داخل کارت (قرص‌ها) — فشرده و خوانا مثل مرجع */
.public-page .tour-meta-line { gap: 6px; margin: 6px 0 0; }
.public-page .meta-pill {
  padding: 3px 9px;
  font-size: 11px;
  line-height: 1.5;
  border-radius: 10px;
  background: rgba(0, 0, 0, .45);
  border: 1px solid rgba(255, 255, 255, .14);
  color: rgba(255, 255, 255, .92);
}
.public-page .meta-pill b { font-weight: 700; }

/* داخل کارت: فقط خلاصه (عیناً محتوای کارت مرجع)؛ جزئیات در صفحهٔ مسابقه
   ⚠️ meta-line در کارت لیست پنهان است چون همان تاریخ‌ها در hero-desc هست →
   نمایش دوبارهٔ تاریخ‌ها + آدرس بلند، کارت ۳۰۰×۳۰۰ را شلوغ/سرریز می‌کرد. */
.public-page .tour-hero .countdown-row,
.public-page .tour-hero .hero-actions,
.public-page .tour-hero .tour-contacts,
.public-page .tour-hero .tour-meta-line,
.public-page .tour-hero .hero-media { display: none; }

/* لینک‌های سریع بالای کارت (تب‌های مرجع) */
.public-page .tour-hero .tour-links {
  margin: 8px 0 0; padding-top: 8px; gap: 5px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.public-page .tour-hero .tour-link {
  padding: 5px 11px; font-size: 11.5px; font-weight: 700;
  background: rgba(0, 0, 0, .45);
  border: 1px solid rgba(93, 102, 162, .6);
  border-bottom: 3px solid transparent;
  color: #fff; border-radius: 10px;
}
.public-page .tour-hero .tour-link:hover {
  background: var(--brand); border-color: rgba(255, 255, 255, .35);
  border-bottom-color: rgba(255, 255, 255, .5); color: #fff;
}

/* ---------- صفحهٔ تک‌مسابقه: هیرو تمام‌عرض (استاندارد صفحهٔ رویداد مرجع) ---------- */
.public-page .tour-block.is-single .tour-hero,
.public-page .tour-block.is-single .tour-hero.has-poster {
  width: 100%; height: auto; min-height: 420px;
  padding: 26px 24px 20px;
  background-image: linear-gradient(0deg, rgba(16, 20, 53, .9) 0%, rgba(16, 20, 53, .55) 60%, rgba(16, 20, 53, .25) 100%);
}
.public-page .tour-block.is-single .tour-hero.has-poster::before {
  top: 0; left: 0; right: 0; bottom: 0; border-radius: 0;
  filter: none;
}
.public-page .tour-block.is-single .tour-hero.has-poster::after {
  top: 0; left: 0; right: 0; bottom: 0; border-radius: 0;
  background: linear-gradient(0deg, rgba(16, 20, 53, .95) 0%, rgba(16, 20, 53, .35) 70%, transparent 100%);
}
.public-page .tour-block.is-single .tour-hero-main {
  position: relative; bottom: auto; left: auto; right: auto; max-width: none;
  padding: 0;
}
.public-page .tour-block.is-single .hero-media { display: block; }
.public-page .tour-block.is-single .tour-hero .countdown-row,
.public-page .tour-block.is-single .tour-hero .hero-actions,
.public-page .tour-block.is-single .tour-hero .tour-meta-line,
.public-page .tour-block.is-single .tour-hero .tour-contacts { display: flex; }
.public-page .tour-block.is-single .hero-date-badge { display: none !important; }
.public-page .tour-block.is-single .hero-logo-badge { position: static; display: inline-block; margin-bottom: 10px; }
.public-page .tour-block.is-single .hero-title {
  font-size: clamp(1.5rem, 3.4vw, 2.4rem);
  font-weight: 700; line-height: 1.25; max-height: none;
  -webkit-line-clamp: unset; display: block;
}
.public-page .tour-block.is-single .hero-subtitle { font-size: .92rem; max-height: none; }

/* ---------- موبایل: مرجع همیشه ۳۰۰×۳۰۰ می‌ماند و وسط‌چین است ----------
   ⚠️ هیچ override برای عرض کارت در موبایل نداریم — چون عرض ثابت ۳۰۰px خودش
   در گرید یک‌ستونی وسط‌چین می‌شود (عیناً رفتار مرجع در 390px).
   اگر روزی «تمام‌عرض» خواستی: **اول** `place-items: stretch` روی گرید و
   `justify-self: stretch` روی آیتم، **بعد** `width:100%` روی کارت — وگرنه
   آیتم به عرض محتوا جمع می‌شود (باگ ۱۲px). */

/* ==================================================================
   جعبه‌های اطلاعات رویداد — عیناً استاندارد SET Online
   منبع: modern.css → .eventinfobox* (+ اندازه‌گیری DOM)
     .eventinfoboxes  : grid، repeat(auto-fit, minmax(300px,1fr))، gap 1rem، margin 1.5rem
     .eventinfobox    : position relative، margin-bottom 1.5rem
     .eventinfobox>i  : absolute، font-size 35px، background var(--brand)، radius 10px،
                        padding 1rem، width 60px
     .eventinfobox-body   : margin-left 80px
     .eventinfobox-body h5: bold + uppercase + margin-top 2px
     .eventinfobox-detail : margin-left 80px + uppercase + font 13px
   ================================================================== */
.public-page .eventinfoboxes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  justify-content: left;
  place-items: start;
  gap: 1rem;
  margin: 1.5rem 0;
  grid-auto-rows: 1fr;
}
.public-page .eventinfobox { position: relative; margin-bottom: 1.5rem; min-height: 60px; }
.public-page .eventinfobox > i,
.public-page .eventinfobox > a > i {
  position: absolute;
  top: 0; left: 0;
  font-size: 35px;
  line-height: 1;
  padding: 1rem;
  width: 60px; height: 60px;
  border-radius: 10px;
  background: var(--brand);
  text-align: center;
  font-style: normal;
  display: inline-flex; align-items: center; justify-content: center;
}
.public-page .eventinfobox-body { margin-right: 80px; }
.public-page .eventinfobox-body h5 {
  font-weight: 700; font-size: 18px; margin: 2px 0 10px;
  color: #fff; letter-spacing: .2px;
}
.public-page .eventinfobox-detail {
  margin-right: 80px;
  font-size: 13px;
  color: rgba(255, 255, 255, .72);
  word-break: break-word;
}
.public-page .eventinfobox-detail a { color: var(--link); text-decoration: none; }
.public-page .eventinfobox-detail a:hover { text-decoration: underline; }

/* موبایل: جعبه‌ها یک‌ستونی، آیکون کوچک‌تر */
@media (max-width: 560px) {
  .public-page .eventinfoboxes { grid-template-columns: 1fr; gap: .5rem; margin: 1rem 0; }
  .public-page .eventinfobox { margin-bottom: .75rem; }
  .public-page .eventinfobox > i { font-size: 26px; width: 46px; height: 46px; padding: .6rem; }
  .public-page .eventinfobox-body,
  .public-page .eventinfobox-detail { margin-right: 58px; }
}

/* ==================================================================
   یکدست‌سازی: کادرها هم‌ابعاد + حذف کادرهای دور متن
   ──────────────────────────────────────────────────────────────────
   ۱) `.tour-block` کادر قدیمی (border + radius 18 + padding 20) دور هر کارت
      بود → کارت را ۳۴۲px می‌کرد در حالی که خود کارت باید ۳۰۰px باشد.
   ۲) `.meta-pill` و `.tour-link` هر دو کادر دور «نوشته» هستند → کادرشان حذف،
      متن آزاد روی کارت (استاندارد مرجع: نوشته‌ها کادر ندارند).
   ۳) جعبه‌های eventinfobox عرض نامساوی داشتند (۱۷۰/۱۶۹/۲۷۴) → هر جعبه یک
      ستون هم‌عرض گرید می‌شود.
   ================================================================== */
.public-page .tour-block {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: none !important;
}
/* پنل تب‌ها بدون کادر و بدون فاصلهٔ اضافه */
.public-page .tour-block .tab-panel { padding: 16px 0 4px; }

/* ---------- حذف کادرهای دور نوشته ---------- */
.public-page .meta-pill {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
.public-page .meta-pill + .meta-pill { margin-right: 0; }
.public-page .tour-link {
  background: none !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  padding: 6px 2px !important;
  color: var(--link) !important;
}
.public-page .tour-link:hover,
.public-page .tour-link.active {
  background: none !important;
  color: #fff !important;
  border-bottom-color: var(--link) !important;
}
/* جداکنندهٔ بالای لینک‌ها هم برداشته شود (کادر دور گروه نوشته) */
.public-page .tour-block.is-single .tour-links,
.public-page .tour-hero .tour-links { border-top: 0 !important; }
.public-page .wc-title {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.public-page .countdown-box {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
}
.public-page .chip { border: 0 !important; border-bottom: 3px solid transparent !important; border-radius: 0 !important; background: none !important; }
.public-page .chip.active { border-bottom-color: var(--link) !important; color: #fff !important; }
.public-page .tabs { border-bottom: 1px solid var(--border); }
.public-page .tabs .tab {
  background: none !important; border: 0 !important;
  border-bottom: 3px solid transparent !important; border-radius: 0 !important;
}
.public-page .tabs .tab.active { border-bottom-color: var(--link) !important; color: #fff !important; }

/* ---------- جعبه‌های اطلاعات: هر جعبه دقیقاً یک ستون هم‌عرض ---------- */
.public-page .eventinfoboxes {
  grid-auto-rows: auto;
  align-items: start;
}
.public-page .eventinfobox {
  width: 100%;
  min-height: 60px;
  margin-bottom: 0;
  padding: 0;
}
.public-page .eventinfobox-body h5 { margin: 2px 0 6px; }

/* ==================================================================
   محتوای داخل کادر — عیناً استاندارد مرجع
   نقشهٔ عناصر مرجع → ما:
     <time> + .day/.month/.year + .flag  →  .hero-date-badge + .hb-day/.hb-month/.hb-year + .hero-logo-badge
     >img (پس‌زمینه)                     →  .tour-hero.has-poster::before
     .info > h2.title                    →  .tour-hero-text > .hero-title
     .info > p.desc                      →  .hero-desc   (محدودهٔ تاریخ)
     .info > .desc2                      →  .hero-desc2  (نوع رویداد)
     .info > p.label.label-danger        →  .hero-status (وضعیت ثبت‌نام)
   ================================================================== */
.public-page .tour-hero-text {
  max-width: 98%;
}

/* محدودهٔ تاریخ کارت — مرجع: .desc { font-size:11pt; font-weight:300; max-height:90px } */
.public-page .hero-desc {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  color: rgba(255, 255, 255, .88);
  margin: 4px 0 0;
  max-height: 90px;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* نوع رویداد — مرجع: .desc2 { padding:3px 10px; border-radius:5px; background:rgba(93,102,162,.7); font-weight:bold } */
.public-page .hero-desc2 {
  display: inline-block;
  padding: 3px 10px;
  margin-top: 5px;
  border-radius: 5px;
  background: rgba(93, 102, 162, .7);
  font-size: 10.5px;
  font-weight: 700;
  color: #fff;
}
/* وضعیت ثبت‌نام — مرجع: .label.label-danger */
.public-page .hero-status {
  display: inline-block;
  padding: 3px 10px;
  margin: 6px 0 0;
  border-radius: 5px;
  font-size: 10.5px;
  font-weight: 700;
  color: #fff;
  background: rgba(229, 72, 77, .85);
}
.public-page .hero-status-open { background: rgba(62, 207, 142, .85); }

/* لینک‌ها در حالت تک‌مسابقه: بدون کادر، فقط متن + زیرخط نازک */
.public-page .tour-block.is-single .tour-links { border-top: 0 !important; padding-top: 6px; }
.public-page .tour-block.is-single .tour-link {
  background: none !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  padding: 4px 2px !important;
  color: var(--link) !important;
  font-size: 12.5px;
}
.public-page .tour-block.is-single .tour-link:hover,
.public-page .tour-block.is-single .tour-link.active {
  color: #fff !important;
  border-bottom-color: var(--link) !important;
  background: none !important;
}

/* ==================================================================
   کل کادر کلیک‌پذیر — عیناً استاندارد مرجع
   مرجع: img کارت data-toggle="modal" دارد و .info > .title > a به صفحهٔ
   اطلاعات رویداد می‌رود؛ یعنی همه‌جای کادر کلیک‌پذیر است.
   ما هم یک <a> کشیده روی کل کادر می‌گذاریم (z-index بالاتر از محتوا).
   ================================================================== */
.public-page .tour-hero { cursor: pointer; }
.public-page .hero-link {
  position: absolute;
  /* ⚠️ inset:0 روی کارتِ دارای border 1px، ۱px از حاشیه بیرون می‌زند و
     اسکرول‌بار/سرریز می‌سازد (scrollHeight از clientHeight بیشتر می‌شود).
     با فاصلهٔ ۱px داخل حاشیه حل می‌شود. */
  top: 1px; left: 1px; right: 1px; bottom: 1px;
  z-index: 3;                 /* بالاتر از ::before(0) ::after(1) و محتوا(2) */
  border-radius: 9px;
  text-indent: -9999px;
  overflow: hidden;
  display: block;
}
.public-page .tour-hero:hover .hero-link { background: rgba(255, 255, 255, .04); }
/* دکمه‌های داخل کارت باید بالاتر از لینک سراسری باشند تا خودشان کار کنند */
.public-page .tour-block.is-single .tour-hero .hero-actions { position: relative; z-index: 6; }
.public-page .tour-block.is-single .tour-hero .tour-links { position: relative; z-index: 6; }
/* بج‌های گوشه باید از لینک سراسری بالاتر باشند تا کلیک‌پذیر بمانند */
.public-page .hero-date-badge { z-index: 5 !important; }
.public-page .hero-logo-badge { z-index: 5 !important; }
/* فلش « ⟵ » کنار عنوان — به‌درخواست کاربر حذف شد */
.public-page .tour-hero-text .hero-title::after { content: none !important; }

/* عناصر خط تاریخ داخل کارت */
.public-page .hero-desc .hd-item { display: block; }
.public-page .hero-desc .hd-item b { color: #fff; font-weight: 700; }
.public-page .hero-desc .hd-item + .hd-item { margin-top: 2px; }

/* کارت بدون پوستر (مثل مسابقهٔ بدون تصویر) — زمینهٔ تزئینی ملایم به‌جای فضای خالی */
.public-page .tour-hero:not(.has-poster) {
  background-image:
    radial-gradient(120% 90% at 85% 0%, rgba(93, 102, 162, .45), transparent 62%),
    linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #000 100%);
}

/* ==================================================================
   بازچینی کارت مطابق تصویر مرجع (کارت مسابقهٔ اسپانیا)
   ساختار مرجع از تصویر:
     ┌──────────────────────────────┐
     │  [REGISTRATION]   [ 02 ] [OCT] [2026] │  ← وضعیت چپ / بج تاریخ راست
     │                              │
     │      عنوان مسابقه (چند خط)     │  ← میانه
     │                              │
     │  2026.10.02 - 2026.10.03     │  ← پایین: تاریخ رویداد
     │  TOURNAMENT (REG. ENDS ...)  │  ← برچسب نوع
     └──────────────────────────────┘
   ================================================================== */

/* ردیف بالای کارت */
.public-page .hero-top {
  position: absolute;
  top: 10px; left: 10px; right: 10px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  z-index: 3;
}
.public-page .hero-top-right {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
}

/* بج تاریخ — ساختار مرجع: سه خط عمودی (روز / ماه / سال) */
.public-page .hero-date-badge {
  position: static;
  top: auto; right: auto; left: auto;
  width: 62px;
  text-align: center;
  padding: 5px 4px;
  border-radius: 10px;
  background: rgba(93, 102, 162, .85);
  line-height: 1.12;
  box-shadow: 0 3px 12px rgba(0, 0, 0, .45);
}
.public-page .hero-date-badge .hb-day   { display: block; font-size: 24px; font-weight: 300; line-height: 1.05; }
.public-page .hero-date-badge .hb-month { display: block; font-size: 13.5px; font-weight: 600; }
.public-page .hero-date-badge .hb-year  { display: block; font-size: 12.5px; font-weight: 300; opacity: .9; }

/* لوگو کنار بج تاریخ (نه گوشهٔ مقابل) */
.public-page .hero-logo-badge {
  position: static;
  top: auto; left: auto;
  width: 44px; height: 44px;
  border-radius: 10px;
  object-fit: cover;
  background: rgba(0, 0, 0, .35);
  border: 1px solid rgba(255, 255, 255, .18);
  flex: 0 0 auto;
}

/* برچسب وضعیت — بالای کارت، سمت چپ (مثل REGISTRATION مرجع) */
.public-page .hero-status {
  display: inline-block;
  padding: 4px 11px;
  margin: 0;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background: rgba(229, 72, 77, .9);
  box-shadow: 0 3px 12px rgba(0, 0, 0, .4);
  white-space: nowrap;
}
.public-page .hero-status-open { background: rgba(62, 207, 142, .92); }

/* متن کارت: تیتر در میانه، تاریخ‌ها در پایین */
.public-page .tour-hero-main { position: absolute; bottom: 10px; left: 5px; right: 5px; }

/* تاریخ برگزاری — پایین کارت (مثل «2026.10.02 - 2026.10.03» مرجع) */
.public-page .hero-desc {
  font-size: 13.5px;
  font-weight: 500;
  margin: 5px 0 0;
  max-height: none;
  color: #fff;
 }
.public-page .hero-desc .hd-item { display: inline-flex; align-items: center; gap: 6px; }
.public-page .hero-desc i { font-size: 12px; opacity: .85; }

/* مهلت ثبت‌نام — خط سوم پایین کارت */
.public-page .hero-reg {
  margin: 4px 0 0;
  font-size: 11.5px;
  font-weight: 500;
  color: rgba(255, 255, 255, .82);
}
.public-page .hero-reg i { margin-left: 3px; opacity: .85; }
.public-page .hero-reg b { font-weight: 700; color: #fff; }

/* نوع رویداد — زیر تاریخ (مثل «TOURNAMENT» مرجع) */
.public-page .tour-block:not(.is-single) .hero-desc2 {
  display: inline-block;
  margin-top: 6px;
  padding: 3px 10px;
  border-radius: 5px;
  background: rgba(93, 102, 162, .78);
  font-size: 10.5px;
  font-weight: 700;
  color: #fff;
}

/* کارت بدون پوستر: زمینهٔ تزئینی برند */
.public-page .tour-hero:not(.has-poster)::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: 10px;
  background:
    radial-gradient(circle at 78% 12%, rgba(93, 102, 162, .55), transparent 62%),
    linear-gradient(160deg, #2a2d45 0%, #1b1d2e 55%, #141623 100%);
  z-index: 0;
}
.public-page .tour-hero:not(.has-poster)::after { display: none; }

/* ==================================================================
   بج تاریخ با لوگو بالای آن — مطابق ساختار مرجع
   مرجع: <time> [.flag img] [.day] [.month] [.year] </time>
   ابعاد از CSS مرجع: width 80px / padding 5px / border-radius: var(--radius-sm)
     .day   20pt (≈26.67px) weight 300 line-height 1
     .month 14pt (≈18.67px) weight 600 line-height 1
     .year  14pt (≈18.67px) weight 300 line-height 1
     .flag  display:block / margin auto / font-size 24pt
   ================================================================== */
.public-page .hero-date-badge {
  position: static;
  top: auto; right: auto; left: auto;
  width: 80px;
  padding: 5px;
  text-align: center;
  border-radius: 10px;
  background: rgba(93, 102, 162, .7);
  line-height: 1;
  box-shadow: 0 3px 12px rgba(0, 0, 0, .45);
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* لوگو = پرچم مرجع: بالای روز/ماه/سال، وسط‌چین */
.public-page .hero-date-badge .hb-flag {
  display: block;
  width: 100%;
  margin: 0 auto 4px;
  line-height: 1;
}
.public-page .hero-date-badge .hb-flag-img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: 30px;
  object-fit: contain;
  border-radius: 3px;
}
.public-page .hero-date-badge .hb-day   { display: block; font-size: 26.67px; font-weight: 300; line-height: 1; }
.public-page .hero-date-badge .hb-month { display: block; font-size: 18.67px; font-weight: 600; line-height: 1; }
.public-page .hero-date-badge .hb-year  { display: block; font-size: 18.67px; font-weight: 300; line-height: 1; }

/* در حالت تک‌مسابقه لوگو جدا نمایش داده می‌شود (نه داخل بج) */
.public-page .tour-block.is-single .hero-date-badge { display: none !important; }
.public-page .tour-block.is-single .hero-logo-badge {
  position: static; display: inline-block; margin-bottom: 10px;
  width: 48px; height: 48px; object-fit: cover; border-radius: 10px;
}

/* ==================================================================
   نوار شمارش معکوس سبز داخل کارت — سبک «REG. END 3 DAYS 9 HOURS» مرجع
   از تصویر مرجع: عرض ≈۴۴٪ کارت (۱۳۳px در ۳۰۰px)، ارتفاع ≈۲۸px، رنگ #78ba7c
   ================================================================== */
.public-page .hero-countdown {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  padding: 5px 10px;
  border-radius: 5px;
  background: rgba(120, 186, 124, .92);
  color: #10240f;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}
.public-page .hero-countdown i { font-size: 10.5px; opacity: .9; }
.public-page .hero-countdown-done { background: rgba(229, 72, 77, .9); color: #fff; }

/* ==================================================================
   دکمهٔ ثبت‌نام — عیناً طرح مرجع (.card2 + .service-icon)
   ── مرجع (modern.css):
      .card2                padding:22px / min-height:100px / border-radius:10px / border بنفش
      .card2 .service-icon  width:60px / height:30px / line-height:30px / radius:10% /
                            margin:4px / font-size:30px / color:#fff / مرکزچین
      .card2 > a            font-size:10px
      .card2:hover          حاشیهٔ روشن‌تر + گرادیان برند
   ================================================================== */
.public-page .btn-reg-ref {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  /* ابعاد از تصویر کاربر: مستطیل 128x102 با نسبت 1.25 → ۱۶۰x۱۲۷px واقعی */
  width: 160px;
  min-height: 127px;
  padding: 16px 12px;
  border-radius: 10px;
  border: 1px solid rgba(93, 102, 162, .5);
  background: var(--panel, #1c1d26);
  color: #fff;
  text-decoration: none;
  text-align: center;
  transition: background .18s ease, border-color .18s ease;
}
.public-page .btn-reg-ref:hover {
  border-color: rgba(255, 255, 255, .30);
  background: linear-gradient(to bottom, transparent 50%, rgba(93, 102, 162, .5) 100%);
  color: #fff;
  transform: none;
  filter: none;
}
/* آیکون — ابعاد دقیق service-icon مرجع */
.public-page .btn-reg-ref .service-icon {
  /* نسبت تصویر کاربر: آیکون ۳۱px در دکمهٔ ۱۲۸px = ۲۴٪ → در ۱۶۰px می‌شود ۴۲px */
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 10%;
  margin: 0;
  font-size: 36px;
  color: #fff;
  text-align: center;
  flex: 0 0 auto;
}
/* متن دکمه — اندازهٔ .card2 > a مرجع */
.public-page .btn-reg-ref .reg-label {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
}
/* دکمهٔ فرم ثبت‌نام: همان طرح ولی عرض کامل */
.public-page .reg-submit-btn.btn-reg-ref {
  width: 100%;
  min-height: 0;
  padding: 16px;
  margin-top: 6px;
  flex-direction: row;
  gap: 10px;
}
.public-page .reg-submit-btn.btn-reg-ref .service-icon {
  width: 30px;
  height: 30px;
  line-height: 30px;
  font-size: 26px;
  margin: 0;
}
.public-page .reg-submit-btn.btn-reg-ref .reg-label { font-size: 1.05rem; font-weight: 700; }

/* ==================================================================
   لوگوی بالای تاریخ — بزرگ‌تر (درخواست کاربر)
   قبلاً ۳۰px بود → الان ۴۲px با عرض بیشتر
   ================================================================== */
.public-page .hero-date-badge {
  width: 92px;
  padding: 6px 5px 7px;
}
.public-page .hero-date-badge .hb-flag { margin: 0 auto 5px; }
.public-page .hero-date-badge .hb-flag-img {
  height: 42px;
  max-width: 80px;
  width: auto;
  object-fit: contain;
  border-radius: 4px;
}

/* ==================================================================
   ⚠️ باگ: دکمهٔ داخل کارت زیر «لینک سراسری کادر» می‌ماند
   ── علت: .tour-hero-main خودش position:absolute + z-index:2 دارد و یک
      **context انباشت** می‌سازد؛ پس z-index دکمهٔ داخلش (۶) فقط داخل همان
      context معنا دارد و هرگز از hero-link (z-index:3، خواهرش) بالاتر نمی‌رود.
   ── راه‌حل: برای حالت لیست (که hero-link وجود دارد):
      • .tour-hero-main را به z-index:4 می‌بریم (بالای hero-link)
      • pointer-events:none می‌دهیم تا کلیک‌های متن از آن عبور کنند و
        همچنان به hero-link (کل کادر کلیک‌پذیر) برسند
      • فقط عناصر تعاملی pointer-events:auto می‌گیرند تا خودشان کار کنند
   در حالت تک‌مسابقه (hero-link وجود ندارد) هیچ تغییری اعمال نمی‌شود.
   ================================================================== */
.public-page .tour-block:not(.is-single) .tour-hero-main {
  z-index: 4;
  pointer-events: none;
}
.public-page .tour-block:not(.is-single) .tour-hero-main a,
.public-page .tour-block:not(.is-single) .tour-hero-main button,
.public-page .tour-block:not(.is-single) .tour-hero-main .btn {
  pointer-events: auto;
}
/* دکمهٔ ثبت‌نام کارت: بالاتر از همه چیز داخل کارت */
.public-page .btn-reg-hero-card { z-index: 7 !important; }

/* ==================================================================
   دکمهٔ ثبت‌نام جای بج «ثبت‌نام باز» — بالای کارت، سمت چپ
   ابعاد نسبت به بج قبلی (66x25) ولی با آیکون بالای متن (طرح مرجع)
   ================================================================== */
/* ---------- رنگ از تصویر کاربر: بدون پس‌زمینهٔ سبز، متن/آیکون سفید ----------
   در تصویر کاربر، داخل دکمه همان رنگ کارت است (rgb(45,31,56)) و فقط
   آیکون و متن سفید (#fbfbfc) دیده می‌شود → دکمه با پس‌زمینهٔ نیمه‌شفاف تیره
   و حاشیهٔ نازک، تا مثل تصویر «کادر نامرئی با محتوای سفید» دیده شود.
   اندازه: بزرگ‌تر (۱۰۰×۸۶ در برابر ۶۸×۴۴ قبلی) و مربعی‌تر. */
.public-page .btn-reg-card.btn-reg-ref {
  width: auto;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 6px 12px 8px;
  border-radius: 8px;
  border: 1px solid rgba(93, 102, 162, .45);
  /* پس‌زمینه: بالا بنفش برند (مثل بج تاریخ: rgba(93,102,162,.7))
     و پایین تیره — همان گرادیان کارت‌های مرجع */
  background: linear-gradient(to bottom, rgba(93, 102, 162, .72) 0%, rgba(20, 22, 35, .92) 100%);
  color: #fff;
  box-shadow: 0 3px 14px rgba(0, 0, 0, .45);
  position: relative;
  z-index: 7;
  transition: border-color .16s ease, background .16s ease;
}
.public-page .btn-reg-card.btn-reg-ref:hover {
  border-color: rgba(255, 255, 255, .45);
  background: linear-gradient(to bottom, rgba(110, 120, 185, .85) 0%, rgba(30, 33, 52, .95) 100%);
  color: #fff;
}
.public-page .btn-reg-card.btn-reg-ref .service-icon {
  /* آیکون بزرگ (≈۵۱px در مقیاس کارت ۳۰۰px) */
  width: 52px;
  height: 52px;
  line-height: 52px;
  font-size: 46px;
  margin: 0;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .7);
}
.public-page .btn-reg-card.btn-reg-ref .reg-label {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .75);
}

/* ==================================================================
   ⚠️ ردیف بالای کارت (.hero-top) با hero-link هم‌تراز است
   .hero-top فقط z-index پایه (خودکار) داشت → لینک سراسری (z-index:3) رویش بود
   و دکمهٔ ثبت‌نام کلیک‌پذیر نمی‌شد (elementFromPoint → hero-link).
   راه‌حل: .hero-top را به z-index:4 و pointer-events:none می‌بریم
   (مثل .tour-hero-main) و فقط عناصر تعاملی داخلش کلیک می‌گیرند.
   ================================================================== */
.public-page .hero-top { z-index: 4; pointer-events: none; }
.public-page .hero-top a,
.public-page .hero-top button,
.public-page .hero-top .btn-reg-card { pointer-events: auto; }
.public-page .btn-reg-card { z-index: 7 !important; }

/* ==================================================================
   لوگو: فقط خودِ لوگو دیده شود (حذف حاشیهٔ سفید) + شکل خودکار
   ── پس‌زمینهٔ سفیدِ PNG در سرور با flood-fill حذف می‌شود (logo_meta)
   ── شکل از گوشه‌های محتوا تشخیص داده می‌شود:
        .shape-circle → دایره‌ای کلیپ می‌شود
        .shape-square → مربعی می‌ماند
   ================================================================== */
.public-page .hb-flag-img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: 44px;
  width: auto;
  object-fit: contain;
  /* ⚠️ حاشیه و پس‌زمینه حذف شد تا فقط خودِ لوگو دیده شود */
  background: transparent;
  border: 0;
  border-radius: 0;
  /* ⚠️ هیج box-shadow/filter نباشد — وگرنه «حاشیه» دیدہ می‌شود */
  box-shadow: none;
  filter: none;
  padding: 0;
}
/* شکل دایره‌ای */
.public-page .hb-flag-img.shape-circle { border-radius: 50%; }
/* شکل مربعی */
.public-page .hb-flag-img.shape-square { border-radius: 4px; }

/* لوگوی سربرگ صفحهٔ مسابقه */
.public-page .tour-hero-logo {
  height: 46px;
  width: auto;
  max-width: 90px;
  object-fit: contain;
  background: transparent;
  border: 0;
  box-shadow: none;
  vertical-align: middle;
  margin-left: 6px;
}
.public-page .tour-hero-logo.shape-circle { border-radius: 50%; }
.public-page .tour-hero-logo.shape-square { border-radius: 6px; }

/* لوگوی صفحهٔ آرشیو */
.public-page .arch-logo {
  background: transparent;
  border: 0;
  box-shadow: none;
  object-fit: contain;
}
.public-page .arch-logo.shape-circle { border-radius: 50%; }
.public-page .arch-logo.shape-square { border-radius: 6px; }

/* ==================================================================
   درخواست‌های کاربر:
   ۱) فاصلهٔ بیشتر بین خطوط تاریخ زیر لوگو
   ۲) عنوان مسابقه در یک خط جا شود (دو خط نشود)
   ================================================================== */

/* ---------- ۱) فاصلهٔ خطوط بج تاریخ ---------- */


/* ---------- ۲) عنوان مسابقه: یک خط، بدون شکستن ---------- */
.public-page .tour-block:not(.is-single) .hero-title {
  font-size: 18.67px;
  line-height: 20.53px;
  /* یک خط: بدون wrap + کوچک‌شدن خودکار متن اگر بلند بود */
  display: block;
  -webkit-line-clamp: unset;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: none;
  min-width: 0;
}
/* اگر مرورگر از font-size: clamp پشتیبانی می‌کند، متن بلند خودکار کوچک شود */
@supports (font-size: clamp(1px, 1vw, 2px)) {
  .public-page .tour-block:not(.is-single) .hero-title {
    white-space: normal;                       /* اجازهٔ کوچک‌شدن با wrap داخلی */
    overflow: hidden;
    text-overflow: unset;
    display: -webkit-box;
    -webkit-line-clamp: 1;                     /* فقط یک خط */
    -webkit-box-orient: vertical;
    line-clamp: 1;
  }
}

/* ==================================================================
   فاصلهٔ بیشتر بین خطوط تاریخ (درخواست کاربر: «یه کوچولو باید از هم فاصله داشته باشن»)
   اندازه‌گیری قبلی: gap = ۲px بین روز↔ماه و ماه↔سال
   ================================================================== */


/* ==================================================================
   سه اصلاح طبق درخواست کاربر
   ================================================================== */

/* ---------- ۱) فاصلهٔ خطوط تاریخ: حداقل (گام ۰، line-height ۱) ---------- */
.public-page .hero-date-badge { gap: 0; padding: 6px 5px 6px; }
.public-page .hero-date-badge .hb-flag { margin: 0 auto 5px; }
.public-page .hero-date-badge .hb-day,
.public-page .hero-date-badge .hb-month,
.public-page .hero-date-badge .hb-year { line-height: 1; margin: 0; padding: 0; }

/* ---------- ۲) عنوان در یک خط، کامل — فونت خودتنظیم ----------
   ⚠️ به‌جای ellipsis و clamp، با JS فونت کوچک می‌شود تا متن کامل بماند
   (data-fit-title در قالب). JS در app.js: initFitTitles()
*/
.public-page .tour-block:not(.is-single) .hero-title {
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  -webkit-box-orient: initial !important;
  max-height: none !important;
  font-size: 18.67px;              /* اندازهٔ پایه؛ JS در صورت لزوم کوچک می‌کند */
  line-height: 1.15;
  min-width: 0;
  max-width: 100%;
}

/* ---------- ۳) زیرنویس مسابقه در کارت ---------- */
.public-page .hero-subtitle-card {
  margin: 3px 0 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  color: rgba(255, 255, 255, .78);
  text-shadow: 0 1px 4px rgba(0, 0, 0, .75);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}


/* ==================================================================
   جلوگیری از افتادن عنوان مسابقه روی کادر تاریخ
   ── کادر تاریخ (hero-top) بالای کارت است و عنوان در tour-hero-main
      (پایین کارت) قرار دارد. اگر عنوان بلند باشد یا زیرنویس اضافه شود،
      ممکن است به کادر تاریخ نزدیک/روی آن برود.
   ── راه‌حل:
      • عرض بلوک متن به اندازه‌ای کم می‌شود که از کادر تاریخ فاصله بگیرد
        (کادر تاریخ ۹۲px در گوشهٔ راست-بالا با margin)
      • اگر ارتفاع محتوا زیاد شد، فاصلهٔ پایین کارت کم می‌شود (نه بالا رفتن)
   ================================================================== */
.public-page .tour-block:not(.is-single) .tour-hero-main {
  /* فاصلهٔ امن از لبهٔ راست اندازه‌ی کادر تاریخ: از سمت راست جمع می‌شود */
  justify-content: flex-end;
}
/* اگر متن به کادر تاریخ نزدیک شد، پدینگ راست اضافه کن (کادر تاریخ در راست-بالا) */
.public-page .tour-block:not(.is-single) .tour-hero-text {
  max-width: 100%;
  min-width: 0;
}
/* بج تاریخ همیشه بالاتر از متن بماند */
.public-page .hero-top { z-index: 6; }
.public-page .tour-block:not(.is-single) .tour-hero-main { z-index: 4; }

/* ⚠️ رفع سرریز ۵px کارت در موبایل (scrollWidth 303 در برابر clientWidth 298)
   علت: بج تاریخ ۹۲px + حاشیهٔ ۱px + دکمهٔ ثبت‌نام در عرض ۳۰۰px با padding 11px
   → ۱۱ + ۹۲ + فاصله + دکمه = بیشتر از ۲۷۸px داخلی.
   راه‌حل: در موبایل بج تاریخ کمی باریک‌تر و دکمه کوچک‌تر شود. */
@media (max-width: 480px) {
  .public-page .tour-hero .hero-top { gap: 6px; }
  .public-page .tour-hero .hero-date-badge { min-width: 84px; }
  .public-page .tour-hero .reg-label { font-size: 12px; }
  .public-page .tour-hero .tour-hero { overflow: hidden; }
  /* جلوگیری قطعی از سرریز افقی در کارت */
  .public-page .tour-hero,
  .public-page .tour-hero .tour-hero-main,
  .public-page .tour-hero .hero-top {
    max-width: 100%;
    overflow-x: hidden;
  }
}

/* ⚠️ رفع قطعی سرریز ۵px در کارت (scrollWidth 303 در برابر clientWidth 298)
   علت: شبه‌عنصر .tour-hero:not(.has-poster)::before با inset:1px و
   radial-gradient عرض کارت را ۵px بیشتر از محتوا می‌کند. چون محتوا
   فضای scroll تولید می‌کند، scrollWidth از clientWidth بیشتر می‌شود.
   راه‌حل: حذف overflow و صریح‌کردن box-sizing + عرض شبه‌عنصر. */
.public-page .tour-hero {
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.public-page .tour-hero:not(.has-poster)::before,
.public-page .tour-hero.has-poster::before,
.public-page .tour-hero.has-poster::after {
  box-sizing: border-box !important;
  max-width: 100% !important;
}
/* در موبایل: حذف کامل هر منبع سرریز افقی در کارت */
@media (max-width: 600px) {
  .public-page .tour-hero,
  .public-page .tour-hero * {
    max-width: 100%;
  }
  .public-page .tour-hero .hero-top { gap: 5px; }
  .public-page .tour-hero .hero-date-badge { min-width: 0; width: 84px; }
  .public-page .tour-hero .btn-reg-card { flex: 0 1 auto; }
}

/* ⚠️ علت واقعی سرریز: نام ماه میلادی («November») در بج ۸۴px جا نمی‌شود
   → hb-month سرریز ۶-۱۲px می‌کرد و کل کارت scrollWidth اضافه می‌گرفت.
   راه‌حل: نام ماه با ellipsis + فونت کوچک‌تر در موبایل. */
.public-page .tour-hero .hb-month {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}
@media (max-width: 600px) {
  .public-page .tour-hero .hb-month { font-size: 10.5px; letter-spacing: -0.2px; }
  .public-page .tour-hero .hb-day { font-size: 19px; }
  .public-page .tour-hero .hb-year { font-size: 10.5px; }
  .public-page .tour-hero .hero-date-badge { width: 86px; padding: 0 3px; }
}


/* روزشمار پویا: در گرهٔ جدا تا i18n.js بتواند ترجمه‌اش کند
   (اگر با برچسب در یک گره باشد، «متن مختلط» می‌شود و ترجمه نمی‌شود) */
.cd-dyn, .hero-countdown .cd-dyn { display: inline; }



/* ==================================================================
   ⚠️ جای قطعی لوگو/بج تاریخ در کارت — **همیشه چپ فیزیکی، در هر زبان**
   ── درخواست کاربر: «لوگو و تاریخ همون سمت چپ کارت باشن، جاشون رو عوض نکن»

   چرا راه‌های قبلی شکست خوردند:
     ۱) margin-inline/auto → در RTL درست، در LTR بج به راست می‌رفت
     ۲) order + direction:ltr → در LTR درست، در RTL بج وسط می‌افتاد

   ✅ راه قطعی: پین **فیزیکی** با position:absolute — به هیچ منطق RTL/LTR
      وابسته نیست:
         بج تاریخ/لوگو → left: 0   (چپ همهٔ زبان‌ها)
         دکمه          → right: 0  (راست همهٔ زبان‌ها)
      و min-height روی ظرف تا ارتفاع بج (۱۲۳px) حفظ شود.
   ================================================================== */
.public-page .tour-hero .hero-top {
  position: absolute;          /* از قبل بود — تأکید */
  justify-content: flex-start;
  align-items: flex-start;
}
/* بج تاریخ + لوگو → چپ فیزیکی */
.public-page .tour-hero .hero-top > .hero-top-right {
  position: absolute;
  left: 0;
  top: 0;
  margin: 0;
  order: 0;
}
/* دکمه (ثبت‌نام یا لایو) → راست فیزیکی */
.public-page .tour-hero .hero-top > .btn-reg-card,
.public-page .tour-hero .hero-top > .btn-live-card {
  position: absolute;
  right: 0;
  top: 0;
  left: auto;
  margin: 0;
  order: 0;
}
/* ارتفاع ظرف = ارتفاع بج تاریخ (۹۲ عرض / ۱۲۳ ارتفاع) تا absolute ها فضا داشته باشند */
.public-page .tour-hero .hero-top:has(> .hero-top-right > .hero-date-badge) { min-height: 123px; }
.public-page .tour-hero .hero-top:has(> .hero-top-right > .hero-date-badge) ~ .tour-hero-main { margin-top: 133px; }
/* بدون بج تاریخ، ارتفاع کم (فقط دکمه) */
.public-page .tour-hero .hero-top { min-height: 0; }


/* ایموجی پخش زنده — به‌جای آیکون فونت (قابل تغییر از app.py → LIVE_EMOJI) */
.public-page .tour-hero .btn-live-card .live-ring.live-emoji {
  font-size: 19px;
  line-height: 1;
  background: transparent;
  width: auto;
  height: auto;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
}
.public-page .tour-hero .btn-live-card {
  padding: 5px 8px;
  width: auto;
  height: auto;
  justify-content: center;
}

/* ==================================================================
   آیکون پخش زنده در کارت مسابقه (حالت live) — **بالا سمت راست**
   ── آیکون: fa-rss (همان آیکون «Live Activity Blog» سایت مرجع SET Online)
   ── تطبیق قالب با تصویر کاربر: IoU 0.803 از ۲۰۶۱ آیکون
   ── جای دکمهٔ ثبت‌نام می‌نشیند (راست فیزیکی کارت)
   ================================================================== */
.public-page .tour-hero .btn-live-card {
  /* ⚠️ پین فیزیکی راست — هم‌جای دکمهٔ ثبت‌نام (بج تاریخ چپ می‌ماند) */
  position: absolute;
  top: 0;
  right: 0;
  left: auto;
  z-index: 4;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #c62828 0%, #8e1b1b 100%);
  border: 1px solid rgba(255, 120, 120, .55);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 3px 12px rgba(198, 40, 40, .5);
  transition: transform .18s ease, box-shadow .18s ease;
  pointer-events: auto;
}
.public-page .tour-hero .btn-live-card i {
  font-size: 17px;
  line-height: 1;
  color: #fff;
}
.public-page .tour-hero .btn-live-card:hover {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 5px 16px rgba(198, 40, 40, .68);
  color: #fff;
}
/* نبض قرمز — نشانهٔ «زنده» */
.public-page .tour-hero .btn-live-card .live-pulse {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff5252;
  box-shadow: 0 0 0 0 rgba(255, 82, 82, .85);
  animation: livePulse 1.6s infinite;
}
@keyframes livePulse {
  0%   { box-shadow: 0 0 0 0 rgba(255, 82, 82, .85); }
  70%  { box-shadow: 0 0 0 8px rgba(255, 82, 82, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 82, 82, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .public-page .tour-hero .btn-live-card .live-pulse { animation: none; }
  .public-page .tour-hero .btn-live-card { transition: none; }
}
@media (max-width: 480px) {
  .public-page .tour-hero .btn-live-card { width: 34px; height: 34px; }
  .public-page .tour-hero .btn-live-card i { font-size: 14px; }
}

/* ── متن «در حال برگزاری مسابقات» زیر کارت (روز مسابقه) ──
   جای «مهلت ثبت‌نام تمام شد» می‌نشیند و سبز زنده است */
.public-page .tour-hero .hero-countdown.hero-countdown-live {
  color: #7fe4b3;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.public-page .tour-hero .hero-countdown.hero-countdown-live i {
  color: #ff5252;
  animation: livePulseDot 1.6s infinite;
}
@keyframes livePulseDot { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) {
  .public-page .tour-hero .hero-countdown.hero-countdown-live i { animation: none; }
}




/* ==================================================================
   شروع و پایان مسابقات در کارت
   ── تک‌تاریخی: آیکون تقویم + تاریخ
   ── چندروزه : 🔵 شروع (play) + 🏁 پایان (flag) در دو خط
   ================================================================== */
.public-page .hero-desc .hd-item.hd-start { display: block; }
.public-page .hero-desc .hd-item.hd-end { display: block; }
.public-page .hero-desc .hd-item.hd-start i {
  color: #78ba7c;          /* سبز شمارشی برند — شروع */
  font-size: 10px;
  margin-left: 2px;
}
.public-page .hero-desc .hd-item.hd-end i {
  color: #e0a24a;          /* کهربایی — پایان */
  font-size: 10px;
  margin-left: 2px;
}
.public-page .hero-desc .hd-item.hd-start + .hd-item.hd-end { margin-top: 1px; }

/* ==================================================================
   متن «مسابقات تمام شده است» — رنگ جذاب و خوانا
   ── درخواست کاربر: «یه رنگ جذاب و خوانا باشه، به پایان مسابقات بخوره»

   طراحی: گرادیان کهربایی→طلایی (نماد پایان/جام) + درخشش ملایم
   دلیل انتخاب: کهربایی/طلایی معنی «پایان و نتیجه» می‌دهد (مدال، جام)،
   روی زمینهٔ تیرهٔ کارت کنتراست ۷:۱+ دارد و از رنگ‌های
   سبز (لایو) و بنفش (ثبت‌نام) کاملاً متمایز است.
   ================================================================== */
.public-page .tour-hero .hero-countdown.hero-countdown-ended {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .2px;
  /* گرادیان کهربایی→طلایی */
  background: linear-gradient(90deg, #f0b24a 0%, #ffd479 45%, #e8a13a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #f5c064;               /* fallback برای مرورگرهای قدیمی */
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .85));
  /* ⚠️ text-shadow روی متن گرادیانتی کار نمی‌کند → drop-shadow */
}
.public-page .tour-hero .hero-countdown.hero-countdown-ended i {
  -webkit-text-fill-color: #e8a13a;
  color: #e8a13a;
  font-size: 12px;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .85));
}
/* نشان کوچک «تمام‌شده» — کادر کهربایی ملایم دور متن */
.public-page .tour-hero .hero-countdown.hero-countdown-ended::before {
  content: none;
}
/* نسخهٔ موبایل — کمی کوچک‌تر */
@media (max-width: 480px) {
  .public-page .tour-hero .hero-countdown.hero-countdown-ended { font-size: 12px; gap: 5px; }
}


/* ══════════════════════════════════════════════════════════════════════════
   رفع: روزشمار پایین کارت بریده می‌شد
   ── کارت ۳۰۰×۳۰۰ با overflow:hidden است و محتوای متن ۱۶۹px ارتفاع داشت
      در حالی که فقط ۱۴۸px فضا بود → روزشمار ۱۰px بیرون می‌افتاد و بریده می‌شد.
   ── ریشه: `hero-reg` («مهلت ثبت‌نام: تاریخ») و روزشمار («۲۷ روز ۲۱ ساعت»)
      یک اطلاعات را دوبار نشان می‌دادند.
   ══════════════════════════════════════════════════════════════════════════ */

/* ۱) در کارت لیست، خط «مهلت ثبت‌نام» حذف — روزشمار همان را دقیق‌تر می‌دهد */
.public-page .tour-block:not(.is-single) .tour-hero .hero-reg { display: none; }

/* ۲) روزشمار: هرگز بریده نشود — فشرده‌تر و با فاصلهٔ امن از پایین کارت */
.public-page .tour-block:not(.is-single) .tour-hero .hero-countdown {
  margin-top: 5px;
  padding: 4px 9px;
  font-size: 10.5px;
  max-width: 100%;
  flex-wrap: nowrap;
}
.public-page .tour-block:not(.is-single) .tour-hero .hero-countdown .cd-dyn {
  white-space: nowrap;
}

/* ۳) فضای امن پایین متن کارت — روزشمار کامل جا شود */
.public-page .tour-block:not(.is-single) .tour-hero .tour-hero-text {
  padding-bottom: 2px;
}
/* عنوان کارت کمی فشرده‌تر تا فضای بیشتری برای روزشمار بماند */
.public-page .tour-block:not(.is-single) .tour-hero .hero-title {
  line-height: 19.5px;
  max-height: 78px;
}

/* ۴) در نمای تک‌مسابقه (کارت بزرگ) روزشمار درشت‌تر می‌ماند */
.public-page .tour-block.is-single .tour-hero .hero-countdown {
  font-size: 12.5px;
  padding: 6px 12px;
}

/* ۵) موبایل: کارت باریک‌تر → روزشمار شکسته نشود */
@media (max-width: 420px) {
  .public-page .tour-block:not(.is-single) .tour-hero .hero-countdown {
    font-size: 10px;
    padding: 4px 8px;
    gap: 4px;
  }
}