/* ==========================================================================
   Radia — استایل ویجت‌های Custom-HTML صفحه محصول (استخراج‌شده از المنتور)
   منبع: بازبینی فنی ۳ سپتامبر ۲۰۲۶ — «فایل‌بندی نهایی» (گزینه A)
   به‌روزرسانی ۵ سپتامبر ۲۰۲۶ (اول): بخش‌های ۱ تا ۵ ادغام شدند (هر جفت
   دسکتاپ/موبایل به یک ویجت واحد و واکنش‌گرا تبدیل شد؛ به تایید کاربر).
   بخش ۶ (نمایش بیشتر) بدون تغییر باقی مانده.
   به‌روزرسانی ۵ سپتامبر ۲۰۲۶ (دوم — رفع باگ گزارش‌شده روی سایت زنده):
   تداخل CSS با استایل پیش‌فرض دکمه‌های تم وودمارت (base-rtl.css) رفع شد —
   سلکتورهای مربوط به تگ‌های <button> واقعی (copy-sku-btn، radia-share-close،
   radia-order-close) با پیشوند «button.» specificity بالاتری گرفتند تا
   صرف‌نظر از ترتیب لود فایل‌ها همیشه برنده باشند؛ یک قانون هاور اختصاصی هم
   به دکمه‌ی «نمایش بیشتر» اضافه شد تا رنگ آبی‌اش روی هاور خنثی نشود؛ و
   min-height:0 به دکمه‌های وضعیت کالا اضافه شد تا کف ارتفاع ۴۲px تم روی
   ارتفاع طراحی‌شده‌ی ۳۲/۳۸px اثر نگذارد. هیچ مقدار طراحی تغییر نکرده.
   به‌روزرسانی ۵ سپتامبر ۲۰۲۶ (سوم — درخواست کاربر): روی موبایل، دکمه‌ی
   «تماس سریع با فروشگاه» (بخش ۵، اندازه‌گیری سیال با clamp) و دکمه‌ی
   «سفارش از طریق پیام‌رسان‌ها» (بخش ۴، اندازه‌ی ثابت) که زیر هم قرار
   می‌گیرند هم‌ارتفاع نبودند؛ در یک media query موبایل، پدینگ/فونت/فاصله‌ی
   بین دو خط دکمه‌ی «تماس سریع» با مقادیر ثابت دکمه‌ی «سفارش» یکی شد.
   ظاهر دسکتاپ هیچ‌کدام تغییر نکرد.
   به‌روزرسانی ۵ سپتامبر ۲۰۲۶ (چهارم — درخواست کاربر): در پاپ‌آپ سفارش
   (radia-order-title) عنوان وسط‌چین به دکمه‌ی ضربدر بستن (absolute، گوشه‌ی
   چپ-بالا) خیلی نزدیک/چسبیده بود، چون آخرین کلمه‌ی جمله‌ی فارسی (سمت چپ)
   دقیقاً همان‌جا قرار می‌گیرد. یک padding افقی متقارن (26px از هر طرف) به
   عنوان اضافه شد تا از دکمه فاصله بگیرد، بدون به‌هم‌خوردن تقارن وسط‌چین.
   طبق درخواست کاربر («هر سه مثل هم»)، همین فیکس به radia-share-title همین
   فایل و radia-share-v3-title در blog-post-widgets.css هم اعمال شد.
   ========================================================================== */

/* ---------- 1. وضعیت کالا (ادغام‌شده — دسکتاپ+موبایل/تبلت) — ID: radia-type-wrapper ---------- */
#radia-type-wrapper {
  --brand: #2471A3; --btn-h: 32px; --btn-pad: 6px 16px; --btn-fs: 13px; --btn-minw: 70px; --gap: 10px;
  direction: rtl; font-family: inherit; margin-bottom: 20px;
}
#radia-type-wrapper .radia-type-label { font-weight: 600; color: #333; margin-bottom: 6px; font-size: 14px; font-family: inherit; }
#radia-type-wrapper .radia-type-buttons { display: flex; gap: var(--gap); flex-wrap: wrap; align-items: center; }
#radia-type-wrapper .radia-type-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: var(--btn-pad); font-size: var(--btn-fs); font-weight: 500; font-family: inherit;
  border: 2px solid #ccc; border-radius: 10px; background: #fff; color: #333; cursor: pointer;
  min-width: var(--btn-minw); height: var(--btn-h); min-height: 0;
  transition: border-color 0.2s ease, background-color 0.2s ease;
  user-select: none; white-space: nowrap; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
