/* ═══════ 🆕 (Update 54) هدرِ «برنامه‌ی من» (psh-) و ویزاردِ ورودِ اولیه (ob-) ═══════ */
.psh, .ob {
  --sj-bg: #f6f7fb;
  --sj-surface: #ffffff;
  --sj-border: #e5e7eb;
  --sj-border-strong: #d1d5db;
  --sj-text: #111827;
  --sj-text-2: #4b5563;
  --sj-text-3: #6b7280;
  --sj-accent: #4f46e5;
  --sj-accent-2: #2563eb;
  --sj-accent-bg: #eef2ff;
  --sj-ok: #16a34a;
  --sj-ok-bg: #f0fdf4;
  --sj-warn: #b45309;
  --sj-warn-bg: #fffbeb;
  --sj-err: #b91c1c;
  --sj-err-bg: #fef2f2;
  --sj-radius: 16px;
  font-family: 'Vazirmatn', system-ui, sans-serif;
  color: var(--sj-text);
}
[data-theme="dark"] .psh, [data-theme="dark"] .ob {
  --sj-bg: #15161a;
  --sj-surface: #1c1d22;
  --sj-border: rgba(255,255,255,.08);
  --sj-border-strong: rgba(255,255,255,.16);
  --sj-text: #f1f1ef;
  --sj-text-2: #c4c4bf;
  --sj-text-3: #8d8d86;
  --sj-accent-bg: rgba(79,70,229,.18);
  --sj-ok-bg: rgba(22,163,74,.14);
  --sj-warn-bg: rgba(245,158,11,.12);
  --sj-err-bg: rgba(220,38,38,.14);
}

/* ── هدر ── */
.psh { background: var(--sj-surface); border: 1px solid var(--sj-border); border-radius: var(--sj-radius); padding: 16px 18px; margin-bottom: 18px; box-shadow: 0 1px 2px rgba(0,0,0,.03); position: relative; overflow: hidden; }
.psh::before { content: ""; position: absolute; inset-inline-start: 0; top: 0; bottom: 0; width: 4px; background: linear-gradient(180deg, var(--sj-accent), var(--sj-accent-2)); }
.psh-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.psh-title { margin: 0; font-size: 17px; font-weight: 800; }
.psh-date { font-size: 12px; color: var(--sj-text-3); margin-top: 2px; display: flex; align-items: center; gap: 4px; }
.psh-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 4px 12px; border: 1px solid transparent; white-space: nowrap; }
.psh-chip.ok { background: var(--sj-ok-bg); color: var(--sj-ok); border-color: rgba(22,163,74,.25); }
.psh-chip.warn { background: var(--sj-warn-bg); color: var(--sj-warn); border-color: rgba(180,83,9,.25); }
.psh-chip.info { background: var(--sj-accent-bg); color: var(--sj-accent); border-color: rgba(79,70,229,.25); }
.psh-chip.pending { background: var(--sj-bg); color: var(--sj-text-2); border-color: var(--sj-border-strong); }
.psh-skel { display: grid; gap: 8px; margin-top: 12px; }
.psh-skel span { height: 18px; border-radius: 8px; background: linear-gradient(90deg, var(--sj-bg) 25%, var(--sj-border) 50%, var(--sj-bg) 75%); background-size: 200% 100%; animation: sjShimmer 1.2s infinite; }
.psh-skel span + span { width: 60%; }
@keyframes sjShimmer { to { background-position: -200% 0; } }

.psh-progress { margin-top: 14px; }
.psh-progress-txt { display: flex; justify-content: space-between; font-size: 12px; color: var(--sj-text-2); margin-bottom: 5px; }
.psh-bar { height: 8px; border-radius: 999px; background: var(--sj-bg); overflow: hidden; }
.psh-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--sj-accent-2), var(--sj-accent)); transition: width .4s ease; }

