﻿/* Vazirmatn همراه خود سایت است (مجوز OFL — fonts/vazirmatn/OFL.txt). پیش از این فقط نامش در
   font-family بود و روی دستگاهی که نصبش نداشت Segoe UI یا Tahoma جایش می‌نشست؛ هر دستگاه یک قلم.
   وزن‌های ایستا (نه فایل متغیر): مرورگر فقط وزن‌های به‌کاررفته را می‌گیرد، و PDF گزارش که سرور با
   همین قلم می‌سازد کوچک و دقیقاً هم‌اندازه‌ی چاپ مرورگر می‌ماند. */
@font-face { font-family: "Vazirmatn"; src: url("/fonts/vazirmatn/Vazirmatn-Regular.woff2") format("woff2"); font-weight: 100 449; font-display: swap; }
@font-face { font-family: "Vazirmatn"; src: url("/fonts/vazirmatn/Vazirmatn-Medium.woff2") format("woff2"); font-weight: 450 549; font-display: swap; }
@font-face { font-family: "Vazirmatn"; src: url("/fonts/vazirmatn/Vazirmatn-SemiBold.woff2") format("woff2"); font-weight: 550 649; font-display: swap; }
@font-face { font-family: "Vazirmatn"; src: url("/fonts/vazirmatn/Vazirmatn-Bold.woff2") format("woff2"); font-weight: 650 749; font-display: swap; }
@font-face { font-family: "Vazirmatn"; src: url("/fonts/vazirmatn/Vazirmatn-ExtraBold.woff2") format("woff2"); font-weight: 750 1000; font-display: swap; }

:root {
  /* پالت مشترک با لندینگ و پنل‌ها (panel.css / landing.css) — سبز #0F4C45 و طلایی #D6A44D. */
  --ink: #10261F;
  --muted: #7C8C87;
  --line: rgba(15, 76, 69, .14);
  --surface: #FFFFFF;
  --surface-soft: #F1F4F2;
  --page: #F8F7F4;
  --brand: #0F4C45;
  --brand-2: #136158;
  --accent: #D6A44D;
  --accent-soft: rgba(214, 164, 77, .14);
  --danger: #B3261E;
  --danger-soft: #FBECEB;
  --success: #2E8B57;
  --warning: #8A6520;
  --shadow: 0 2px 4px rgba(8,60,54,.04), 0 8px 24px rgba(8,60,54,.06);
  --radius: 16px;
  font-family: Vazirmatn, "IRANSansX", "Segoe UI", Tahoma, sans-serif;
  color: var(--ink);
  background: var(--page);
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--page); color: var(--ink); line-height: 1.75; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }

.skip-link { position: fixed; inset-block-start: 8px; inset-inline-start: 8px; z-index: 100; padding: 8px 14px; background: var(--ink); color: white; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }

.site-header { min-height: 88px; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 14px clamp(18px, 4vw, 56px); background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.brand-block { display: flex; align-items: center; gap: 14px; }
.brand-mark { height: 60px; width: auto; object-fit: contain; display: block; background: transparent; }
.brand-block h1 { margin: 0; font-size: clamp(18px, 2.2vw, 27px); line-height: 1.35; }
.eyebrow { margin: 0 0 1px; color: var(--brand-2); font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.data-status { color: var(--muted); font-size: 13px; white-space: nowrap; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); margin-left: 6px; }
.data-status.ready .status-dot { background: var(--success); }
.data-status.error .status-dot { background: var(--danger); }

.app-shell { max-width: 1520px; margin: 0 auto; padding: 30px clamp(16px, 4vw, 48px) 70px; display: grid; grid-template-columns: 258px minmax(0, 1fr); gap: 26px; align-items: start; }
/* صفحه‌ی ماده صد تک‌مرحله‌ای است و ستون مراحل ندارد — به‌دستور کارفرما، تا کاربر
   فقط چیزی را ببیند که لازم دارد. */
.workflow { position: sticky; top: 118px; }
.workflow ol { list-style: none; margin: 0; padding: 0; border-right: 1px solid var(--line); }
.workflow li { margin: 0; }
.workflow-step { width: 100%; display: grid; grid-template-columns: 34px 1fr; text-align: right; gap: 0 10px; padding: 13px 16px; border: 0; border-right: 3px solid transparent; background: transparent; color: var(--muted); }
.workflow-step > span { grid-row: 1 / 3; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #E6DFCB; color: var(--muted); font-size: 12px; font-weight: 800; }
.workflow-step strong { font-size: 14px; color: var(--ink); }
.workflow-step small { font-size: 11px; }
.workflow-step:hover { background: rgba(255,255,255,.55); }
.workflow-step.active { background: var(--surface); border-right-color: var(--brand-2); box-shadow: 0 5px 18px rgba(8,60,54,.06); }
.workflow-step.active > span { background: var(--brand); color: white; }
.source-box { margin-top: 25px; padding: 16px; border: 1px solid var(--line); background: rgba(255,255,255,.45); font-size: 12px; }
.source-box strong, .source-box a { display: block; }
.source-box a { color: var(--brand-2); text-decoration: none; margin-top: 7px; }
.source-box a:hover { text-decoration: underline; }

/* دکمه ذخیره پیش‌نویس در نوار کناری، زیر جعبه منابع */
.button.button-save-draft {
  display: block; width: 100%; margin-top: 14px; padding: 12px 16px;
  border: 1px solid var(--brand-2); border-radius: 10px;
  background: var(--surface); color: var(--brand-2);
  font-size: 13px; font-weight: 800; text-align: center;
  transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .12s ease;
}
.button.button-save-draft:hover { background: var(--brand-2); color: #fff; box-shadow: var(--shadow); }
.button.button-save-draft:active { transform: translateY(1px); }
.button.button-save-draft:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

main { min-width: 0; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(20px, 3vw, 34px); min-height: 460px; }
.section-heading { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding-bottom: 22px; margin-bottom: 24px; border-bottom: 1px solid var(--line); }
.section-heading h2 { margin: 0; font-size: clamp(21px, 2vw, 28px); }
.section-heading p:not(.section-kicker) { max-width: 720px; margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.section-kicker { margin: 0 0 3px; color: var(--accent); font-size: 12px; font-weight: 900; }
.source-tag { display: inline-flex; flex-shrink: 0; padding: 5px 10px; border: 1px solid rgba(214,164,77,.45); background: var(--accent-soft); color: var(--warning); font-size: 11px; font-weight: 800; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.span-2 { grid-column: span 2; }
.field { display: flex; flex-direction: column; min-width: 0; }
.field > span:first-child { margin-bottom: 6px; font-size: 13px; font-weight: 750; }
.field b { color: var(--danger); }
input, select, textarea { width: 100%; min-height: 44px; border: 1px solid #CFC7B2; border-radius: 8px; background: white; padding: 8px 11px; color: var(--ink); outline: none; transition: border-color .15s, box-shadow .15s; }
input:hover, select:hover { border-color: #B6A986; }
input:focus, select:focus, textarea:focus { border-color: var(--brand-2); box-shadow: 0 0 0 3px rgba(44, 106, 84, .18); }
input[aria-invalid="true"], select[aria-invalid="true"] { border-color: var(--danger); background: var(--danger-soft); }
.field-hint { min-height: 20px; margin-top: 4px; color: var(--muted); font-size: 11px; }
.field-error { min-height: 18px; margin-top: 2px; color: var(--danger); font-size: 11px; line-height: 1.4; }
.warning-text { color: var(--warning); }

.check-group { margin: 24px 0; padding: 15px 18px 17px; border: 1px solid var(--line); background: var(--surface-soft); display: flex; flex-wrap: wrap; gap: 12px 26px; }
.check-group legend { padding: 0 7px; font-size: 12px; font-weight: 800; color: var(--muted); }
.check-group label, .inline-options label { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; }
input[type="checkbox"], input[type="radio"] { width: 17px; min-height: 17px; accent-color: var(--brand-2); }

.coefficient-strip { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); background: var(--surface-soft); }
.coefficient-strip > div { padding: 14px; border-left: 1px solid var(--line); }
.coefficient-strip > div:last-child { border-left: 0; }
.coefficient-strip span, .coefficient-strip small { display: block; color: var(--muted); font-size: 10px; }
.coefficient-strip strong { display: block; min-height: 30px; margin: 3px 0; font-size: 15px; direction: ltr; text-align: right; overflow-wrap: anywhere; }
.density-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 22px 0 12px; border: 1px solid var(--line); background: var(--surface-soft); }
.density-summary > div { padding: 13px 15px; border-left: 1px solid var(--line); }
.density-summary > div:last-child { border-left: 0; }
.density-summary span, .density-summary small { display: block; color: var(--muted); font-size: 11px; }
.density-summary strong { display: block; min-height: 29px; margin-top: 3px; font-size: 16px; }
.inline-field input { width: 70px; min-height: 34px; margin-inline: 5px; }

.segmented-control { border: 0; padding: 0; margin: 0 0 28px; display: flex; flex-wrap: wrap; gap: 8px; }
.segmented-control legend { width: 100%; margin-bottom: 7px; font-size: 12px; font-weight: 800; color: var(--muted); }
.segmented-control label { position: relative; }
.segmented-control input { position: absolute; opacity: 0; pointer-events: none; }
.segmented-control span { min-width: 120px; display: inline-flex; justify-content: center; padding: 8px 18px; border: 1px solid var(--line); background: var(--surface-soft); font-weight: 750; }
.segmented-control input:checked + span { border-color: var(--brand); background: var(--brand); color: white; }
.segmented-control input:focus-visible + span { outline: 3px solid rgba(14,142,155,.25); }

.use-form { min-height: 230px; }
.inset { margin: 15px 0 20px; padding: 18px; background: var(--surface-soft); border-right: 3px solid var(--accent); }
.rows-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 18px 0 12px; }
.rows-heading h3, .rows-heading p { margin: 0; }
.rows-heading p { color: var(--muted); font-size: 12px; }
.floor-rows { display: grid; gap: 14px; }
.floor-row { border: 1px solid var(--line); padding: 18px; background: #FAFCFD; }
.floor-row-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.floor-row-header h4 { margin: 0; font-size: 14px; }
.inline-options { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 14px; }

.button { border: 1px solid transparent; border-radius: 8px; padding: 8px 16px; min-height: 42px; font-weight: 800; }
.button-primary { background: var(--brand); color: white; }
.button-primary:hover { background: #163828; }
.button-secondary { border-color: var(--brand-2); color: var(--brand-2); background: white; }
.button-quiet { border-color: var(--line); background: white; color: var(--ink); }
.button:disabled { opacity: .45; cursor: not-allowed; }
.icon-button { border: 0; background: transparent; color: var(--danger); font-size: 12px; font-weight: 800; }
.section-actions { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); display: flex; align-items: center; gap: 18px; }
.inline-result { margin: 0; color: var(--success); font-weight: 900; }

.two-column-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.two-column-layout h3 { margin: 0 0 12px; font-size: 16px; }
.option-card { border: 1px solid var(--line); padding: 15px; margin-bottom: 12px; }
.option-card > small { display: block; margin-top: 8px; color: var(--muted); }
.switch-line { display: flex; align-items: center; gap: 8px; }
.radio-stack { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
.radio-stack > label { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid var(--line); }
.radio-stack > label:has(input:checked) { border-color: var(--brand-2); background: var(--surface-soft); }
.radio-stack span, .radio-stack small { display: block; }
.radio-stack small { color: var(--muted); }

.additional-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.additional-card { border: 1px solid var(--line); padding: 18px; min-height: 132px; }
.additional-card > p { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.additional-card .form-grid { margin-top: 14px; }
.additional-card.unavailable { background: var(--surface-soft); color: var(--muted); }
.additional-card.unavailable > span { display: inline-block; margin: 6px 0 2px; padding: 2px 7px; border: 1px solid #D6DAE0; font-size: 10px; font-weight: 800; }

.block-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px 14px; flex-wrap: wrap; margin-bottom: 4px; }
.block-heading h3 { margin: 0; font-size: 16px; }
.block-hint { margin: 0 0 14px; color: var(--muted); font-size: 12px; }
.development-block { margin-top: 20px; }
.previous-building-block { margin-top: 18px; }
.discount-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: start; }
.discount-grid .option-card { margin-bottom: 0; }

.option-note { color: var(--muted); font-size: 11px; font-weight: 600; }

.bazaar-zone { margin-bottom: 14px; }
.bazaar-map { margin: 0; }
.bazaar-map img { display: block; width: 100%; max-width: 560px; height: auto; border: 1px solid var(--line); background: #fff; }
.bazaar-map figcaption { margin-top: 6px; color: var(--muted); font-size: 12px; }

.table5-block { margin-top: 18px; }
.table5-rows { display: grid; gap: 10px; }
.table5-row { display: flex; align-items: flex-start; gap: 12px; border: 1px solid var(--line); padding: 14px; background: var(--surface); }
.table5-row > .form-grid { flex: 1 1 auto; min-width: 0; }
.table5-row .remove-row { flex: 0 0 auto; margin-top: 28px; }
.table5-row .t5-cf { display: block; font-size: 18px; color: var(--brand-2); }
.table5-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 12px; flex-wrap: wrap; }

.alert { margin-bottom: 18px; padding: 13px 16px; border: 1px solid #e4b9b4; background: var(--danger-soft); color: #7e2b23; font-size: 13px; }
.alert ul { margin: 4px 0 0; padding-right: 18px; }
.alert strong, .alert small { display: block; }
.alert small { margin-top: 4px; opacity: .85; }
.empty-state { min-height: 280px; display: grid; place-content: center; text-align: center; color: var(--muted); }
.empty-state strong { color: var(--ink); font-size: 17px; }
.empty-state p { margin: 4px 0 0; }
.report-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.report-pdf-note { flex-basis: 100%; font-size: 13px; line-height: 1.8; color: #8C1D18; }
.total-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); }
.total-summary > div { padding: 16px; border-left: 1px solid var(--line); }
.total-summary > div:nth-child(4) { border-left: 0; }
.total-summary span, .total-summary small { display: block; color: var(--muted); font-size: 11px; }
.total-summary strong { display: block; margin-top: 6px; font-size: 16px; }
.total-summary .grand-total { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--line); background: var(--brand); color: white; display: grid; grid-template-columns: 1fr auto; align-items: center; }
.total-summary .grand-total span, .total-summary .grand-total small { color: #CFE7EB; }
.total-summary .grand-total strong { grid-row: 1 / 3; grid-column: 2; font-size: clamp(21px, 3vw, 31px); }
.report-warnings { margin-top: 16px; padding: 14px 18px; border: 1px solid rgba(214,164,77,.45); background: var(--accent-soft); color: var(--warning); font-size: 12px; }
.report-meta { margin: 20px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.report-meta span { border: 1px solid var(--line); padding: 4px 9px; font-size: 11px; color: var(--muted); }
.audit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 18px 0; }
.audit-grid section { border: 1px solid var(--line); padding: 16px; }
.audit-grid h3 { margin: 0 0 10px; font-size: 14px; }
.audit-table { width: 100%; border-collapse: collapse; font-size: 11px; }
.audit-table th, .audit-table td { padding: 6px 4px; border-bottom: 1px solid var(--line); text-align: right; vertical-align: top; }
.audit-table th { width: 40%; color: var(--muted); font-weight: 600; }
.raw-inputs { margin: 14px 0; border: 1px solid var(--line); padding: 10px 14px; }
.raw-inputs summary { cursor: pointer; font-weight: 800; font-size: 13px; }
.raw-inputs pre { direction: ltr; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 11px; background: var(--surface-soft); padding: 12px; }
.trace-evidence { color: var(--warning); font-size: 11px; }
.trace-header { display: flex; align-items: end; justify-content: space-between; margin-top: 28px; border-bottom: 1px solid var(--line); }
.trace-header h3 { margin: 0 0 9px; }
.trace-header span { margin-bottom: 10px; color: var(--muted); font-size: 11px; }
.trace-list { display: grid; }
.trace-step { padding: 16px 2px; border-bottom: 1px solid var(--line); }
.trace-step-head { display: flex; justify-content: space-between; gap: 15px; }
.trace-step h4 { margin: 0; font-size: 14px; }
.trace-step .trace-source { color: var(--muted); font-size: 10px; }
.formula { direction: ltr; unicode-bidi: plaintext; text-align: start; font-family: ui-monospace, Consolas, monospace; background: var(--surface-soft); border-right: 3px solid var(--brand-2); padding: 10px 12px; overflow-x: auto; white-space: nowrap; font-size: 12px; }
.substitution { direction: ltr; unicode-bidi: plaintext; text-align: start; color: var(--muted); font-family: ui-monospace, Consolas, monospace; font-size: 11px; overflow-wrap: anywhere; }
.trace-result { color: var(--success); font-weight: 900; }

@media (max-width: 1150px) {
  .app-shell { grid-template-columns: 220px minmax(0, 1fr); }
  .columns-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .coefficient-strip { grid-template-columns: repeat(3, 1fr); }
  .coefficient-strip > div { border-bottom: 1px solid var(--line); }
}

@media (max-width: 850px) {
  .site-header { position: static; flex-direction: column; align-items: stretch; }
  .header-actions { justify-content: space-between; }
  .app-shell { display: block; padding-top: 14px; }
  .workflow { position: static; overflow-x: auto; margin-bottom: 14px; }
  .workflow ol { display: flex; min-width: 720px; border: 0; }
  .workflow li { flex: 1; }
  .workflow-step { border-right: 0; border-bottom: 3px solid transparent; }
  .workflow-step.active { border-bottom-color: var(--brand-2); }
  .source-box { display: none; }
  .columns-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .two-column-layout { grid-template-columns: 1fr; }
  .audit-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .brand-mark { width: 42px; height: 42px; }
  .data-status { white-space: normal; }
  .panel { padding: 18px 14px; border-radius: 0; margin-inline: -16px; }
  .section-heading { flex-direction: column; }
  .form-grid, .columns-2, .columns-3, .columns-4, .additional-grid, .discount-grid { grid-template-columns: 1fr; }
  .span-2 { grid-column: auto; }
  .coefficient-strip { grid-template-columns: repeat(2, 1fr); }
  .density-summary { grid-template-columns: 1fr; }
  .density-summary > div { border-left: 0; border-bottom: 1px solid var(--line); }
  .segmented-control { display: grid; grid-template-columns: repeat(2, 1fr); }
  .segmented-control span { min-width: 0; padding-inline: 8px; }
  .total-summary { grid-template-columns: repeat(2, 1fr); }
  .total-summary > div:nth-child(2) { border-left: 0; }
  .total-summary > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .total-summary .grand-total { grid-template-columns: 1fr; }
  .total-summary .grand-total strong { grid-row: auto; grid-column: auto; }
  .report-actions { width: 100%; }
  .report-actions .button { flex: 1; }
}

@media print {
  body { background: white; }
  .site-header, .workflow, .workflow-panel:not(#report-section), .report-actions, .skip-link { display: none !important; }
  .app-shell { display: block; padding: 0; }
  #report-section { display: block !important; border: 0; box-shadow: none; padding: 0; }
  .trace-step { break-inside: avoid; }
}


.calculation-mode-tabs { padding: 10px; border: 1px solid var(--line); background: #F1F7FA; }
.calculation-mode-tabs label { flex: 1 1 210px; }
.calculation-mode-tabs span { width: 100%; min-height: 48px; align-items: center; }
.use-selector label { flex: 1 1 135px; }
.use-selector span { width: 100%; }
.ledger-section { margin: 22px 0; padding: 16px; border: 1px solid var(--line); background: #FAFCFD; }
.ledger-section h3 { margin: 0 0 10px; font-size: 15px; }
.ledger-table th:first-child { width: 20%; }
.ledger-table th:nth-child(2) { width: 55%; }
.ledger-table td:last-child { direction: ltr; text-align: left; font-weight: 800; }
.readable-block { margin: 10px 0; padding: 10px; border: 1px solid var(--line); background: var(--surface-soft); }
.readable-block h4 { margin: 0 0 7px; }
.raw-inputs details { margin: 8px 0; padding: 7px 10px; border: 1px dashed var(--line); }
@media (max-width: 600px) {
  .calculation-mode-tabs, .use-selector { grid-template-columns: 1fr; }
  .ledger-section { margin-inline: -4px; padding: 10px; overflow-x: auto; }
  .ledger-table { min-width: 560px; }
}

/* v5.7.3 — سه موتور مستقل و رابط کم‌ورودی */
.engine-context-bar { position: sticky; top: 102px; z-index: 9; display: grid; grid-template-columns: 1.3fr 1fr 1.4fr; gap: 1px; margin: -8px 0 24px; border: 1px solid var(--line); background: var(--line); box-shadow: 0 8px 18px rgba(8,60,54,.06); }
.engine-context-bar > div { padding: 10px 13px; background: #F4F9FB; min-width: 0; }
.engine-context-bar span,.engine-context-bar strong { display:block; }
.engine-context-bar span { color:var(--muted); font-size:10px; }
.engine-context-bar strong { font-size:12px; overflow-wrap:anywhere; }
.engine-panel { animation:engineIn .18s ease-out; }
.engine-intro-copy { display:flex; align-items:center; gap:12px; margin-bottom:18px; padding:14px 16px; border:1px solid #C6DDE2; border-right:4px solid var(--brand-2); background:var(--surface-soft); }
.engine-intro-copy strong,.engine-intro-copy span { display:block; }
.engine-intro-copy strong { white-space:nowrap; }
.engine-intro-copy span { color:var(--muted); font-size:12px; }
.use-details-heading { margin:26px 0 14px; padding:11px 14px; border-bottom:2px solid var(--brand-2); background:linear-gradient(90deg,#fff,var(--surface-soft)); }
.use-details-heading strong,.use-details-heading span { display:block; }
.use-details-heading span { color:var(--muted); font-size:11px; }
.engine-use-form { margin-bottom:22px; padding:18px; border:1px solid var(--line); background:#fff; }
.derived-field { justify-content:center; padding:10px 12px; border:1px dashed #CFC7B2; background:#F7F3EA; }
.derived-field strong { font-size:13px; }
.derived-field small { color:var(--muted); }
.article8-engine { border-right-color:var(--brand-2); }
.article8-fields { margin-top:14px; }
.smart-default-field { opacity:.82; }
.smart-default-field > span:first-child::after { content:" — مقدار سیستمی"; color:var(--success); font-size:10px; }
.smart-default-field input { background:#EAF4F6; }
@keyframes engineIn { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
@media(max-width:850px){.engine-context-bar{top:0;grid-template-columns:1fr;position:relative}.engine-intro-copy{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.engine-context-bar{margin-inline:-6px}.engine-use-form{padding:12px;margin-inline:-4px}}

/* v5.7.2 — جدول شفاف کران‌های Cf */
.cf-preview-card{margin-top:20px;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.cf-preview-heading{display:flex;justify-content:space-between;align-items:start;gap:18px;padding:17px 18px;background:linear-gradient(135deg,#F0F7F9,#fffaf0);border-bottom:1px solid var(--line)}
.cf-preview-heading h3,.cf-preview-heading p{margin:0}.cf-preview-heading p{color:var(--muted);font-size:12px;margin-top:3px}
.cf-table-scroll{overflow-x:auto}.cf-preview-table{width:100%;min-width:720px;border-collapse:collapse;font-size:12px}
.cf-preview-table th,.cf-preview-table td{padding:11px 12px;text-align:center;border:1px solid var(--line)}.cf-preview-table thead th{background:var(--brand);color:#fff;white-space:nowrap}
/* ستون‌های عددی وسط‌چین می‌مانند، ولی خانه‌هایی که جمله‌ی فارسی دارند راست‌چین می‌شوند —
   وسط‌چین‌کردن متن فارسی خواندنش را سخت می‌کند. */
.cf-preview-table td:first-child,.cf-preview-table thead th:first-child,.cf-preview-table tfoot th{text-align:right}
.cf-permitted-row td{background:#edf9f2}.cf-excess-row td{background:#fff4e6}.cf-permitted-row:hover td{background:#e1f4e9}.cf-excess-row:hover td{background:#ffe9cf}
.cf-active-cell{font-weight:950!important;color:#0b4235!important;box-shadow:inset 0 -3px 0 #258266}.cf-excess-row .cf-active-cell{color:#8a3e0d!important;box-shadow:inset 0 -3px 0 #e07b28}
.cf-muted-cell{color:#87918e;opacity:.72}.cf-sf-cell{direction:ltr;font-weight:850}.cf-status-pill{display:inline-block;border-radius:999px;padding:3px 9px;font-weight:850;white-space:nowrap}
.cf-permitted-row .cf-status-pill{background:#d4f0df;color:#146044}.cf-excess-row .cf-status-pill{background:#ffe0bd;color:#91460f}
.cf-preview-table tfoot th,.cf-preview-table tfoot td{background:var(--surface-soft);font-weight:850}.cf-preview-table .cf-total-row th,.cf-preview-table .cf-total-row td{background:var(--accent-soft);color:var(--brand);font-size:13px}
@media(max-width:600px){.cf-preview-heading{display:block}.cf-preview-heading .source-tag{margin-top:10px}.cf-table-scroll{margin:0}.cf-preview-table{min-width:680px}}

/* ——— گردش مرحله‌ای ——— */
.step-nav {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--line);
}
.step-nav-end { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.step-nav .button { min-height: 44px; padding: 11px 22px; border-radius: 10px; font-weight: 700; }
.step-nav .button-primary {
  background: var(--brand); color: #fff; border: 1px solid var(--brand);
  transition: background-color .25s ease, box-shadow .25s ease, transform .15s ease;
}
.step-nav .button-primary:hover:not(:disabled) { background: var(--brand-2); box-shadow: var(--shadow); transform: translateY(-1px); }
.step-nav .button-primary:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.step-nav .button-quiet {
  background: transparent; color: var(--brand); border: 1px solid var(--line);
  transition: background-color .25s ease, border-color .25s ease;
}
.step-nav .button-quiet:hover { background: rgba(15,76,69,.05); border-color: var(--brand-2); }

/* مرحله‌ی طی‌شده: خوانا می‌ماند ولی قابل ویرایش نیست. */
.workflow-panel.step-locked { position: relative; }
.workflow-panel.step-locked::before {
  content: "این مرحله تکمیل شده و در همین پرونده قابل ویرایش نیست.";
  display: block; margin-bottom: 20px; padding: 11px 16px;
  border: 1px solid rgba(214,164,77,.45); border-radius: 10px;
  background: var(--accent-soft); color: var(--warning);
  font-size: 12.5px; font-weight: 700;
}
.workflow-panel.step-locked input:disabled,
.workflow-panel.step-locked select:disabled,
.workflow-panel.step-locked textarea:disabled {
  background: var(--surface-soft); color: var(--ink); opacity: 1; cursor: default;
}

.workflow-panel.step-reopened::before {
  content: "این مرحله برای اصلاح خطا دوباره باز شد. پس از اصلاح، به گام آخر برگردید.";
  display: block; margin-bottom: 20px; padding: 11px 16px;
  border: 1px solid rgba(179,38,30,.25); border-radius: 10px;
  background: var(--danger-soft); color: var(--danger);
  font-size: 12.5px; font-weight: 700;
}

.workflow-step.done > span { background: var(--success); color: #fff; }
.workflow-step.blocked { opacity: .45; cursor: not-allowed; }
.workflow-step.blocked:hover { background: transparent; }

.report-subhead { margin: 26px 0 10px; font-size: 15px; color: var(--brand); }

/* ——— پاپ‌آپ تأیید ——— */
.modal-overlay {
  position: fixed; inset: 0; z-index: 200;
  display: grid; place-items: center; padding: 20px;
  background: rgba(16, 38, 31, .45); backdrop-filter: blur(3px);
  animation: modalFade .18s ease;
}
.modal-box {
  width: min(460px, 100%);
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 28px; box-shadow: 0 24px 60px rgba(8,60,54,.22);
  animation: modalRise .22s cubic-bezier(.16,1,.3,1);
}
.modal-box h3 { margin: 0 0 10px; font-size: 18px; color: var(--brand); }
.modal-box p { margin: 0 0 22px; color: var(--ink); font-size: 14px; line-height: 1.9; }
.modal-box.warn h3 { color: var(--warning); }
.modal-actions { display: flex; justify-content: flex-start; gap: 10px; flex-wrap: wrap; }
.modal-actions .button { min-height: 44px; padding: 11px 22px; border-radius: 10px; font-weight: 700; }
.modal-actions .button-primary { background: var(--brand); color: #fff; border: 1px solid var(--brand); }
.modal-actions .button-primary:hover { background: var(--brand-2); }
.modal-actions .button-quiet { background: transparent; color: var(--muted); border: 1px solid var(--line); }
.modal-actions .button-quiet:hover { background: rgba(15,76,69,.05); color: var(--brand); }
@keyframes modalFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes modalRise { from { opacity: 0; transform: translateY(12px) } to { opacity: 1; transform: none } }

/* ——— پنجره‌ی پرداخت (billing.js) ——— */
.bill-lines { margin: 0 0 16px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.bill-line { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 5px 0; font-size: 13.5px; color: var(--muted); }
.bill-line + .bill-line { border-top: 1px dashed var(--line); }
.bill-line strong { color: var(--ink); font-weight: 700; white-space: nowrap; }
.bill-line.total strong { color: var(--brand); font-size: 16px; }
.modal-box p.bill-note { margin-bottom: 20px; font-size: 12.5px; color: var(--muted); line-height: 1.9; }
/* تخفیف‌ها و کد تخفیف در پنجره‌ی تأیید پرداخت (billing.js) */
.bill-line.discount strong { color: #1e7a4c; }
.bill-code { display: flex; gap: 8px; margin: 0 0 6px; }
.bill-code input { flex: 1; min-width: 0; height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; font: inherit; text-align: left; }
.bill-code button { white-space: nowrap; }
.modal-box p.bill-code-msg { margin: 0 0 10px; font-size: 12.5px; }
.modal-box p.bill-code-msg.ok { color: #1e7a4c; }
.modal-box p.bill-code-msg.bad { color: #b3261e; }
.reopen-note { margin-bottom: 18px; padding: 12px 16px; border-radius: 10px; background: rgba(46,139,87,.1); color: var(--success); font-size: 13px; font-weight: 700; line-height: 1.9; }

/* ——— انتخاب ملک از روی نقشه ——— */
.map-pick-bar {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin-bottom: 22px; padding: 15px 18px;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--surface-soft);
}
.map-pick-bar .button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 18px; border-radius: 10px; background: var(--surface); color: var(--brand); border: 1px solid var(--brand-2); font-weight: 700; }
.map-pick-bar .button:hover { background: var(--brand-2); color: #fff; }
.map-pick-bar small { color: var(--muted); font-size: 12.5px; flex: 1; min-width: 220px; }
.map-pick-note { flex-basis: 100%; margin: 0; padding: 9px 13px; border-radius: 9px; background: rgba(46,139,87,.1); color: var(--success); font-size: 12.5px; font-weight: 700; line-height: 1.85; }
.map-pick-note.warn { background: var(--accent-soft); color: var(--warning); }

.map-overlay {
  position: fixed; inset: 0; z-index: 210;
  display: grid; place-items: center; padding: 20px;
  background: rgba(16, 38, 31, .5); backdrop-filter: blur(3px);
  animation: modalFade .18s ease;
}
.map-box {
  width: min(1040px, 100%); height: min(720px, 92vh);
  display: flex; flex-direction: column;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 24px 60px rgba(8,60,54,.24); overflow: hidden;
  animation: modalRise .22s cubic-bezier(.16,1,.3,1);
}
.map-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.map-head h3 { margin: 0; font-size: 17px; color: var(--brand); }
.map-head p { margin: 3px 0 0; color: var(--muted); font-size: 12.5px; }
.map-close { width: 34px; height: 34px; padding: 0; flex: none; border: 0; border-radius: 50%; background: transparent; color: var(--muted); font-size: 24px; line-height: 1; }
.map-close:hover { background: rgba(15,76,69,.06); color: var(--brand); }

.map-canvas { flex: 1; min-height: 0; }
.map-canvas .leaflet-container { width: 100%; height: 100%; font: inherit; background: var(--surface-soft); }

.map-foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; padding: 15px 22px; border-top: 1px solid var(--line); background: var(--surface-soft); }
.map-readout { flex: 1; min-width: 240px; color: var(--muted); font-size: 13px; }
.map-readout dl { display: flex; flex-wrap: wrap; gap: 7px 20px; margin: 0; }
.map-readout dl > div { display: flex; gap: 6px; }
.map-readout dt { color: var(--muted); font-size: 12px; }
.map-readout dd { margin: 0; color: var(--ink); font-size: 12.5px; font-weight: 700; }
/* پنجره‌ی نقشه‌ی فرم مقادیر خوانده‌شده را نشان نمی‌دهد (محافظت از لایه‌ی داده)؛ فقط
   یک تأیید کوتاه، و در ملک نبش انتخاب بین عرض‌های ممکن. */
.map-picked { margin: 0; color: var(--ink); font-size: 13px; }
.map-streets { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.map-streets-title { flex-basis: 100%; color: var(--muted); font-size: 12px; }
.map-street { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); cursor: pointer; font-size: 12.5px; }
.map-street:hover { border-color: var(--brand); }
.map-street:has(input:checked) { border-color: var(--brand); background: rgba(15,76,69,.07); }
.map-street input { margin: 0; accent-color: var(--brand); }
.map-street-w { color: var(--ink); font-weight: 700; }
.map-street-tag { color: var(--muted); font-size: 11px; }

.map-actions { display: flex; gap: 10px; }
.map-actions .button { min-height: 42px; padding: 10px 20px; border-radius: 10px; font-weight: 700; }
.map-actions .button-primary { background: var(--brand); color: #fff; border: 1px solid var(--brand); }
.map-actions .button-primary:hover:not(:disabled) { background: var(--brand-2); }
.map-actions .button-primary:disabled { opacity: .5; cursor: not-allowed; }
.map-actions .button-quiet { background: transparent; color: var(--muted); border: 1px solid var(--line); }
.map-actions .button-quiet:hover { background: rgba(15,76,69,.05); color: var(--brand); }

@media (max-width: 600px) {
  .map-box { height: 94vh; }
  .map-foot { flex-direction: column; align-items: stretch; }
  .map-actions .button { flex: 1; }
}

/* ——— لودینگ ورود به سامانه ——— */
.boot-screen {
  position: fixed; inset: 0; z-index: 150;
  display: grid; place-items: center; gap: 18px; align-content: center;
  background: var(--page);
  transition: opacity .35s ease, visibility .35s ease;
}
.boot-screen.done { opacity: 0; visibility: hidden; }
.boot-screen img { height: 62px; width: auto; }
.boot-screen p { margin: 0; color: var(--muted); font-size: 13.5px; }
.boot-bar { width: 190px; height: 3px; border-radius: 999px; background: rgba(15,76,69,.12); overflow: hidden; }
.boot-bar::after {
  content: ""; display: block; width: 40%; height: 100%;
  border-radius: 999px; background: var(--brand);
  animation: bootSlide 1.05s ease-in-out infinite;
}
@keyframes bootSlide { 0% { transform: translateX(120%) } 100% { transform: translateX(-260%) } }

@media (max-width: 600px) {
  .step-nav { flex-direction: column; align-items: stretch; }
  .step-nav-end { flex-direction: column; }
  .step-nav .button { width: 100%; }
}

/* ═══ ماده صد — علامت راهنما و ردیف‌های تخلف ═══
   کارفرما: «کاربر اطلاعاتی که نیاز نیست نبیند و گیج نشود.» راهنما به‌جای متن ثابت
   داخل فرم می‌نشیند تا فرم شلوغ نشود ولی توضیح در دسترس بماند. */
.help-mark {
  display: inline-grid; place-items: center; width: 17px; height: 17px; margin-inline-start: 6px;
  border: 0; border-radius: 50%; background: var(--brand, #1E4A3B); color: #fff;
  font-size: 11px; font-weight: 800; line-height: 1; cursor: help; vertical-align: middle;
}
.help-mark:hover, .help-mark:focus-visible { filter: brightness(1.15); outline: none; }

.violation-row { border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; margin-bottom: 14px; background: rgba(255,255,255,.5); }
.violation-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.violation-head strong { font-size: 14px; }
.violation-remove { padding: 4px 12px; font-size: 12px; }
.violation-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.violation-actions small { flex: 1 1 260px; }
.violation-equipment-select { min-height: 96px; }
.report-basis { border: 1px solid var(--line); border-radius: 10px; padding: 12px 16px; margin: 16px 0; background: rgba(255,255,255,.55); }
.report-basis strong { display: block; margin-bottom: 6px; font-size: 13px; }
.report-basis ul { margin: 0; padding-inline-start: 18px; }
.report-basis li { font-size: 12px; line-height: 1.9; color: var(--muted); }

/* چیدمان تک‌ستونه‌ی ماده صد — انتهای فایل و با دو کلاس، تا media queryهای بالاتر
   (که برای چیدمان دوستونه‌ی عوارض شهرسازی‌اند) دوباره ستون کناری را برنگردانند. */
.app-shell.app-shell-single { grid-template-columns: minmax(0, 1fr); max-width: 1080px; }

/* ═══ گزارش ماده صد — سربرگ و جدول‌ها (طرح کارفرما) ═══ */
.report-letterhead {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  padding: 14px 18px; margin-bottom: 18px;
  border-bottom: 3px solid var(--brand, #1E4A3B);
}
.letterhead-brand { display: flex; align-items: center; gap: 10px; }
.letterhead-brand img { width: 44px; height: 44px; }
.letterhead-brand span { font-size: 22px; font-weight: 800; color: var(--brand, #1E4A3B); letter-spacing: 2px; }

/* ═══ سربرگ گزارش ماده صد ═══
   `.app-shell-single` فقط روی صفحه‌ی جرائم ماده صد گذاشته می‌شود (تک‌مرحله‌ای)،
   پس این دو قاعده به ماشین‌حساب عوارض شهرسازی نمی‌رسند — به‌دستور کارفرما که
   گفت فعلاً فقط روی ماده صد کار شود.

   لوگو ۵۶۰×۲۶۴ است (نسبت ۲٫۱۲ به ۱). قاعده‌ی بالا هر دو بُعد را ۴۴ می‌کرد و
   تصویر را به مربع می‌فشرد. حالا ارتفاع مبناست و عرض خودش می‌آید. */
.app-shell-single .letterhead-brand img { width: auto; height: 44px; }

/* واژه‌ی «بارو» داخل خودِ لوگو هست؛ کنارش دوباره نوشته می‌شد و «بارو بارو» می‌شد. */
.app-shell-single .letterhead-brand span { display: none; }
.letterhead-meta { display: grid; gap: 4px; margin: 0; }
.letterhead-meta > div { display: flex; gap: 8px; font-size: 12px; }
.letterhead-meta dt { color: var(--muted); }
.letterhead-meta dt::after { content: ":"; }
.letterhead-meta dd { margin: 0; font-weight: 600; }

.report-block { margin: 18px 0; }
.report-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.report-table th, .report-table td { border: 1px solid var(--line); padding: 7px 9px; text-align: center; }
.report-table thead th { background: var(--brand, #1E4A3B); color: #fff; font-weight: 700; }
.report-table tbody tr:nth-child(odd) { background: rgba(30, 74, 59, .04); }
.tier-caption { margin: 10px 0 4px; font-size: 12px; font-weight: 700; }
.report-table .tier-total td { background: rgba(30,74,59,.08); font-weight: 700; }

/* ═══ گزارش ماده صد — ظاهر مطابق طرح کارفرما (سند «1382.docx») ═══ */
.report-top-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 18px 0; }
@media (max-width: 900px) { .report-top-grid { grid-template-columns: minmax(0, 1fr); } }

.report-card { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; margin: 16px 0; }
.report-top-grid .report-card { margin: 0; }
.report-card > h3 {
  margin: 0; padding: 10px 14px; font-size: 13px; font-weight: 700;
  background: var(--brand, #1E4A3B); color: #fff; text-align: center;
}
.report-card .report-table { border: 0; }
.report-card .report-table thead th { background: rgba(30,74,59,.12); color: var(--ink); }
.report-card .report-basis { border: 0; border-radius: 0; margin: 0; background: transparent; padding: 12px 16px; }

/* مبلغ نهایی — جعبه‌ی سبز با عدد درشت، مثل طرح */
.report-final {
  display: flex; align-items: center; justify-content: center; gap: 18px; flex-wrap: wrap;
  margin: 20px 0; padding: 18px 24px; border-radius: 12px;
  background: rgba(30,74,59,.08); border: 1px solid rgba(30,74,59,.25);
}
.report-final-label { font-size: 13px; color: var(--muted); }
.report-final strong { font-size: 26px; font-weight: 800; color: var(--brand, #1E4A3B); letter-spacing: .5px; }


/* ═══════════ بخش چهارم: دو خوانش از یک گزارش ═══════════
   «گزارش مدیریتی» برای مرجع رسیدگی و «گزارش تفصیلی» برای کارشناس دادگستری.
   هیچ‌کدام عددی نمی‌سازند؛ فقط همان گزارش را دو جور می‌چینند. */

.report-tabs {
  display: flex;
  gap: 8px;
  padding: 6px;
  margin: 0 0 20px;
  background: var(--surface-soft, #F1F4F2);
  border: 1px solid var(--line);
  border-radius: 14px;
}
.report-tab {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 11px 14px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  text-align: center;
  cursor: pointer;
  transition: background .15s, color .15s, box-shadow .15s;
}
.report-tab strong { font-size: 14px; font-weight: 700; }
.report-tab small { font-size: 11px; opacity: .85; }
.report-tab:hover { background: rgba(15, 76, 69, .06); color: var(--ink); }
.report-tab.is-active {
  background: var(--surface, #fff);
  border-color: var(--line);
  color: var(--brand, #0F4C45);
  box-shadow: 0 1px 2px rgba(8, 60, 54, .08);
}
@media (max-width: 620px) {
  .report-tabs { flex-direction: column; }
}

/* ——— برگ مدیریتی ——— */
.report-exec { display: grid; gap: 14px; }

.exec-hero {
  display: grid;
  gap: 6px;
  justify-items: center;
  text-align: center;
  padding: 19px 20px;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(135deg, var(--brand, #0F4C45), var(--brand-2, #136158));
  box-shadow: 0 8px 24px rgba(8, 60, 54, .18);
}
.exec-hero-label { font-size: 13px; letter-spacing: .4px; opacity: .8; }
.exec-hero-amount {
  font-size: clamp(24px, 4.4vw, 33px);
  font-weight: 800;
  letter-spacing: .5px;
  line-height: 1.3;
}
.exec-hero-words {
  font-size: 11.5px;
  opacity: .85;
  border-top: 1px solid rgba(255, 255, 255, .22);
  padding-top: 6px;
  margin-top: 2px;
}

.exec-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.exec-facts > div {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  background: var(--surface, #fff);
  border: 1px solid var(--line);
  border-radius: 12px;
  /* نوار طلایی سمت راست: نشانه‌ی «این عدد، شناسنامه‌ی پرونده است» */
  border-inline-start: 3px solid var(--accent, #D6A44D);
}
.exec-facts span { font-size: 11.5px; color: var(--muted); }
.exec-facts strong { font-size: 12.5px; font-weight: 700; color: var(--ink); line-height: 1.45; }
@media (max-width: 900px) { .exec-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .exec-facts { grid-template-columns: minmax(0, 1fr); } }

.exec-block {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: var(--surface, #fff);
}
.exec-block > h3 {
  margin: 0;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  background: rgba(15, 76, 69, .07);
  border-bottom: 1px solid var(--line);
}
.exec-block > h3 small { font-weight: 500; font-size: 11.5px; color: var(--muted); margin-inline-start: 8px; }
.exec-block > .report-table { border: 0; }

.exec-table td, .exec-table th { font-size: 12px; padding: 6px 8px; }
.exec-cell-start { text-align: start; }
.exec-cell-amount { font-weight: 700; white-space: nowrap; }
.exec-table .exec-table-total td {
  background: rgba(15, 76, 69, .09);
  font-weight: 800;
  border-top: 2px solid var(--brand, #0F4C45);
}

.exec-civil-amount {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 11px 14px;
}
.exec-civil-amount span { font-size: 12.5px; color: var(--muted); }
.exec-civil-amount strong { font-size: 19px; font-weight: 800; color: var(--brand, #0F4C45); }

.exec-basis { margin: 0; padding: 9px 28px 11px 14px; display: grid; gap: 4px; }
.exec-basis li { font-size: 12px; line-height: 1.7; color: var(--ink); }

.exec-note { margin: 0; padding: 10px 14px; font-size: 12px; color: var(--muted); line-height: 1.7; }

.exec-warn { border-color: rgba(138, 101, 32, .32); }
.exec-warn > h3 { background: rgba(214, 164, 77, .16); color: var(--warning, #8A6520); }
.exec-warn ul { margin: 0; padding: 9px 28px 11px 14px; display: grid; gap: 4px; }
.exec-warn li { font-size: 12px; line-height: 1.7; color: var(--ink); }

.exec-footnote {
  margin: 0;
  padding: 9px 14px;
  font-size: 11px;
  line-height: 1.75;
  color: var(--muted);
  background: var(--surface-soft, #F1F4F2);
  border: 1px dashed var(--line);
  border-radius: 10px;
}

/* کارت عوارض دیوانی از کلاس panel استفاده می‌کند و min-height ۴۶۰ پیکسلیِ
   مراحلِ فرم را ارث می‌برد — که وقتی این دوره عوارض دیوانی ندارد، یک کادر
   خالی به بلندی نصف صفحه در گزارش می‌سازد. این کارت، مرحله‌ی فرم نیست. */
#civil-toll-block { min-height: 0; }

/* ——— جدول ضرایب ——— */
.coef-table td, .coef-table th { font-size: 12px; padding: 6px 8px; }
.coef-symbol { font-weight: 700; color: var(--brand, #0F4C45); font-size: 13px; }
.coef-basis { color: var(--muted); font-size: 11.5px; }

.exec-inline-note {
  margin: 0;
  padding: 9px 13px;
  font-size: 11.5px;
  line-height: 1.7;
  color: var(--ink);
  background: var(--accent-soft, rgba(214,164,77,.14));
  border-inline-start: 3px solid var(--accent, #D6A44D);
  border-radius: 8px;
}
.exec-inline-note strong { color: var(--warning, #8A6520); }

/* افشای مبنای تفکیک کران‌ها — رویه است نه نص مصوبه، و گزارش باید همین را بگوید. */
.tier-allocation-note {
  margin: 0;
  padding: 10px 14px;
  font-size: 11.5px;
  line-height: 1.75;
  color: var(--warning, #8A6520);
  background: var(--accent-soft, rgba(214,164,77,.14));
  border-top: 1px solid var(--line);
}

/* افشای مبنای تفکیک کران‌ها — رویه است نه نص مصوبه، و گزارش باید همین را بگوید. */
.tier-allocation-note {
  margin: 0;
  padding: 10px 14px;
  font-size: 11.5px;
  line-height: 1.75;
  color: var(--warning, #8A6520);
  background: var(--accent-soft, rgba(214,164,77,.14));
  border-top: 1px solid var(--line);
}

/* کارفرما: «با کمترین توضیحات». جدول‌ها حالا روش محاسبه را نشان می‌دهند، پس
   متن‌های کنارشان دوستونی می‌شوند تا برگ مدیریتی به یک صفحه نزدیک‌تر شود.
   چیزی حذف نمی‌شود — متن حقوقی را از جلوی چشم مرجع رسیدگی برنمی‌داریم. */
@media (min-width: 760px) {
  .exec-warn ul, .exec-basis { columns: 2; column-gap: 26px; }
  .exec-warn li, .exec-basis li { break-inside: avoid; }
}

/* ردیف کران «۰ تا ۱۲۰٪»: عضو جدول است ولی ضریب پله ندارد، پس با یک نوار
   طلایی از پله‌ها جدا می‌شود تا کسی آن را پله‌ی دیگری نخواند. */
.report-table .tier-below td { background: var(--accent-soft, rgba(214,164,77,.14)); }
.report-table .tier-below td:first-child { border-inline-start: 3px solid var(--accent, #D6A44D); }


@media print {
  /* زبانه‌ها ابزار صفحه‌اند، نه بخشی از سند؛ آنچه چاپ می‌شود همان خوانشی است
     که کاربر انتخاب کرده — خوانش دیگر hidden است و خودبه‌خود چاپ نمی‌شود. */
  .report-tabs { display: none !important; }
  .exec-hero {
    color: var(--ink);
    background: none;
    border: 2px solid var(--brand, #0F4C45);
    box-shadow: none;
  }
  .exec-hero-words { border-top-color: var(--line); }
  .exec-block, .exec-facts > div { break-inside: avoid; }
}


/* ═══════════ فرم دوطبقه‌ی ماده صد ═══════════ */

/* مشخصات ملک — یک‌بار، بالای تخلف‌ها. کارت خودش را دارد تا از ردیف‌های تخلف
   جدا دیده شود و معلوم باشد این‌ها مال کل پرونده‌اند. */
.property-block {
  margin: 0 0 18px;
  padding: 16px 18px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft, #F1F4F2);
}
.property-block > h3 {
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 800;
  color: var(--brand, #0F4C45);
}
/* فرم عوارض دیوانی سال تاریخی — همان فرم سال جاری، زیر تیک خودش. قاب جدا دارد
   تا با مشخصات ملکِ جریمه (property-block) که درست زیرش می‌آید قاطی نشود. */
.civil-toll-form {
  margin: 10px 0 18px;
  padding: 16px 18px 18px;
  border: 1px solid var(--line);
  border-inline-start: 3px solid var(--brand, #0F4C45);
  border-radius: 12px;
}
.civil-toll-form > h3 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 800;
  color: var(--brand, #0F4C45);
}
.civil-toll-form > .field-hint { display: block; margin-bottom: 12px; }
@media (max-width: 860px) { .property-block .columns-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .property-block .columns-3 { grid-template-columns: minmax(0, 1fr); } }

/* نوار توازن مساحت — سامانه تفکیک را حدس نمی‌زند، فقط می‌گوید می‌خواند یا نه. */
.balance-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 14px;
  margin: 14px 0 0;
  padding: 11px 14px;
  border-radius: 10px;
  border: 1px solid var(--line);
  font-size: 12.5px;
  line-height: 1.7;
}
.balance-bar .balance-line { font-weight: 700; }
.balance-bar .balance-verdict { font-weight: 700; }
.balance-bar .balance-note { flex-basis: 100%; font-size: 11.5px; color: var(--muted); }
.balance-bar.is-balanced {
  background: rgba(46, 139, 87, .08);
  border-color: rgba(46, 139, 87, .3);
}
.balance-bar.is-balanced .balance-verdict { color: var(--success, #2E8B57); }
.balance-bar.is-off {
  background: var(--danger-soft, #FBECEB);
  border-color: rgba(179, 38, 30, .3);
}
.balance-bar.is-off .balance-verdict { color: var(--danger, #B3261E); }

/* ═══════════ صفحه‌ی جرائم ماده صد ═══════════ */

/* نوار «پرونده فعال» در ماشین‌حساب عوارض چسبان است تا هنگام اسکرولِ فرمِ بلند
   بالای صفحه بماند. در صفحه‌ی ماده صد که تک‌مرحله‌ای است، همان چسبندگی باعث
   می‌شد نوار روی «نوع محاسبه فرم» بنشیند و متنش را بپوشاند. اینجا در جریان
   عادی صفحه می‌ماند. */
.app-shell-single .engine-context-bar { position: static; margin: 4px 0 20px; }

/* نوار بارگذاری فرم پس از انتخاب سال. */
.form-loading {
  display: flex; align-items: center; gap: 9px;
  margin: 10px 0 2px; padding: 9px 13px;
  border: 1px solid var(--line); background: var(--surface-soft);
  color: var(--muted); font-size: 12px;
}
.form-loading-dot {
  width: 11px; height: 11px; flex: none; border-radius: 50%;
  border: 2px solid var(--brand-2); border-top-color: transparent;
  animation: formLoadingSpin .7s linear infinite;
}
@keyframes formLoadingSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .form-loading-dot { animation: none; border-top-color: var(--brand-2); opacity: .5; }
}

/* ردیف‌های «گذرهای مشرف به ملک» — یک ملک می‌تواند بر چند گذر بَر داشته باشد و
   گران‌ترینشان ملاک است، پس ردیف‌ها افزودنی‌اند. */
.tier-row { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
.tier-row .tier-select { flex: 1; min-width: 0; }
.tier-row .tier-remove { flex: none; padding: 6px 11px; line-height: 1; }
.tier-add { margin-top: 2px; align-self: flex-start; }

/* ═══ فرم «بنای مجاز / بنای موجود» ماده صد ۱۴۰۲ به بعد (js/article100-buildings.js) ═══
   هر بخش رنگ کناره‌ی خودش را دارد تا بخش‌ها از هم جدا دیده شوند (حکم کارفرما). */
.article100-buildings { margin: 8px 0 24px; }
/* فرم قدیم وقتی فرم تازه فعال است؛ تراکم از دو بنا ساخته می‌شود و دوباره پرسیده نمی‌شود. */
.article100-buildings-on #permit-use-selector,
.article100-buildings-on #use-details-heading,
.article100-buildings-on .use-form.engine-use-form,
.article100-buildings-on #article100-factor-block,
.article100-buildings-on .field:has(> #article100-parking-count),
.article100-buildings-on .field:has(> #article100-parking-use),
.article100-buildings-on .field:has(> #article100-parking-coeff),
.article100-buildings-on .field:has(input[name="densityInputMode"]),
.article100-buildings-on #density-percent-field,
.article100-buildings-on #density-gross-field,
.article100-buildings-on #density-excluded-field { display: none !important; }
/* دوره‌ی ۱۳۴۹ تا ۱۳۵۲، بنای غیرمسکونی: عوارض کسری پارکینگ فقط Kr و Km/Ks و P می‌خواهد — منطقه، بلوک و
   عرض گذر. پهنه، زیرپهنه، عرصه و تراکم در فرمولش نیستند و دیده نمی‌شوند (کاربر اطلاعاتی که نیاز نیست نبیند). */
.article100-parking-toll-only #property-fields .form-grid > .field:not(:has(#district, #block, #streetWidth)),
.article100-parking-toll-only #property-fields .check-group,
.article100-parking-toll-only #property-fields #bazaar-block,
.article100-parking-toll-only #property-fields #table5-block { display: none !important; }
.b-section { border: 1px solid var(--line); border-right: 4px solid var(--brand); background: var(--surface); padding: 16px 18px; margin-bottom: 16px; }
.b-s2 { border-right-color: #1D9E75; }
.b-s3 { border-right-color: var(--muted); }
.b-s4 { border-right-color: var(--accent); }
.b-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.b-head h3 { margin: 0; font-size: 16px; }
.b-head small { color: var(--muted); font-size: 12px; }
.b-num { width: 26px; height: 26px; border-radius: 50%; background: var(--brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; }
.b-types, .b-uses { margin: 0 0 12px; }
.b-seg { min-width: 120px; padding: 8px 18px; border: 1px solid var(--line); background: var(--surface-soft); font: inherit; font-weight: 750; cursor: pointer; }
.b-seg.on { border-color: var(--brand); background: var(--brand); color: #fff; }
.b-seg.b-fixed { cursor: default; display: inline-flex; justify-content: center; }
.b-use { border: 1px solid var(--line); padding: 12px; margin-bottom: 12px; background: var(--surface-soft); }
.b-grid { display: grid; grid-template-columns: 72px repeat(3, minmax(0, 1fr)) 96px; gap: 8px 10px; align-items: center; }
.b-res .b-grid { grid-template-columns: 72px repeat(4, minmax(0, 1fr)) 96px; }
.b-th { font-size: 11px; color: var(--muted); font-weight: 700; }
.b-side { font-size: 12px; color: var(--muted); font-weight: 700; }
.b-grid input { width: 100%; min-width: 0; box-sizing: border-box; }
.b-grid input.b-mirror { background: transparent; border-style: dashed; color: var(--muted); }
.b-chip { font-size: 11px; padding: 2px 8px; background: var(--surface-soft); border: 1px solid var(--line); color: var(--muted); white-space: nowrap; justify-self: start; }
.b-chip.b-changed { background: var(--accent-soft); color: var(--warning); border-color: transparent; }
.b-chip.b-accent { background: rgba(15, 76, 69, .08); color: var(--brand); border-color: transparent; }
.b-totals { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.b-totals div { background: var(--surface-soft); padding: 8px 10px; }
.b-totals span { display: block; font-size: 11px; color: var(--muted); }
.b-totals strong { font-size: 16px; }
.b-line { border: 1px solid var(--line); padding: 12px; margin-bottom: 10px; background: var(--surface); }
.b-line .span-all, .b-subgrid.span-all { grid-column: 1 / -1; }
.b-subgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.b-check { display: flex; gap: 8px; align-items: center; font-size: 13px; }
.b-remove { margin-top: 6px; }
.b-line-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.b-ok { color: var(--success); }
.b-bad { color: var(--danger); }
.b-violation { border: 1px solid var(--line); padding: 12px; margin-bottom: 12px; }
.b-violation-head { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.b-warning { color: var(--warning); background: var(--accent-soft); padding: 8px 12px; }
.b-commercial-options:not(:empty) { margin-top: 10px; }
@media (max-width: 720px) {
  .b-grid, .b-res .b-grid { grid-template-columns: 60px repeat(3, minmax(0, 1fr)); }
  .b-res .b-grid .b-th:nth-of-type(n+5), .b-grid > span:empty { display: none; }
  .b-totals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .b-subgrid { grid-template-columns: 1fr; }
}

/* تعرفه‌ی خدمت کنار دکمه‌ی محاسبه، تا پیش از کلیک معلوم باشد. */
.ef-actions:has(> .ef-price) { align-items: center; gap: 14px; flex-wrap: wrap; }
.ef-price { color: var(--muted); font-size: 13px; }
.ef-price strong { color: var(--brand); }