#radia-type-wrapper .radia-type-btn:hover,
#radia-type-wrapper .radia-type-btn.radia-active { border-color: var(--brand); background-color: #f9f9f9; }
#radia-type-wrapper .radia-type-btn.radia-oos { opacity: 0.4; cursor: not-allowed; border-color: #ccc !important; background: #f5f5f5 !important; pointer-events: none; }
#radia-type-wrapper .radia-color-square { display: inline-block; width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0; }
#radia-type-wrapper .radia-gold { background: #f4b400; }
#radia-type-wrapper .radia-silver { background: #c0c0c0; }
#radia-type-wrapper .radia-bronze { background: #cd7f32; }

/* نسخه‌ی موبایل/تبلت (قبلاً radia-type-wrapper-mobile) — دکمه‌های بزرگ‌تر برای لمس */
@media (max-width: 1024px) {
  #radia-type-wrapper {
    --btn-h: 38px; --btn-pad: 8px 18px; --btn-fs: 14px; --btn-minw: 80px; --gap: 8px;
    margin-bottom: 16px;
  }
  #radia-type-wrapper .radia-type-label { font-size: 15px; margin-bottom: 8px; }
  #radia-type-wrapper .radia-color-square { width: 11px; height: 11px; }
}

/* ---------- 2. اشتراک‌گذاری (ادغام‌شده — دسکتاپ+موبایل/تبلت) — id: radia-share-trigger ---------- */
/* ─── دکمه: عیناً مطابق سایز و ساختار radia-report-btn (44×44، padding:0) ─── */
.radia-share-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    position: relative !important;
    transition: none !important;
    transform: none !important;
}
.radia-share-btn:hover,
.radia-share-btn:active,
.radia-share-btn:focus {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    outline: none !important;
}
.radia-share-btn img {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    pointer-events: none !important;
    object-fit: contain !important;
    opacity: 1;
    transition: opacity 0.18s ease !important;
}
.radia-share-btn:hover img {
    opacity: 0.7 !important;
}

/* ─── tooltip: همون مکانیزم دکمه گزارش (aria-label + ::after) ─── */
.radia-share-btn[aria-label]::after {
    content: attr(aria-label);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: #1a1a1a;
    color: #fff;
    font-size: 12px;
    font-family: 'IRANYekanXVF', Tahoma, Arial, sans-serif;
    white-space: nowrap;
    padding: 5px 10px;
    border-radius: 6px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.18s ease;
    z-index: 10;
    direction: rtl;
}
.radia-share-btn[aria-label]:hover::after {
    opacity: 1;
}
@media (hover: none) {
    .radia-share-btn[aria-label]::after {
        display: none !important;
    }
}

.radia-share-popup {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 999999;
  overflow-y: auto;
}
.radia-share-popup-inner {
  width: min(92%, 420px);
  background: #FFFFFF;
  margin: 18vh auto;
  padding: clamp(20px, 5vw, 28px);
  border-radius: 14px;
  text-align: center;
  box-sizing: border-box;
  direction: rtl;
  position: relative;
}
button.radia-share-close {
  position: absolute;
  top: 12px;
  left: 14px;
  background: none;
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: #555;
  line-height: 1;
}
.radia-share-title {
  font-size: clamp(15px, 4vw, 17px);
  font-weight: 700;
  margin-bottom: 18px;
  color: #1B4F72;
  padding: 0 26px;
}
.radia-share-item {
  display: flex;
  align-items: center;
  gap: clamp(8px, 3vw, 12px);
  padding: clamp(10px, 3vw, 12px) 14px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: #F6F8FC;
  color: #1B4F72;
  text-decoration: none;
  font-weight: 600;
  font-size: clamp(14px, 3.5vw, 15px);
  border: 1px solid #C0C8D0;
  transition: background 0.2s ease;
  direction: rtl;
  cursor: pointer;
}
.radia-share-item:hover {
  background: #E0E0E0;
}
.radia-share-item img {
  width: clamp(22px, 6vw, 26px);
  height: clamp(22px, 6vw, 26px);
  flex-shrink: 0;
}
.radia-share-toast {
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: #1B4F72;
  color: #fff;
  padding: 10px 22px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 9999999;
  white-space: nowrap;
}
.radia-share-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
@media (max-width: 600px) {
  .radia-share-popup-inner {
    width: 90%;
    margin: 20vh auto;
    padding: 20px;
  }
}

