/* ==========================================================================
   استایل صفحات خاص
   ========================================================================== */

/* ----------------------------- صفحه‌ی ورود ------------------------------ */
.login-card {
  position: relative;
  width: 100%;
  max-width: 400px;
  padding: var(--sp-6) var(--sp-5) var(--sp-5);
  border-radius: var(--r-2xl);
  /* شیشه‌ی واقعی: شفافیت بالا + blur/saturate شدید + لبه‌ی specular */
  background: var(--glass-bg);
  border: none;
  backdrop-filter: blur(var(--glass-blur)) saturate(200%);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(200%);
  box-shadow: var(--sh-lg), var(--glass-edge);
  animation: fade-up var(--dur-3) var(--ease) both;
  overflow: hidden;
}
/* انکسار نور: هایلایت مورب که با نور پس‌زمینه ترکیب می‌شود */
.login-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(120% 60% at 20% -10%, rgba(255, 255, 255, 0.22), transparent 55%),
    radial-gradient(80% 40% at 90% 110%, rgba(255, 255, 255, 0.08), transparent 60%);
  pointer-events: none;
}
.login-card > * {
  position: relative;
}

.login-head {
  text-align: center;
  margin-bottom: var(--sp-5);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-3);
}
.login-logo-mark {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  /* حباب شیشه‌ای لوگو */
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
  box-shadow:
    0 10px 26px rgba(20, 5, 32, 0.3),
    inset 0 1px 1px rgba(255, 255, 255, 1);
  line-height: 0;
  flex-shrink: 0;
}
.login-logo-mark svg {
  display: block;
  max-width: 40px;
  max-height: 40px;
  width: auto;
  height: auto;
}
.login-brand {
  font-size: var(--fs-2xl);
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
}
.login-sub {
  font-size: var(--fs-sm);
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.6;
  max-width: 280px;
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}

/* در کارت شیشه‌ای، فیلدها هم شیشه‌اند: شفاف با متن روشن و لبه‌ی نورانی */
.login-card .field__label {
  color: rgba(255, 255, 255, 0.9);
}
.login-card .input {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  caret-color: #fff;
  box-shadow: var(--glass-edge-soft);
}
.login-card .input::placeholder {
  color: rgba(255, 255, 255, 0.45);
  opacity: 1;
}
.login-card .input:hover {
  background: rgba(255, 255, 255, 0.14);
}
.login-card .input:focus {
  background: rgba(255, 255, 255, 0.18);
  box-shadow:
    var(--glass-edge-soft),
    0 0 0 3.5px rgba(255, 255, 255, 0.22);
}
.login-card .input-wrap__icon {
  color: rgba(255, 255, 255, 0.6);
}
.login-card .input-wrap:focus-within .input-wrap__icon {
  color: #fff;
}
.login-card .input-action {
  color: rgba(255, 255, 255, 0.6);
}
.login-card .input-action:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
}
.login-card .field__error {
  color: #ffb3c1;
}
.login-card .input--error {
  box-shadow: var(--glass-edge-soft), inset 0 0 0 1.5px rgba(255, 120, 140, 0.8);
}
.login-card .input--otp {
  font-size: var(--fs-xl);
  font-weight: 700;
  letter-spacing: 0.35em;
  text-align: center;
  padding-inline: var(--sp-4) !important;
  direction: ltr;
}
.login-card .input-wrap:has(.input--otp) .input-wrap__icon {
  display: none;
}

.login-otp-step[hidden] {
  display: none !important;
}

.login-otp-hint {
  font-size: var(--fs-xs);
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.6;
  margin-bottom: var(--sp-1);
}
.login-otp-hint strong {
  color: #fff;
  font-weight: 700;
}

.login-otp-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  margin-top: var(--sp-2);
  flex-wrap: wrap;
}

.link-btn {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
  padding: var(--sp-1) 0;
  transition: opacity var(--dur-1) var(--ease);
}
.link-btn:hover:not(:disabled) {
  opacity: 1;
  text-decoration: underline;
}
.link-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.login-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  flex-wrap: wrap;
}
.login-card .checkbox {
  color: rgba(255, 255, 255, 0.85);
}
.login-card .checkbox__box {
  border-color: rgba(255, 255, 255, 0.6);
  background: rgba(255, 255, 255, 0.15);
}
.link {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: #fff;
  opacity: 0.9;
  transition: opacity var(--dur-1) var(--ease);
}
.link:hover {
  opacity: 1;
  text-decoration: underline;
}

