/**
 * Zlata Reviews Plugin — Frontend CSS v2
 * وقتی zlata-theme فعال است این فایل از CSS variables قالب استفاده می‌کند.
 * وقتی با قالب دیگری استفاده می‌شود، fallback values زیر اعمال می‌شوند.
 */

/* Fallback variables — overridden by zlata-theme */
:root {
  --gold-pure:    var(--gold-pure,    #D4AF37);
  --gold-warm:    var(--gold-warm,    #C9A04A);
  --gold-dark:    var(--gold-dark,    #9A7520);
  --grad-gold:    var(--grad-gold,    linear-gradient(135deg,#E8CB6B 0%,#C9A04A 40%,#9A7520 100%));
  --bg:           var(--bg,           #FFFFFF);
  --bg-1:         var(--bg-1,         #F9F9F9);
  --surface:      var(--surface,      #FFFFFF);
  --surface-h:    var(--surface-h,    #F3F3F3);
  --border:       var(--border,       rgba(154,117,32,.2));
  --border-h:     var(--border-h,     rgba(154,117,32,.5));
  --text-1:       var(--text-1,       #1A1A1A);
  --text-2:       var(--text-2,       #555555);
  --text-3:       var(--text-3,       #888888);
  --text-gold:    var(--text-gold,    #7A5000);
  --badge-bg:     var(--badge-bg,     rgba(154,117,32,.08));
  --badge-bd:     var(--badge-bd,     rgba(154,117,32,.25));
  --reply-bg:     var(--reply-bg,     rgba(154,117,32,.05));
  --reply-bd:     var(--reply-bd,     rgba(154,117,32,.18));
  --in-bg:        var(--in-bg,        #FFFFFF);
  --in-focus:     var(--in-focus,     #FFFFFF);
  --green-bg:     var(--green-bg,     rgba(5,100,60,.06));
  --green-bd:     var(--green-bd,     rgba(5,100,60,.22));
  --green-tx:     var(--green-tx,     #05643C);
  --shadow-card:  var(--shadow-card,  0 4px 24px rgba(0,0,0,.08));
  --shadow-btn:   var(--shadow-btn,   0 4px 20px rgba(154,117,32,.28));
  --r-sm:         var(--r-sm,         8px);
  --r-md:         var(--r-md,         14px);
  --r-lg:         var(--r-lg,         20px);
  --r-xl:         var(--r-xl,         28px);
  --t:            var(--t,            .22s);
}

/* font fallback اگر Vazirmatn از قالب لود نشده */
.zlata-form-wrapper,
.zlata-reviews-wrapper,
.zlata-summary-card {
  font-family: 'Vazirmatn', Tahoma, sans-serif;
  direction: rtl;
}

/* ─── موارد اضافه‌ای که در style.css قالب نیستند ─── */

/* category badge رنگ‌بندی اضافی */
.zlata-review-category {
  padding: 2px 9px;
  border-radius: 100px;
  background: var(--badge-bg);
  border: 1px solid var(--badge-bd);
  font-size: .66rem;
  font-weight: 600;
  color: var(--text-gold);
}

/* verified badge */
.zlata-verified-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 7px;
  border-radius: 100px;
  background: var(--green-bg);
  border: 1px solid var(--green-bd);
  color: var(--green-tx);
  font-size: .62rem;
  font-weight: 700;
}

/* image zoom */
.zlata-review-image img {
  cursor: zoom-in;
  transition: opacity var(--t);
}
.zlata-review-image img:hover { opacity: .9; }

/* Lightbox overlay */
.zlata-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.88);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-out;
  animation: zl-lb-in .18s ease;
}
@keyframes zl-lb-in { from { opacity:0 } to { opacity:1 } }
.zlata-lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: var(--r-md);
  box-shadow: 0 0 60px rgba(0,0,0,.6);
  cursor: default;
}
.zlata-lightbox-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--t);
}
.zlata-lightbox-close:hover { background: rgba(255,255,255,.28); }

/* Toast notification */
.zlata-toast {
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: var(--text-1);
  color: var(--bg);
  padding: .7rem 1.4rem;
  border-radius: 100px;
  font-size: .84rem;
  font-weight: 600;
  z-index: 9998;
  opacity: 0;
  transition: all .3s ease;
  white-space: nowrap;
  box-shadow: 0 8px 30px rgba(0,0,0,.25);
  pointer-events: none;
}
.zlata-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.zlata-toast.success { background: var(--green-tx); color: #fff; }
.zlata-toast.error   { background: #C0392B; color: #fff; }