/* ---------- 3. کپی شناسه محصول (ادغام‌شده — دسکتاپ+موبایل/تبلت) — id: copy-sku-btn ---------- */
  /* یافته‌ی بازبینی فنی ۵ سپتامبر ۲۰۲۶: چون این عنصر یک تگ <button> واقعی
     است، قانون عمومی تم وودمارت برای همه‌ی دکمه‌های سایت
     (:is(.btn,.button,button,...) در base-rtl.css) با specificity یکسان
     با کلاس ما رقابت می‌کرد و چون فایل تم بعد از این فایل لود می‌شود در
     این تساوی برنده می‌شد و کل ظاهر دکمه (رنگ/حاشیه/گردی‌گوشه/پدینگ) را
     خنثی می‌کرد. اضافه‌شدن پیشوند «button.» به سلکتور، specificity را
     بالاتر می‌برد تا همیشه مستقل از ترتیب لود فایل‌ها برنده باشد — هیچ
     مقداری تغییر نکرده. */
  button.copy-sku-btn {
    background-color: #f5f5f7;
    border: 1px solid #C0C8D0;
    color: #282828;
    font-weight: 700;
    padding: 12px 24px;
    border-radius: 12px;
    font-size: 15px;
    cursor: pointer;
    user-select: none;
    box-shadow: 0 2px 6px rgb(0 0 0 / 0.1);
    transition: background-color 0.3s ease, box-shadow 0.3s ease, color 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: max-content;
    min-height: 0;
  }
  button.copy-sku-btn:hover {
    background-color: #e0e0e5;
    box-shadow: 0 4px 12px rgb(0 0 0 / 0.15);
  }
  button.copy-sku-btn:active {
    background-color: #d1d1d6;
  }
  button.copy-sku-btn.copied {
    color: #2471A3;
  }
  .copy-icon {
    width: 18px;
    height: 18px;
    fill: currentColor;
  }
  /* یافته‌ی بازبینی فنی ۳ سپتامبر ۲۰۲۶: قبلاً خطاها با alert() مسدودکننده
     نشون داده می‌شد؛ این toast غیرمسدودکننده جایگزینش شده، هماهنگ با الگوی
     قبلاً موجود در ویجت‌های اشتراک‌گذاری (radia-share-toast) */
  .copy-sku-toast {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: #c62828;
    color: #fff;
    padding: 10px 22px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease, transform 0.3s ease;
    z-index: 9999999;
    white-space: nowrap;
  }
  .copy-sku-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }

  /* نسخه‌ی موبایل/تبلت (قبلاً copy-sku-btn-mobile) — تمام‌عرض */
  @media (max-width: 1024px) {
    button.copy-sku-btn {
      width: 100%;
      justify-content: center;
      font-size: 14px;
      padding: 12px 20px;
    }
  }

/* ---------- 4. سفارش از طریق پیام‌رسان‌ها (ادغام‌شده — دسکتاپ+موبایل/تبلت) — radia-order-container ---------- */
.radia-order-btn {
  width: 100%;
  background: #2471A3;
  color: #FFFFFF;
  padding: 14px 18px;
  border-radius: 10px;
  text-align: center;
  cursor: pointer;
  transition: all .25s ease;
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-sizing: border-box;
}
.radia-order-btn span {
  font-size: 15px;
  font-weight: 700;
  color: #FFFFFF;
  line-height: 1.6;
}
.radia-order-btn:hover {
  background: #1B4F72;
}
.radia-order-popup {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .45);
  z-index: 999999;
  overflow-y: auto;
}
.radia-order-popup-inner {
  width: min(92%, 420px);
  background: #FFFFFF;
  margin: 18vh auto;
  padding: 22px;
  border-radius: 14px;
  text-align: center;
  box-sizing: border-box;
  direction: rtl;
  position: relative;
}
button.radia-order-close {
  position: absolute;
  top: 12px;
  left: 14px;
  background: none;
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: #555;
  line-height: 1;
}
.radia-order-title {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 18px;
  color: #1B4F72;
  padding: 0 26px;
}
.radia-order-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: #F6F8FC;
  color: #1B4F72;
  text-decoration: none;
  font-weight: 600;
  transition: background .2s ease;
  border: 1px solid #C0C8D0;
  direction: rtl;
}
.radia-order-item:hover {
  background: #E0E0E0;
}
.radia-order-item img {
  width: 26px;
  height: 26px;
}
@media (max-width: 600px) {
  .radia-order-popup-inner {
    width: 90%;
    margin: 20vh auto;
    padding: 20px;
  }
  .radia-order-item img {
    width: 24px;
    height: 24px;
  }
}