.login-hint {
  margin-top: var(--sp-3);
  text-align: center;
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.75);
}

.contact-hint {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, 0.1);
  box-shadow: var(--glass-edge-soft);
  color: rgba(255, 255, 255, 0.88);
  font-size: var(--fs-xs);
  line-height: 1.7;
  text-align: start;
}
.contact-hint b {
  color: #fff;
  font-weight: 700;
}
.contact-hint__icon {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #00b894;
  display: grid;
  place-items: center;
}
.contact-hint__icon svg {
  width: 16px;
  height: 16px;
}

/* ------- صفحات auth چندمرحله‌ای (register/pending/contract/brand) ------- */
.auth-page {
  width: 100%;
  max-width: 460px;
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  padding: max(var(--sp-5), env(safe-area-inset-top)) var(--sp-5)
    max(var(--sp-5), env(safe-area-inset-bottom));
  max-height: 100dvh;
  overflow-y: auto;
}
.auth-panel {
  padding: var(--sp-6) var(--sp-5);
  border-radius: var(--r-2xl);
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur)) saturate(200%);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(200%);
  box-shadow: var(--sh-lg), var(--glass-edge);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  animation: fade-up var(--dur-3) var(--ease) both;
}
.auth-panel .field__label { color: rgba(255, 255, 255, 0.9); }
.auth-panel .input,
.auth-panel .select,
.auth-panel .textarea {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  box-shadow: var(--glass-edge-soft);
}
.auth-panel .input::placeholder,
.auth-panel .textarea::placeholder { color: rgba(255, 255, 255, 0.45); }
.auth-panel .select option { color: #1c1024; }
.auth-panel .field__error { color: #ffb3c1; }
.auth-head {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-2);
}
.auth-head .login-logo-mark { width: 60px; height: 60px; padding: 12px; }
.auth-title { font-size: var(--fs-xl); font-weight: 800; color: #fff; }
.auth-sub { font-size: var(--fs-sm); color: rgba(255, 255, 255, 0.8); line-height: 1.7; }
.auth-back {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  font-size: var(--fs-sm);
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
}
.auth-back svg { width: 18px; height: 18px; }

/* آیکن حالت بزرگ وسط (pending / موفقیت) */
.auth-status-icon {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  margin: 0 auto;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: var(--glass-edge), 0 12px 30px rgba(20, 5, 32, 0.3);
}
.auth-status-icon svg { width: 44px; height: 44px; }
.auth-status-icon--ok { background: linear-gradient(135deg, #2bc98a, #148f5d); }
.auth-status-icon--wait { background: linear-gradient(135deg, #f4b53f, #c98410); }

/* گام‌شمار روی auth (نقطه‌ها) */
.auth-dots { display: flex; justify-content: center; gap: var(--sp-2); }
.auth-dots i {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transition: all var(--dur-2) var(--ease);
}
.auth-dots i.on { width: 22px; border-radius: var(--r-full); background: #fff; }

/* متن قرارداد اسکرول‌شونده */
.contract-box {
  max-height: 240px;
  overflow-y: auto;
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, 0.1);
  box-shadow: var(--glass-edge-soft);
  color: rgba(255, 255, 255, 0.9);
  font-size: var(--fs-sm);
  line-height: 2;
}
.contract-box h3 { color: #fff; margin: var(--sp-3) 0 var(--sp-1); font-size: var(--fs-md); font-weight: 700; }
.contract-box h3:first-child { margin-top: 0; }
.contract-box h4 { color: rgba(255, 255, 255, 0.92); margin: var(--sp-2) 0 var(--sp-1); font-size: var(--fs-sm); font-weight: 700; }
.contract-box p { margin-bottom: var(--sp-2); }
.contract-box ul { padding-inline-start: var(--sp-4); margin-bottom: var(--sp-2); }
.contract-box li { list-style: disc; margin-bottom: var(--sp-1); }
.auth-panel .checkbox { color: rgba(255, 255, 255, 0.9); }
.auth-panel .checkbox__box {
  border-color: rgba(255, 255, 255, 0.6);
  background: rgba(255, 255, 255, 0.15);
}

/* پیش‌نمایش برند (فاکتور/لیبل) */
.brand-preview {
  border-radius: var(--r-lg);
  overflow: hidden;
  background: #fff;
  color: #1c1024;
  box-shadow: 0 10px 26px rgba(20, 5, 32, 0.3);
}
.bp-invoice { padding: var(--sp-4); }
.bp-top {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding-bottom: var(--sp-3);
  border-bottom: 1px dashed var(--line-strong);
}
.bp-logo {
  width: 42px; height: 42px; border-radius: var(--r-md);
  background: var(--surface-3); color: var(--brand);
  display: grid; place-items: center; overflow: hidden; flex-shrink: 0;
  font-weight: 800;
}
.bp-logo img { width: 100%; height: 100%; object-fit: cover; }
.bp-brandname { font-weight: 800; font-size: var(--fs-md); }
.bp-contact { font-size: var(--fs-xs); color: var(--ink-3); direction: ltr; text-align: start; }
.bp-rows { padding-top: var(--sp-3); font-size: var(--fs-xs); color: var(--ink-2); }
.bp-rows div { display: flex; justify-content: space-between; padding: 3px 0; }
.bp-label {
  margin-top: var(--sp-2);
  padding: var(--sp-3);
  background: var(--surface-3);
  font-size: var(--fs-xs);
  color: var(--ink-2);
  border-top: 1px dashed var(--line-strong);
}
.bp-label strong { color: var(--ink); }

/* آپلود لوگو */
.logo-upload {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.logo-upload__preview {
  width: 64px; height: 64px; border-radius: var(--r-lg); flex-shrink: 0;
  background: rgba(255, 255, 255, 0.15);
  box-shadow: var(--glass-edge-soft);
  display: grid; place-items: center; overflow: hidden;
  color: rgba(255, 255, 255, 0.6);
}
.logo-upload__preview img { width: 100%; height: 100%; object-fit: cover; }

/* نشان امنیت پایین کارت */
.login-secure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  margin-top: var(--sp-5);
  font-size: var(--fs-xs);
  color: rgba(255, 255, 255, 0.65);
}

/* ----------------------- صفحه‌ی داشبورد (نمونه) ------------------------- */
.page {
  position: relative;
  flex: 1;
  overflow-y: auto;
  padding: var(--sp-5);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}
/* فرزندان ستون اسکرول‌شونده هرگز له نشوند (به‌ویژه عناصر overflow:hidden مثل بنر پلن) */
.page > * {
  flex-shrink: 0;
}
/* هاله‌های رنگی درون صفحه: سطح یکنواخت نباشد تا کارت‌های شیشه‌ای
   رنگ متغیر برای نمونه‌برداری/انکسار داشته باشند (رفع ایراد لایه‌بندی) */
.page::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(60% 30% at 85% 8%, rgba(201, 59, 216, 0.28), transparent 60%),
    radial-gradient(55% 28% at 10% 40%, rgba(122, 92, 255, 0.22), transparent 62%),
    radial-gradient(50% 26% at 90% 72%, rgba(255, 96, 196, 0.16), transparent 64%);
}
.page > * {
  position: relative;
  z-index: 1;
}
@media (max-width: 900px) {
  .page {
    padding: var(--sp-4);
    padding-block-end: max(var(--sp-6), env(safe-area-inset-bottom));
  }
}
.page-header {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--sp-1);
}
.page-header__title {
  font-size: var(--fs-xl);
  font-weight: 800;
  color: var(--ink);
  line-height: 1.4;
}
.page-header__sub {
  font-size: var(--fs-sm);
  color: var(--ink-2);
  line-height: 1.5;
}

.plan-banner {
  padding: var(--sp-5);
  border-radius: var(--r-xl);
  /* شیشه‌ی تینت‌خورده‌ی برند (glass prominent) — نه گرادیان تخت */
  background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.22) 0%,
      rgba(255, 255, 255, 0) 50%
    ),
    linear-gradient(135deg, rgba(160, 30, 200, 0.78), rgba(100, 2, 130, 0.8));
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  color: #fff;
  box-shadow:
    var(--sh-brand),
    inset 0 1px 1px rgba(255, 255, 255, 0.5),
    inset 0 0 0 1px rgba(255, 255, 255, 0.2);
  position: relative;
  overflow: hidden;
}
.plan-banner > * {
  position: relative;
  z-index: 1;
}
/* بازتاب نور روی شیشه */
.plan-banner::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(
    110% 70% at 85% -20%,
    rgba(255, 255, 255, 0.25),
    transparent 55%
  );
  pointer-events: none;
}
.plan-banner__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
}
.plan-banner__label {
  font-size: var(--fs-xs);
  opacity: 0.85;
}
.plan-banner__value {
  font-size: var(--fs-2xl);
  font-weight: 800;
  margin-top: var(--sp-1);
  line-height: 1.3;
  overflow: visible;
}
.plan-banner__pct {
  font-size: var(--fs-lg);
  font-weight: 800;
  padding: var(--sp-1) var(--sp-3);
  border-radius: var(--r-full);
  background: rgba(255, 255, 255, 0.16);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}
.progress {
  height: 10px;
  border-radius: var(--r-full);
  background: rgba(0, 0, 0, 0.22);
  margin-top: var(--sp-4);
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
}
.progress__bar {
  height: 100%;
  border-radius: var(--r-full);
  background: #fff;
  box-shadow: 0 0 8px rgba(255, 255, 255, 0.6);
}
.plan-banner__hint {
  font-size: var(--fs-sm);
  line-height: 1.55;
  margin-top: var(--sp-3);
  opacity: 0.9;
}

/* پیشرفتِ تعداد سفارش تا پلن بعدی — داخل باکس پلن فعلی؛ کاملاً سفید و مینیمال */
.plan-progress {
  margin-top: var(--sp-4);
  padding-top: var(--sp-4);
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
}
.plan-progress__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  font-size: var(--fs-xs);
  font-weight: 600;
  opacity: 0.95;
  margin-bottom: var(--sp-2);
  text-shadow: 0 1px 3px rgba(60, 0, 80, 0.35);
}
.plan-progress__count {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  opacity: 1;
}
.plan-progress__count small {
  font-weight: 500;
  opacity: 0.85;
}
.plan-progress__track {
  height: 6px;
  border-radius: var(--r-full);
  background: rgba(255, 255, 255, 0.22);
  overflow: hidden;
}
.plan-progress__fill {
  height: 100%;
  border-radius: var(--r-full);
  background: #fff;
  transition: width var(--dur-3, 0.5s) var(--ease, ease);
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3);
}
.stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3);
}
.stat {
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  /* شیشه‌ی روشن و تمیز (نه خاکستریِ کدر): سفیدِ بالاتر + saturate کمتر */
  background: rgba(255, 255, 255, 0.62);
  backdrop-filter: blur(24px) saturate(135%);
  -webkit-backdrop-filter: blur(24px) saturate(135%);
  border: none;
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 1),
    inset 0 0 0 1px rgba(255, 255, 255, 0.6),
    0 6px 18px rgba(20, 5, 32, 0.08);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  min-width: 0;
  text-align: start;
}
/* کارت شاخص (فروش این ماه): تمام‌عرض، تینت برند، عدد بزرگ */
.stat--hero {
  grid-column: 1 / -1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.5)),
    rgba(240, 222, 250, 0.5);
}
.stat--hero .stat__value {
  font-size: var(--fs-3xl);
  color: var(--brand);
  letter-spacing: 0.01em;
}
a.stat {
  transition: background var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease),
    transform var(--dur-1) var(--ease);
}
a.stat:hover {
  background: rgba(255, 255, 255, 0.78);
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 1),
    inset 0 0 0 1px rgba(255, 255, 255, 0.8),
    0 10px 26px rgba(20, 5, 32, 0.12);
}
a.stat:active {
  transform: scale(0.98);
}
.stat__label {
  font-size: var(--fs-xs);
  color: var(--ink-2);
  line-height: 1.4;
}
.stat__value {
  font-size: var(--fs-xl);
  font-weight: 800;
  color: var(--ink);
  line-height: 1.25;
  text-align: start;
  word-break: break-word;
}

