/* =========================================================
   Gem Store — حساب کاربری: ورود با کد پیامکی + پیشخوان

   Rides on style.css: same tokens, same nav, same starfield.
   خودکفا، مثل blog.css و cart.css — هیچ وابستگی‌ای به product.css.
   بلاب‌های آئورا (پایین‌تر) عیناً همان دستور نوری‌ست که در product.css
   برای صفحه‌ی محصول است، فقط با توکن‌های محلیِ همین فایل — تا این
   فایل هم مثل بقیه خودکفا بماند، نه وابسته به بارگذاری product.css.
   ========================================================= */

:root, :root[data-theme="light"]{ --acct-aurora-op: .34; }
:root[data-theme="dark"]{ --acct-aurora-op: .8; }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){ --acct-aurora-op: .8; }
}

/* عرض کلی صفحه: پیشخوان (نویگیشن + محتوا) به این عرض نیاز دارد؛ خودِ
   فرم ورود (.otp-login) عرض باریک‌تر خودش را جدا نگه می‌دارد، پس با
   این‌که این قاب یکی است، حالت لاگین باز هم مثل یک کارت وسط‌چین دیده
   می‌شود. */
.account-wrap{
  position:relative; max-width:1080px; margin-inline:auto;
  padding:var(--s-7) var(--s-5) var(--s-9);
}
.account-wrap .aurora{ position:absolute; inset:-8% -5% auto; block-size:600px; z-index:0; pointer-events:none; overflow:hidden; }
.account-wrap .aurora__blob{
  position:absolute; display:block; inline-size:clamp(240px,36vw,480px); aspect-ratio:1;
  border-radius:50%; filter:blur(70px); opacity:var(--acct-aurora-op); will-change:transform;
}
.account-wrap .aurora__blob--a{ inset-block-start:-10%; inset-inline-end:-6%; background:radial-gradient(circle, var(--indigo) 0%, transparent 68%); animation:acct-drift-a 24s ease-in-out infinite; }
.account-wrap .aurora__blob--b{ inset-block-start:24%; inset-inline-start:-10%; background:radial-gradient(circle, var(--cyan) 0%, transparent 68%); animation:acct-drift-b 29s ease-in-out infinite; }
@keyframes acct-drift-a{ 50%{ transform:translate(-6%,8%) scale(1.1); } }
@keyframes acct-drift-b{ 50%{ transform:translate(7%,-6%) scale(.9); } }
@media (prefers-reduced-motion:reduce){
  .account-wrap .aurora__blob{ animation:none; }
}
.account-wrap > :not(.aurora){ position:relative; z-index:1; }

.otp-login{
  max-width:440px; margin-inline:auto;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--e-2); padding:var(--s-6) var(--s-5);
}
.otp-login__title{ font-size:var(--t-lg); font-weight:900; margin-block-end:var(--s-2); }
.otp-login__lede{ color:var(--text-muted); font-size:var(--t-sm); margin:0 0 var(--s-5); }

.otp-login__step + .otp-login__step{ margin-block-start:var(--s-4); }
.otp-login__label{ display:block; font-size:.8125rem; font-weight:700; color:var(--text); margin-block-end:var(--s-2); }
.otp-login__row{ display:flex; gap:var(--s-2); }
.otp-login__input{
  flex:1; min-inline-size:0; min-block-size:46px;
  border:1px solid var(--line); border-radius:var(--r-md);
  padding-inline:var(--s-4); background:var(--surface-2);
  font-family:inherit; font-size:var(--t-base); color:var(--text);
  letter-spacing:.02em; text-align:start;
  /* شماره و کد هر دو لاتین‌اند؛ راست‌چین کردنشان نصفه‌ونیمه دیده می‌شود */
  direction:ltr;
}
.otp-login__input:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }
.otp-login__input--code{ letter-spacing:.4em; text-align:center; font-weight:900; font-size:var(--t-lg); }
.otp-login__row .btn{ flex:none; }
.otp-login__row .btn.is-busy{ opacity:.6; pointer-events:none; }

.otp-login__consent{
  display:flex; align-items:flex-start; gap:var(--s-2);
  margin-block-start:var(--s-4);
}
.otp-login__checkbox{
  flex:none; inline-size:18px; block-size:18px; margin-block-start:2px;
  accent-color:var(--ink);
}
.otp-login__checkbox:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }
.otp-login__consent-label{
  font-size:.8125rem; color:var(--text); cursor:pointer; line-height:1.6;
}
.otp-login__consent-label a{ color:var(--ink); text-decoration:underline; text-underline-offset:2px; }