/* ---------- 5. تماس سریع با فروشگاه (ادغام‌شده — دسکتاپ+موبایل/تبلت) — radia-call-wrapper-v2 ---------- */
.radia-call-wrapper-v2{
  width:100%;
  box-sizing:border-box;
}
.radia-call-btn-v2{
  width:100%;
  padding:clamp(12px,3vw,16px) clamp(16px,4vw,24px);
  background-color:#2471A3;
  color:#FFFFFF;
  border-radius:10px;
  text-decoration:none;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  transition:all .3s ease;
  line-height:1.6;
}
.radia-call-btn-v2:hover{
  background-color:#1B4F72;
  color:#FFFFFF;
}
.radia-call-title-v2{
  font-size:clamp(14px,3.4vw,16px);
  font-weight:700;
}
.radia-call-number-v2{
  font-size:clamp(14px,3.2vw,15px);
  font-weight:700;
  margin-top:2px;
  direction:ltr;
}
/* یافته‌ی بازبینی فنی ۵ سپتامبر ۲۰۲۶ (سوم): روی موبایل این دکمه (اندازه‌گیری
   سیال با clamp) و دکمه‌ی «سفارش از طریق پیام‌رسان‌ها» (بخش ۴، اندازه‌ی
   ثابت) زیر هم قرار می‌گیرند ولی چون هرکدام مستقل طراحی شده بودند، ارتفاعشان
   با هم فرق داشت (کاربر گزارش داد). فیکس: روی موبایل، پدینگ/فونت/فاصله‌ی
   بین دو خط این دکمه دقیقاً با مقادیر ثابت radia-order-btn یکی شد تا دو
   باکس هم‌ارتفاع دیده شوند؛ ظاهر دسکتاپ (clamp سیال) دست‌نخورده ماند. */
@media (max-width: 1024px) {
  .radia-call-btn-v2 {
    padding: 14px 18px;
    gap: 4px;
  }
  .radia-call-title-v2,
  .radia-call-number-v2 {
    font-size: 15px;
  }
  .radia-call-number-v2 {
    margin-top: 0;
  }
}

/* ---------- 6. نمایش بیشتر توضیحات — show-more-wrapper ---------- */
/* جلوگیری از فاصله ناخواسته Flex */
.show-more-wrapper {
    row-gap: 0 !important;
}

/* محو شدن متن */
.show-more-wrapper .hidden-box {
    display: none;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* حذف فاصله ویرایشگر متن */
.show-more-wrapper .hidden-box .elementor-widget-text-editor {
    margin-top: 0 !important;
}

/* دکمه نمایش بیشتر */
.show-more-wrapper .show-more-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    color: #1B4F72;
    background: none;
    border: none;
    font-family: 'IranYekan', sans-serif;
    font-size: 13px;
    font-weight: 500;
    padding: 8px 0;
}
/* یافته‌ی بازبینی فنی ۵ سپتامبر ۲۰۲۶: چون این عنصر یک تگ <button> است،
   بدون یک قانون هاور اختصاصی، قانون عمومی هاور دکمه‌های تم وودمارت
   (رنگ خاکستری + پس‌زمینه‌ی خاکستری) روی هاور جایگزین رنگ آبی می‌شد. */
.show-more-wrapper .show-more-btn:hover {
    color: #1B4F72;
    background: none;
    border-color: transparent;
}

/* آیکون — یافته‌ی بازبینی فنی ۳ سپتامبر ۲۰۲۶: قبلاً از یک آیکون Font
   Awesome (fa-chevron-down) استفاده می‌شد که کل کتابخانه‌ی Font Awesome را
   از یک CDN خارجی فقط برای همین یک آیکون لود می‌کرد. جایگزین شد با همون
   تکنیک CSS خالص (کادر چرخیده) که در بخش ۱۴ assets/css/single-product.css
   برای دکمه‌های «نمایش بیشتر» تب‌های محصول استفاده شده — ظاهر و رفتار
   بصری کاملاً یکسان، بدون هیچ درخواست شبکه‌ی اضافه */
.show-more-wrapper .show-more-btn .icon {
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

/* چرخش آیکون */
.show-more-wrapper .show-more-btn.active .icon {
    transform: rotate(225deg);
}