/* سامانه صندوق — سبک پایه راست‌به‌چپ
   فونت: Vazirmatn (مجوز OFL). فایل‌های فونت را در static/fonts قرار دهید (راهنما: README). */

@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/Vazirmatn[wght].woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --bg: #f6f7f9;
  --surface: #ffffff;
  --text: #1c2430;
  --muted: #5c6776;
  --border: #dde2e8;
  --accent: #1f5f8b;
  --accent-soft: #e6f0f7;
  --accent-fill: var(--accent);
  --ok: #1e7a46;
  --ok-soft: #e5f4ea;
  --warn: #9a6400;
  --warn-soft: #fbf1dc;
  --bad: #b3261e;
  --bad-soft: #fbe7e6;
  --radius: 8px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Vazirmatn", Tahoma, "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.8;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  padding: 10px 24px; background: var(--surface); border-bottom: 1px solid var(--border);
}
.topbar .brand { font-weight: 700; color: var(--text); display: inline-flex; align-items: center; gap: 8px; font-size: 17px; }
.topbar .brand:hover { text-decoration: none; }
.topbar .brand-logo { height: 32px; width: auto; max-width: 96px; object-fit: contain; }
.topbar nav { display: flex; gap: 16px; flex: 1; }
.topbar .who { display: flex; gap: 12px; align-items: center; color: var(--muted); font-size: 13px; }
.topbar form { margin: 0; }

.container { max-width: 1040px; margin: 24px auto; padding: 0 16px; }
.footer { text-align: center; color: var(--muted); font-size: 12px; padding: 24px 16px; }

h1 { font-size: 22px; margin: 0 0 16px; }
h2 { font-size: 17px; margin: 0 0 12px; }

.card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 20px; margin-bottom: 16px; overflow-x: auto;
}
.grid { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; }
@media (max-width: 800px) { .grid { grid-template-columns: 1fr; } }