.section-title {
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--ink);
  margin-top: var(--sp-1);
}

.stat__value--sm {
  font-size: var(--fs-md);
}
.stat__value--link {
  font-size: var(--fs-md);
  color: var(--brand);
}
.stat__sub {
  font-size: var(--fs-xs);
  color: var(--ink-3);
}

/* ----------------------------- داشبورد ---------------------------------- */
.dash-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
}
.avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 55%),
    linear-gradient(135deg, rgba(160, 30, 200, 0.85), rgba(113, 1, 147, 0.9));
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: var(--fs-lg);
  flex-shrink: 0;
  overflow: hidden;
  box-shadow: var(--sh-brand), inset 0 1px 1px rgba(255, 255, 255, 0.5);
}
.avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* شبکه دوتایی کارت‌های کوچک (کیف پول / اشتراک) */
.duo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-3);
}
.mini-card {
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, 0.62);
  backdrop-filter: blur(24px) saturate(135%);
  -webkit-backdrop-filter: blur(24px) saturate(135%);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 1),
    inset 0 0 0 1px rgba(255, 255, 255, 0.6), 0 4px 14px rgba(20, 5, 32, 0.06);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  min-width: 0;
}
.mini-card--empty {
  align-items: center;
  text-align: center;
  padding: var(--sp-5);
}
.mini-card__head {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--fs-xs);
  color: var(--ink-2);
  font-weight: 600;
}
.mini-card__head svg {
  width: 17px;
  height: 17px;
  color: var(--brand);
  flex-shrink: 0;
}
.mini-card__value {
  font-size: var(--fs-lg);
  font-weight: 800;
  color: var(--ink);
  line-height: 1.3;
}
.mini-card__value small {
  font-size: var(--fs-xs);
  font-weight: 400;
  color: var(--ink-3);
}
.mini-card__sub {
  font-size: var(--fs-xs);
  color: var(--ink-3);
}
.mini-card__foot {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-2);
}
.mini-card__foot .mini-card__value {
  margin: 0;
}
.mini-card__action {
  flex-shrink: 0;
  height: 34px;
  padding: 0 var(--sp-3);
  border-radius: var(--r-full);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--brand);
  background: var(--brand-050);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  transition: background var(--dur-1) var(--ease);
}
.mini-card__action:hover {
  background: var(--brand-100);
}