.otp-login__hint{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-2);
  margin:var(--s-3) 0 0; font-size:.75rem; color:var(--text-muted);
}
.otp-login__linkbtn{
  color:var(--ink); font-weight:700; font-family:inherit; font-size:inherit;
  text-decoration:underline; text-underline-offset:2px;
}
.otp-login__linkbtn:disabled{ color:var(--text-muted); text-decoration:none; cursor:default; }

.otp-login__error{
  margin:var(--s-4) 0 0; padding:var(--s-3) var(--s-4);
  border-radius:var(--r-md); background:var(--surface-2);
  border-inline-start:4px solid var(--pink);
  font-size:.8125rem; color:var(--text);
}
/* حالت آزمایشی — تا وقتی سرویس پیامک واقعی وصل نشده، کد همین‌جا هم نشان داده می‌شود */
.otp-login__dev{
  margin:var(--s-4) 0 0; padding:var(--s-3) var(--s-4);
  border-radius:var(--r-md); background:var(--surface-2);
  border-inline-start:4px solid var(--amber);
  font-size:.8125rem; color:var(--text); direction:ltr; text-align:end;
  font-family:ui-monospace, monospace;
}

/* ---------------- متن تحویل سفارش — صفحه‌ی «مشاهده‌ی سفارش» مشتری ---------------- */
.uc-delivery{
  margin-block-start:var(--s-6); background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--e-2); padding:var(--s-5);
  border-inline-start:4px solid var(--emerald);
}
.uc-delivery__title{ font-size:var(--t-base); font-weight:900; margin:0 0 var(--s-3); }
.uc-delivery__body{
  font-size:var(--t-sm); line-height:2; color:var(--text);
  background:var(--surface-2); border-radius:var(--r-md); padding:var(--s-4);
  font-family:ui-monospace, monospace; direction:ltr; text-align:start; white-space:pre-wrap;
}

/* ---------------- پیشخوان حساب کاربری ---------------- */

/* عنوان صفحه — هم‌اندازه‌ی .panel-title پنل سفارش‌ها تا دو ناحیه‌ی
   «حساب» و «پنل» یک‌شکل دیده شوند. */
.acct-title{ font-size:var(--t-xl); font-weight:900; margin:0 0 var(--s-5); }

.acct-layout{ display:grid; gap:var(--s-6); grid-template-columns:1fr; align-items:start; }
/* Grid items get an implicit min-inline-size:auto, which refuses to shrink
   narrower than their content's intrinsic minimum — on mobile the nav's
   nowrap flex row (see .acct-nav__list below) was forcing this track (and the
   whole page) wider than the viewport instead of being clamped so its own
   overflow-x:auto could turn it into a scroll strip. Clamp every direct child
   so the track's own size wins and inner scrolling can actually engage. */
.acct-layout > *{ min-inline-size:0; }
@media (min-width:820px){
  .acct-layout{ grid-template-columns:220px minmax(0,1fr); }
}

/* نویگیشن — روی موبایل نوار افقی قابل‌اسکرول، روی دسکتاپ ستون کناری.
   مارک‌آپ واقعی nav.acct-nav است (navigation.php)، نه کلاس پیش‌فرض
   ووکامرس — قبلاً این‌جا .woocommerce-MyAccount-navigation نوشته شده
   بود که هرگز چیزی را match نمی‌کرد (sticky واقعاً کار نمی‌کرد). */
.acct-nav{
  position:sticky; inset-block-start:calc(104px + var(--s-4));
}
.acct-nav__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
@media (max-width:819px){
  .acct-nav{ position:static; }
  /* اسکرول‌بار خام مرورگر همان زیر تب‌ها یک خط اضافه و زشت بود؛ به‌جایش
     محو می‌شود و نور نور کجی روی هر دو لبه، خودش اشاره‌ی «بیشتر هست»
     را می‌رساند — نه اسکرول‌بار قابل‌دیدن. */
  .acct-nav__list{
    flex-direction:row; overflow-x:auto; gap:var(--s-2); padding-block-end:2px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none; -ms-overflow-style:none;
    -webkit-mask-image:linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent);
            mask-image:linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent);
  }
  .acct-nav__list::-webkit-scrollbar{ display:none; }
  .acct-nav__item{ flex:none; }
}
.acct-nav__link{
  display:flex; align-items:center; gap:var(--s-3); white-space:nowrap;
  padding:11px var(--s-4); border-radius:var(--r-md); font-size:var(--t-sm); font-weight:700;
  color:var(--text-muted); transition:background .16s var(--ease-out), color .16s var(--ease-out);
}
.acct-nav__link:hover{ background:var(--surface-2); color:var(--text); }
.acct-nav__link[aria-current="page"]{ background:var(--ink); color:var(--on-ink); }
.acct-nav__ico{ inline-size:18px; block-size:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }

