/* =============================================================================
   VANTA POLISH — لایه‌ی پرداخت بصری
   -----------------------------------------------------------------------------
   این فایل بعد از بقیه استایل‌ها بارگذاری می‌شود و هیچ markup‌ای را عوض
   نمی‌کند؛ فقط روی همان کلاس‌های موجود می‌نشیند. بنابراین اضافه/حذفش هیچ
   منطقی را نمی‌شکند و همیشه می‌شود برش گرداند.

   فهرست:
     ۱. حرکت پایه (ورود عناصر + احترام به prefers-reduced-motion)
     ۲. سطوح و عمق
     ۳. کارت‌های آمار — فعال‌کردن رنگ‌های خوابیده
     ۴. سایدبار و ناوبری
     ۵. سربرگ
     ۶. دکمه‌ها
     ۷. فرم‌ها و فوکوس
     ۸. نشان‌ها
     ۹. ردیف لاگ
     ۱۰. ردیف انبار
     ۱۱. مودال
     ۱۲. اسکرول‌بار، انتخاب متن، جزئیات
   ========================================================================== */

:root {
  /* ---------------------------------------------------------------------
     نام‌های مستعارِ ترمیمی   (v10.8)
     ---------------------------------------------------------------------
     در صفحه‌های پنل ۴۱ جا از متغیرهایی استفاده شده که هیچ‌وقت تعریف
     نشده‌اند. مرورگر مقدار نامعتبر را دور می‌اندازد، یعنی آن خط CSS
     اصلاً اعمال نمی‌شود و متن به‌جای رنگ کم‌رنگ، رنگ ارث‌بری‌شده را
     می‌گیرد. نتیجه‌اش از بین رفتن سلسله‌مراتب متن در کل پنل بود.

     با تعریف این نام‌ها به‌عنوان مستعارِ متغیرهای واقعی، هر ۴۱ مورد
     یکجا درست می‌شود، بدون اینکه حتی یک خط از فایل‌های صفحه عوض شود:

        --vt-text-3     ۱۶ بار      --vt-primary     ۳ بار
        --vt-text-2      ۷ بار      --vt-border      ۲ بار
        --vt-text-muted  ۶ بار      --vt-surface     ۱ بار
        --vt-muted       ۴ بار      --vt-text-1      ۱ بار
                                    --vt-brand-soft  ۱ بار
     --------------------------------------------------------------------- */
  --vt-text-1:     var(--vt-text);
  --vt-text-2:     var(--vt-text-soft);
  --vt-text-3:     var(--vt-text-mute);
  --vt-text-muted: var(--vt-text-mute);
  --vt-muted:      var(--vt-text-mute);
  --vt-border:     var(--vt-line);
  --vt-surface:    var(--vt-surface-1);
  --vt-primary:    var(--vt-brand-500);
  --vt-brand-soft: rgba(139, 61, 255, 0.14);

  /* رنگ لهجه‌ی هر دسته — برای نوار کناری کارت‌ها و ردیف‌ها */
  --vp-accent-purple: #a76cff;
  --vp-accent-green:  #34d99b;
  --vp-accent-blue:   #4fc3f7;
  --vp-accent-orange: #ffbf47;
  --vp-accent-red:    #ff5f6d;

  /* منحنی‌های حرکت مکمل توکن‌های موجود */
  --vp-spring: cubic-bezier(0.22, 1.2, 0.36, 1);
  --vp-stagger: 45ms;
}


/* =============================================================================
   ۱. حرکت پایه
   ========================================================================== */

@keyframes vp-rise {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}
@keyframes vp-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes vp-modal-in {
  from { opacity: 0; transform: translateY(16px) scale(0.975); }
  to   { opacity: 1; transform: none; }
}

/* ورود پلکانی: کارت‌ها و ردیف‌ها یکی‌یکی می‌آیند، نه همه با هم.
   nth-child تا ۱۲ کافی است؛ بقیه بدون تأخیر ولی با همان انیمیشن می‌آیند. */
.stats-grid > *,
.log-list > .log-row,
.wh-list > .wh-row,
.side-nav .nav-group {
  animation: vp-rise 420ms var(--vt-ease-out, ease-out) both;
}
.stats-grid > *:nth-child(1),  .log-list > .log-row:nth-child(1),  .wh-list > .wh-row:nth-child(1)  { animation-delay: calc(var(--vp-stagger) * 0); }
.stats-grid > *:nth-child(2),  .log-list > .log-row:nth-child(2),  .wh-list > .wh-row:nth-child(2)  { animation-delay: calc(var(--vp-stagger) * 1); }
.stats-grid > *:nth-child(3),  .log-list > .log-row:nth-child(3),  .wh-list > .wh-row:nth-child(3)  { animation-delay: calc(var(--vp-stagger) * 2); }
.stats-grid > *:nth-child(4),  .log-list > .log-row:nth-child(4),  .wh-list > .wh-row:nth-child(4)  { animation-delay: calc(var(--vp-stagger) * 3); }
.stats-grid > *:nth-child(5),  .log-list > .log-row:nth-child(5),  .wh-list > .wh-row:nth-child(5)  { animation-delay: calc(var(--vp-stagger) * 4); }
.stats-grid > *:nth-child(6),  .log-list > .log-row:nth-child(6),  .wh-list > .wh-row:nth-child(6)  { animation-delay: calc(var(--vp-stagger) * 5); }
.log-list > .log-row:nth-child(7),  .wh-list > .wh-row:nth-child(7)  { animation-delay: calc(var(--vp-stagger) * 6); }
.log-list > .log-row:nth-child(8),  .wh-list > .wh-row:nth-child(8)  { animation-delay: calc(var(--vp-stagger) * 7); }
.log-list > .log-row:nth-child(9),  .wh-list > .wh-row:nth-child(9)  { animation-delay: calc(var(--vp-stagger) * 8); }
.log-list > .log-row:nth-child(n+10), .wh-list > .wh-row:nth-child(n+10) { animation-delay: calc(var(--vp-stagger) * 9); }

.side-nav .nav-group:nth-child(1) { animation-delay: 40ms; }
.side-nav .nav-group:nth-child(2) { animation-delay: 90ms; }
.side-nav .nav-group:nth-child(3) { animation-delay: 140ms; }
.side-nav .nav-group:nth-child(4) { animation-delay: 190ms; }
.side-nav .nav-group:nth-child(n+5) { animation-delay: 240ms; }

.admin-topbar { animation: vp-fade 320ms var(--vt-ease, ease) both; }

/* کسی که حرکت کمتر می‌خواهد، هیچ‌کدام از این‌ها را نمی‌بیند. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/* =============================================================================
   ۲. سطوح و عمق
   ========================================================================== */

/* یک خط نور بسیار ملایم روی لبه بالای کارت‌ها — همان چیزی که سطح را از
   «مستطیل تخت» به «سطح» تبدیل می‌کند. */
.stat-card,
.log-row,
.wh-row,
.modal-content,
.admin-hint {
  position: relative;
  overflow: hidden;
}
.stat-card::before,
.modal-content::before,
.admin-hint::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.14), transparent);
  pointer-events: none;
}


