/* ============================================================
   واترمارک نمایشی روی عکس محصولات — shofazheydari.ir
   Display-time overlay ONLY: this never modifies image files.
   The badge is injected by static/js/watermark.js at render time,
   so changing position/style later affects display instantly.

   ➜ جابه‌جایی واترمارک بعداً: فقط همین متغیرها را عوض کنید.
     پایین-چپ:  --wm-right:auto; --wm-left:10px;
     بالا-راست: --wm-bottom:auto; --wm-top:8px;  (کلاس wm-badge را هم تنظیم کنید)
   ============================================================ */
:root {
  --wm-bottom: 8px;
  --wm-right: 10px;
  --wm-left: auto;
  --wm-top: auto;
  --wm-size: 10px;
  --wm-opacity: 0.9;
}

/* محفظه‌ای که برای سنجش موقعیت relative می‌شود (توسط JS اضافه می‌شود) */
.wm-host {
  position: relative !important;
}

.wm-badge {
  position: absolute;
  z-index: 6;
  bottom: var(--wm-bottom);
  right: var(--wm-right);
  left: var(--wm-left);
  top: var(--wm-top);
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  font-family: Vazirmatn, Shabnam, Tahoma, Arial, sans-serif;
  font-size: var(--wm-size);
  font-weight: 600;
  letter-spacing: 0.2px;
  line-height: 1.6;
  direction: ltr;
  unicode-bidi: isolate;
  white-space: nowrap;
  color: #ffffff;
  background: rgba(22, 22, 22, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.30);
  padding: 1px 9px;
  border-radius: 999px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.40);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  opacity: var(--wm-opacity);
  transition: opacity 0.2s ease;
}

/* حالت تاریک سایت */
[data-theme="dark"] .wm-badge,
.dark-theme .wm-badge {
  background: rgba(0, 0, 0, 0.45);
  border-color: rgba(255, 255, 255, 0.22);
}

/* موبایل: کمی کوچک‌تر و نزدیک‌تر به گوشه */
@media (max-width: 576px) {
  :root {
    --wm-bottom: 6px;
    --wm-right: 8px;
    --wm-size: 9px;
  }
}

/* حالت چاپ / PRINT: واترمارک محو شود؟ خیر — روی چاپ هم می‌ماند ولی شفاف‌تر */
@media print {
  .wm-badge { opacity: 0.55; }
}

/* کاهش انیمیشن برای کاربران حساس */
@media (prefers-reduced-motion: reduce) {
  .wm-badge { transition: none; }
}