.row { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.spacer { flex: 1; }
.muted { color: var(--muted); font-size: 13px; }

table { width: 100%; border-collapse: collapse; }
th, td { text-align: right; padding: 10px 8px; border-bottom: 1px solid var(--border); vertical-align: top; }
th { color: var(--muted); font-weight: 500; font-size: 13px; }
.num { font-variant-numeric: tabular-nums; white-space: nowrap; }

dl.facts { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
dl.facts dt { color: var(--muted); }
dl.facts dd { margin: 0; }

.btn, button {
  font: inherit; cursor: pointer; border-radius: var(--radius);
  padding: 8px 16px; border: 1px solid var(--accent-fill); background: var(--accent-fill); color: #fff;
}
.btn.secondary, button.secondary { background: var(--surface); color: var(--accent); }
.btn.danger, button.danger { background: var(--surface); color: var(--bad); border-color: var(--bad); }
button.link { background: none; border: none; color: var(--accent); padding: 0; }
.btn { display: inline-block; }
.btn:hover { text-decoration: none; opacity: .92; }

form p, form div { margin: 0 0 12px; }
label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 4px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=file],
select, textarea {
  width: 100%; font: inherit; padding: 8px 10px; border: 1px solid var(--border);
  border-radius: var(--radius); background: var(--surface); color: var(--text);
}
input[type=checkbox], input[type=radio] { margin-left: 8px; }
ul.errorlist { color: var(--bad); margin: 4px 0; padding: 0; list-style: none; font-size: 13px; }
.helptext { color: var(--muted); font-size: 12px; }
#id_decision { list-style: none; padding: 0; margin: 0; }
#id_decision label { color: var(--text); font-size: 14px; }

.messages { list-style: none; padding: 0; margin: 0 0 16px; }
.msg { padding: 10px 14px; border-radius: var(--radius); margin-bottom: 8px; background: var(--accent-soft); }
.msg.success { background: var(--ok-soft); color: var(--ok); }
.msg.error { background: var(--bad-soft); color: var(--bad); }
.msg.warning { background: var(--warn-soft); color: var(--warn); }

.badge { display: inline-block; padding: 1px 10px; border-radius: 999px; font-size: 12px; background: var(--accent-soft); color: var(--accent); }
.badge.approved { background: var(--ok-soft); color: var(--ok); }
.badge.rejected, .badge.withdrawn { background: var(--bad-soft); color: var(--bad); }
.badge.returned, .badge.overdue { background: var(--warn-soft); color: var(--warn); }
.badge.draft { background: #eef0f3; color: var(--muted); }

.stages { list-style: none; padding: 0; margin: 0; }
.stages li { padding: 6px 12px; border-right: 3px solid var(--border); color: var(--muted); }
.stages li.done { border-color: var(--ok); color: var(--text); }
.stages li.current { border-color: var(--accent); color: var(--text); font-weight: 600; background: var(--accent-soft); }

.timeline { list-style: none; padding: 0; margin: 0; }
.timeline li { padding: 8px 0; border-bottom: 1px dashed var(--border); }
.timeline li:last-child { border-bottom: none; }

.auth { max-width: 460px; margin: 40px auto; }

@media (max-width: 600px) {
  .container { margin: 16px auto; }
  .card { padding: 14px; }
  .topbar { padding: 10px 16px; gap: 12px; }
}

/* ---------- داشبورد مدیریتی ---------- */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.tile {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 14px 16px; display: flex; flex-direction: column; gap: 4px;
}
.tile-label { color: var(--muted); font-size: 13px; }
.tile-value { font-size: 28px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.3; }
.tile-alert { border-color: var(--warn); background: var(--warn-soft); }
.tile-alert .tile-label { color: var(--warn); }
.dash-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dash-grid > .card { min-width: 0; }
@media (max-width: 800px) { .dash-grid { grid-template-columns: 1fr; } }
.bars { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.bars li { display: grid; grid-template-columns: minmax(110px, 38%) 1fr auto; gap: 12px; align-items: center; }
.bar-label { font-size: 13px; }
.bar-track { height: 12px; background: #eef1f5; border-radius: 2px; overflow: hidden; }
/* نوار از سمت راست (ابتدای خط) رشد می‌کند؛ فقط انتهای داده گرد است */
.bar-fill { display: block; height: 100%; min-width: 2px; background: var(--accent); border-radius: 4px 0 0 4px; }
.bar-value { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; min-width: 3ch; text-align: left; }
@media (max-width: 600px) {
  .bars li { grid-template-columns: 1fr auto; }
  .bars .bar-track { grid-column: 1 / -1; grid-row: 2; }
  .dash-grid table { min-width: 520px; }
}

/* ---------- اعلان‌ها ---------- */
.notes { list-style: none; margin: 0; padding: 0; }
.notes li { padding: 12px 12px; border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 2px; }
.notes li:last-child { border-bottom: none; }
.notes li.unread { background: var(--accent-soft); border-radius: var(--radius); }
.bell-count { display: inline-block; min-width: 20px; padding: 0 6px; margin-inline-start: 4px; border-radius: 999px; background: var(--bad); color: #fff; font-size: 12px; text-align: center; line-height: 20px; }

/* ---------- کمیته ---------- */
ul.plain { list-style: none; padding: 0; margin: 0 0 12px; display: flex; flex-direction: column; gap: 6px; }
.vote-form, .decide-form { border-top: 1px dashed var(--border); padding-top: 12px; margin-top: 12px; }
.vote-form ul, .decide-form ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 16px; flex-wrap: wrap; }
.vote-form label, .decide-form ul label { color: var(--text); font-size: 14px; }
.minutes header { border-bottom: 1px solid var(--border); margin-bottom: 16px; padding-bottom: 12px; }

/* ---------- تسهیلات ---------- */
.tile-sm { font-size: 18px; }
tfoot th { color: var(--text); font-weight: 600; border-top: 2px solid var(--border); }

/* ---------- ضمانت‌نامه و وثیقه ---------- */
details.add-block { border-top: 1px dashed var(--border); padding-top: 10px; margin-top: 10px; }
details.add-block summary { cursor: pointer; color: var(--accent); margin-bottom: 8px; }
.negative { color: var(--bad); }

/* ---------- نقشه زنجیره ارزش ---------- */
.chain { list-style: none; padding: 0; margin: 0 0 12px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.chain .link {
  background: var(--surface); border: 1px solid var(--border); padding: 14px 22px 14px 14px; min-width: 0;
  clip-path: polygon(100% 0, 14px 0, 0 50%, 14px 100%, 100% 100%, calc(100% - 14px) 50%);
}
.chain .link:first-child { clip-path: polygon(100% 0, 14px 0, 0 50%, 14px 100%, 100% 100%); padding-right: 14px; }
.chain .link-name { display: block; font-weight: 700; margin-bottom: 8px; }
.chain dl { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; margin: 0; font-size: 13px; }
.chain dt { color: var(--muted); }
.chain dd { margin: 0; font-variant-numeric: tabular-nums; }
.support { display: flex; gap: 8px; flex-wrap: wrap; align-items: stretch; background: var(--accent-soft); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 16px; }
.support-label { font-size: 13px; color: var(--accent); align-self: center; }
.support-item { display: flex; flex-direction: column; background: var(--surface); border-radius: var(--radius); padding: 6px 12px; color: var(--text); }
@media (max-width: 900px) {
  .chain { grid-template-columns: 1fr; }
  .chain .link, .chain .link:first-child { clip-path: none; border-radius: var(--radius); padding: 12px 14px; }
}

/* ---------- حسابداری ---------- */
.voucher { border-bottom: 1px solid var(--border); padding: 12px 0; }
.voucher:last-child { border-bottom: none; }
table.lines { margin-top: 6px; background: var(--bg); border-radius: var(--radius); }
table.lines td { padding: 4px 10px; border-bottom: none; font-size: 13px; }

/* ---------- منوی پرآیتم و کاشی‌ها ---------- */
.topbar nav { flex-wrap: wrap; row-gap: 4px; }
.topbar nav a, .topbar > a { white-space: nowrap; }
.tiles { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
bdi[dir="ltr"] { white-space: nowrap; }

/* ---------- جلسات ارکان و مصوبات ---------- */
.tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 16px; }
.tabs a { padding: 4px 12px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--text); font-size: 13px; white-space: nowrap; }
.tabs a.on { background: var(--accent-fill); border-color: var(--accent-fill); color: #fff; }
.tabs a:hover { text-decoration: none; }
.res { border-bottom: 1px solid var(--border); padding: 12px 0; }
.res:last-child { border-bottom: none; }
.res .timeline { margin-top: 6px; font-size: 13px; }
.badge.done { background: var(--ok-soft); color: var(--ok); }
.badge.cancelled { background: #eef0f3; color: var(--muted); }
.badge { white-space: nowrap; }

/* گزینه‌های رادیویی Django داخل fieldset */
fieldset { border: none; padding: 0; margin: 0 0 12px; min-width: 0; }
fieldset legend { font-size: 13px; color: var(--muted); padding: 0; margin-bottom: 4px; }
fieldset > div { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; }
fieldset > div label { color: var(--text); font-size: 14px; }

/* ---------- منوی گروهی ---------- */
.topbar nav { align-items: center; }
details.menu { position: relative; }
details.menu > summary { list-style: none; cursor: pointer; color: var(--accent); white-space: nowrap; }
details.menu > summary::-webkit-details-marker { display: none; }
details.menu > summary::after { content: " ▾"; font-size: 11px; color: var(--muted); }
details.menu[open] > summary { font-weight: 600; }
details.menu > div {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 20; min-width: 190px; margin: 0;
  display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: 0 6px 20px rgba(0,0,0,.08); padding: 6px 0;
}
details.menu > div a { padding: 6px 14px; white-space: nowrap; }
details.menu > div a:hover { background: var(--accent-soft); text-decoration: none; }
@media (max-width: 600px) { details.menu > div { position: static; box-shadow: none; margin-top: 4px; } }

/* ---------- گفتگوی برخط ---------- */
.chat { display: flex; flex-direction: column; gap: 10px; }
.bubble { max-width: 85%; padding: 10px 14px; border-radius: 12px; background: var(--bg); border: 1px solid var(--border); }
.bubble .who { font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.bubble.user { align-self: flex-start; background: var(--accent-soft); border-color: transparent; }
.bubble.assistant { align-self: flex-end; }
.bubble.staff { align-self: flex-end; background: var(--ok-soft); border-color: transparent; }
.bubble.system { align-self: center; background: none; border-style: dashed; font-size: 13px; color: var(--muted); }
.bubble .rate { margin: 6px 0 0; font-size: 12px; }

/* ---------- نمای فرایند ---------- */
h3 { font-size: 15px; margin: 14px 0 8px; }
ol.flow { list-style: none; counter-reset: step; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
ol.flow li { counter-increment: step; display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; padding: 6px 36px 6px 8px; position: relative; border-radius: var(--radius); background: var(--bg); }
ol.flow li::before { content: counter(step); position: absolute; right: 8px; top: 7px; width: 20px; height: 20px; border-radius: 50%; background: var(--accent-fill); color: #fff; font-size: 12px; text-align: center; line-height: 20px; }
ol.flow.after li::before { background: var(--ok); }
.track li { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; }
.track li .muted { grid-column: 1 / -1; }
.waiting { padding: 10px 14px; border-radius: var(--radius); margin-bottom: 12px; }
.waiting.applicant { background: var(--warn-soft); color: var(--warn); }
.waiting.fund { background: var(--accent-soft); color: var(--accent); }
.waiting.none { background: var(--ok-soft); color: var(--ok); }
.letter-body { border-top: 1px solid var(--border); margin-top: 12px; padding-top: 12px; line-height: 2.1; }

/* ---------- قالب یکنواخت اسناد صندوق ---------- */
.doc-sheet { background: #fff; border: 1px solid var(--border); border-radius: 4px; padding: 28px 32px; margin: 16px auto;
  max-width: 820px; box-shadow: 0 2px 14px rgba(0,0,0,.06); position: relative; overflow: hidden; color: #1c2430; }
.doc-sheet::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .045;
  background: url("../img/logo.svg") center 55% / 360px no-repeat; }
.doc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; border-bottom: 3px double #1f5f8b; padding-bottom: 12px; }
.doc-brand { display: flex; gap: 12px; align-items: center; font-size: 14px; }
.doc-brand span { font-size: 12px; color: var(--muted); }
.doc-logo { height: 64px; width: auto; max-width: 120px; object-fit: contain; }
.doc-meta { display: grid; grid-template-columns: auto auto; gap: 2px 10px; margin: 0; font-size: 13px; }
.doc-meta dt { color: var(--muted); } .doc-meta dd { margin: 0; }
.doc-title { text-align: center; font-size: 20px; margin: 18px 0 12px; color: #0f3a57; }
.doc-stamp { text-align: center; color: var(--bad); border: 2px solid var(--bad); display: table; margin: 0 auto 12px; padding: 2px 16px; transform: rotate(-3deg); font-weight: 700; }
.doc-fields { margin: 8px 0 12px; } .doc-fields th { width: 34%; background: #f4f7fa; color: #334; font-weight: 500; }
.doc-fields th, .doc-fields td { border: 1px solid var(--border); padding: 6px 10px; }
.doc-body { line-height: 2.1; text-align: justify; }
.doc-body p { margin: 0 0 6px; }
.doc-body .doc-article { font-size: 15px; margin: 18px 0 6px; padding-bottom: 4px; border-bottom: 1px solid var(--border); }
.doc-table { width: 100%; border-collapse: collapse; margin: 6px 0 12px; font-size: 13px; }
.doc-table th, .doc-table td { border: 1px solid var(--border); padding: 4px 8px; text-align: center; }
.doc-table th { background: #f4f7fa; font-weight: 500; }
.doc-signs { display: flex; gap: 16px; flex-wrap: wrap; justify-content: flex-start; margin: 18px 0; }
.doc-sign { display: flex; flex-direction: column; min-width: 190px; border-top: 1px dashed var(--border); padding-top: 6px; font-size: 13px; }
.doc-foot { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; border-top: 1px solid var(--border); padding-top: 12px; font-size: 12px; }
.doc-verify { display: flex; flex-direction: column; gap: 3px; text-align: center; align-items: center; }
.doc-hash { font-family: monospace; font-size: 10px; word-break: break-all; }
.doc-holo svg { display: block; }
.doc-revoked .doc-body, .doc-revoked .doc-fields { opacity: .55; }
@media (max-width: 600px) { .doc-sheet { padding: 16px; } .doc-head { flex-direction: column; } .doc-foot { grid-template-columns: 1fr; justify-items: center; text-align: center; } }
.print-brand, .print-foot { display: none; }
@media print {
  .topbar, .footer, .no-print, .messages { display: none !important; }
  .print-brand { display: flex; gap: 12px; align-items: center; border-bottom: 2px solid #1f5f8b; padding-bottom: 8px;
                 margin-bottom: 16px; font-size: 13px; }
  .print-brand span { color: #566374; font-size: 11px; }
  .print-logo { height: 52px; width: auto; }
  .print-foot { display: block; border-top: 1px solid #d6dde5; margin-top: 24px; padding-top: 6px; font-size: 10px;
                color: #566374; }
  form button, .btn, select, input[type="file"] { display: none !important; }
  body { background: #fff; } .container { margin: 0; max-width: none; }
  .doc-sheet { box-shadow: none; border: none; margin: 0; max-width: none; }
}

/* نمایشگر قدرت گذرواژه */
.pw-meter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0 12px; }
.pw-bar { flex: 1 1 140px; height: 6px; border-radius: 3px; background: var(--border); overflow: hidden; }
.pw-bar span { display: block; height: 100%; width: 0; transition: width .2s; }
.pw-meter .pw-note { flex-basis: 100%; }

/* احراز هویت و امضای دستخط */
.method-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; margin-bottom: 16px; }
.method { border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 12px; }
.method.off { opacity: .55; }
.method p { margin: 6px 0 0; font-size: .9em; }
.id-compare { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }
.id-compare figure { margin: 0; }
.id-compare img { max-width: 260px; max-height: 200px; border: 1px solid var(--border); border-radius: 6px; }
.id-compare figcaption { font-size: .85em; color: var(--muted); }
label.check { display: block; margin: 4px 0; }
img.specimen { max-height: 70px; max-width: 220px; vertical-align: middle; background: #fff; }
.flow li.done { background: var(--ok-soft); }
.flow li.done strong::after { content: " ✓"; color: var(--ok); }
.doc-specimen { display: block; max-height: 64px; max-width: 200px; margin: 4px 0; mix-blend-mode: multiply; }
.doc-sign-blank { min-height: 90px; border-bottom: 1px dashed var(--border); }
.notary-box { min-height: 140px; border: 1px dashed var(--border); padding: 12px; margin-top: 16px; }
.token-payload { width: 100%; font-family: monospace; font-size: 12px; }
.doc-cert { font-size: 11px; }

/* مرسولات */
.ship-label { max-width: 560px; margin: 16px auto; border: 2px dashed var(--text, #222); padding: 18px; border-radius: 8px; background: #fff; }
.ship-label .label-addr { border: 1px solid var(--border); border-radius: 6px; padding: 10px 12px; margin: 10px 0; display: grid; gap: 2px; }
.label-qr svg { width: 110px; height: 110px; }
.instructions { background: var(--surface-2, #f5f7f9); border-radius: 6px; padding: 4px 12px; font-size: .92em; }
.ship-flow li { font-size: .95em; }
.ship-label header { flex-wrap: nowrap; align-items: center; gap: 10px; }
.ship-label header strong { flex: 1; }
nav details.menu .menu-group { display: block; font-size: 11px; color: var(--muted); padding: 8px 12px 2px; border-top: 1px solid var(--border); }
nav details.menu .menu-group:first-child { border-top: 0; }

/* موبایل: جدول پهن درون خودش افقی پیمایش می‌شود و صفحه را پهن نمی‌کند (قبلاً صفحه پس از بارگذاری مدرک بیرون می‌زد) */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* واژه فارسی هرگز حرف‌به‌حرف شکسته نمی‌شود؛ فقط رشته بی‌فاصله‌ای که در سطر جا نشود (نام پرونده، نشانی) می‌شکند */
main { overflow-wrap: break-word; word-break: normal; }
img, svg, video { max-width: 100%; }
input[type=file] { max-width: 100%; }
@media (max-width: 800px) {
  main table:not(.card table):not(.doc-sheet table) { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
  main .card, main section { min-width: 0; }
  .grid > *, .dash-grid > * { min-width: 0; }
}
img.thumb { max-width: 120px; max-height: 90px; border: 1px solid var(--border); border-radius: 4px; margin-top: 4px; }
/* کدها و نشانی‌های لاتین: در جدول یک‌تکه (جدول درون کارت پیمایش می‌شود)؛ در متن و فهرست اگر جا نشد هرجا بشکنند */
main code { overflow-wrap: anywhere; }
main p bdi[dir="ltr"], main dd bdi[dir="ltr"], main li bdi[dir="ltr"], main code { white-space: normal; overflow-wrap: anywhere; }

/* پرداخت مرحله‌ای و جدول فرم */
.progress{height:8px;background:var(--line,#e5e7eb);border-radius:4px;overflow:hidden;margin:6px 0 12px}
.progress span{display:block;height:100%;background:var(--accent,#0f766e)}
.form-table td{padding:4px}
.form-table input,.form-table select{width:100%;min-width:90px;box-sizing:border-box}
.doc-seal{width:110px;height:110px;object-fit:contain;display:block;margin:4px 0}

/* الگوهای متن */
.diff { font-size: 13px; line-height: 2; border: 1px solid var(--border); border-radius: 6px; padding: 8px 12px; overflow-wrap: break-word; }
.diff-add { background: #e6f4ea; color: #1e5631; }
.diff-del { background: #fdecea; color: #8a1c13; text-decoration: line-through; }
.doc-text { line-height: 2.1; overflow-wrap: break-word; }
.template-body { font-family: inherit; line-height: 2; width: 100%; }
label.inline { display: inline-flex; gap: 6px; align-items: center; margin-inline-end: 12px; }
.var-list li { padding: 4px 0; border-bottom: 1px solid var(--border); }
.var-list code { font-family: inherit; font-weight: 600; }

/* بودجه */
.meter { display: inline-block; width: 80px; height: 8px; background: var(--border); border-radius: 4px; overflow: hidden; vertical-align: middle; margin-inline-end: 6px; }
.meter span { display: block; height: 100%; background: #2e7d4f; }
.meter span.over { background: #b3261e; }
tr.row-warn td { background: #fdf3e7; }

/* ورود دومرحله‌ای */
.totp-qr { width: 200px; max-width: 100%; background: #fff; padding: 8px; border: 1px solid var(--border); border-radius: 6px; }
.totp-qr svg { width: 100%; height: auto; display: block; }
.totp-secret code, .backup-codes code { font-size: 15px; letter-spacing: .08em; overflow-wrap: anywhere; }
.backup-codes { columns: 2; text-align: left; }
.positive { color: var(--ok, #1e7a46); }

/* گزارش‌ساز */
.col-picks { display: flex; flex-wrap: wrap; gap: 4px 4px; }
.row.wrap { flex-wrap: wrap; }
.report-table tfoot th { background: #f4f7fa; }

.auth-logo { display: block; width: 100%; max-width: 360px; height: auto; margin: 0 auto 16px; }

/* صفحه‌بندی */
.pager { display: flex; gap: 12px; align-items: center; justify-content: center; flex-wrap: wrap; margin: 12px 0; font-size: 13px; }
.pager a { padding: 4px 10px; border: 1px solid var(--border); border-radius: 6px; }
.pager span { color: var(--muted); }

/* مدیریت دسترسی‌ها */
.small { font-size: 12px; }
.warn-text { color: var(--warn); }
.perm-group { margin-bottom: 14px; }
.perm-group legend { font-weight: 600; color: var(--text); font-size: 14px; }
.perm-table td, .perm-table th { vertical-align: middle; }
.perm-table .group-row th { background: var(--accent-soft); text-align: right; }
.perm-table tr.changed td { background: var(--warn-soft); }
.perm-table select { min-width: 9em; }
.member-list { columns: 2 16em; }
.member-list label { break-inside: avoid; }
.demo-accounts { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 12px; }
.demo-accounts summary { cursor: pointer; font-weight: 600; }
.demo-accounts h3 { font-size: 14px; margin: 12px 0 6px; }
.demo-list { display: flex; flex-wrap: wrap; gap: 6px; }
.demo-list button { font-size: 13px; padding: 4px 10px; }

/* منوی حساب کاربری و خروج */
.user-menu > summary { display: inline-flex; align-items: center; gap: 6px; }
.user-menu .avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--accent-fill); color: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; }
.user-menu .user-name { max-width: 14em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
details.menu.user-menu > div { right: auto; left: 0; min-width: 240px; }
.user-menu .user-card { margin: 4px 14px 8px; padding-bottom: 8px; border-bottom: 1px solid var(--border); white-space: normal; }
.user-menu .logout-form { margin: 8px 14px 4px; padding-top: 8px; border-top: 1px solid var(--border); }
.user-menu .logout-btn { width: 100%; }
@media (max-width: 600px) { .user-menu .user-name { display: none; } }
.auth-sub { text-align: center; margin: -6px 0 14px; }
.auth h1 { text-align: center; }

/* ---------- شاخص‌های عملکرد (kpi) ---------- */
.kpi-filter { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; }
.kpi-filter label { margin: 0; flex: 1 1 140px; min-width: 0; }
.kpi-filter input, .kpi-filter select { width: 100%; margin: 0; }
.kpi-section { margin-bottom: 20px; }
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.kpi-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px;
  display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.kpi-label { font-size: 13px; font-weight: 400; color: var(--muted); margin: 0; }
.kpi-value { font-size: 22px; font-weight: 700; margin: 0; line-height: 1.4; font-variant-numeric: tabular-nums; overflow-wrap: break-word; }
.kpi-unit { font-size: 12px; font-weight: 400; color: var(--muted); }
.kpi-prev { font-size: 12px; color: var(--muted); margin: 0; }
.kpi-def { font-size: 12px; color: var(--muted); }
.kpi-def summary { cursor: pointer; }
.kpi-chart { min-height: 30px; }
.kpi-spark, .kpi-meter, .kpi-bar { display: block; max-width: 100%; height: auto; overflow: visible; }
.kpi-spark-line { fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; }
.kpi-spark-dot { fill: var(--accent); }
.kpi-spark-base { stroke: var(--border); stroke-width: 1; }
.kpi-meter-track { fill: var(--accent-soft); }
.kpi-meter-fill, .kpi-bar-fill { fill: var(--accent); }
.kpi-dist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.kpi-dist li { display: grid; grid-template-columns: minmax(90px, 30%) minmax(60px, 160px) 1fr; gap: 10px; align-items: center; }
.kpi-dist-label { font-size: 13px; min-width: 0; }
.kpi-dist-value { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; min-width: 0; }
.kpi-defs dt { font-weight: 700; font-size: 13px; }
.kpi-defs dd { margin: 0 0 8px; font-size: 12px; color: var(--muted); }
@media (max-width: 600px) {
  .kpi-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .kpi-card { padding: 10px; }
  .kpi-value { font-size: 18px; }
  .kpi-dist li { grid-template-columns: 1fr; gap: 2px; }
}
@media (max-width: 380px) { .kpi-grid { grid-template-columns: 1fr; } }
@media print {
  .kpi-board-section { break-inside: avoid; border: none; padding: 0; }
  .kpi-board table { min-width: 0; font-size: 11px; }
  .kpi-def { display: none; }
}

/* راهنمای سامانه (help) */
details.page-help { float: left; position: relative; z-index: 5; margin: 0 12px 8px 0; font-size: 13px; }
details.page-help > summary { list-style: none; cursor: pointer; color: var(--accent); background: var(--accent-soft);
  border: 1px solid var(--border); border-radius: 999px; padding: 2px 12px; white-space: nowrap; }
details.page-help > summary::-webkit-details-marker { display: none; }
.page-help-icon { display: inline-flex; width: 18px; height: 18px; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--accent-fill); color: #fff; font-size: 12px; font-weight: 700; }
.page-help-panel { position: absolute; left: 0; top: calc(100% + 6px); width: min(420px, calc(100vw - 32px));
  max-height: 70vh; overflow-y: auto; background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: 0 6px 24px rgba(0, 0, 0, .12); padding: 12px 16px; line-height: 1.9; }
.page-help-panel p { margin: 0 0 6px; }
.page-help-panel ol, .page-help-panel ul, .help-page-entry ol, .help-page-entry ul { margin: 0 0 8px; padding-inline-start: 20px; }
.page-help-title { font-size: 15px; }
.page-help-h { font-weight: 600; margin: 8px 0 2px !important; color: var(--text); }
.page-help-more { border-top: 1px solid var(--border); padding-top: 6px; margin-top: 6px !important; }
.help-nav { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: -6px 0 14px; font-size: 14px; }
.help-search { display: flex; gap: 8px; margin-bottom: 16px; }
.help-search input { flex: 1; min-width: 0; }
.help-hidden-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.help-results { list-style: none; margin: 0; padding: 0; }
.help-results li { padding: 8px 0; border-bottom: 1px solid var(--border); overflow-wrap: break-word; }
.help-guides { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-bottom: 16px; }
.help-guide { display: flex; flex-direction: column; gap: 4px; margin: 0; color: var(--text); }
.help-guide:hover { text-decoration: none; border-color: var(--accent); }
.help-guide.mine { border: 2px solid var(--accent); background: var(--accent-soft); order: -1; }
.help-toc ol { margin: 4px 0 0; padding-inline-start: 20px; columns: 2 14em; }
.help-article { line-height: 2; overflow-wrap: break-word; }
.help-article h2 { margin-top: 20px; scroll-margin-top: 12px; }
.help-article .lead { font-size: 16px; }
.help-article .note { background: var(--warn-soft); border-radius: var(--radius); padding: 8px 12px; font-size: 14px; }
.help-page-entry h3 { margin: 0 0 6px; font-size: 16px; }
/* پیش‌نویس محلی فرم‌ها و هشدار قطع اتصال (static/js/drafts.js) */
.draft-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; background: var(--accent-soft);
  border: 1px solid var(--accent); border-radius: var(--radius); padding: 8px 12px; margin: 0 0 10px; font-size: 14px; }
.draft-bar span { flex: 1 1 200px; }
.offline-banner { position: sticky; top: 0; z-index: 50; background: var(--warn-soft); color: var(--warn);
  border: 1px solid var(--warn); border-radius: var(--radius); padding: 8px 12px; margin: 0 0 12px; font-weight: 600; }
/* نمودار جریان ساده در راهنماها (راست‌به‌چپ؛ در صفحه باریک عمودی) */
.flow { list-style: none; margin: 12px 0; padding: 0; display: flex; flex-wrap: nowrap; gap: 22px; counter-reset: flow; }
.flow > li { flex: 1 1 0; min-width: 0; position: relative; border: 1px solid var(--border); border-top: 3px solid var(--accent);
  border-radius: var(--radius); background: var(--surface); padding: 8px 10px; font-size: 13px; line-height: 1.7; counter-increment: flow; }
.flow > li strong { display: block; font-size: 14px; }
.flow > li strong::before { content: counter(flow, persian) ". "; color: var(--accent); }
.flow > li:not(:last-child)::after { content: "←"; position: absolute; inset-inline-start: 100%; top: 50%; transform: translateY(-50%);
  width: 22px; text-align: center; color: var(--accent); font-weight: 700; }
.flow > li.flow-in { border-top-color: var(--ok); }
.flow > li.flow-alt { border-top-style: dashed; }
.flow-caption { font-size: 13px; color: var(--muted); margin-top: -4px; }
@media (max-width: 760px) {
  .flow { flex-direction: column; gap: 18px; }
  .flow > li:not(:last-child)::after { content: "↓"; inset-inline-start: 50%; top: 100%; transform: translateX(50%); height: 18px; line-height: 18px; }
}
@media print { .flow > li { break-inside: avoid; } }
.help-page-entry:target, .help-faq details:target, .glossary dt:target { outline: 2px solid var(--accent); outline-offset: 4px; }
.help-faq details { border-bottom: 1px solid var(--border); padding: 8px 0; }
.help-faq summary { cursor: pointer; font-weight: 600; }
.help-faq p { margin: 6px 0 0; }
dl.glossary { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
dl.glossary dt { font-weight: 600; }
dl.glossary dd { margin: 0; color: var(--text); }
@media (max-width: 600px) {
  details.page-help { float: none; display: block; margin: 0 0 10px; }
  .page-help-panel { position: static; width: auto; max-height: none; margin-top: 6px; box-shadow: none; }
  dl.glossary { grid-template-columns: 1fr; }
  dl.glossary dd { margin-bottom: 8px; }
  .help-guides { grid-template-columns: 1fr; }
}
@media print {
  .help-toc { display: none; }
  .help-article, .help-page-entry { border: none; padding: 0; }
  .help-article h2 { break-after: avoid; }
  .help-page-entry { break-inside: avoid; }
}
.user-menu .install-app { display: block; padding: 6px 14px; text-align: right; width: 100%; }
dl.facts dt, dl.facts dd { min-width: 0; overflow-wrap: break-word; }
@media (max-width: 600px) { dl.facts { grid-template-columns: 1fr; gap: 2px; } dl.facts dd { margin-bottom: 8px; } }
dl.facts dd.num { white-space: normal; }

/* ================= چیدمان متوازن (بازبینی بنیان‌گذار) ================= */

/* --- نوار بالا: گروه و قلم فعال --- */
.topbar nav a.active, .topbar > a.active, details.menu.active > summary { font-weight: 700; color: var(--accent); }
.topbar nav > a.active, .topbar > a.active, details.menu.active > summary { box-shadow: inset 0 -2px 0 var(--accent); }
details.menu > div a.active { background: var(--accent-soft); font-weight: 600; }
details.menu > div a[aria-current="page"] { border-inline-start: 3px solid var(--accent); padding-inline-start: 11px; }
details.menu > summary:focus-visible, .topbar a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

/* --- صفحه ورود: شناسه صندوق فقط یک بار، همه‌چیز وسط‌چین --- */
.auth-page .topbar { justify-content: center; border-bottom-color: transparent; background: transparent; }
.auth-page .topbar nav { flex: 0 1 auto; justify-content: center; gap: 24px; font-size: 14px; }
.auth { max-width: 440px; margin: 24px auto 40px; padding: 32px 32px 24px; text-align: center; }
.auth .auth-logo { width: 112px; max-width: 40%; height: auto; margin: 0 auto 12px; }
.auth h1 { text-align: center; font-size: 22px; margin: 0 0 4px; letter-spacing: 0; }
.auth-fund { margin: 0 auto 24px; max-width: 32em; font-size: 13px; line-height: 1.9; color: var(--muted); text-wrap: balance; }
.auth form, .auth-form { text-align: start; }
.auth-submit { display: block; width: 100%; margin: 8px 0 0; padding: 10px 16px; font-weight: 600; }
.auth-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 0; margin: 16px 0 0; font-size: 14px; text-align: center; }
.auth-aside { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid var(--border); text-align: center; line-height: 2; }
.sep { color: var(--muted); margin: 0 10px; }
.auth .demo-accounts { text-align: start; }
@media (max-width: 600px) { .auth { padding: 24px 18px 18px; margin-top: 12px; } .auth .auth-logo { width: 88px; } }

/* --- مسیر «شما اینجا هستید» و راهنمای صفحه در یک نوار --- */
.page-bar { display: flex; align-items: center; gap: 8px 16px; flex-wrap: wrap; margin: -8px 0 14px; min-height: 0; }
.page-bar:empty { display: none; }
.crumbs { display: flex; align-items: baseline; gap: 6px; flex: 1 1 auto; min-width: 0; font-size: 13px; color: var(--muted); }
.crumbs-lead { white-space: nowrap; }
.crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: baseline; row-gap: 2px; }
.crumbs li { display: inline-flex; align-items: baseline; }
.crumbs li + li::before { content: "›"; margin: 0 8px; color: var(--muted); }
.crumbs a { color: var(--accent); }
.crumbs [aria-current="page"] { color: var(--text); font-weight: 600; }
.page-bar details.page-help { float: none; margin: 0 0 0 0; margin-inline-start: auto; }
@media (max-width: 600px) {
  .crumbs-lead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .page-bar { margin-top: -4px; }
  .page-bar details.page-help { margin-inline-start: 0; }
}

/* --- پانویس: فقط شناسنامه سامانه (نام سامانه، نام صندوق، نسخه، راهنما) و یادداشت واحد مبالغ --- */
.footer { border-top: 1px solid var(--border); margin-top: 32px; padding: 12px 16px 16px; }
.footer p { margin: 0; }
.footer-line { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 2px 0; line-height: 2; }
.footer-line > span + span::before { content: "·"; margin: 0 10px; color: var(--muted); }
.footer-id { color: var(--text); font-weight: 600; }
.footer-contact { color: var(--muted); }
.footer-links { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 0 14px; }

.footer-ver { color: var(--muted); font-variant-numeric: tabular-nums; }
.footer > .footer-links { display: flex; margin: 2px 0; line-height: 2; }
/* --- یادداشت واحد مبالغ: یک بار در پانویس همه صفحه‌ها (مبلغ‌ها بدون واژه «ریال» نمایش داده می‌شوند) --- */
.unit-note { margin: 2px 0 0; font-size: 12px; color: var(--muted); }

/* --- کاشی‌ها و کارت‌های شاخص: وسط‌چین، هم‌اندازه، بی‌تک‌کاشی در سطر دوم --- */
.tiles { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)); align-items: stretch; }
.tile { align-items: center; justify-content: center; text-align: center; min-width: 0; container-type: inline-size; padding: 14px 12px; }
.tile-label { line-height: 1.6; text-wrap: balance; flex: 1 1 auto; display: flex; align-items: center; justify-content: center; }
.tile-value { max-width: 100%; }
.tile-value.tile-sm { white-space: nowrap; }
.tile-value.tile-sm { font-size: clamp(13px, 12.5cqi, 18px); }
.tile-value:not(.tile-sm) { font-size: clamp(18px, 20cqi, 28px); }
.tile-alert { background: var(--warn-soft); }
@media (min-width: 900px) {
  .tiles:has(> :nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .tiles:has(> :nth-child(6):last-child) { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .tiles:has(> :nth-child(7):last-child), .tiles:has(> :nth-child(8):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .tiles:has(> :nth-child(9):last-child), .tiles:has(> :nth-child(10):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .tiles:has(> :nth-child(11)) { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (min-width: 601px) and (max-width: 899px) {
  .tiles:has(> :nth-child(5):last-child), .tiles:has(> :nth-child(6):last-child),
  .tiles:has(> :nth-child(9):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tiles:has(> :nth-child(7):last-child), .tiles:has(> :nth-child(8):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tiles > :only-child { grid-column: 1 / -1; }
  .tiles > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .tile { padding: 12px 8px; }
}
.kpi-card { align-items: center; text-align: center; justify-content: flex-start; }
.kpi-card .kpi-chart { align-self: stretch; display: flex; justify-content: center; }
.kpi-card .kpi-def { align-self: stretch; }
.kpi-dist, .kpi-defs { text-align: start; }

/* --- نوار جست‌وجو و فیلتر درون کارت: وسط‌چین با حاشیه برابر --- */
.filter-bar, .card > form.row[method="get"], form.row.card[method="get"], form.row.filters {
  justify-content: center; gap: 10px 12px; margin-bottom: 16px; }
.filter-bar input[type=text], .filter-bar input[type=search], .filter-bar select,
.card > form.row[method="get"] input[type=text], .card > form.row[method="get"] select {
  flex: 1 1 200px; width: auto; min-width: 0; max-width: 320px; margin: 0; }
.filter-bar > *, .card > form.row[method="get"] > * { margin-bottom: 0; }

/* --- گزارش‌ساز: منابع داده در شبکه یکنواخت --- */
.dataset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.dataset-grid .btn { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 48px; padding: 8px 12px; line-height: 1.6; }

/* --- جدول‌ها: سرستون یک‌خطی، ستون نام با کمینه پهنا، پیمایش افقی درون کارت --- */
th { white-space: nowrap; }
.card { min-width: 0; }
.card > table, .card > form > table { min-width: 100%; }
td { overflow-wrap: break-word; }
@media (max-width: 800px) {
  .card table td:not(.num) { min-width: 8em; }
  .card table td:empty, .card table td:has(> .btn:only-child) { min-width: 0; }
}

/* --- فاصله‌ها و هم‌ترازی عمومی --- */
.container > h1, .container > .row > h1 { line-height: 1.5; }
section.card > h2:first-child, div.card > h2:first-child { margin-top: 0; }
.row > button, .row > .btn { flex: 0 0 auto; }

/* --- نوار بالا در گوشی: منو پشت دکمه «منو» جمع می‌شود (فقط وقتی جاوااسکریپت فعال است) --- */
.nav-toggle { display: none; }
@media (max-width: 800px) {
  .js .topbar { gap: 8px 12px; }
  .js .topbar > .brand { order: 0; }
  .js .topbar > .bell { order: 1; margin-inline-start: auto; }
  .js .topbar > .user-menu { order: 2; }
  .js .topbar > .nav-toggle { order: 3; display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; font-size: 14px; }
  .js .topbar > nav#main-nav { order: 10; flex-basis: 100%; }
  .js .topbar > .top-extra { order: 11; }
  .js .topbar:not(.nav-open) > nav#main-nav, .js .topbar:not(.nav-open) > .top-extra { display: none; }
  .js .topbar.nav-open > nav#main-nav { flex-direction: column; align-items: stretch; gap: 2px; padding-top: 8px; border-top: 1px solid var(--border); }
  .js .topbar.nav-open > nav#main-nav > a, .js .topbar.nav-open > nav#main-nav > details > summary { display: block; padding: 6px 4px; }
  .js .topbar.nav-open > nav#main-nav .qs { padding: 4px; }
  .js .topbar.nav-open > nav#main-nav details.menu > div { position: static; box-shadow: none; margin: 2px 0 6px; }
  .js .topbar.nav-open > .top-extra { padding: 4px; }
  .topbar .brand span { font-size: 15px; }
}
.dash-grid table td:first-child { min-width: 7em; }
.auth-links a, .auth-aside a, .footer-links a { white-space: nowrap; }

/* --- مهلت مرحله پرونده (کارتابل و داشبورد) --- */
.sla { display: inline-block; padding: 1px 10px; border-radius: 999px; font-size: 12px; white-space: nowrap; background: #eef0f3; color: var(--text); }
.sla-warn { background: var(--warn-soft); color: var(--warn); font-weight: 600; }
.sla-bad { background: var(--bad-soft); color: var(--bad); font-weight: 600; }
.sla-legend { margin: 10px 0 0; font-size: 12px; line-height: 2; }

/* --- گروه کوچک کاشی/کارت (۱ تا ۳ عدد): هم‌پهنا و وسط‌چین، نه یک کادر کشیده به پهنای صفحه --- */
@media (min-width: 601px) {
  .tiles:not(:has(> :nth-child(4))) { grid-template-columns: repeat(auto-fit, minmax(180px, 280px)); justify-content: center; }
  .kpi-grid:not(:has(> :nth-child(4))) { grid-template-columns: repeat(auto-fit, minmax(200px, 300px)); justify-content: center; }
}
.kpi-section > h2 { text-align: center; }

/* --- مسیر پرداخت --- */
.pay-step { max-width: 560px; margin: 0 auto; }
.pay-step .pay-actions { margin-top: 12px; justify-content: center; }
.back-link { white-space: nowrap; }

/* --- دکمه «راهنمای این صفحه»: فشرده --- */
details.page-help > summary { display: inline-flex; align-items: center; gap: 6px; padding: 1px 10px 1px 4px; font-size: 12px; line-height: 1.9; }
details.page-help .page-help-icon { width: 16px; height: 16px; font-size: 11px; }

/* ================= نظام یکنواخت چیدمان (دور دوم بازبینی بنیان‌گذار) ================= */

/* --- اعداد: در کاشی وسط‌چین؛ در جدول به انتهای سطر (چپ) با ارقام هم‌عرض --- */
th.num, td.num { text-align: left; }
.tile-value, .kpi-value { text-align: center; }

/* --- کارت‌های کلید/مقدار (جدول دوستونی مانند گزارش فصلی ناظر): پهنای محدود و وسط صفحه، نه کشیده و نامتوازن --- */
.container > .card:has(> table > thead > tr > th:nth-child(2):last-child):not(:has(th:nth-child(3))) {
  max-width: 760px; margin-inline: auto; }
.container > .card:has(> table > thead > tr > th:nth-child(2):last-child):not(:has(th:nth-child(3))) > h2 { text-align: center; }
.container > .card:has(> table > thead > tr > th:nth-child(2):last-child):not(:has(th:nth-child(3))) > p.muted { text-align: center; }

.container > .card:has(> table > thead > tr > th:nth-child(2):last-child):not(:has(th:nth-child(3))) ~ .dash-grid {
  max-width: 760px; margin-inline: auto; }

/* --- فرم فیلتر بالای صفحه (بیرون از کارت): وسط‌چین با فاصله یکسان --- */
.container > form.row[method="get"] { justify-content: center; gap: 10px 12px; margin-bottom: 16px; }
.container > form.row[method="get"] > * { margin-bottom: 0; }

/* --- پانویس در گوشی: هر جزء در یک سطر، بی‌جداکننده سرگردان --- */
@media (max-width: 600px) {
  .footer-line { flex-direction: column; align-items: center; }
  .footer-line > span + span::before { content: none; }
}

/* --- شبکه دوستونی با یک کارت: کارت تنها نیمه خالی نمی‌گذارد --- */
.dash-grid > :only-child, .grid > :only-child { grid-column: 1 / -1; }

/* --- گروه دکمه‌های کارت «اقدام» و نوار ابزار: فاصله یکسان، در گوشی وسط‌چین --- */
.card > .row:has(> form > button, > .btn) { gap: 10px; }
.card > .row > form { margin: 0; }
@media (max-width: 600px) {
  .card > .row:has(> form > button, > .btn), .pager { justify-content: center; }
}

/* --- جدول: ستون‌های کوتاه یک‌خطی؛ متن بلند در مرز واژه می‌شکند، نه حرف‌به‌حرف --- */
td .badge, td .sla, td.num, td bdi[dir="ltr"] { white-space: nowrap; }
td, th, .tile-label, .kpi-label, details.menu > div a { word-break: normal; overflow-wrap: break-word; hyphens: none; }

/* --- سرگروه درون همه منوهای کشویی (از جمله منوی حساب کاربری) --- */
details.menu .menu-group { display: block; font-size: 11px; color: var(--muted); padding: 8px 14px 2px; border-top: 1px solid var(--border); margin-top: 4px; }
details.menu .user-card + .menu-group, details.menu > div > .menu-group:first-child { border-top: 0; margin-top: 0; }
.user-menu .install-app[hidden] { display: none; }

/* --- کارت‌های شاخص: سطر آخرِ ناقص وسط‌چین می‌شود (نه یک کارت تنها در گوشه راست) --- */
.kpi-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.kpi-grid > * { flex: 0 1 calc((100% - 36px) / 4); }
@media (min-width: 601px) and (max-width: 899px) { .kpi-grid > * { flex-basis: calc((100% - 24px) / 3); } }
@media (max-width: 600px) { .kpi-grid { gap: 8px; } .kpi-grid > * { flex-basis: calc((100% - 8px) / 2); } }
@media (max-width: 380px) { .kpi-grid > * { flex-basis: 100%; } }
@media (min-width: 601px) { .kpi-grid:not(:has(> :nth-child(4))) > * { flex: 0 1 300px; } }
/* گوشی: منوی حساب کاربری در header.css به برگه تمام‌قد تبدیل شد (ویرایش ۴۰) */
.tile-value { overflow-wrap: anywhere; max-width: 100%; }
.tile .tile-value bdi { word-break: break-all; }
main > .tiles, .tiles > .tile { min-width: 0; }
.tile .tile-value.tile-sm { white-space: normal; }

/* ---------- ویرایش ۵۶: صفحه‌های استعلام و برآورد هم‌راستا با صفحه‌های ورود ---------- */
.page-narrow { max-width: 720px; margin: 28px auto 40px; padding: 0 16px; }
.page-narrow.page-wide { max-width: 880px; }
.page-narrow > h1 { text-align: center; font-size: 22px; margin: 0 0 8px; }
.page-narrow > .lead { text-align: center; color: var(--muted); line-height: 1.9; margin: 0 auto 20px; max-width: 36em; }
.page-narrow .card { margin-top: 0; padding: 24px; }
.verify-form, .calc-form { display: grid; gap: 14px; }
.verify-form > div, .verify-form label { display: block; }
.verify-form input { margin-top: 4px; }
.verify-form > button, .calc-form > button { width: 100%; height: 44px; font-size: 15px; font-weight: 600; margin-top: 6px; }
.calc-form h2 { margin: 20px 0 0; font-size: 16px; }
.calc-form .form-grid { gap: 14px; }
@media (max-width: 600px) { .page-narrow { margin-top: 18px; } .page-narrow .card { padding: 18px; } }