.psh-plan { margin-top: 14px; display: grid; gap: 10px; }
.psh-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.psh-day { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 2px; border-radius: 10px; background: var(--sj-bg); color: var(--sj-text-3); font-size: 11px; border: 1px solid var(--sj-border); }
.psh-day b { font-weight: 700; white-space: nowrap; }
.psh-day.on { background: var(--sj-ok-bg); color: var(--sj-ok); border-color: rgba(22,163,74,.25); }
.psh-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--sj-text-2); }
.psh-meta span { display: inline-flex; align-items: center; gap: 4px; }
.psh-last.ok { color: var(--sj-ok); }
.psh-last.bad { color: var(--sj-err); }
.psh-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.psh-btn, .ob-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--sj-accent); background: var(--sj-accent); color: #fff; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; text-decoration: none; transition: filter .15s, background .15s; }
.psh-btn:hover, .ob-btn:hover { filter: brightness(1.05); text-decoration: none; color: #fff; }
.psh-btn.ghost, .ob-btn.ghost { background: var(--sj-surface); color: var(--sj-text); border-color: var(--sj-border-strong); }
.psh-btn.ghost:hover, .ob-btn.ghost:hover { background: var(--sj-bg); color: var(--sj-text); }
.psh-btn.primary, .ob-btn.primary { background: linear-gradient(135deg, var(--sj-accent-2), var(--sj-accent)); border-color: transparent; }
.psh-btn:disabled, .ob-btn:disabled { opacity: .55; cursor: not-allowed; filter: none; }
.psh-btn:focus-visible, .ob-btn:focus-visible, .ob button:focus-visible, .ob input:focus-visible, .psh input:focus-visible { outline: 3px solid rgba(79,70,229,.35); outline-offset: 2px; }
.psh-spin, .ob-spin { display: inline-block; animation: sjSpin 1s linear infinite; }
@keyframes sjSpin { to { transform: rotate(360deg); } }

.psh-lead { margin: 14px 0 8px; font-size: 13px; font-weight: 700; color: var(--sj-text-2); }
.psh-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.psh-step { display: grid; grid-template-columns: auto auto 1fr auto; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--sj-border); border-radius: 14px; background: var(--sj-surface); }
.psh-step.current { border-color: rgba(79,70,229,.45); background: var(--sj-accent-bg); }
.psh-step-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: var(--sj-bg); color: var(--sj-text-2); }
.psh-step.current .psh-step-n { background: var(--sj-accent); color: #fff; }
.psh-step-ic { width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; font-size: 19px; background: var(--sj-bg); color: var(--sj-accent); }
.psh-step-title { font-size: 13.5px; font-weight: 800; }
.psh-step-detail { font-size: 12px; color: var(--sj-text-2); line-height: 1.8; }
.psh-step.waiting .psh-step-ic { color: var(--sj-warn); }
.psh-wait { font-size: 12px; font-weight: 700; color: var(--sj-warn); display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.psh-foot { margin: 10px 0 0; font-size: 12px; color: var(--sj-text-3); display: flex; gap: 6px; align-items: center; }

.psh-commit { margin-top: 14px; padding: 16px; border-radius: 14px; background: linear-gradient(135deg, var(--sj-accent-bg), var(--sj-surface)); border: 1px solid rgba(79,70,229,.25); display: grid; gap: 10px; }
.psh-commit-h { font-size: 14px; font-weight: 800; display: flex; align-items: center; gap: 6px; color: var(--sj-accent); }
.psh-quote { margin: 0; padding: 12px 14px; border-inline-start: 4px solid var(--sj-accent); background: var(--sj-surface); border-radius: 10px; font-size: 14px; font-weight: 700; line-height: 2; }
.psh-check { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; cursor: pointer; }
.psh-check input { width: 20px; height: 20px; accent-color: var(--sj-accent); }
.psh-disclaimer { margin: 0; font-size: 11.5px; color: var(--sj-text-3); display: flex; gap: 5px; align-items: flex-start; line-height: 1.8; }
.psh-ready { margin-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 14px; border-radius: 14px; background: var(--sj-ok-bg); border: 1px solid rgba(22,163,74,.25); font-size: 13px; }

.psh-alert, .ob-alert { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border-radius: 12px; font-size: 12.5px; line-height: 1.8; margin-top: 12px; border: 1px solid transparent; }
.psh-alert > div, .psh-alert > span { flex: 1; }
.psh-alert.ok, .ob-alert.ok { background: var(--sj-ok-bg); color: var(--sj-ok); border-color: rgba(22,163,74,.25); }
.psh-alert.warn { background: var(--sj-warn-bg); color: var(--sj-warn); border-color: rgba(180,83,9,.25); }
.ob-alert.error { background: var(--sj-err-bg); color: var(--sj-err); border-color: rgba(185,28,28,.25); }
.ob-alert.info { background: var(--sj-accent-bg); color: var(--sj-accent); border-color: rgba(79,70,229,.25); }
.psh-small { font-size: 11px; opacity: .85; }
.psh-x { border: 0; background: transparent; color: inherit; cursor: pointer; padding: 2px; font-size: 16px; }

@media (max-width: 560px) {
  .psh { padding: 14px; }
  .psh-step { grid-template-columns: auto 1fr; }
  .psh-step-ic { display: none; }
  .psh-step > .psh-btn, .psh-step > .psh-wait { grid-column: 1 / -1; width: 100%; }
  .psh-day { font-size: 10px; }
}

/* ── ویزارد ── */
.ob { max-width: 720px; margin: 0 auto; padding: 18px 16px 40px; }
.ob-head { display: flex; gap: 14px; align-items: center; margin-bottom: 16px; }
.ob-logo { width: 54px; height: 54px; object-fit: contain; border-radius: 14px; background: var(--sj-surface); border: 1px solid var(--sj-border); padding: 6px; flex-shrink: 0; }
.ob-head h1 { margin: 0 0 4px; font-size: 19px; font-weight: 800; }
.ob-head p { margin: 0; font-size: 12.5px; color: var(--sj-text-2); line-height: 1.8; }
.ob-steps { margin-bottom: 14px; }
.ob-progress { height: 6px; border-radius: 999px; background: var(--sj-border); overflow: hidden; margin-bottom: 10px; }
.ob-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--sj-accent-2), var(--sj-accent)); transition: width .4s ease; }
.ob-steps ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
.ob-steps li button { width: 100%; border: 0; background: transparent; display: flex; flex-direction: column; align-items: center; gap: 4px; cursor: pointer; font: inherit; color: var(--sj-text-3); padding: 4px 0; }
.ob-steps li button:disabled { cursor: default; }
.ob-step-dot { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--sj-surface); border: 2px solid var(--sj-border-strong); font-size: 16px; }
.ob-steps li.done .ob-step-dot { background: var(--sj-ok); border-color: var(--sj-ok); color: #fff; }
.ob-steps li.current .ob-step-dot { border-color: var(--sj-accent); color: var(--sj-accent); box-shadow: 0 0 0 4px var(--sj-accent-bg); }
.ob-steps li.current .ob-step-label { color: var(--sj-accent); font-weight: 800; }
.ob-step-label { font-size: 11.5px; font-weight: 600; text-align: center; }

.ob-card { background: var(--sj-surface); border: 1px solid var(--sj-border); border-radius: 20px; padding: 20px; box-shadow: 0 8px 30px rgba(17,24,39,.05); }
.ob-card h2 { margin: 0 0 6px; font-size: 16px; font-weight: 800; }
.ob-help { margin: 0 0 14px; font-size: 12.5px; color: var(--sj-text-2); line-height: 1.9; }
.ob-note { margin: 10px 0 0; font-size: 12px; color: var(--sj-text-3); line-height: 1.8; }
.ob-note a { color: var(--sj-accent); font-weight: 700; }
.ob-grid.two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ob-field { display: flex; flex-direction: column; gap: 5px; }
.ob-field label, .ob-label { font-size: 12.5px; font-weight: 700; color: var(--sj-text); }
.ob-label { margin: 12px 0 6px; }
.ob-req { color: var(--sj-err); }
.ob-field input { height: 44px; border-radius: 12px; border: 1px solid var(--sj-border-strong); background: var(--sj-surface); color: var(--sj-text); padding: 0 12px; font: inherit; font-size: 14px; }
.ob-field input[aria-invalid="true"] { border-color: var(--sj-err); }
.ob-err { color: var(--sj-err); font-size: 11.5px; }
.ob-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ob-chips button { min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--sj-border-strong); background: var(--sj-surface); color: var(--sj-text); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.ob-chips button.on { background: var(--sj-accent); border-color: var(--sj-accent); color: #fff; }
.ob-chips button:disabled { opacity: .6; cursor: not-allowed; }
.ob-option { width: 100%; display: flex; align-items: center; gap: 12px; text-align: right; padding: 12px 14px; border-radius: 14px; border: 1.5px solid var(--sj-border-strong); background: var(--sj-surface); color: var(--sj-text); font: inherit; cursor: pointer; }
.ob-option.on { border-color: var(--sj-accent); background: var(--sj-accent-bg); }
.ob-option b { display: block; font-size: 13.5px; }
.ob-option small { display: block; font-size: 12px; color: var(--sj-text-2); line-height: 1.7; margin-top: 2px; }
.ob-option-ic { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--sj-bg); color: var(--sj-accent); font-size: 20px; flex-shrink: 0; }
.ob-presets { display: grid; gap: 8px; }
.ob-school-list { margin-top: 8px; display: grid; gap: 6px; max-height: 320px; overflow-y: auto; padding: 2px; }
.ob-school { display: flex; align-items: center; gap: 8px; text-align: right; min-height: 44px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--sj-border); background: var(--sj-surface); color: var(--sj-text); font: inherit; font-size: 13px; cursor: pointer; }
.ob-school span { flex: 1; }
.ob-school small { color: var(--sj-text-3); font-size: 11.5px; }
.ob-school.on { border-color: var(--sj-accent); background: var(--sj-accent-bg); font-weight: 700; }
.ob-empty { font-size: 12.5px; color: var(--sj-text-3); padding: 12px; text-align: center; }
.ob-actions { display: flex; align-items: center; gap: 8px; margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--sj-border); }
.ob-spacer { flex: 1; }
.ob-later { text-align: center; margin-top: 14px; font-size: 12px; color: var(--sj-text-3); }
.ob-link { border: 0; background: transparent; color: var(--sj-accent); font: inherit; font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.ob-center { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.ob-big-ic { font-size: 44px; color: var(--sj-warn); }
.ob-big-ic.ok { color: var(--sj-ok); }
.ob-summary { list-style: none; margin: 6px 0; padding: 0; display: grid; gap: 6px; text-align: right; width: 100%; max-width: 420px; }
.ob-summary li { display: flex; align-items: center; gap: 8px; font-size: 13px; padding: 8px 12px; border-radius: 10px; background: var(--sj-bg); color: var(--sj-text-2); }
.ob-summary li.ok { color: var(--sj-ok); background: var(--sj-ok-bg); }
.ob-summary li.later { color: var(--sj-warn); background: var(--sj-warn-bg); }
.ob-skel { height: 22px; border-radius: 10px; margin-bottom: 10px; background: linear-gradient(90deg, var(--sj-bg) 25%, var(--sj-border) 50%, var(--sj-bg) 75%); background-size: 200% 100%; animation: sjShimmer 1.2s infinite; }
.ob-skel.short { width: 55%; }

@media (max-width: 560px) {
  .ob { padding: 12px 12px 32px; }
  .ob-card { padding: 16px; border-radius: 16px; }
  .ob-grid.two { grid-template-columns: 1fr; }
  .ob-step-label { font-size: 10px; }
  .ob-step-dot { width: 30px; height: 30px; font-size: 14px; }
  .ob-actions .ob-btn { flex: 1; }
  .ob-actions .ob-spacer { display: none; }
}
@media (prefers-reduced-motion: reduce) { .psh-skel span, .ob-skel, .psh-spin, .ob-spin { animation: none; } .psh-bar span, .ob-progress span { transition: none; } }

/* 🆕 (Update 59.2) پیامِ «ارسال به مشاور» و پیشنهادِ دوستانه‌ی خودارزیابی */
.psh-alert.info { background: #eef2ff; color: #1e3a8a; border-color: #c7d2fe; }
.psh-alert.psh-tip { background: #fffbeb; color: #78350f; border-color: #fde68a; }
.psh-tip-link { display: inline-flex; align-items: center; gap: 2px; margin-top: 4px; font-weight: 800; color: #b45309; text-decoration: none; font-size: 12px; }
.psh-tip-link:hover { text-decoration: underline; }

/* 🆕 (Update 72) اطلاعاتِ هویتی در ویزاردِ ثبت‌نام */
.ob-id-box { margin-top: 16px; padding: 12px 14px; border: 1px solid var(--sj-border-strong); background: var(--sj-accent-bg); border-radius: 12px; }
.ob-id-head { display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 13.5px; }
.ob-id-head i { font-size: 18px; color: var(--sj-accent-2); }
.ob-id-tag { font-size: 10.5px; font-weight: 800; padding: 1px 8px; border-radius: 999px; background: #fef3c7; color: #92400e; }
.ob-ok { color: var(--sj-ok); font-size: 11.5px; font-weight: 700; }
.ob-hint { color: var(--sj-text-3); font-size: 11.5px; font-weight: 500; }
#ob-nc, #ob-bc { text-align: left; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