/* کارت عمومی — پیشخوان، وضعیت سفارش، یادداشت‌ها، خالی‌بودن سفارش‌ها،
   همه از همین یک الگو استفاده می‌کنند. */
.acct-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--e-1); padding:var(--s-5);
}
.acct-card + .acct-card{ margin-block-start:var(--s-4); }
.acct-card__title{ font-size:var(--t-base); font-weight:900; margin:0 0 var(--s-3); }

.acct-welcome__hello{ font-size:var(--t-lg); font-weight:900; margin:0 0 var(--s-2); }
.acct-welcome__body{ color:var(--text-muted); margin:0 0 var(--s-4); }
.acct-welcome__body a{ color:var(--ink); font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.acct-welcome__actions{ display:flex; gap:var(--s-3); flex-wrap:wrap; }

.acct-empty{ text-align:center; display:grid; justify-items:center; gap:var(--s-3); padding-block:var(--s-7); }
.acct-empty svg{ inline-size:40px; block-size:40px; color:var(--text-muted); fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.acct-empty p{ margin:0; color:var(--text-muted); }

/* فهرست سفارش‌ها — همان زبان بصری panel-row در panel.css، پیشوند acct- */
.acct-orders{ display:flex; flex-direction:column; gap:var(--s-2); }
.acct-order-row{
  display:grid; grid-template-columns:56px 1fr auto auto auto; gap:var(--s-3); align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  padding:var(--s-3) var(--s-4); font-size:var(--t-sm); color:var(--text);
  transition:border-color .16s var(--ease-out), transform .16s var(--ease-out);
}
.acct-order-row:hover{ border-color:var(--ink); transform:translateY(-1px); }
.acct-order-row__id{ font-weight:900; color:var(--text-muted); font-variant-numeric:tabular-nums; }
.acct-order-row__items{ min-inline-size:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-muted); }
.acct-order-row__total{ font-weight:700; white-space:nowrap; }
.acct-order-row__date{ color:var(--text-muted); font-size:.75rem; white-space:nowrap; font-variant-numeric:tabular-nums; }
.acct-order-row__status{
  display:inline-flex; align-items:center; padding:3px 10px; border-radius:var(--r-full);
  font-size:.6875rem; font-weight:700; white-space:nowrap; background:var(--surface-2); color:var(--text-muted);
}
.acct-order-row__status--processing{ background:color-mix(in oklch, var(--cyan) 16%, var(--surface-2)); color:var(--cyan); }
.acct-order-row__status--on-hold{ background:color-mix(in oklch, var(--amber) 16%, var(--surface-2)); color:var(--amber); }
.acct-order-row__status--completed{ background:color-mix(in oklch, var(--emerald) 16%, var(--surface-2)); color:var(--emerald); }
.acct-order-row__status--cancelled,
.acct-order-row__status--refunded,
.acct-order-row__status--failed{ background:color-mix(in oklch, var(--pink) 16%, var(--surface-2)); color:var(--pink); }
@media (max-width:560px){
  .acct-order-row{ grid-template-columns:1fr auto; grid-template-areas:"items status" "id total" "date date"; row-gap:6px; }
  .acct-order-row__items{ grid-area:items; } .acct-order-row__status{ grid-area:status; justify-self:end; }
  .acct-order-row__id{ grid-area:id; } .acct-order-row__total{ grid-area:total; justify-self:end; }
  .acct-order-row__date{ grid-area:date; }
}

.acct-pagination{ display:flex; justify-content:center; gap:var(--s-3); margin-block-start:var(--s-5); }

/* جزئیات یک سفارش */
.acct-order-status{ border-inline-start:4px solid var(--cyan); }
.acct-order-status--completed{ border-inline-start-color:var(--emerald); }
.acct-order-status--cancelled,
.acct-order-status--refunded,
.acct-order-status--failed{ border-inline-start-color:var(--pink); }
.acct-order-status__line{ margin:0; font-size:var(--t-sm); line-height:2; }
.acct-order-status mark{ background:none; color:var(--ink); font-weight:900; padding:0; }

.acct-notes{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--s-3); }
.acct-notes__item{ padding-inline-start:var(--s-4); border-inline-start:2px solid var(--line); }
.acct-notes__meta{ margin:0 0 4px; font-size:.75rem; color:var(--text-muted); }
.acct-notes__body{ font-size:var(--t-sm); color:var(--text); }
.acct-notes__body p{ margin:0; }

