/* ==========================================================================
   حساب کاربری — از توکن‌های style.css استفاده می‌کنه
   ========================================================================== */

.account-page{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:110px 24px 60px;
  position:relative;
}
.account-page .grid-field{ opacity:.35; }

.account-topbar{
  position:fixed;
  top:0; inset-inline:0;
  padding:20px 24px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  z-index:10;
}
.account-topbar a.back{ font-size:13.5px; color:var(--muted); }
.account-topbar a.back:hover{ color:var(--copper-bright); }

.auth-card{
  width:100%;
  max-width:420px;
  background:var(--ink-900);
  border:1px solid var(--line);
  border-radius:var(--radius-m);
  padding:38px 34px;
  position:relative;
  z-index:2;
}
.auth-card .brand{ justify-content:center; margin-bottom:26px; font-size:18px; }
.auth-tabs{
  display:flex;
  border:1px solid var(--line);
  border-radius:999px;
  padding:4px;
  margin-bottom:28px;
}
.auth-tabs button{
  flex:1;
  background:transparent;
  border:none;
  color:var(--muted);
  font-family:var(--font-body);
  font-size:13.5px;
  padding:10px;
  border-radius:999px;
  transition:background .25s ease, color .25s ease;
}
.auth-tabs button.is-active{ background:var(--copper); color:#1A1006; font-weight:600; }

.auth-form{ display:none; }
.auth-form.is-active{ display:block; }
.auth-form h2{ font-size:19px; margin-bottom:6px; }
.auth-form > p{ font-size:13.5px; color:var(--muted); margin-bottom:24px; }
.auth-error{
  display:none;
  background:rgba(217,83,79,.1);
  border:1px solid #d9534f;
  color:#e77f7b;
  font-size:13px;
  padding:10px 14px;
  border-radius:var(--radius-s);
  margin-bottom:16px;
}
.auth-error.is-visible{ display:block; }

.auth-link-btn{
  display:block;
  width:100%;
  text-align:center;
  background:transparent;
  border:none;
  color:var(--muted);
  font-size:13px;
  margin-top:14px;
  padding:6px;
}
.auth-link-btn:hover{ color:var(--copper-bright); }

/* ---- dashboard ---- */
.dashboard-wrap{ width:100%; max-width:760px; }
.dashboard-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:32px;
  flex-wrap:wrap;
}
.dashboard-head h1{ font-size:24px; }
.dashboard-head p{ margin-top:6px; color:var(--muted); font-size:14px; }
.dashboard-orders{ display:flex; flex-direction:column; gap:12px; }
.dash-order{
  background:var(--ink-900);
  border:1px solid var(--line);
  border-radius:var(--radius-m);
  padding:20px 22px;
}
.dash-order .top{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; }
.dash-order .service{ font-family:var(--font-mono); font-size:11px; color:var(--copper-bright); }
.dash-order h4{ margin-top:6px; font-size:15px; color:var(--text); }
.dash-order .status{
  font-family:var(--font-mono);
  font-size:11.5px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:5px 12px;
  color:var(--muted);
  flex-shrink:0;
}
.dash-order .date{ margin-top:8px; font-size:12px; color:var(--muted-2); font-family:var(--font-mono); }
.dashboard-empty{
  border:1px dashed var(--line);
  border-radius:var(--radius-m);
  padding:48px 24px;
  text-align:center;
  color:var(--muted);
  font-size:14px;
}