/**
 * Toska Product Cards — discount.css  |  v30.37.0 (NEW)
 * «تخفیف خرید نقدی»
 */

.epc-cash-discount { width: 100%; margin-top: 10px; }

/* ── دکمه‌ی «بررسی قیمت» ─────────────────────────────────────────── */
.epc-discount-check-btn {
  all: unset !important; /* BUG FIX: مثل بقیه‌ی دکمه‌ها، مستقل از استایل تم */
  box-sizing: border-box !important;
  display:         flex !important;
  align-items:     center !important;
  justify-content: center !important;
  gap:             8px !important;
  width:           100% !important;
  padding:         13px 16px !important;
  background:      linear-gradient(135deg, #f59e0b, #ec4899) !important;
  color:           #fff !important;
  border-radius:   12px !important;
  font-family:     inherit !important;
  font-size:       14px !important;
  font-weight:     700 !important;
  cursor:          pointer !important;
  transition:      transform .15s !important;
}
.epc-discount-check-btn:hover  { transform: translateY(-2px) !important; }
.epc-discount-check-btn:disabled { opacity: .6 !important; cursor: default !important; }

.epc-discount-panel { margin-top: 10px; position: relative; } /* NEW (v30.41): برای جای‌گیری دکمه بستن */

/* NEW (v30.41): دکمه بستن پنل تخفیف — تا مشتری بتواند بدون رفرش صفحه
   محصولات دیگر را هم بررسی کند */
.epc-discount-close-btn {
  all: unset !important;
  position: absolute !important;
  top: 6px !important;
  left: 6px !important; /* گوشه‌ی مخالفِ متن، همیشه در دسترس */
  z-index: 2 !important;
  width: 24px !important;
  height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: rgba(0,0,0,.08) !important;
  color: #6b7280 !important;
  font-size: 13px !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}
.epc-discount-close-btn:hover { background: rgba(0,0,0,.16) !important; }

/* ── انیمیشن «قفل کیف‌پول» + چرخش دو رقم ────────────────────────── */
.epc-discount-spin {
  display:        flex;
  flex-direction: column;
  align-items:    center;
  gap:            10px;
  padding:        18px 12px;
  background:     #fdf4ff;
  border-radius:  14px;
  border:         1px dashed #d8b4fe;
}
.epc-wallet-lock {
  width:  46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: epc-wallet-shake 1.1s ease-in-out infinite;
}
.epc-wallet-lock svg { width: 100%; height: 100%; }
.epc-wallet-lock .epc-lock-shackle {
  transform-origin: 8px 9px;
  transition: transform .4s cubic-bezier(.34,1.56,.64,1);
}
.epc-wallet-lock.epc-unlocked {
  animation: none;
}
.epc-wallet-lock.epc-unlocked .epc-lock-shackle {
  transform: rotate(-35deg) translateX(-2px);
}
@keyframes epc-wallet-shake {
  0%, 100% { transform: rotate(0deg); }
  25%      { transform: rotate(-4deg); }
  75%      { transform: rotate(4deg); }
}

.epc-spin-number {
  display:     flex;
  align-items: baseline;
  gap:         2px;
  font-weight: 900;
  font-size:   30px;
  color:       #a21caf;
}
/* BUG FIX (v30.40): روی سایت‌های RTL، «direction: ltr» ساده روی کل عدد
   کافی نبود و رقم‌ها برعکس (مثلاً ۹۰ به‌جای ۰۹) نمایش داده می‌شدند. فقط
   جفت رقم را (نه علامت ٪) داخل یک ایزوله‌ی LTR واقعی قرار می‌دهیم تا صرف‌نظر
   از جهت صفحه، همیشه درست («۰» سمت چپ، «۹» سمت راست) خوانده شود. */
.epc-spin-digits-pair {
  display:       inline-flex !important;
  direction:     ltr !important;
  unicode-bidi:  isolate-override !important;
  gap:           2px;
}
.epc-spin-digit {
  display:         inline-flex;
  align-items:     center;
  justify-content: center;
  width:           30px;
  background:      #fff;
  border-radius:   8px;
  box-shadow:      0 2px 6px rgba(162,28,175,.2);
}
.epc-spin-percent-sign { font-size: 18px; color: #a21caf; margin-inline-start: 2px; }
.epc-spin-label { font-size: 12px; color: #a855f7; margin: 0; }

/* ── نتیجه: درصد + قیمت نهایی + کد ───────────────────────────────── */
.epc-discount-result {
  display:        flex;
  flex-direction: column;
  align-items:    center;
  gap:            8px;
  padding:        16px 14px;
  background:     linear-gradient(135deg, #fdf4ff, #fff7ed);
  border-radius:  14px;
  border:         1px solid #f0abfc;
  animation:      epc-discount-pop .35s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes epc-discount-pop {
  0%   { transform: scale(.85); opacity: 0; }
  100% { transform: scale(1);   opacity: 1; }
}
.epc-discount-percent-badge {
  background:    #16a34a;
  color:         #fff;
  font-size:     13px;
  font-weight:   800;
  padding:       4px 12px;
  border-radius: 20px;
}
/* FIX (v30.42): طبق درخواست کاربر — به‌جای نمایش قیمت پایه با خط‌خورده،
   دو کادر جدا نشان داده می‌شود؛ چون مشتری ممکن است بخواهد قسطی بخرد و با
   دانستن قیمت پایه با مشاور تماس بگیرد. */
.epc-discount-price-boxes {
  display: flex;
  gap:     8px;
  width:   100%;
}
.epc-price-box {
  flex:            1;
  display:         flex;
  flex-direction:  column;
  align-items:     center;
  gap:             4px;
  padding:         8px 6px;
  border-radius:   10px;
}
.epc-price-box-label { font-size: 11px; color: #6b7280; font-weight: 600; }
.epc-price-box-value { font-size: 15px; font-weight: 900; }
.epc-price-box-base {
  background: #f3f4f6;
}
.epc-price-box-base  .epc-price-box-value { color: #4b5563; }
.epc-price-box-final {
  background: #fdf4ff;
  border: 1px solid #f0abfc;
}
.epc-price-box-final .epc-price-box-value { color: #a21caf; font-size: 17px; }

.epc-discount-code-box {
  display:       flex;
  align-items:   center;
  gap:           8px;
  background:    #fff;
  padding:       8px 14px;
  border-radius: 10px;
  border:        1px dashed #d8b4fe;
  font-size:     13px;
}
.epc-discount-code-val { font-weight: 900; letter-spacing: 2px; color: #a21caf; font-size: 15px; }
.epc-discount-copy-btn {
  all: unset !important;
  cursor: pointer !important;
  font-size: 11px !important;
  color: #6366f1 !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  border: 1px solid #6366f1 !important;
  border-radius: 6px !important;
}
.epc-discount-hint { font-size: 11px; color: #9ca3af; margin: 0; text-align: center; }

.epc-discount-add-btn {
  all: unset !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin-top: 6px !important;
  padding: 12px 16px !important;
  background: linear-gradient(135deg, #6366f1, #ec4899) !important;
  color: #fff !important;
  border-radius: 10px !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
.epc-discount-add-btn:disabled { opacity: .6 !important; cursor: default !important; }

.epc-discount-error { color: #d63638; font-size: 12px; text-align: center; margin: 6px 0 0; }