/* =============================================================================
   ۳. کارت‌های آمار
   -----------------------------------------------------------------------------
   کلاس‌های رنگ (purple/green/blue/orange/red) در markup بودند ولی هیچ
   استایلی نداشتند، پس همه کارت‌ها یک‌شکل خاکستری دیده می‌شدند. اینجا
   فعالشان می‌کنیم: یک نوار لهجه‌ی بالا + هاله‌ی هم‌رنگ پشت عدد.
   ========================================================================== */

.stat-card {
  --vp-accent: var(--vp-accent-purple);
  padding-top: calc(var(--vt-s4, 16px) + 2px);
  background:
    radial-gradient(120% 90% at 50% -30%, color-mix(in srgb, var(--vp-accent) 16%, transparent), transparent 70%),
    var(--vt-surface-1);
  transition:
    border-color var(--vt-dur, 240ms) var(--vt-ease, ease),
    transform var(--vt-dur, 240ms) var(--vp-spring),
    box-shadow var(--vt-dur, 240ms) var(--vt-ease-out, ease-out);
}
.stat-card::after {
  content: "";
  position: absolute;
  inset-inline: 22%;
  top: 0;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background: var(--vp-accent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--vp-accent) 70%, transparent);
  opacity: 0.85;
  transition: inset-inline var(--vt-dur, 240ms) var(--vt-ease-out, ease-out),
              opacity var(--vt-dur, 240ms) var(--vt-ease, ease);
}
.stat-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--vp-accent) 45%, transparent);
  box-shadow: 0 14px 34px rgba(0,0,0,0.45),
              0 0 0 1px color-mix(in srgb, var(--vp-accent) 22%, transparent);
}
.stat-card:hover::after { inset-inline: 8%; opacity: 1; }

.stat-card.purple { --vp-accent: var(--vp-accent-purple); }
.stat-card.green  { --vp-accent: var(--vp-accent-green); }
.stat-card.blue   { --vp-accent: var(--vp-accent-blue); }
.stat-card.orange { --vp-accent: var(--vp-accent-orange); }
.stat-card.red    { --vp-accent: var(--vp-accent-red); }

.stat-card .num {
  color: var(--vt-text);
  letter-spacing: -0.01em;
  text-shadow: 0 0 26px color-mix(in srgb, var(--vp-accent) 30%, transparent);
}
.stat-card .lbl {
  letter-spacing: 0.01em;
  opacity: 0.9;
}


/* =============================================================================
   ۴. سایدبار و ناوبری
   ========================================================================== */

.nav-group-title {
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 10px;
  opacity: 0.65;
}

.nav-item {
  position: relative;
  border-radius: var(--vt-r-md, 12px);
  transition:
    background var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
    color var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
    transform var(--vt-dur-fast, 140ms) var(--vp-spring);
}
/* نشانگر فعال/هاور که از لبه‌ی داخلی رشد می‌کند */
.nav-item::before {
  content: "";
  position: absolute;
  inset-block: 22%;
  inset-inline-start: 0;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--vt-brand-300, #c9a7ff), var(--vt-brand-500, #8b3dff));
  transform: scaleY(0);
  transition: transform 220ms var(--vp-spring);
}
.nav-item:hover {
  background: rgba(167, 108, 255, 0.10);
  transform: translateX(-2px); /* RTL: به سمت داخل */
}
.nav-item:hover::before,
.nav-item.is-active::before { transform: scaleY(1); }
.nav-item.is-active {
  background: rgba(167, 108, 255, 0.16);
  color: var(--vt-text);
}

.nav-item .nav-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform var(--vt-dur, 240ms) var(--vp-spring);
}
.nav-item:hover .nav-icon { transform: scale(1.12); }

.side-avatar {
  box-shadow: 0 8px 22px rgba(139, 61, 255, 0.28);
  transition: transform var(--vt-dur, 240ms) var(--vp-spring);
}
.side-head:hover .side-avatar { transform: rotate(-6deg) scale(1.06); }


/* =============================================================================
   ۵. سربرگ
   ========================================================================== */

.topbar-title { letter-spacing: -0.015em; }
.topbar-sub { opacity: 0.75; }
.topbar-id {
  padding: 4px 10px;
  border: 1px solid var(--vt-line, rgba(255,255,255,.09));
  border-radius: var(--vt-r-pill, 999px);
  background: var(--vt-surface-1);
}


/* =============================================================================
   ۶. دکمه‌ها
   ========================================================================== */

/* Hover عمومی دکمه‌ها: بدون نوار سفید عبوری.
   این قانون عمداً از pseudo-element استفاده نمی‌کند تا دکمه‌های جدید و کامپوننت‌ها
   بتوانند ::before/::after خودشان را بدون تداخل داشته باشند. */
button:where(:not(.btn-secondary):not(.nav-item):not(.close-modal)) {
  position: relative;
  transition: transform var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
              filter var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
              box-shadow var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
              border-color var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
              background-color var(--vt-dur-fast, 140ms) var(--vt-ease, ease);
}
button:where(:not(.btn-secondary):not(.nav-item):not(.close-modal)):hover:not(:disabled) {
  filter: brightness(1.035) saturate(1.025);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075),
              0 9px 22px rgba(3,7,18,.18);
}

.btn-secondary { transition: all var(--vt-dur-fast, 140ms) var(--vt-ease, ease); }
.btn-secondary:hover:not(:disabled) { transform: translateY(-1px); }