/* سربرگ بخش با لینک «مشاهده همه» */
.section-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2);
  margin-top: var(--sp-1);
}
.section-row .link-more {
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--brand);
}

/* ردیف سفارش در داشبورد */
.order-mini {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, 0.62);
  backdrop-filter: blur(24px) saturate(135%);
  -webkit-backdrop-filter: blur(24px) saturate(135%);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 1),
    inset 0 0 0 1px rgba(255, 255, 255, 0.6);
  transition: background var(--dur-2) var(--ease);
}
.order-mini:hover {
  background: rgba(255, 255, 255, 0.75);
}
.order-mini__body {
  flex: 1;
  min-width: 0;
}
.order-mini__id {
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--ink);
  direction: ltr;
  text-align: end;
}
.order-mini__meta {
  font-size: var(--fs-xs);
  color: var(--ink-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.order-mini__side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--sp-1);
  flex-shrink: 0;
}
.order-mini__amount {
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--ink-2);
}

/* چیپ وضعیت سفارش */
.st-chip {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 var(--sp-2);
  border-radius: var(--r-full);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.st--pending { color: #9a6a08; background: var(--warning-soft); }
.st--confirmed { color: #1d5fb8; background: #e3eefc; }
.st--preparing { color: var(--brand); background: var(--brand-050); }
.st--shipped { color: #0f766e; background: #d9f3f0; }
.st--delivered { color: var(--success); background: var(--success-soft); }
.st--cancelled { color: var(--danger); background: var(--danger-soft); }
.st--returned { color: #52525b; background: #ececef; }

/* کارت کارشناس اختصاصی */
.expert-card {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-4);
  border-radius: var(--r-xl);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0) 55%),
    linear-gradient(135deg, rgba(160, 30, 200, 0.8), rgba(100, 2, 130, 0.82));
  backdrop-filter: blur(24px) saturate(170%);
  -webkit-backdrop-filter: blur(24px) saturate(170%);
  color: #fff;
  box-shadow: var(--sh-brand), inset 0 1px 1px rgba(255, 255, 255, 0.5),
    inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}
.expert-card__avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--brand);
  display: grid;
  place-items: center;
  flex-shrink: 0;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 1), 0 6px 16px rgba(20, 5, 32, 0.25);
}
.expert-card__body {
  flex: 1;
  min-width: 0;
}
.expert-card__role {
  font-size: var(--fs-xs);
  opacity: 0.85;
}
.expert-card__name {
  font-size: var(--fs-md);
  font-weight: 800;
}
.expert-card__call {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--brand);
  display: grid;
  place-items: center;
  flex-shrink: 0;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 1), 0 6px 16px rgba(20, 5, 32, 0.25);
  transition: transform var(--dur-1) var(--ease);
}
.expert-card__call:active {
  transform: scale(0.92);
}
.expert-card__actions {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-shrink: 0;
}
.expert-card__bale {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #00b894;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.4), 0 6px 16px rgba(0, 120, 90, 0.35);
  transition: transform var(--dur-1) var(--ease);
}
.expert-card__bale:active {
  transform: scale(0.92);
}