/* فرم ویرایش حساب */
.acct-form{ display:flex; flex-direction:column; gap:var(--s-4); max-width:440px; }
.acct-form__row{ display:flex; flex-direction:column; gap:var(--s-2); }
.acct-form__optional{ font-weight:400; color:var(--text-muted); font-size:.75rem; }
.acct-form .otp-login__input:disabled{ opacity:.6; cursor:not-allowed; }
.acct-form__submit{ margin:0; }

/* بخش تغییر رمز عبور — با fieldset از بقیه‌ی فرم جدا می‌شود تا معلوم باشد
   خالی‌گذاشتنش مجاز است. */
.acct-form__fieldset{
  display:flex; flex-direction:column; gap:var(--s-4);
  margin:0; padding:var(--s-4); border:1px solid var(--line); border-radius:var(--r-md);
  background:var(--surface);
}
.acct-form__legend{ padding-inline:var(--s-2); font-weight:700; font-size:var(--t-sm); }
.acct-form__hint{ margin:0; font-size:.8125rem; color:var(--text-muted); line-height:1.7; }
.acct-form__hint a{ color:var(--ink); text-decoration:underline; text-underline-offset:2px; }

/* جدول اقلام/جمع سفارش سمت مشتری — مارک‌آپ پیش‌فرض ووکامرس
   (order_details_table) دست‌نخورده مانده، فقط این‌جا استایل می‌گیرد. */
.woocommerce-order-details{ margin-block-start:var(--s-4); }
.woocommerce-table--order-details{
  width:100%; border-collapse:collapse; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden;
}
.woocommerce-table--order-details th,
.woocommerce-table--order-details td{ padding:var(--s-3) var(--s-4); border-block-end:1px solid var(--line); font-size:var(--t-sm); text-align:start; }
.woocommerce-table--order-details tfoot th{ font-weight:700; color:var(--text-muted); }
.woocommerce-table--order-details tfoot td{ font-weight:900; text-align:end; }
.woocommerce-table--order-details tr:last-child td,
.woocommerce-table--order-details tr:last-child th{ border-block-end:0; }

/* ---------------- نمایش رمز عبور ----------------
   دکمه با assets/js/password-toggle.js ساخته می‌شود. ۴۴ پیکسل هدف لمسی،
   هم‌تراز با بقیه‌ی دکمه‌های سایت. */
.pw-wrap{ position:relative; display:block; }
.pw-wrap input{ padding-inline-end:44px; }
.pw-toggle{
  position:absolute; inset-inline-end:0; inset-block-start:0;
  inline-size:44px; block-size:100%; min-block-size:44px;
  display:grid; place-items:center;
  background:none; border:0; cursor:pointer;
  color:var(--text-muted);
}
.pw-toggle:hover{ color:var(--ink); }

/* ---------------- کدهای تخفیف پاداش ---------------- */
.acct-rewards__lede{ margin:0 0 var(--s-4); font-size:var(--t-sm); color:var(--text-muted); line-height:1.9; }
.acct-rewards__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--s-2); }
.acct-reward{
  display:flex; align-items:center; gap:var(--s-3); flex-wrap:wrap;
  padding:var(--s-3) var(--s-4); border-radius:var(--r-md);
  background:var(--surface-2); border:1px dashed var(--line);
}
.acct-reward__code{
  font-family:var(--mono, monospace); font-weight:900; font-size:var(--t-base);
  letter-spacing:.06em; color:var(--ink);
  /* dir=ltr چون کد لاتین است و در متن راست‌به‌چپ باید از چپ خوانده شود. */
  direction:ltr; unicode-bidi:isolate;
}
.acct-reward__amount{ font-weight:700; color:var(--emerald); }
.acct-reward__expiry{ margin-inline-start:auto; font-size:.8125rem; color:var(--text-muted); }
.acct-card__title .ki{ color:var(--text-muted); }