.close-modal {
  transition: transform var(--vt-dur, 240ms) var(--vp-spring),
              color var(--vt-dur-fast, 140ms) var(--vt-ease, ease);
}
.close-modal:hover { transform: rotate(90deg); color: var(--vt-danger, #ff5f6d); }


/* =============================================================================
   ۷. فرم‌ها و فوکوس
   ========================================================================== */

input, select, textarea {
  transition:
    border-color var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
    box-shadow var(--vt-dur, 240ms) var(--vt-ease-out, ease-out),
    background var(--vt-dur-fast, 140ms) var(--vt-ease, ease);
}
input:focus, select:focus, textarea:focus {
  border-color: var(--vt-brand-400, #a76cff);
  box-shadow: 0 0 0 3px rgba(139, 61, 255, 0.18);
  outline: none;
}

/* حلقه فوکوس یکدست برای پیمایش با کیبورد — قبلاً فقط یک مورد داشت */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--vt-brand-400, #a76cff);
  outline-offset: 2px;
  border-radius: var(--vt-r-sm, 8px);
}

.wh-field-label.required::after {
  color: var(--vt-danger, #ff5f6d);
}


/* =============================================================================
   ۸. نشان‌ها
   ========================================================================== */

.vt-badge {
  transition: transform var(--vt-dur-fast, 140ms) var(--vp-spring),
              filter var(--vt-dur-fast, 140ms) var(--vt-ease, ease);
}
.vt-badge:hover { transform: translateY(-1px); filter: brightness(1.08); }


/* =============================================================================
   ۹. ردیف لاگ
   ========================================================================== */

.log-row {
  transition:
    border-color var(--vt-dur, 240ms) var(--vt-ease, ease),
    background var(--vt-dur, 240ms) var(--vt-ease, ease),
    transform var(--vt-dur-fast, 140ms) var(--vp-spring),
    box-shadow var(--vt-dur, 240ms) var(--vt-ease-out, ease-out);
}
/* نوار لهجه‌ی کناری که هنگام هاور ظاهر می‌شود */
.log-row::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--vt-brand-400, #a76cff), var(--vt-brand-600, #6f21e8));
  transform: scaleY(0);
  transform-origin: center;
  transition: transform 260ms var(--vp-spring);
}
.log-row:hover {
  transform: translateX(-2px);
  box-shadow: 0 8px 22px rgba(0,0,0,0.32);
}
.log-row:hover::after { transform: scaleY(1); }

.log-row.is-review::after {
  background: linear-gradient(180deg, var(--vt-warn, #ffbf47), #d99a1f);
  transform: scaleY(1);
}

.log-field {
  transition: background var(--vt-dur-fast, 140ms) var(--vt-ease, ease);
}
.log-field:hover { background: rgba(255,255,255,0.06); }
.log-field .k { letter-spacing: 0.02em; }

.log-raw summary {
  transition: color var(--vt-dur-fast, 140ms) var(--vt-ease, ease);
  border-radius: var(--vt-r-sm, 8px);
  padding: 2px 4px;
}
.log-raw summary:hover { color: var(--vt-brand-300, #c9a7ff); }


/* =============================================================================
   ۱۰. ردیف انبار
   ========================================================================== */

.wh-row {
  transition:
    border-color var(--vt-dur, 240ms) var(--vt-ease, ease),
    background var(--vt-dur, 240ms) var(--vt-ease, ease),
    transform var(--vt-dur-fast, 140ms) var(--vp-spring),
    box-shadow var(--vt-dur, 240ms) var(--vt-ease-out, ease-out);
}
.wh-row::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--vt-success, #34d99b), #1f9d6f);
  transform: scaleY(0);
  transition: transform 260ms var(--vp-spring);
}
.wh-row:hover {
  transform: translateX(-2px);
  box-shadow: 0 8px 22px rgba(0,0,0,0.32);
}
.wh-row:hover::after { transform: scaleY(1); }
.wh-row.is-empty::after {
  background: linear-gradient(180deg, var(--vt-danger, #ff5f6d), #c23545);
  transform: scaleY(1);
}

.wh-qty {
  font-variant-numeric: tabular-nums;
  text-shadow: 0 0 22px rgba(167,108,255,0.35);
}
.wh-row.is-empty .wh-qty { text-shadow: 0 0 22px rgba(255,95,109,0.4); }


/* =============================================================================
   ۱۱. مودال
   ========================================================================== */

.modal {
  backdrop-filter: blur(6px);
  animation: vp-fade 200ms var(--vt-ease, ease) both;
}
.modal-content {
  animation: vp-modal-in 340ms var(--vp-spring) both;
  box-shadow: 0 30px 80px rgba(0,0,0,0.6);
}


/* =============================================================================
   ۱۲. اسکرول‌بار، انتخاب متن، جزئیات
   ========================================================================== */

.log-list, .wh-list, .side-nav, .modal-content, .member-list {
  scrollbar-width: thin;
  scrollbar-color: rgba(167,108,255,0.45) transparent;
}
.log-list::-webkit-scrollbar,
.wh-list::-webkit-scrollbar,
.side-nav::-webkit-scrollbar,
.modal-content::-webkit-scrollbar,
.member-list::-webkit-scrollbar { width: 9px; height: 9px; }

.log-list::-webkit-scrollbar-track,
.wh-list::-webkit-scrollbar-track,
.side-nav::-webkit-scrollbar-track,
.modal-content::-webkit-scrollbar-track,
.member-list::-webkit-scrollbar-track { background: transparent; }

.log-list::-webkit-scrollbar-thumb,
.wh-list::-webkit-scrollbar-thumb,
.side-nav::-webkit-scrollbar-thumb,
.modal-content::-webkit-scrollbar-thumb,
.member-list::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(167,108,255,0.5), rgba(111,33,232,0.5));
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
.log-list::-webkit-scrollbar-thumb:hover,
.wh-list::-webkit-scrollbar-thumb:hover,
.side-nav::-webkit-scrollbar-thumb:hover,
.modal-content::-webkit-scrollbar-thumb:hover,
.member-list::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(167,108,255,0.8), rgba(111,33,232,0.8));
  background-clip: padding-box;
}

::selection {
  background: rgba(139, 61, 255, 0.35);
  color: #fff;
}

/* اعداد فارسی/لاتین در ستون‌ها هم‌عرض بمانند تا جدول‌ها نلرزند */
.vt-num, .stat-card .num, .wh-qty, .log-field .v.vt-num {
  font-variant-numeric: tabular-nums;
}

.admin-hint {
  transition: border-color var(--vt-dur, 240ms) var(--vt-ease, ease);
}
.admin-hint:hover { border-color: var(--vt-line-brand, rgba(167,108,255,0.34)); }


/* =============================================================================
   ۱۳. کارت «آخرین لاگ ثبت‌شده» در داشبورد   (v10.7)
   -----------------------------------------------------------------------------
   این کارت از دو متغیری استفاده می‌کرد که هیچ‌وقت تعریف نشده بودند:
       var(--vt-border)  →  اسم درست: --vt-line
       var(--vt-muted)   →  اسم درست: --vt-text-mute
   نتیجه‌اش این بود که کادرش بی‌رنگ می‌ماند و متن‌های فرعی‌اش رنگ درست
   نمی‌گرفتند. ضمناً پالتش سرمه‌ای (rgba(15,23,42,…)) بود، نه بنفشِ برند.
   اینجا هر دو مشکل را درست می‌کنیم بدون اینکه markup عوض شود.
   ========================================================================== */

.vglh-card {
  --vglh-tint: var(--vt-brand-400, #a76cff);
  position: relative;
  overflow: hidden;
  border: 1px solid var(--vt-line, rgba(255,255,255,0.09));
  border-radius: var(--vt-r-lg, 18px);
  background:
    radial-gradient(130% 100% at 12% -20%, color-mix(in srgb, var(--vglh-tint) 15%, transparent), transparent 72%),
    var(--vt-surface-1, rgba(23,19,38,0.72));
  box-shadow: var(--vt-shadow-md, 0 10px 30px rgba(0,0,0,0.45));
  animation: vp-rise 420ms var(--vt-ease-out, ease-out) both;
}
/* نوار وضعیت در لبه‌ی داخلی — رنگش از خود کارت می‌آید */
.vglh-card::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: 3px;
  background: var(--vglh-tint);
  box-shadow: 0 0 16px color-mix(in srgb, var(--vglh-tint) 65%, transparent);
}
.vglh-card:hover { border-color: color-mix(in srgb, var(--vglh-tint) 45%, transparent); }

.vglh-title { color: var(--vt-text-mute, rgba(244,241,251,0.48)); }
.vglh-meta  { color: var(--vt-text-mute, rgba(244,241,251,0.48)); }
.vglh-age span { color: var(--vt-text-mute, rgba(244,241,251,0.48)); }
.vglh-value { color: var(--vt-text, #f4f1fb); }
.vglh-age b { font-variant-numeric: tabular-nums; }

/* نقطه‌ی وضعیت: تپش ملایم فقط وقتی همه‌چیز سالم است */
.vglh-dot { background: currentColor; }
.vglh-green .vglh-dot { animation: vp-dot-pulse 2.4s ease-in-out infinite; }
@keyframes vp-dot-pulse {
  0%, 100% { box-shadow: 0 0 0 5px color-mix(in srgb, currentColor 14%, transparent); }
  50%      { box-shadow: 0 0 0 9px color-mix(in srgb, currentColor 4%, transparent); }
}

/* رنگ هر وضعیت — هم‌خانواده با بقیه پنل، نه سرمه‌ای */
.vglh-green  { --vglh-tint: var(--vt-success, #34d99b); }
.vglh-blue   { --vglh-tint: var(--vt-info, #4fc3f7); }
.vglh-yellow { --vglh-tint: var(--vt-warn, #ffbf47); }
.vglh-orange { --vglh-tint: #f97316; }
.vglh-red    { --vglh-tint: var(--vt-danger, #ff5f6d); }
.vglh-gray   { --vglh-tint: var(--vt-text-faint, rgba(244,241,251,0.3)); }


/* =============================================================================
   ۱۴. تصویر پروفایل ادمین در سایدبار   (v10.7)
   ========================================================================== */

.side-avatar {
  position: relative;
  padding: 0;
  border: 1px solid var(--vt-line-strong, rgba(255,255,255,0.16));
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(139, 61, 255, 0.28);
  transition: transform var(--vt-dur, 240ms) var(--vp-spring),
              box-shadow var(--vt-dur, 240ms) var(--vt-ease-out, ease-out);
}
.side-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* مداد ویرایش که فقط موقع هاور دیده می‌شود */
.side-avatar-edit {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 40%;
  display: grid;
  place-items: center;
  font-size: 12px;
  color: #fff;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,0.72));
  opacity: 0;
  transition: opacity var(--vt-dur-fast, 140ms) var(--vt-ease, ease);
}
.side-avatar:hover {
  transform: scale(1.06);
  box-shadow: 0 10px 26px rgba(139, 61, 255, 0.45);
}
.side-avatar:hover .side-avatar-edit { opacity: 1; }
.side-avatar:focus-visible .side-avatar-edit { opacity: 1; }

/* چون حالا دکمه است، استایل عمومی button نباید رویش بنشیند */
.side-head .side-avatar {
  min-height: 0;
  font-weight: inherit;
}


/* =============================================================================
   ۱۵. پوسته‌ی یکدست مودال‌ها   (v10.8)
   -----------------------------------------------------------------------------
   مودال لاگ‌های گنگ از قبل یک سربرگ تمیز داشت، ولی بقیه مودال‌ها فقط یک
   ✖ شناور در گوشه داشتند. اینجا همان حس را به همه می‌دهیم — بدون تغییر
   markup، فقط با استایل‌دادن به دکمه‌ی بستن و عنوان.
   ========================================================================== */

/* دکمه‌ی بستن: از یک ✖ لخت به یک دکمه‌ی واقعی */
.modal-content > .close-modal {
  position: absolute;
  top: 14px;
  inset-inline-end: 16px;
  z-index: 4;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  border: 1px solid var(--vt-line);
  background: var(--vt-surface-2);
  color: var(--vt-text-soft);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  transition: color var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
              border-color var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
              background var(--vt-dur-fast, 140ms) var(--vt-ease, ease),
              transform var(--vt-dur, 240ms) var(--vp-spring);
}
.modal-content > .close-modal:hover {
  color: var(--vt-danger, #ff5f6d);
  border-color: color-mix(in srgb, var(--vt-danger, #ff5f6d) 45%, var(--vt-line));
  background: color-mix(in srgb, var(--vt-danger, #ff5f6d) 10%, var(--vt-surface-2));
  transform: rotate(90deg);
}

/* عنوان مودال: فضای کافی از دکمه‌ی بستن بگیرد تا روی هم نیفتند */
.modal-content > h2 {
  padding-inline-end: 46px;
  letter-spacing: -0.01em;
}


/* =============================================================================
   ۱۶. لیست اعضا   (v10.8)
   ========================================================================== */

.member-box {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
/* نوار وضعیت کناری — سبز برای عادی، قرمز برای کسری/اخطار */
.member-box::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--vt-brand-400, #a76cff), var(--vt-brand-600, #6f21e8));
  transform: scaleY(0);
  transition: transform 260ms var(--vp-spring);
}
.member-box:hover::after { transform: scaleY(1); }
.member-box.deficit::after {
  background: linear-gradient(180deg, var(--vt-danger, #ff5f6d), #c23545);
  transform: scaleY(1);
}
.member-box:hover {
  box-shadow: 0 8px 22px rgba(0,0,0,0.32);
}
.member-box.deficit {
  border-color: color-mix(in srgb, var(--vt-danger, #ff5f6d) 34%, var(--vt-line));
  background: color-mix(in srgb, var(--vt-danger, #ff5f6d) 7%, var(--vt-surface-2));
}

/* دکمه‌های داخل ردیف نباید کلیکِ باز شدن ردیف را بگیرند */
.member-actions { position: relative; z-index: 2; }

.member-list-glass,
#all-members-list {
  scrollbar-width: thin;
  scrollbar-color: rgba(167,108,255,0.45) transparent;
}


/* =============================================================================
   ۱۷. نوار ابزار «کل اعضا» + جستجوی لیست اعضا   (v10.8)
   ========================================================================== */

.all-members-toolbar,
.vp-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
  padding: 11px 12px;
  border: 1px solid var(--vt-line);
  border-radius: 14px;
  background: color-mix(in srgb, var(--vt-surface-2) 78%, transparent);
}
.all-members-toolbar input,
.all-members-toolbar select,
.vp-toolbar input,
.vp-toolbar select { margin: 0; }

@media (max-width: 640px) {
  .all-members-toolbar,
  .vp-toolbar { grid-template-columns: 1fr; }
}

/* شمارنده‌ی نتیجه‌ی جستجو */
.vp-result-count {
  font-size: var(--vt-fs-xs, 11px);
  color: var(--vt-text-mute);
  margin: 0 2px 8px;
}

/* حالت «چیزی پیدا نشد» */
.vp-empty {
  padding: 26px 18px;
  text-align: center;
  color: var(--vt-text-mute);
  border: 1px dashed var(--vt-line);
  border-radius: var(--vt-r-md, 12px);
  animation: vp-fade 260ms var(--vt-ease, ease) both;
}
.vp-empty b { display: block; color: var(--vt-text-soft); margin-bottom: 4px; }


/* =============================================================================
   ۱۸. چت فمیلی   (v10.8)
   ========================================================================== */

.vt-chat-bubble,
.vchat-bubble,
.chat-bubble {
  animation: vp-rise 300ms var(--vt-ease-out, ease-out) both;
}
.vchat-msg + .vchat-msg,
.chat-msg + .chat-msg { margin-top: 6px; }
/* v10.8 warehouse compact unknown queue + item link explorer */
.wh-link-chip{border:1px solid rgba(88,166,255,.28);background:rgba(88,166,255,.08);color:#8ec5ff;border-radius:999px;padding:3px 8px;font:700 10px inherit;cursor:pointer;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wh-link-chip:hover{background:rgba(88,166,255,.16);border-color:rgba(88,166,255,.5)}
.wh-unknown-accordion{border:1px solid rgba(245,158,11,.28);border-radius:16px;background:rgba(245,158,11,.055);overflow:hidden;margin-bottom:12px}.wh-unknown-summary{width:100%;border:0;background:transparent;color:inherit;display:flex;align-items:center;gap:10px;padding:12px 14px;text-align:right;cursor:pointer}.wh-unknown-summary-icon{font-size:19px}.wh-unknown-summary-copy{display:flex;flex-direction:column;gap:2px;flex:1}.wh-unknown-summary-copy b{color:var(--vt-warn);font-size:12px}.wh-unknown-summary-copy small{color:var(--vt-text-muted);font-size:10px}.wh-unknown-chevron{font-size:20px;transition:.2s transform}.wh-unknown-accordion.is-open .wh-unknown-chevron{transform:rotate(180deg)}.wh-unknown-body{display:none;padding:0 14px 12px}.wh-unknown-accordion.is-open .wh-unknown-body{display:block}.wh-unknown-list{display:grid;gap:6px}.wh-unknown-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;border-top:1px solid rgba(245,158,11,.14);padding:9px 2px}.wh-unknown-info{min-width:0}.wh-unknown-info>b{display:block;overflow-wrap:anywhere}.wh-unknown-info>small{display:block;color:var(--vt-text-muted);font-size:10px;margin-top:3px}.wh-unknown-actions{display:flex;gap:6px}.wh-link-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 12px}.wh-link-kpis>div{border:1px solid var(--vt-line);border-radius:14px;padding:10px;background:var(--vt-surface-1)}.wh-link-kpis small{display:block;color:var(--vt-text-muted);font-size:10px}.wh-link-kpis b{display:block;font-size:19px;margin-top:3px}.wh-link-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:10px}.wh-link-panel{border:1px solid var(--vt-line);border-radius:16px;padding:12px;background:var(--vt-surface-1)}.wh-link-panel h3{margin:0 0 9px;font-size:13px}.wh-link-name,.wh-link-log{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--vt-line)}.wh-link-name:last-child,.wh-link-log:last-child{border-bottom:0}.wh-link-name{flex-direction:column;gap:2px}.wh-link-name small,.wh-link-log span{color:var(--vt-text-muted);font-size:10px}.wh-link-log>div:first-child{display:flex;flex-direction:column;gap:2px}.wh-link-source{text-align:left;direction:ltr;display:flex;flex-direction:column;font-size:10px}.wh-link-source span{max-width:170px;overflow:hidden;text-overflow:ellipsis}.wh-link-logs{max-height:440px;overflow:auto}@media(max-width:760px){.wh-link-layout{grid-template-columns:1fr}.wh-link-kpis{grid-template-columns:1fr}.wh-unknown-row{grid-template-columns:1fr}.wh-unknown-actions{justify-content:flex-end}}

/* =============================================================================
   v10.8 — Member & onboarding experience
   ========================================================================== */
#member-list-modal .modal-content,#all-members-modal .modal-content{width:min(1180px,calc(100vw - 26px));max-height:92vh;overflow:hidden;display:flex;flex-direction:column}
.vp-modal-hero{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding-inline-end:48px}
.vp-modal-hero h2{margin:0 0 3px;padding:0;font-size:20px;letter-spacing:-.02em}.vp-modal-hero p{margin:0;color:var(--vt-text-mute);font-size:12px;line-height:1.75}.vp-modal-icon{width:46px;height:46px;flex:0 0 auto;border-radius:15px;display:grid;place-items:center;font-size:21px;background:linear-gradient(145deg,color-mix(in srgb,var(--vt-brand-500) 24%,var(--vt-surface-2)),var(--vt-surface-2));border:1px solid color-mix(in srgb,var(--vt-brand-400) 30%,var(--vt-line));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.vp-kpi-strip{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:8px;margin-bottom:11px}.vp-kpi{min-width:0;padding:10px 11px;border-radius:13px;border:1px solid var(--vt-line);background:linear-gradient(145deg,var(--vt-surface-2),color-mix(in srgb,var(--vt-surface-1) 84%,transparent));display:grid;gap:2px}.vp-kpi span,.vp-kpi small{font-size:10px;color:var(--vt-text-mute)}.vp-kpi b{font-size:17px;line-height:1.25;font-family:var(--vt-font-num);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vp-kpi.is-success{border-color:color-mix(in srgb,var(--vt-success) 30%,var(--vt-line));background:color-mix(in srgb,var(--vt-success) 7%,var(--vt-surface-2))}.vp-kpi.is-warn{border-color:color-mix(in srgb,var(--vt-warn) 32%,var(--vt-line));background:color-mix(in srgb,var(--vt-warn) 7%,var(--vt-surface-2))}.vp-kpi.is-danger{border-color:color-mix(in srgb,var(--vt-danger) 34%,var(--vt-line));background:color-mix(in srgb,var(--vt-danger) 7%,var(--vt-surface-2))}
#member-list,#all-members-list{overflow:auto;min-height:0;padding:2px 3px 10px}.member-list-glass{display:grid;gap:8px}.member-box{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 12px!important;border-radius:15px!important;background:linear-gradient(145deg,color-mix(in srgb,var(--vt-surface-2) 91%,transparent),var(--vt-surface-1))!important}.member-info{min-width:0;display:flex!important;align-items:center;gap:9px;flex-wrap:wrap}.vp-member-avatar{width:38px;height:38px;border-radius:12px;flex:0 0 38px;display:grid;place-items:center;background:linear-gradient(145deg,var(--vt-brand-500),#326fd7);background-size:cover;background-position:center;color:#fff;font-weight:900;font-size:12px;box-shadow:0 5px 15px rgba(0,0,0,.18)}.member-rank{min-width:34px;height:28px;padding:0 7px;border:1px solid var(--vt-line);border-radius:9px;display:grid;place-items:center;color:var(--vt-brand-300);background:var(--vt-surface-1);font-size:11px}.member-name{min-width:120px;font-weight:850;display:flex;flex-direction:column;line-height:1.25}.member-name small{font-weight:500;font-size:9px;margin-top:3px;color:var(--vt-text-mute);font-family:var(--vt-font-num)}.member-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:0}.member-actions{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end}.member-actions button{min-height:32px!important}.pending-badge{position:absolute;top:7px;inset-inline-start:7px;min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;border-radius:999px;background:var(--vt-danger);color:#fff;font-size:9px;font-weight:900;box-shadow:0 3px 12px rgba(255,95,109,.3)}
#all-members-list>section{border:1px solid color-mix(in srgb,var(--vt-danger) 22%,var(--vt-line));background:color-mix(in srgb,var(--vt-danger) 3%,transparent);border-radius:16px;padding:10px;margin-bottom:12px}.history-member-card{position:relative;overflow:hidden;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.history-member-card:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--vt-brand-400) 28%,var(--vt-line));box-shadow:0 10px 28px rgba(0,0,0,.18)}.history-member-head{gap:10px}.history-member-name{font-size:14px;font-weight:900}.history-member-steam{font-family:var(--vt-font-num);font-size:10px;color:var(--vt-text-mute);margin-top:3px}.history-member-badges{gap:5px}.history-member-grid{grid-template-columns:repeat(4,minmax(125px,1fr));gap:7px}.history-member-field{border-radius:10px;background:color-mix(in srgb,var(--vt-surface-2) 76%,transparent);border:1px solid color-mix(in srgb,var(--vt-line) 72%,transparent);padding:8px 9px}.history-member-field small{display:block;color:var(--vt-text-mute);font-size:9px;margin-bottom:3px}.history-member-field b{font-size:11px}.history-member-events summary{cursor:pointer;color:var(--vt-brand-300);font-size:10px;padding:7px 0;user-select:none}
.owner-member-manage-btn{border-radius:9px!important;min-height:30px!important;padding:0 10px!important}

/* Initial member seed */
.vp-seed-modal{width:min(800px,calc(100vw - 26px));position:relative}.vp-seed-steps{display:flex;align-items:center;gap:7px;margin:2px 0 15px;padding:8px 10px;border:1px solid var(--vt-line);border-radius:12px;background:var(--vt-surface-1);font-size:10px;color:var(--vt-text-mute)}.vp-seed-steps span{display:flex;align-items:center;gap:5px}.vp-seed-steps b{width:20px;height:20px;border-radius:7px;display:grid;place-items:center;background:var(--vt-surface-2);color:var(--vt-text)}.vp-seed-steps .is-active{color:var(--vt-brand-300);font-weight:800}.vp-seed-steps .is-active b{background:var(--vt-brand-500);color:#fff}.vp-seed-steps i{font-style:normal;opacity:.5}.vp-seed-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(230px,.75fr);gap:14px}.vp-seed-form{display:grid;gap:13px}.vp-seed-preview{border:1px solid color-mix(in srgb,var(--vt-brand-400) 24%,var(--vt-line));border-radius:16px;background:radial-gradient(circle at 80% 0%,rgba(139,61,255,.14),transparent 42%),var(--vt-surface-1);padding:14px;display:flex;flex-direction:column;gap:10px;min-width:0}.vp-seed-preview-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--vt-surface-2);font-size:20px}.vp-seed-preview-box{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 10px;padding:10px;border-radius:12px;background:rgba(0,0,0,.12);border:1px solid var(--vt-line)}.vp-seed-preview-box span{font-size:9px;color:var(--vt-text-mute)}.vp-seed-preview-box strong,.vp-seed-preview-box code{min-width:0;font-size:10px;overflow-wrap:anywhere;text-align:left;direction:ltr}.vp-seed-preview-box strong.is-ready{color:var(--vt-success)}.vp-seed-flow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;font-size:9px}.vp-seed-flow span{padding:6px;border-radius:8px;background:var(--vt-warn-soft);text-align:center;color:var(--vt-warn)}.vp-seed-flow span.ok{background:var(--vt-success-soft);color:var(--vt-success)}.vp-seed-flow i{font-style:normal;color:var(--vt-text-mute);font-size:8px}.vp-seed-preview>small{color:var(--vt-text-mute);font-size:9px;line-height:1.8}.vp-seed-status{min-height:34px;padding:8px 10px;border-radius:10px;background:var(--vt-surface-1);border:1px solid var(--vt-line);font-size:10px;display:flex;align-items:center}.vp-seed-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:2px}

@media(max-width:900px){.vp-kpi-strip{grid-template-columns:repeat(2,minmax(120px,1fr))}.vp-seed-layout{grid-template-columns:1fr}.history-member-grid{grid-template-columns:repeat(2,minmax(110px,1fr))}.member-box{grid-template-columns:1fr}.member-actions{justify-content:flex-start;padding-inline-start:47px}}
@media(max-width:560px){.vp-kpi-strip{display:flex;overflow-x:auto}.vp-kpi{min-width:135px}.vp-modal-hero{align-items:flex-start}.vp-modal-icon{width:40px;height:40px}.history-member-grid{grid-template-columns:1fr}.member-info{align-items:flex-start}.member-meta{width:100%;padding-inline-start:47px}.member-actions{padding-inline-start:47px}.vp-seed-steps{overflow:auto;white-space:nowrap}.vp-seed-preview{display:none}}

/* ========================================================================== */
/* v10.9 — Member list responsive control cards                               */
/* ========================================================================== */
#member-list-modal .modal-content{width:min(1180px,calc(100vw - 28px));max-height:92vh;overflow:hidden;display:flex;flex-direction:column}
#member-list-modal #member-list{min-height:0;max-height:62vh;overflow:auto;padding:10px;background:transparent;border:0}
#member-list-modal .member-box{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:12px;margin:0 0 10px;padding:14px;border-radius:18px;background:linear-gradient(145deg,var(--vt-surface-1),color-mix(in srgb,var(--vt-surface-2) 82%,transparent));overflow:visible;min-width:0;transform:none!important}
#member-list-modal .member-box.deficit{border-color:color-mix(in srgb,var(--vt-danger) 46%,var(--vt-line));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--vt-danger) 10%,transparent)}
#member-list-modal .vp-member-shell{display:grid;gap:12px;min-width:0;width:100%}
#member-list-modal .vp-member-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;min-width:0}
#member-list-modal .vp-member-identity{display:flex;align-items:center;gap:11px;min-width:0;flex:1}
#member-list-modal .vp-member-avatar-lg{width:48px;height:48px;border-radius:15px;flex:0 0 48px;font-size:13px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
#member-list-modal .vp-member-title{display:grid;gap:4px;min-width:0}.vp-member-name-line{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.vp-member-name-line>b{font-size:15px;overflow-wrap:anywhere}.vp-member-title>small{color:var(--vt-text-muted);font-size:10px}.vp-member-badges{display:flex;gap:5px;flex-wrap:wrap;margin-top:2px}
#member-list-modal .vp-member-presence-block{display:grid;justify-items:end;gap:4px;text-align:left;flex:0 0 auto}.vp-member-presence-block small{font-size:9px;color:var(--vt-text-muted);white-space:normal;max-width:190px}
#member-list-modal .vp-member-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;min-width:0}.vp-member-stat{min-width:0;border:1px solid var(--vt-line);background:rgba(255,255,255,.018);border-radius:13px;padding:9px 10px;display:grid;gap:4px}.vp-member-stat span{font-size:9px;color:var(--vt-text-muted)}.vp-member-stat b{font-size:11px;overflow-wrap:anywhere;min-width:0}
#member-list-modal .vp-member-actions{align-self:center;display:grid;grid-template-columns:repeat(2,minmax(110px,1fr));gap:7px;min-width:235px;margin:0}.vp-member-actions button{width:100%;white-space:nowrap}
@media(max-width:900px){#member-list-modal .member-box{grid-template-columns:1fr}.vp-member-actions{grid-template-columns:repeat(4,minmax(0,1fr))!important;min-width:0!important}.vp-member-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:620px){#member-list-modal .modal-content{width:calc(100vw - 12px)}#member-list-modal .vp-member-head{display:grid}.vp-member-presence-block{justify-items:start!important;text-align:right!important}.vp-member-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}.vp-member-stats{grid-template-columns:1fr 1fr!important}}
@media(max-width:420px){.vp-member-actions,.vp-member-stats{grid-template-columns:1fr!important}}

/* ========================================================================
   Vanta v11 — Warehouse Item Intelligence
   ======================================================================== */
.wh-row[role="button"]{cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}.wh-row[role="button"]:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--vt-brand-400) 28%,var(--vt-line));background:color-mix(in srgb,var(--vt-surface-1) 96%,var(--vt-brand-500) 4%);box-shadow:0 9px 28px rgba(0,0,0,.10)}.wh-row[role="button"]:focus-visible{outline:2px solid color-mix(in srgb,var(--vt-brand-400) 60%,transparent);outline-offset:2px}
.wh-report-modal{max-width:1180px!important;max-height:min(92vh,940px)!important;overflow:auto!important}.wh-report-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:2px 0 10px}.wh-report-head h2{margin:3px 0 4px;font-size:22px}.wh-report-eyebrow{font:900 9px/1 ui-sans-serif,system-ui;letter-spacing:1.4px;color:var(--vt-brand-300)}.wh-report-head p{margin:0;font-size:11px}.wh-report-aliases{display:flex;justify-content:flex-end;gap:5px;flex-wrap:wrap;max-width:45%}.wh-report-aliases span{padding:5px 8px;border:1px solid var(--vt-line);border-radius:999px;background:var(--vt-surface-2);font:700 9px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--vt-text-soft)}
.wh-report-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 0 13px;padding:8px;border:1px solid var(--vt-line);border-radius:16px;background:color-mix(in srgb,var(--vt-surface-1) 96%,transparent)}.wh-report-ranges{display:flex;gap:5px;flex-wrap:wrap}.wh-report-ranges button{border:1px solid transparent;border-radius:11px;padding:8px 12px;background:transparent;color:var(--vt-text-muted);font-size:10px;font-weight:800;cursor:pointer}.wh-report-ranges button:hover{background:var(--vt-surface-2);color:var(--vt-text)}.wh-report-ranges button.active{border-color:color-mix(in srgb,var(--vt-brand-400) 35%,var(--vt-line));background:color-mix(in srgb,var(--vt-brand-500) 11%,var(--vt-surface-2));color:var(--vt-brand-200)}.wh-report-custom{display:flex;align-items:center;gap:6px}.wh-report-custom input{width:145px!important;margin:0!important;padding:7px 8px!important;font-size:10px!important}
.wh-report-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:10px}.wh-report-kpis>div{position:relative;overflow:hidden;border:1px solid var(--vt-line);border-radius:16px;padding:12px;background:linear-gradient(145deg,var(--vt-surface-1),rgba(255,255,255,.02))}.wh-report-kpis>div:before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:3px;background:var(--vt-brand-400)}.wh-report-kpis>div.put:before{background:#36d28d}.wh-report-kpis>div.take:before{background:#ff657c}.wh-report-kpis small{display:block;color:var(--vt-text-muted);font-size:9px}.wh-report-kpis b{display:block;margin:5px 0 3px;font-size:20px}.wh-report-kpis span{font-size:8px;color:var(--vt-text-mute)}
.wh-report-section{border:1px solid var(--vt-line);border-radius:18px;background:linear-gradient(145deg,var(--vt-surface-1),rgba(255,255,255,.015));padding:13px;min-width:0}.wh-report-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.wh-report-section-head h3{margin:0;font-size:13px}.wh-report-section-head p{margin:3px 0 0;color:var(--vt-text-muted);font-size:9px}.wh-chart-legend{display:flex;gap:8px;font-size:9px;font-weight:800}.wh-chart-legend .put,.wh-report-actor .put{color:#49dc9e}.wh-chart-legend .take,.wh-report-actor .take{color:#ff7188}.wh-report-chart{display:block;width:100%;height:auto;max-height:280px;overflow:visible}.wh-report-chart text{fill:var(--vt-text-mute);font-size:9px}.wh-chart-axis{stroke:var(--vt-line-strong);stroke-width:1}.wh-chart-put{fill:#3ed998;opacity:.88}.wh-chart-take{fill:#ff657c;opacity:.86}.wh-report-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:10px;margin-top:10px}.wh-report-actors,.wh-report-timeline{display:grid;gap:6px;max-height:410px;overflow:auto;padding-inline-end:2px}.wh-report-actor{display:grid;grid-template-columns:28px minmax(0,1fr) 74px 74px 78px;align-items:center;gap:7px;padding:8px;border:1px solid rgba(148,163,184,.09);border-radius:12px;background:rgba(255,255,255,.018)}.wh-report-actor .rank{width:25px;height:25px;display:grid;place-items:center;border-radius:9px;background:var(--vt-surface-2);color:var(--vt-text-muted);font-size:9px;font-weight:900}.wh-report-actor .who{min-width:0;display:grid;gap:2px}.wh-report-actor .who b{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wh-report-actor .who small{font-size:7px;color:var(--vt-text-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wh-report-actor>div:not(.who){display:grid;gap:2px;text-align:center}.wh-report-actor>div small{font-size:7px;color:var(--vt-text-mute)}.wh-report-actor>div b{font-size:10px}.wh-report-timeline article{position:relative;display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px 5px;border-bottom:1px solid rgba(148,163,184,.08)}.wh-report-timeline article:last-child{border-bottom:0}.wh-timeline-dot{width:8px;height:8px;border-radius:50%;background:#3ed998;box-shadow:0 0 0 4px rgba(62,217,152,.08)}.wh-timeline-dot.take{background:#ff657c;box-shadow:0 0 0 4px rgba(255,101,124,.08)}.wh-report-timeline article>div:nth-child(2){display:grid;gap:2px}.wh-report-timeline b{font-size:9px}.wh-report-timeline small{font-size:7px;color:var(--vt-text-mute)}.wh-report-timeline .source{display:grid;text-align:left;gap:2px}.wh-report-timeline .source span{font-size:7px;color:var(--vt-text-muted)}.wh-report-timeline .source b{font:800 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.wh-report-empty{text-align:center;padding:25px;color:var(--vt-text-muted);font-size:10px;border:1px dashed var(--vt-line);border-radius:13px}
@media(max-width:900px){.wh-report-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.wh-report-grid{grid-template-columns:1fr}.wh-report-aliases{max-width:100%;justify-content:flex-start}.wh-report-head{flex-direction:column}.wh-report-actor{grid-template-columns:28px minmax(0,1fr) repeat(2,64px)}.wh-report-actor>div:last-child{display:none}}
@media(max-width:560px){.wh-report-kpis{grid-template-columns:1fr 1fr}.wh-report-toolbar{align-items:stretch}.wh-report-ranges{display:grid;grid-template-columns:1fr 1fr;width:100%}.wh-report-ranges button{width:100%}.wh-report-custom{width:100%;flex-wrap:wrap}.wh-report-custom input{flex:1;min-width:120px;width:auto!important}.wh-report-actor{grid-template-columns:25px minmax(0,1fr) 58px}.wh-report-actor>div:nth-of-type(3),.wh-report-actor>div:last-child{display:none}.wh-report-timeline article{grid-template-columns:10px minmax(0,1fr)}.wh-report-timeline .source{grid-column:2;display:flex;gap:6px;text-align:right}.wh-report-kpis b{font-size:16px}}

/* Warehouse item intelligence v12.8 */
.wh-stock-query{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(260px,1.4fr) minmax(150px,.8fr);align-items:center;gap:10px;margin:0 0 12px;padding:11px 12px;border:1px solid var(--vt-line);border-radius:16px;background:linear-gradient(145deg,var(--vt-surface-1),rgba(255,255,255,.015))}.wh-stock-query>div:first-child{display:grid;gap:3px}.wh-stock-query>div:first-child small{font-size:8px;color:var(--vt-text-mute);font-weight:800}.wh-stock-query>div:first-child strong{font-size:11px}.wh-stock-query-control{display:flex;align-items:center;gap:7px;justify-content:center}.wh-stock-query-control input{width:92px!important;margin:0!important;text-align:center;font-weight:900;font-size:13px!important}.wh-stock-query-control span{font-size:9px;color:var(--vt-text-muted);white-space:nowrap}.wh-stock-query-result{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:8px;row-gap:1px;justify-self:end;text-align:left}.wh-stock-query-result small{grid-row:1;color:var(--vt-text-mute);font-size:8px}.wh-stock-query-result b{grid-row:1/3;font-size:22px;color:var(--vt-brand-200)}.wh-stock-query-result span{grid-row:2;font-size:8px;color:var(--vt-text-muted)}
.wh-report-kpis-v2{grid-template-columns:repeat(6,minmax(0,1fr))}.wh-report-kpis>div.stock:before{background:var(--vt-brand-400)}
.wh-stock-snapshots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:10px}.wh-stock-snapshot{position:relative;overflow:hidden;display:grid;gap:3px;padding:10px 12px;border:1px solid var(--vt-line);border-radius:14px;background:color-mix(in srgb,var(--vt-surface-1) 94%,transparent)}.wh-stock-snapshot:after{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:2px;background:var(--vt-brand-400)}.wh-stock-snapshot small{font-size:8px;color:var(--vt-text-muted)}.wh-stock-snapshot b{font-size:17px}.wh-stock-snapshot span{font-size:7px;color:var(--vt-text-mute)}.wh-stock-snapshot.is-unavailable{opacity:.62}.wh-stock-snapshot.is-unavailable:after{background:var(--vt-line-strong)}
.wh-data-health{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;padding:9px 11px;border:1px solid var(--vt-line);border-radius:14px;background:rgba(255,255,255,.012)}.wh-data-health>div:first-child{display:grid;gap:2px;min-width:90px}.wh-data-health b{font-size:10px}.wh-data-health small{font-size:7px;color:var(--vt-text-mute)}.wh-data-health-notes{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}.wh-data-health-notes span{padding:5px 8px;border-radius:999px;border:1px solid var(--vt-line);font-size:8px;font-weight:800}.wh-data-health-notes .ok{color:#55dda4;background:rgba(62,217,152,.06);border-color:rgba(62,217,152,.16)}.wh-data-health-notes .warn{color:#ffc16e;background:rgba(245,158,11,.06);border-color:rgba(245,158,11,.16)}.wh-data-health-notes .info{color:var(--vt-brand-200);background:color-mix(in srgb,var(--vt-brand-500) 7%,transparent);border-color:color-mix(in srgb,var(--vt-brand-400) 20%,var(--vt-line))}
.wh-trend-section{margin-bottom:10px}.wh-chart-legend .stock{color:var(--vt-brand-200)}.wh-chart-stock{fill:none;stroke:var(--vt-brand-300);stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))}
.wh-insights-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:10px}.wh-insight{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:8px;padding:10px;border:1px solid var(--vt-line);border-radius:14px;background:linear-gradient(145deg,var(--vt-surface-1),rgba(255,255,255,.012));min-width:0}.wh-insight-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:var(--vt-surface-2);font-size:14px;color:var(--vt-brand-200)}.wh-insight>div{display:grid;gap:2px;min-width:0}.wh-insight small{font-size:7px;color:var(--vt-text-mute)}.wh-insight b{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wh-insight span:not(.wh-insight-icon){font-size:7px;color:var(--vt-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wh-hourly-section{margin-bottom:10px}.wh-hourly-table-wrap{overflow:auto;max-height:390px;border:1px solid rgba(148,163,184,.08);border-radius:12px}.wh-hourly-table{width:100%;border-collapse:separate;border-spacing:0;min-width:720px;font-size:9px}.wh-hourly-table th{position:sticky;top:0;z-index:2;background:var(--vt-surface-2);padding:8px 9px;text-align:right;color:var(--vt-text-muted);font-size:8px;border-bottom:1px solid var(--vt-line)}.wh-hourly-table td{padding:8px 9px;border-bottom:1px solid rgba(148,163,184,.07);white-space:nowrap}.wh-hourly-table tbody tr:last-child td{border-bottom:0}.wh-hourly-table tbody tr:hover{background:rgba(255,255,255,.018)}.wh-hourly-table td.put{color:#49dc9e;font-weight:900}.wh-hourly-table td.take{color:#ff7188;font-weight:900}.wh-hourly-table td.stock{color:var(--vt-brand-200);font-weight:900}.wh-hourly-table td:first-child b{font-size:8px;color:var(--vt-text-soft)}
@media(max-width:1100px){.wh-report-kpis-v2{grid-template-columns:repeat(3,minmax(0,1fr))}.wh-insights-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.wh-stock-query{grid-template-columns:1fr 1.3fr}.wh-stock-query-result{grid-column:1/-1;justify-self:stretch;grid-template-columns:auto auto 1fr;text-align:right}.wh-stock-query-result b{grid-row:auto}.wh-stock-query-result span{grid-row:auto}}
@media(max-width:760px){.wh-stock-snapshots{grid-template-columns:1fr 1fr}.wh-insights-grid{grid-template-columns:1fr 1fr}.wh-data-health{align-items:flex-start;flex-direction:column}.wh-data-health-notes{justify-content:flex-start}.wh-stock-query{grid-template-columns:1fr}.wh-stock-query-control{justify-content:flex-start}.wh-stock-query-result{grid-column:auto}.wh-report-kpis-v2{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.wh-insights-grid{grid-template-columns:1fr}.wh-stock-query-control{display:grid;grid-template-columns:90px 1fr auto}.wh-stock-query-control input{width:90px!important}.wh-stock-snapshots{grid-template-columns:1fr 1fr}.wh-report-kpis-v2{grid-template-columns:1fr 1fr}.wh-report-kpis-v2>div{padding:10px}.wh-report-kpis-v2 b{font-size:15px}}


/* ==========================================================================
   Gang Level modal: intentionally no global VP sheen/reflection.
   This surface owns its own hover states and must stay visually stable.
   ========================================================================== */
#gang-level-modal button::after,
#gang-level-modal button:hover::after,
#gang-level-modal button:focus::after,
#gang-level-modal button:active::after {
  content: none !important;
  display: none !important;
  animation: none !important;
  background: none !important;
  transform: none !important;
  opacity: 0 !important;
}
