@font-face {
  font-family: "Vazirmatn";
  src: url("/assets/vazirmatn.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

html, body, input, select, textarea, button {
  font-family: "Vazirmatn", Tahoma, Arial, sans-serif !important;
  letter-spacing: 0;
}

/* ==================================================================
   Design system v2 (v9.20) - flat, minimal, consistent
   ================================================================== */
:root {
  --mt-brand: #0b6a93; --mt-brand-d: #085877; --mt-brand-soft: #e6f3f9;
  --mt-ink: #1b2a3a; --mt-mute: #64748b; --mt-line: #dbe3ec; --mt-soft: #f4f7fa;
  --mt-ok: #0a7a52; --mt-ok-bg: #e7f5ee; --mt-ok-line: #bfe3d0;
  --mt-warn: #8a5a00; --mt-warn-bg: #fff4dc; --mt-warn-line: #f2d99b;
  --mt-danger: #b42318; --mt-danger-bg: #fdecea; --mt-danger-line: #f3c2bd;
  --mt-radius: 8px;
}

/* ---- buttons: one look everywhere (special widgets keep their own) ---- */
button:where(:not(.menu-btn):not(.menu-button):not(.mt-menu-button):not(.menu-close):not(.mt-menu-close):not(.sidebar-close):not(.menu-action):not(.mtn-fab):not(.modal-close):not(.fullscreen):not(.score-button):not(.preset-btn):not(.toggle-pass):not(.x):not(.jfp-close):not(.add-row):not(.tab):not(.mt-ab-btn):not(.mt-plain):not([id^="jfp"]):not([id^="cal"]):not([id^="mtn"]):not(.jfp-days *):not(.cal-days *)),
.btn, a.nav, a.navbtn, a.manage-btn, a.primary, a.secondary, a.back, .small-action, input[type="submit"] {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 6px;
  min-height: 36px; padding: 0 16px !important; margin: 0;
  background: var(--mt-brand) !important; background-image: none !important; color: #fff !important;
  border: 1px solid var(--mt-brand) !important; border-radius: var(--mt-radius) !important;
  font-size: 13px !important; font-weight: 600 !important; line-height: 1.3; letter-spacing: 0;
  box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  text-decoration: none !important; cursor: pointer; width: auto;
  /* v13.5.2: a long label wraps inside its button instead of running out of a narrow form or grid (was nowrap) */
  white-space: normal; overflow-wrap: break-word; max-width: 100%; text-align: center;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease !important;
}
button:where(:not(.menu-btn):not(.menu-button):not(.mt-menu-button):not(.menu-close):not(.mt-menu-close):not(.sidebar-close):not(.menu-action):not(.mtn-fab):not(.modal-close):not(.fullscreen):not(.score-button):not(.preset-btn):not(.toggle-pass):not(.x):not(.jfp-close):not(.add-row):not(.tab):not(.mt-ab-btn):not(.mt-plain):not([id^="jfp"]):not([id^="cal"]):not([id^="mtn"]):not(.jfp-days *):not(.cal-days *)):hover,
.btn:hover, a.nav:hover, a.navbtn:hover, a.manage-btn:hover, a.primary:hover, a.secondary:hover, a.back:hover, .small-action:hover, input[type="submit"]:hover {
  background: var(--mt-brand-d) !important; border-color: var(--mt-brand-d) !important; transform: none; filter: none; box-shadow: none !important;
}
button:active, .btn:active, .small-action:active, input[type="submit"]:active { transform: none; }
button[disabled], .btn[disabled] { opacity: .5; cursor: not-allowed; }

/* compact inside tables / toolbars */
td button, td .btn, td a.btn, td .small-action, .acts button, .acts .btn, .inv-actions .small-action, .uacts button {
  min-height: 30px; padding: 0 11px !important; font-size: 12px !important;
}

/* neutral (outline) */
button.gray, button.secondary, button.reopen, button.no, button.ghost, .btn.gray, a.nav.secondary, a.secondary, .nav.secondary,
button.okbtn.neutral {
  background: #fff !important; color: #334155 !important; border-color: var(--mt-line) !important;
}
button.gray:hover, button.secondary:hover, button.reopen:hover, button.no:hover, button.ghost:hover, .btn.gray:hover, a.nav.secondary:hover, a.secondary:hover, .nav.secondary:hover {
  background: var(--mt-soft) !important; border-color: #c4d0dd !important; color: #1b2a3a !important;
}
/* success / approve */
button.ok, button.okbtn, button.approve, .btn.ok { background: var(--mt-ok-bg) !important; color: var(--mt-ok) !important; border-color: var(--mt-ok-line) !important; }
button.ok:hover, button.okbtn:hover, button.approve:hover, .btn.ok:hover { background: #d6eee1 !important; border-color: #a6d6bf !important; }
/* caution */
button.warn, .btn.warn { background: var(--mt-warn-bg) !important; color: var(--mt-warn) !important; border-color: var(--mt-warn-line) !important; }
button.warn:hover, .btn.warn:hover { background: #ffeac2 !important; border-color: #ecc979 !important; }
/* destructive */
button.danger, button.reject, button.bad, .btn.danger { background: var(--mt-danger-bg) !important; color: var(--mt-danger) !important; border-color: var(--mt-danger-line) !important; }
button.danger:hover, button.reject:hover, button.bad:hover, .btn.danger:hover { background: #fbdcd8 !important; border-color: #eba9a2 !important; }

button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid rgba(11,106,147,.45) !important; outline-offset: 2px;
}

/* ---- form controls: same border, radius and focus ring ---- */
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not(.jalali-filter-input):not([type="submit"]),
select, textarea {
  border: 1px solid var(--mt-line) !important; border-radius: var(--mt-radius) !important; background-color: #fff; color: var(--mt-ink);
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="submit"]):focus, select:focus, textarea:focus {
  border-color: var(--mt-brand) !important; box-shadow: 0 0 0 3px rgba(11,106,147,.14); outline: none !important;
}
.jalali-filter-input { border: 1px solid var(--mt-line) !important; border-radius: var(--mt-radius) !important; }
label { color: #475569; }

/* ---- cards and tables ---- */
/* card surface: see "Design system v3" below */
.card table th, .panel table th, .tablebox table th {
  background: rgba(10,41,65,.055); color: var(--mt-ink-2, #3a4f63); font-size: 12px; font-weight: 700;
  border-bottom: 1px solid #e3e9f0 !important; padding: 11px 10px;
}
.card table td, .panel table td, .tablebox table td { border-bottom: 1px solid #eef2f6 !important; }
.card table tbody tr:hover td, .panel table tbody tr:hover td { background-color: #fafcfe; }

/* ---- tabs, badges, chips ---- */
.tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding: 4px; background: var(--mt-soft); border-radius: 10px; width: fit-content; max-width: 100%; }
.tabs a { padding: 7px 14px; border-radius: 8px; color: #475569; text-decoration: none; font-size: 12.5px; font-weight: 600; background: transparent; }
.tabs a.on { background: #fff; color: var(--mt-brand); box-shadow: 0 1px 2px rgba(16,24,40,.1); }

/* Access lists scroll in one isolated surface; opaque headers never mix with row controls. */
.access-account-table { overflow-x: auto; overflow-y: visible; position: relative; isolation: isolate; }
.access-account-table.fits { overflow: visible; }
.access-account-table table { border-collapse: separate; border-spacing: 0; width: 100%; }
.access-account-table .scroll { overflow: visible !important; max-height: none !important; }
.access-account-table thead th { position: sticky; top: var(--mt-sticky-top, 0px); z-index: 3; background: #f1f5f8 !important; background-clip: padding-box; box-shadow: 0 1px 0 var(--mt-line, #dce6ef); }
.access-account-table tbody td { position: relative; z-index: 0; }
.pf-tabs a:focus-visible { outline: 3px solid var(--mt-brand, #007f88); outline-offset: 2px; }
.badge, .ubadge, .status { letter-spacing: 0; }
.status-card.bad { background: var(--mt-danger-bg) !important; border-color: var(--mt-danger-line) !important; color: #7a1a12 !important; }
.status-card.ok { background: #fff !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ------------------------------------------------------------------
   v9.18 visual polish - additive only (no structure / layout changes)
   ------------------------------------------------------------------ */
:root { accent-color: #0878a8; }
::placeholder { color: #93a1b3; opacity: 1; }
::selection { background: #cfe9f5; }

/* checkboxes / radios must never inherit "input { width:100% }" from page styles */
input[type="checkbox"]:not([class]),
input[type="radio"]:not([class]) {
  width: auto !important; min-width: 0 !important; height: auto !important;
  padding: 0 !important; flex: 0 0 auto;
}
label.perm { display: flex !important; align-items: center; gap: 10px; cursor: pointer; line-height: 1.7; }
label.perm input[type="checkbox"] { width: 18px !important; height: 18px !important; margin: 0; }

.inv-actions .small-action, td form button { white-space: nowrap; }
.table-wrap, .panel, .card { scrollbar-width: thin; scrollbar-color: #b9c8d6 transparent; }

/* small screens: wide tables scroll inside their card instead of pushing the whole page sideways */
@media (max-width: 820px) {
  .panel, .card, .table-wrap, section.live-overview {
    overflow-x: auto !important; -webkit-overflow-scrolling: touch; max-width: 100%;
  }
  .table-wrap table { min-width: 520px; }
  select, textarea,
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]) { min-height: 42px; }
}
@media print { .mt-backbar { display: none !important; } }

/* form controls sized inside their cell (prevents inputs poking out of cards) */
form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]),
form select, form textarea { box-sizing: border-box; max-width: 100%; }

/* phone: the seller's invoice tables become one card per row, actions always visible */
@media (max-width: 640px) {
  .table-wrap table.inv-table { min-width: 0; }
  table.inv-table, .inv-table thead, .inv-table tbody, .inv-table tr, .inv-table td { display: block; width: 100%; box-sizing: border-box; }
  .inv-table thead { display: none; }
  .inv-table tr { border: 1px solid #e3ebf3; border-radius: 14px; margin: 0 0 10px; padding: 6px 4px; background: #fff; overflow: hidden; }
  .inv-table td { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 7px 10px !important; border: 0 !important; text-align: right; }
  .inv-table td[data-l]::before { content: attr(data-l); font-weight: 900; color: #64748b; font-size: 11px; flex: 0 0 auto; }
  .inv-table td[data-l="عملیات"] { display: block; padding-top: 10px !important; border-top: 1px dashed #d8e3ee !important; }
  .inv-table td[data-l="عملیات"]::before { display: block; margin-bottom: 6px; }
  .inv-table td[colspan] { display: block; text-align: center; }
}

/* ---- action groups: buttons sit in one tidy, wrapping row ---- */
.acts, .uacts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.acts form, .uacts form { margin: 0; display: inline-flex; }
td .acts, td .uacts { justify-content: center; }

/* ==================================================================
   Design system v3 (v12.0) - one glass shell for every panel
   ------------------------------------------------------------------
   * Tokens first; components read only tokens.
   * Glass (translucency + blur) is used where it helps orientation:
     the header, the menu, dialogs and popovers.  Content cards are
     translucent WITHOUT blur, so long pages stay light and text stays
     crisp.  Readability of text, tables and forms wins over effects.
   * Browsers without backdrop-filter, and users who ask for reduced
     transparency, get solid surfaces of the same colours.
   ================================================================== */
:root {
  --mt-navy: #0a2941; --mt-navy-2: #102b48; --mt-petrol: #0a7491;
  --mt-brand: #0b6a93; --mt-brand-d: #085877; --mt-brand-soft: #e6f3f9;
  --mt-ink: #14273a; --mt-ink-2: #3a4f63; --mt-mute: #56677a;
  --mt-line: #d3dde8; --mt-line-soft: #e4ebf2;
  --mt-bg: #eaf0f6;
  --mt-glass: rgba(255,255,255,.78); --mt-glass-strong: rgba(255,255,255,.9); --mt-glass-line: rgba(255,255,255,.75);
  --mt-glass-dark: linear-gradient(120deg, rgba(10,41,65,.93), rgba(7,94,120,.9));
  --mt-blur: 14px;
  --mt-shadow-sm: 0 1px 2px rgba(10,41,65,.06);
  --mt-shadow: 0 1px 2px rgba(10,41,65,.05), 0 6px 18px rgba(10,41,65,.07);
  --mt-shadow-lg: 0 18px 48px rgba(10,41,65,.22);
  --mt-r-sm: 8px; --mt-r: 10px; --mt-r-lg: 14px;
  --mt-s1: 4px; --mt-s2: 8px; --mt-s3: 12px; --mt-s4: 16px; --mt-s5: 24px;
  --mt-ctl: 40px;
  --mt-fs-xs: 11.5px; --mt-fs-sm: 12.5px; --mt-fs: 14px; --mt-fs-lg: 16px; --mt-fs-h: 18px;
  --mt-focus: 0 0 0 3px rgba(11,106,147,.28);
  --mt-radius: var(--mt-r);
}

/* ---- page canvas ---- */
/* pages with their own full-page picture (the portal login, body.home-entry) keep it */
html body.mt-ds:not(.mt-tv):not(.home-entry) {
  background:
    radial-gradient(1100px 520px at 100% -8%, rgba(10,116,145,.15), transparent 62%),
    radial-gradient(900px 520px at -6% 6%, rgba(16,43,72,.11), transparent 60%),
    linear-gradient(180deg, #eef3f8, #e7edf4);
  background-repeat: no-repeat; min-height: 100vh;
  color: var(--mt-ink);
  font-size: var(--mt-fs);
}
body.mt-ds:not(.mt-tv):not(.home-entry) h1 { font-size: 20px; } body.mt-ds:not(.mt-tv):not(.home-entry) h2 { font-size: var(--mt-fs-h); color: var(--mt-ink); }
body.mt-ds:not(.mt-tv):not(.home-entry) h3 { font-size: 15px; color: var(--mt-ink); }

/* ---- content surfaces: translucent, no blur (cheap and crisp) ---- */
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(.card, .panel, section.card, .password-card, .filter-panel, .mt-card) {
  background: var(--mt-glass);
  border: 1px solid var(--mt-glass-line);
  box-shadow: var(--mt-shadow), inset 0 1px 0 rgba(255,255,255,.85);
  border-radius: var(--mt-r-lg);
}
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(.kpi, .stat, .live-mini, .mini) {
  background: rgba(255,255,255,.62); border: 1px solid var(--mt-line-soft); border-radius: var(--mt-r); box-shadow: none;
}
html body.mt-ds:not(.mt-tv):not(.home-entry) .kpi small, html body.mt-ds:not(.mt-tv):not(.home-entry) .stat small { color: var(--mt-mute); }

/* ---- tables: plain and readable on the glass ---- */
html body.mt-ds:not(.mt-tv):not(.home-entry) table th { background: rgba(10,41,65,.055); color: var(--mt-ink-2); font-size: var(--mt-fs-sm); font-weight: 700; }
html body.mt-ds:not(.mt-tv):not(.home-entry) table td { color: var(--mt-ink); }
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(.card, .panel) table tbody tr:hover td { background-color: rgba(11,106,147,.045); }

/* ---- form controls: solid white so text always reads ---- */
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="submit"]), select, textarea) {
  background-color: #fff; color: var(--mt-ink); font-family: inherit; font-size: var(--mt-fs);
}
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="submit"]), select) { min-height: var(--mt-ctl); }
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(input, select, textarea):focus { box-shadow: var(--mt-focus); }
html body.mt-ds:not(.mt-tv):not(.home-entry) label { color: var(--mt-ink-2); font-weight: 600; font-size: var(--mt-fs-sm); }

/* ---- status: always a word, never colour alone ---- */
.mt-status { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; font-size: var(--mt-fs-xs); font-weight: 700; white-space: nowrap; border: 1px solid transparent; }
.mt-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: 0 0 auto; }
.mt-status.s-wait { color: #7a4d00; background: #fff4dc; border-color: #f2d99b; }
.mt-status.s-work { color: #0b5a7d; background: #e6f3f9; border-color: #bfdfee; }
.mt-status.s-ok { color: #0a6a47; background: #e7f5ee; border-color: #bfe3d0; }
.mt-status.s-bad { color: #9b1c12; background: #fdecea; border-color: #f3c2bd; }
.mt-status.s-mute { color: #485a6c; background: #eef2f6; border-color: #dbe3ec; }

/* ==================================================================
   The application header (one for every signed-in page)
   ================================================================== */
.mt-ic { flex: 0 0 auto; }
.mt-appbar {
  position: sticky; top: 0; z-index: 9000; color: #fff; display: block; margin: 0; padding: 0; border-radius: 0;
  background: var(--mt-glass-dark);
  -webkit-backdrop-filter: blur(var(--mt-blur)) saturate(150%); backdrop-filter: blur(var(--mt-blur)) saturate(150%);
  border-bottom: 1px solid rgba(255,255,255,.12); box-shadow: 0 4px 18px rgba(10,41,65,.16);
  font-family: "Vazirmatn", Tahoma, Arial, sans-serif;
}
.mt-appbar-in { max-width: 1480px; margin: 0 auto; min-height: 60px; padding: 8px 16px; display: flex; align-items: center; gap: 10px; direction: rtl; }
.mt-ab-btn, .mt-appbar summary.mt-ab-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 38px; min-width: 38px; padding: 0 12px; margin: 0;
  border-radius: var(--mt-r); border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: #eef6fb;
  font: 600 13px/1 "Vazirmatn", Tahoma, Arial, sans-serif; text-decoration: none; cursor: pointer; white-space: nowrap; list-style: none;
  transition: background-color .15s ease, border-color .15s ease;
}
.mt-appbar summary.mt-ab-btn::-webkit-details-marker { display: none; }
.mt-appbar .mt-ab-btn, .mt-drawer .mt-ab-btn { width: auto; max-width: none; flex: 0 0 auto; box-shadow: none; transform: none; }
.mt-appbar .mt-ab-icon, .mt-drawer .mt-ab-icon { width: 38px; }
.mt-appbar .mt-ab-brand { flex: 0 1 auto; }
.mt-ab-btn:hover { background: rgba(255,255,255,.17); border-color: rgba(255,255,255,.4); color: #fff; }
.mt-ab-btn:focus-visible { outline: 2px solid #9ed6ec; outline-offset: 2px; }
.mt-ab-btn[aria-current="page"] { background: rgba(255,255,255,.2); }
.mt-ab-icon { padding: 0; width: 38px; }
.mt-ab-return { background: #f6c453; border-color: #f6c453; color: #3a2a00; }
.mt-ab-return:hover { background: #ffd36e; border-color: #ffd36e; color: #3a2a00; }
.mt-ab-brand { display: flex; align-items: center; gap: 10px; min-width: 0; color: #fff; text-decoration: none; }
.mt-logo { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; flex: 0 0 auto;
  font: 700 19px/1 Georgia, "Times New Roman", serif; color: #fff; background: linear-gradient(135deg, rgba(255,255,255,.28), rgba(255,255,255,.06)); border: 1px solid rgba(255,255,255,.35); }
.mt-ab-names { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.mt-ab-title { font-size: 15px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt-ab-names small { font-size: 11px; color: #bfe0ec; }
.mt-ab-status { flex: 1 1 auto; display: flex; align-items: center; gap: 8px; justify-content: flex-end; min-width: 0; flex-wrap: wrap; }
.mt-ab-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
/* v13.1.8: the badge is positioned on its own bell button (the element the appbar renders), never on the page corner */
.mt-ab-bell, .mt-ab-btn[data-mt-bell] { position: relative; overflow: visible; }
.mt-ab-badge { position: absolute; top: -5px; left: -5px; z-index: 1; box-sizing: border-box; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; border: 2px solid #fff; background: #d92d20; color: #fff; font: 800 10.5px/15px Tahoma, Arial, sans-serif; text-align: center; white-space: nowrap; direction: ltr; pointer-events: none; }
.mt-ab-badge[hidden], .mt-ab-btn[hidden] { display: none; }
.mt-pill { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 999px; font: 700 12px/1 "Vazirmatn", Tahoma, sans-serif; color: #eef6fb;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); white-space: nowrap; }
.mt-pill.live { background: #0e7f55; border-color: rgba(255,255,255,.2); }
.mt-pill.live.disconnected { background: #b42318; } .mt-pill.live.connecting { background: rgba(255,255,255,.14); }

/* account popover */
.mt-ab-account { position: relative; }
.mt-ab-pop { position: absolute; top: 46px; left: 0; min-width: 230px; z-index: 9100; padding: 8px; border-radius: var(--mt-r-lg);
  background: var(--mt-glass-strong); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%);
  border: 1px solid var(--mt-glass-line); box-shadow: var(--mt-shadow-lg); color: var(--mt-ink); }
.mt-ab-pop-head { padding: 8px 10px 10px; border-bottom: 1px solid var(--mt-line-soft); margin-bottom: 6px; display: flex; flex-direction: column; gap: 2px; }
.mt-ab-pop-head small { color: var(--mt-mute); font-size: var(--mt-fs-xs); }
.mt-ab-pop a { display: flex; align-items: center; min-height: 38px; padding: 0 10px; border-radius: var(--mt-r-sm); color: var(--mt-ink); text-decoration: none; font-weight: 600; font-size: 13px; }
.mt-ab-pop a:hover, .mt-ab-pop a:focus-visible { background: rgba(11,106,147,.08); outline: none; }
.mt-ab-pop a[href$="logout"] { color: #b42318; }

/* ---- the menu drawer: one scroll area, groups never scroll on their own ---- */
.mt-drawer { position: fixed; inset: 0; z-index: 30000; }
.mt-drawer[hidden] { display: none; }
html.mt-drawer-open, html.mt-drawer-open body { overflow: hidden; }
.mt-dr-shade { position: absolute; inset: 0; background: rgba(6,24,39,.42); }
.mt-drawer .mt-dr-panel { display: block; margin: 0; }
.mt-dr-panel { position: absolute; top: 0; bottom: 0; right: 0; width: min(330px, 88vw); overflow-y: auto; overscroll-behavior: contain;
  padding: 12px 12px 28px; color: var(--mt-ink); direction: rtl;
  background: var(--mt-glass-strong); -webkit-backdrop-filter: blur(20px) saturate(160%); backdrop-filter: blur(20px) saturate(160%);
  border-left: 1px solid var(--mt-glass-line); box-shadow: var(--mt-shadow-lg); animation: mt-drawer-in .22s cubic-bezier(.2,.8,.2,1); }
@keyframes mt-slide { from { transform: translateX(24px); opacity: .6; } to { transform: none; opacity: 1; } }
.mt-dr-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 6px 8px; border-bottom: 1px solid var(--mt-line-soft); }
.mt-dr-head b { font-size: 15px; }
.mt-dr-head .mt-ab-btn { color: var(--mt-ink-2); background: rgba(10,41,65,.05); border-color: var(--mt-line-soft); }
.mt-dr-group { display: block; margin: 0; padding: 0; border: 0; background: none; }
.mt-drawer .mt-dr-group h3 { margin: 14px 10px 4px; font-size: var(--mt-fs-xs); font-weight: 700; color: var(--mt-mute); }
/* collapsible groups (v12.1) */
.mt-drawer details.mt-dr-group { border-bottom: 1px solid var(--mt-line-soft); padding: 2px 0 6px; }
.mt-drawer details.mt-dr-group > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 40px; padding: 4px 10px; margin: 4px 0 2px;
  border-radius: var(--mt-r); cursor: pointer; font-size: 13px; font-weight: 800; color: var(--mt-ink-2); user-select: none; }
.mt-drawer details.mt-dr-group > summary::-webkit-details-marker { display: none; }
.mt-drawer details.mt-dr-group > summary:hover { background: rgba(11,106,147,.06); }
.mt-drawer details.mt-dr-group > summary:focus-visible { outline: 2px solid var(--mt-brand); outline-offset: -2px; }
.mt-drawer details.mt-dr-group > summary .mt-chev { transition: transform .15s ease; color: var(--mt-mute); }
.mt-drawer details.mt-dr-group[open] > summary .mt-chev { transform: rotate(180deg); }
.mt-drawer details.mt-dr-group.is-current > summary { color: var(--mt-brand-d); }
.mt-drawer .mt-dr-items { padding: 0 0 2px; }
.mt-drawer .mt-dr-group a { display: flex; align-items: center; min-height: 38px; padding: 6px 12px; margin: 1px 0; border-radius: var(--mt-r);
  color: var(--mt-ink); text-decoration: none; font-weight: 600; font-size: 13.5px; }
.mt-dr-group a:hover { background: rgba(11,106,147,.08); }
.mt-dr-group a:focus-visible { outline: 2px solid var(--mt-brand); outline-offset: -2px; }
.mt-dr-group a[aria-current="page"] { background: var(--mt-brand); color: #fff; }
.mt-dr-group a[aria-current="page"]::after { content: "صفحه فعلی"; margin-inline-start: auto; font-size: 10.5px; font-weight: 600; opacity: .85; }
.mt-dr-group a.mt-dr-return { background: #fff4dc; color: #6b4600; border: 1px solid #f2d99b; }

/* ---- the notification button lives in the header; its panel opens under it ---- */
body.mt-shell #mtnFab { display: none !important; }
body.mt-shell #mtnPanel { top: 68px !important; bottom: auto !important; left: 12px !important; }

/* ---- page body under the header ---- */
body.mt-shell main.mt-shell-main { margin-top: var(--mt-s5); }

/* ---- phones: icons with accessible names, status on its own row ---- */
.mt-vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 760px) {
  .mt-appbar-in { padding: 6px 10px; gap: 6px; flex-wrap: wrap; min-height: 54px; }
  .mt-ab-actions .mt-ab-btn > span:not(.mt-ab-badge), .mt-ab-menu > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .mt-ab-actions .mt-ab-btn, .mt-ab-menu { width: 38px; padding: 0; }
  .mt-appbar .mt-ab-brand { flex: 1 1 0; min-width: 0; } .mt-ab-brand > * { min-width: 0; } .mt-logo { width: 32px; height: 32px; font-size: 17px; flex: 0 0 auto; }
  /* v13.5.2: the brand never gets narrower than its logo (it collapsed to 0 and the logo slid under the back button on a narrow
     header, e.g. a phone at 150 % zoom); when menu + logo + the four actions do not fit one row, the actions wrap to a second
     row, kept at the end of the bar as on one row. Only the page title may shrink away. */
  /* logo (34) + gap (10) + a readable bit of the title (56, with …); not min-content, which is the whole unwrappable title */
  .mt-appbar .mt-ab-brand { min-width: 100px; } .mt-appbar .mt-ab-names { min-width: 56px; }
  .mt-appbar .mt-ab-actions { margin-inline-start: auto; }
  .mt-ab-status { order: 10; flex-basis: 100%; justify-content: flex-start; }
  .mt-ab-status:empty { display: none; }
  body.mt-shell #mtnPanel { top: 60px !important; left: 6px !important; right: 6px !important; }
  /* v13.1.4 mobile header: one row, title shrinks; account menu inside the screen */
  .mt-appbar .mt-ab-pop { position: fixed; top: 58px; left: 8px; right: 8px; min-width: 0; max-height: calc(100dvh - 70px); overflow-y: auto; }
}

/* ---- browsers without backdrop-filter, or users asking for less transparency: solid surfaces ---- */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .mt-appbar { background: linear-gradient(120deg, #0a2941, #075e78); }
  .mt-dr-panel, .mt-ab-pop { background: #fff; }
}
@media (prefers-reduced-transparency: reduce) {
  .mt-appbar { background: linear-gradient(120deg, #0a2941, #075e78); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .mt-dr-panel, .mt-ab-pop { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  html body.mt-ds:not(.mt-tv):not(.home-entry) :is(.card, .panel, section.card, .password-card, .filter-panel, .mt-card) { background: #fff; }
}
@media (prefers-reduced-motion: reduce) { .mt-dr-panel, .mt-dr-shade, .mt-drawer.mt-closing .mt-dr-panel, .mt-drawer.mt-closing .mt-dr-shade { animation: none; } }
@media print { .mt-appbar, .mt-drawer { display: none !important; } html body.mt-ds { background: #fff !important; } }

/* ==================================================================
   Notifications (v12.1): one component for manager, seller and agent
   panels. Scoped to #mtNotif so page-level rules (e.g. the seller
   panel's full-width buttons) can never reshape it.
   ================================================================== */
#mtNotif .mtn-panel { background: var(--mt-glass-strong); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%);
  border: 1px solid var(--mt-glass-line); border-radius: var(--mt-r-lg); box-shadow: var(--mt-shadow-lg); color: var(--mt-ink);
  font-family: "Vazirmatn", Tahoma, Arial, sans-serif; width: min(380px, calc(100vw - 24px)); }
#mtNotif .mtn-head { background: var(--mt-glass-dark); padding: 10px 12px; gap: 10px; min-height: 52px; }
#mtNotif .mtn-head b { font-size: 14px; font-weight: 800; }
#mtNotif .mtn-head > span { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
#mtNotif button { width: auto; min-width: 0; max-width: none; flex: 0 0 auto; margin: 0; box-shadow: none; display: inline-flex; align-items: center; justify-content: center;
  font: 700 12px/1 "Vazirmatn", Tahoma, Arial, sans-serif; cursor: pointer; white-space: nowrap; }
#mtNotif .mtn-head button { height: 30px; padding: 0 10px; border-radius: var(--mt-r-sm); background: rgba(255,255,255,.14); color: #fff; border: 1px solid rgba(255,255,255,.22); }
#mtNotif .mtn-head button:hover { background: rgba(255,255,255,.24); }
#mtNotif #mtnClose { width: 30px; padding: 0; font-size: 16px; }
#mtNotif .mtn-list { background: transparent; }
#mtNotif .mtn-item { padding: 11px 14px; border-bottom: 1px solid var(--mt-line-soft); color: var(--mt-ink); }
#mtNotif .mtn-item.unread { background: rgba(11,106,147,.07); border-right: 4px solid var(--mt-brand); }
#mtNotif .mtn-item small { color: var(--mt-mute); }
#mtNotif .mtn-empty { padding: 28px 16px; color: var(--mt-mute); font-size: 13px; }
#mtNotif .mtn-foot { padding: 10px 12px; border-top: 1px solid var(--mt-line-soft); display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: 12px; color: var(--mt-ink-2); }
#mtNotif .mtn-foot:empty { display: none; }
#mtNotif .mtn-foot button { height: 34px; padding: 0 16px; border-radius: var(--mt-r-sm); }
@media (prefers-reduced-transparency: reduce) { #mtNotif .mtn-panel { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; } }
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) { #mtNotif .mtn-panel { background: #fff; } }

/* v13.1 form clarity (ui-ux-pro-max: visible labels, units inside fields, help on demand, grouped fields) */
.lbl{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.hint{font-weight:400;font-size:12px;color:var(--mt-ink-2,#5b6b7d);line-height:1.6}
.in-unit{position:relative;display:block}
.in-unit>input{padding-left:58px!important}
.in-unit>i{position:absolute;left:10px;top:50%;transform:translateY(-50%);font-style:normal;font-size:12px;color:var(--mt-ink-2,#5b6b7d);pointer-events:none}
details.help{margin:8px 0 12px;border:1px solid var(--mt-line-soft,#e4ebf2);border-radius:var(--mt-r,10px);background:#f8fbfd}
details.help>summary{cursor:pointer;padding:8px 12px;font-weight:700;font-size:13px;color:#174a63;list-style-position:inside;min-height:24px}
details.help>div{padding:0 12px 10px;font-size:12.5px;line-height:2;color:#334155}
fieldset.group{border:1px solid var(--mt-line-soft,#e4ebf2);border-radius:var(--mt-r,10px);padding:10px 12px 12px;margin:0 0 12px;min-width:0}
fieldset.group>legend{font-weight:800;font-size:13px;padding:0 6px;color:#1f3347}
.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;align-items:stretch}
.kpi-row .kpi{display:flex;flex-direction:column;justify-content:flex-start;min-height:84px}
@media(max-width:640px){.kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v13.1.3 seller home: finance summary and grade (scoped to .fin-home only) */
.fin-home .fin-home-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.fin-home .fin-home-head h2{margin:0}
.fin-home .fin-home-head small{color:var(--mt-ink-2,#5b6b7d);font-size:12px}
.fin-home .fin-home-kpis,.fin-home .fin-home-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.fin-home .fin-home-kpis>div,.fin-home .fin-home-grade>div{background:#fff;border:1px solid var(--mt-line-soft,#e4ebf2);border-radius:var(--mt-r,10px);padding:12px 14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.fin-home .fin-home-kpis span,.fin-home .fin-home-grade span{font-size:12px;color:var(--mt-ink-2,#5b6b7d)}
.fin-home .fin-home-amt{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;font-size:20px;color:var(--mt-brand,#0878a8);font-variant-numeric:tabular-nums}
.fin-home .fin-home-amt small{font-size:12px;font-weight:600;color:var(--mt-ink-2,#5b6b7d)}
.fin-home .fin-home-grade b{font-size:18px;color:var(--mt-brand,#0878a8)}
@media(max-width:640px){.fin-home .fin-home-kpis,.fin-home .fin-home-grade{grid-template-columns:repeat(2,minmax(0,1fr))}.fin-home .fin-home-amt{font-size:17px}}
.fin-home .fin-home-grade .fin-grade{align-self:flex-start}

/* v13.1.9 touch targets: buttons and button-links inside table cells are at least 36px high on phones */
@media (max-width:700px){td button,td a.btn,td .btn{min-height:36px;display:inline-flex;align-items:center;justify-content:center}}

/* ==================================================================
   v13.1.11 motion: ONE small shared set for every panel (seller, representative, checking, management). Only transform and
   opacity move; nothing runs forever except a real wait. Reduced motion: no movement, the wait is said in words.
   ================================================================== */
@keyframes mt-loading-spin { to { transform: rotate(360deg); } }
@keyframes mt-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes mt-fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes mt-drawer-in { from { transform: translateX(100%); } to { transform: none; } }
@keyframes mt-drawer-out { from { transform: none; } to { transform: translateX(100%); } }
@keyframes mt-skel-pulse { from { opacity: .55; } to { opacity: 1; } }
@keyframes mt-pop-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes mt-tick { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }
.mt-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* (a) action buttons waiting for the server: same ring, same size, the button keeps its box */
.mt-busy-btn { position: relative; }
.mt-busy-btn[aria-busy="true"] { pointer-events: none; cursor: progress; color: transparent !important; opacity: 1 !important; }
.mt-busy-btn[aria-busy="true"] > * { visibility: hidden; }
.mt-busy-btn[aria-busy="true"]::after { content: ""; position: absolute; inset: 0; margin: auto; width: 18px; height: 18px; box-sizing: border-box;
  border: 2px solid var(--mt-busy-ring, #fff); border-inline-start-color: transparent; border-radius: 50%; animation: mt-loading-spin .75s linear infinite; }

/* (b) tables waiting for their first data: a few quiet rows in the place of the table (never fake numbers) */
.mt-skel { display: grid; gap: 10px; padding: 4px 0; }
.mt-skel i { display: block; height: 40px; border-radius: 8px; background: #e9eff4; animation: mt-skel-pulse .9s ease-in-out infinite alternate; }
.mt-skel i:first-child { height: 22px; width: 38%; }
.mt-skel i:nth-child(odd):not(:first-child) { background: #eef3f7; }

/* (c) the menu drawer opens from the right; the shade fades; closing plays the same way back (see the shell script) */
.mt-dr-shade { animation: mt-fade-in .22s ease-out; }
.mt-drawer.mt-closing .mt-dr-panel { animation: mt-drawer-out .2s ease-in forwards; }
.mt-drawer.mt-closing .mt-dr-shade { animation: mt-fade-out .2s ease-in forwards; }

/* (d) invoice details and the other existing windows: fade with a very small growth, in and out */
dialog#modal, dialog.pf-dlg { opacity: 0; transform: scale(.98);
  transition: opacity .2s ease, transform .2s ease, overlay .2s ease allow-discrete, display .2s ease allow-discrete; }
dialog#modal[open], dialog.pf-dlg[open] { opacity: 1; transform: none; }
dialog#modal::backdrop, dialog.pf-dlg::backdrop { opacity: 0; transition: opacity .2s ease, overlay .2s ease allow-discrete, display .2s ease allow-discrete; }
dialog#modal[open]::backdrop, dialog.pf-dlg[open]::backdrop { opacity: 1; }
@starting-style {
  dialog#modal[open], dialog.pf-dlg[open] { opacity: 0; transform: scale(.98); }
  dialog#modal[open]::backdrop, dialog.pf-dlg[open]::backdrop { opacity: 0; }
}

/* (e) a confirmed success (only after the server answered): the existing message appears softly with a short green tick */
.mt-ok-msg { animation: mt-pop-in .2s ease-out; }
.mt-ok-msg::before { content: "✓"; display: inline-grid; place-items: center; width: 20px; height: 20px; margin-inline-end: 8px; border-radius: 50%;
  background: #0a7a52; color: #fff; font-size: 12px; font-weight: 800; vertical-align: middle; animation: mt-tick .25s ease-out .05s both; }
.mt-toast { position: fixed; inset-inline: 16px; bottom: max(16px, env(safe-area-inset-bottom)); margin: 0 auto; width: fit-content; max-width: calc(100% - 32px);
  z-index: 100030; padding: 10px 16px; border-radius: 12px; background: #e7f5ee; color: #0a5a36; border: 1px solid #bfe3d0;
  box-shadow: 0 10px 30px rgba(10,41,65,.16); font-weight: 700; font-size: 13px; line-height: 1.8; pointer-events: none; }
.mt-toast[hidden] { display: none; }

/* (f) target progress: the bar follows a real change of the count in about .4s; a plain refresh does not replay it */
.mt-progress { display: block; height: 6px; margin-top: 6px; border-radius: 999px; background: rgba(10,41,65,.1); overflow: hidden; }
.mt-progress > i { display: block; height: 100%; background: var(--mt-ok, #0a7a52); transform-origin: right center; transform: scaleX(var(--p, 0));
  transition: transform .4s cubic-bezier(.2,.8,.2,1); }

@media (prefers-reduced-motion: reduce) {
  .mt-busy-btn[aria-busy="true"]::after { content: attr(data-busy-text); animation: none; width: auto; height: auto; border: 0; border-radius: 0;
    display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: var(--mt-busy-ring, #fff); }
  .mt-skel i, .mt-ok-msg, .mt-ok-msg::before, .mt-progress > i { animation: none; transition: none; }
  dialog#modal, dialog.pf-dlg, dialog#modal::backdrop, dialog.pf-dlg::backdrop { transition: none; }
}

/* v13.3 target state, gift rows, status correction ------------------------------------------------------------- */
.tgt-state { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; line-height: 1.7;
  white-space: nowrap; border: 1px solid transparent; }
.tgt-achieved { background: #dcfce7; color: #166534; border-color: #86efac; }
.tgt-in_progress { background: #e0f2fe; color: #075985; border-color: #7dd3fc; }
.tgt-ended_pending { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.tgt-expired { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
.gift-tag { display: inline-block; padding: 0 8px; border-radius: 999px; background: #f3e8ff; color: #6b21a8; border: 1px solid #d8b4fe;
  font-size: 12px; font-weight: 700; margin-inline-start: 4px; }
.inv-line.is-gift { background: #faf5ff; }
.inv-line.is-gift .inv-disc { visibility: hidden; }
.sfix-effects { margin: 8px 0; padding: 10px 12px; border-radius: 10px; background: #fff7ed; border: 1px solid #fed7aa; font-size: 13.5px; }
.sfix-effects li { margin: 2px 0; }
@media (max-width: 640px) { .tgt-state { white-space: normal; } .inv-line.is-gift .inv-disc { display: none; } }

/* ==================================================================
   Design system v4 (13.4.0) — "signal line"
   ------------------------------------------------------------------
   * Mahoor navy and teal, matured; a flat light canvas; white surfaces with a hairline; colour only for meaning.
   * Radii by hierarchy: panel 16, tile 12, control 10, chip 999, tooltip 8.
   * Motion tokens: 120/180/260 ms for answers, one page entrance <= 600 ms. Only transform and opacity move.
   * Components are scoped (mt-panel, mt-kpis, mt-chart, mt-seg, mt-flash, ...). No new global rule on table/input/button.
   * Appended last on purpose: older pages keep working and only pick up the new tokens.
   ================================================================== */
:root {
  --mt-navy: #0F2B46; --mt-navy-6: #2A4A6B; --mt-navy-1: #E8EEF4;
  --mt-teal: #0E7C86; --mt-teal-d: #0A636B; --mt-teal-3: #43C6BE; --mt-teal-soft: #E3F3F3;
  --mt-brand: #0E7C86; --mt-brand-d: #0A636B; --mt-brand-soft: #E3F3F3; --mt-petrol: #0E7C86; --mt-navy-2: #16385A;
  --mt-bg: #F2F5F8; --mt-surface: #FFFFFF;
  --mt-ink: #13283D; --mt-ink-2: #3B5167; --mt-mute: #5B6E82;
  --mt-line: #DCE3EA; --mt-line-soft: #E8EDF2;
  --mt-ok: #127A55; --mt-ok-bg: #E6F4EE; --mt-ok-line: #BCE0CF;
  --mt-warn: #8F5A00; --mt-warn-bg: #FFF3D9; --mt-warn-line: #F0D69A;
  --mt-danger: #B3261E; --mt-danger-bg: #FCE9E7; --mt-danger-line: #F1C3BE;
  --mt-info: #1F5FA8; --mt-info-bg: #E7F0FB;
  --mt-c1: #1C4467; --mt-c2: #0E9A9A; --mt-c3: #B5523B; --mt-c0: #C9D5E1;
  --mt-r-panel: 16px; --mt-r-tile: 12px; --mt-r-ctl: 10px; --mt-r-tip: 8px;
  --mt-r-sm: 8px; --mt-r: 10px; --mt-r-lg: 16px; --mt-radius: 10px;
  --mt-e1: 0 1px 2px rgba(15,43,70,.06); --mt-e2: 0 8px 24px rgba(15,43,70,.12); --mt-e3: 0 24px 60px rgba(15,43,70,.28);
  --mt-shadow-sm: var(--mt-e1); --mt-shadow: var(--mt-e1); --mt-shadow-lg: var(--mt-e3);
  --mt-glass: #fff; --mt-glass-strong: #fff; --mt-glass-line: var(--mt-line); --mt-glass-dark: #0F2B46;
  --mt-focus: 0 0 0 3px rgba(14,124,134,.26);
  --mt-d1: 120ms; --mt-d2: 180ms; --mt-d3: 260ms; --mt-d-enter: 480ms;
  --mt-ease-out: cubic-bezier(.2,.8,.2,1); --mt-ease-in: cubic-bezier(.4,0,1,1);
  accent-color: #0E7C86;
}
::selection { background: #CDEDEA; }

/* ---- canvas: flat, light ---- */
html body.mt-ds:not(.mt-tv):not(.home-entry) { background: var(--mt-bg); }
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(.card, .panel, section.card, .password-card, .filter-panel, .mt-card) {
  background: #fff; border: 1px solid var(--mt-line); box-shadow: var(--mt-e1); border-radius: var(--mt-r-panel);
}
html body.mt-ds:not(.mt-tv):not(.home-entry) :is(.kpi, .stat, .live-mini, .mini) { background: #fff; border-color: var(--mt-line-soft); border-radius: var(--mt-r-tile); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--mt-teal) !important; outline-offset: 2px;
}

/* ---- the header: flat navy, one row on phones ---- */
.mt-appbar {
  background: var(--mt-navy); -webkit-backdrop-filter: none; backdrop-filter: none;
  border-bottom: 1px solid rgba(255,255,255,.08); box-shadow: 0 1px 0 rgba(15,43,70,.2), 0 6px 18px rgba(15,43,70,.10);
  transition: transform var(--mt-d3) var(--mt-ease-out);
}
.mt-appbar.mt-ab-hide { transform: translateY(calc(-100% - 2px)); }
.mt-appbar-in { min-height: 58px; }
.mt-appbar details.mt-ab-account { margin: 0; }
.mt-appbar, .mt-appbar *, .mt-drawer, .mt-drawer * { box-sizing: border-box; }   /* the same header height on every page */   /* page rules such as details{margin} never reach the header */
.mt-ab-btn, .mt-appbar summary.mt-ab-btn { height: 40px; min-width: 40px; border-radius: var(--mt-r-ctl); border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.06);
  transition: background-color var(--mt-d2) ease, border-color var(--mt-d2) ease, transform var(--mt-d1) ease; }
.mt-ab-btn:active { transform: scale(.96); }
.mt-ab-btn:hover { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.3); }
.mt-ab-btn:focus-visible { outline: 2px solid var(--mt-teal-3) !important; outline-offset: 2px; }
.mt-ab-btn[aria-current="page"] { background: rgba(67,198,190,.16); border-color: rgba(67,198,190,.45); }
.mt-logo { width: 38px; height: 38px; border-radius: var(--mt-r-ctl); background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); font: 700 19px/1 Georgia, serif; }
.mt-logo svg { width: 26px; height: 26px; display: block; }
.mt-ab-title { font-size: 16px; }
.mt-ab-names small { color: #A9C6D8; }
.mt-pill.live { background: #0F6E4E; }
.mt-ab-pop { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; border: 1px solid var(--mt-line); box-shadow: var(--mt-e2); border-radius: var(--mt-r-tile);
  transform-origin: top left; animation: mt-pop-in var(--mt-d2) var(--mt-ease-out); }
.mt-ab-pop a { min-height: 42px; border-radius: var(--mt-r-sm); }
.mt-ab-pop a:hover, .mt-ab-pop a:focus-visible { background: var(--mt-teal-soft); }
@media (max-width: 760px) {
  .mt-appbar-in { min-height: 54px; padding: 6px 8px; gap: 6px; }
  .mt-ab-btn, .mt-appbar summary.mt-ab-btn { height: 44px; min-width: 44px; }
  .mt-ab-actions .mt-ab-btn, .mt-ab-menu { width: 44px; }
  .mt-ab-actions { gap: 4px; }
  .mt-logo { width: 34px; height: 34px; } .mt-logo svg { width: 24px; height: 24px; }
  .mt-ab-names small { display: none; }
  .mt-appbar .mt-ab-brand { min-height: 44px; }
  .mt-ab-title { font-size: 15px; }
  /* the only status a page may still put in the header (a preview / return link) becomes one slim strip, not a second tall row */
  .mt-ab-status:not(:empty) { margin: 6px -8px -6px; padding: 0; flex-basis: calc(100% + 16px); }
  .mt-ab-status .mt-ab-return { width: 100%; height: 44px; border-radius: 0; justify-content: center; border-width: 1px 0 0; }
  .mt-appbar .mt-ab-pop { top: 60px; }
}

/* ---- the menu drawer: solid, with a local search ---- */
.mt-dr-panel { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; border-left: 1px solid var(--mt-line); box-shadow: var(--mt-e3); padding: 10px 10px 28px; width: min(340px, 90vw);
  animation: mt-drawer-in var(--mt-d3) var(--mt-ease-out); }
.mt-dr-shade { background: rgba(9,26,42,.46); }
.mt-dr-head { gap: 10px; padding: 6px 4px 10px; border-bottom: 0; }
.mt-dr-head .mt-dr-brand { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 15px; color: var(--mt-navy); }
.mt-dr-head .mt-dr-brand svg { width: 30px; height: 30px; }
.mt-dr-head .mt-ab-btn { color: var(--mt-ink-2); background: var(--mt-bg); border-color: var(--mt-line); }
.mt-dr-search { position: relative; display: block; margin: 2px 2px 8px; }
.mt-dr-search input { width: 100%; box-sizing: border-box; min-height: 44px; padding: 0 40px 0 12px !important; border-radius: var(--mt-r-ctl) !important; background: var(--mt-bg) !important; border: 1px solid var(--mt-line) !important; font-size: 14px; }
.mt-dr-search svg { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--mt-mute); pointer-events: none; }
.mt-dr-empty { margin: 10px 8px; color: var(--mt-mute); font-size: 13px; }
.mt-dr-empty[hidden] { display: none; }
.mt-drawer details.mt-dr-group { border-bottom: 1px solid var(--mt-line-soft); }
.mt-drawer details.mt-dr-group > summary { min-height: 44px; font-size: 13.5px; color: var(--mt-navy); }
.mt-drawer details.mt-dr-group > summary .mt-chev { transition: transform var(--mt-d2) var(--mt-ease-out); }
.mt-drawer details.mt-dr-group[open] > .mt-dr-items { animation: mt-pop-in var(--mt-d2) var(--mt-ease-out); }
.mt-drawer .mt-dr-group a { min-height: 42px; position: relative; color: var(--mt-ink); }
.mt-dr-group a:hover { background: var(--mt-teal-soft); }
.mt-dr-group a[aria-current="page"] { background: var(--mt-teal-soft); color: var(--mt-teal-d); font-weight: 800; box-shadow: inset -3px 0 0 var(--mt-teal); }
.mt-dr-group a[aria-current="page"]::after { content: "صفحه فعلی"; font-weight: 600; color: var(--mt-teal-d); opacity: 1; }
.mt-drawer.mt-searching details.mt-dr-group > .mt-dr-items { animation: none; }
.mt-drawer .mt-dr-group a[hidden], .mt-drawer details.mt-dr-group[hidden] { display: none; }
@media (max-width: 760px) { .mt-drawer .mt-dr-group a { min-height: 46px; } }

/* ---- shared surfaces and type ---- */
.mt-panel { background: #fff; border: 1px solid var(--mt-line); border-radius: var(--mt-r-panel); box-shadow: var(--mt-e1); padding: 16px 18px; min-width: 0; }
.mt-panel > h2, .mt-h { margin: 0 0 12px; font-size: 16px; font-weight: 700; color: var(--mt-navy); line-height: 1.5; }
.mt-h small, .mt-panel > h2 small { font-size: 12px; font-weight: 500; color: var(--mt-mute); margin-inline-start: 6px; }
@media (max-width: 760px) { .mt-h small, .mt-panel > h2 small { display: block; margin: 2px 0 0; } }
.mt-num { font-variant-numeric: tabular-nums; }
.mt-ltr { direction: ltr; unicode-bidi: isolate; display: inline-block; }
.mt-unit { font-size: 12px; font-weight: 500; color: var(--mt-mute); margin-inline-start: 4px; }

/* ---- KPI band: one surface, cells separated by hairlines (not a card per number) ---- */
.mt-kpis { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); background: #fff; border: 1px solid var(--mt-line); border-radius: var(--mt-r-panel); box-shadow: var(--mt-e1); overflow: hidden; }
.mt-kpi { position: relative; padding: 14px 18px 14px; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.mt-kpi + .mt-kpi { border-inline-start: 1px solid var(--mt-line-soft); }
.mt-kpi > span { font-size: 13px; font-weight: 600; color: var(--mt-ink-2); }
.mt-kpi > b { font-size: 28px; line-height: 1.15; font-weight: 800; color: var(--mt-navy); font-variant-numeric: tabular-nums; white-space: nowrap; }
.mt-kpi > small { font-size: 12px; color: var(--mt-mute); }
.mt-kpi .mt-meter { margin-top: 4px; }
.mt-kpis-2 { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 10px 18px; border-top: 1px solid var(--mt-line-soft); background: #FAFCFD; font-size: 13px; color: var(--mt-ink-2); }
.mt-kpis-2 > span { display: inline-flex; align-items: baseline; gap: 6px; }
.mt-kpis-2 > span b { color: var(--mt-navy); font-weight: 800; font-variant-numeric: tabular-nums; }
@media (max-width: 760px) {
  .mt-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mt-kpi { padding: 11px 12px; }
  .mt-kpi + .mt-kpi { border-inline-start: 0; }
  .mt-kpi:nth-child(even) { border-inline-start: 1px solid var(--mt-line-soft); }
  .mt-kpi:nth-child(n+3) { border-top: 1px solid var(--mt-line-soft); }
  .mt-kpi > b { font-size: 22px; }
  .mt-kpi > span { font-size: 12.5px; }
  .mt-kpis-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px 12px; gap: 6px 12px; font-size: 12.5px; }
  .mt-kpis-2 > span { display: flex; justify-content: space-between; gap: 6px; }
}
@media (max-width: 340px) { .mt-kpis, .mt-kpis-2 { grid-template-columns: 1fr; } .mt-kpi:nth-child(even) { border-inline-start: 0; } .mt-kpi:nth-child(n+2) { border-top: 1px solid var(--mt-line-soft); } }

/* a small proportion meter (only drawn when the denominator is valid) */
.mt-meter { display: block; height: 6px; border-radius: 999px; background: var(--mt-navy-1); overflow: hidden; }
.mt-meter > i { display: block; height: 100%; background: var(--mt-teal); transform-origin: right center; transform: scaleX(var(--p, 0)); transition: transform var(--mt-d3) var(--mt-ease-out); border-radius: inherit; }

/* ---- segmented switch (period tabs and the like) ---- */
.mt-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 999px; background: var(--mt-navy-1); max-width: 100%; overflow-x: auto; }
.mt-seg button { all: unset; box-sizing: border-box; cursor: pointer; min-height: 36px; padding: 0 16px; border-radius: 999px; font: 600 13px/36px Vazirmatn, Tahoma, sans-serif; color: var(--mt-ink-2); white-space: nowrap;
  transition: background-color var(--mt-d2) ease, color var(--mt-d2) ease; }
.mt-seg button[aria-selected="true"] { background: #fff; color: var(--mt-teal-d); box-shadow: 0 1px 2px rgba(15,43,70,.12); font-weight: 800; }
.mt-seg button:focus-visible { outline: 2px solid var(--mt-teal) !important; outline-offset: 1px; }
@media (max-width: 760px) { .mt-seg button { min-height: 44px; line-height: 44px; } }

/* ---- charts (inline SVG drawn by window.mtChart) ---- */
.mt-chart { margin: 0; position: relative; min-width: 0; }
.mt-chart figcaption { font-size: 12.5px; color: var(--mt-mute); margin-top: 8px; line-height: 1.8; }
.mt-chart-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 8px; font-size: 12.5px; color: var(--mt-ink-2); }
.mt-chart-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-inline-end: 6px; vertical-align: -1px; }
.mt-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.mt-chart svg text { font-family: Vazirmatn, Tahoma, sans-serif; fill: var(--mt-ink-2); }
.mt-chart .mc-axis { stroke: var(--mt-line); stroke-width: 1; }
.mt-chart .mc-grid { stroke: var(--mt-line-soft); stroke-width: 1; }
.mt-chart .mc-d { cursor: pointer; outline: none; }
.mt-chart .mc-d:focus-visible .mc-hit { stroke: var(--mt-teal); stroke-width: 2; }
.mt-chart .mc-hit { fill: transparent; }
.mt-chart .mc-d.is-on .mc-hit, .mt-chart .mc-d:hover .mc-hit { fill: rgba(14,124,134,.07); }
.mt-chart .mc-bar { transform-box: fill-box; }
.mt-chart .mc-band { opacity: .55; }
.mt-tip { position: absolute; z-index: 5; pointer-events: none; min-width: 120px; max-width: 240px; padding: 8px 10px; border-radius: var(--mt-r-tip); background: var(--mt-navy); color: #fff; font-size: 12.5px; line-height: 1.8;
  box-shadow: var(--mt-e2); opacity: 0; transform: translateY(4px); transition: opacity var(--mt-d2) ease, transform var(--mt-d2) var(--mt-ease-out); }
.mt-tip.on { opacity: 1; transform: none; }
.mt-tip b { display: block; font-weight: 800; }
.mt-chart-state { padding: 14px; border-radius: var(--mt-r-tile); background: var(--mt-bg); color: var(--mt-ink-2); font-size: 13px; line-height: 1.9; }
.mt-chart-state.is-error { background: var(--mt-danger-bg); color: #7A1A12; }
.mt-chart-state.is-thin { background: var(--mt-warn-bg); color: #6B4600; }
.mt-chart-table summary { cursor: pointer; font-size: 12.5px; font-weight: 700; color: var(--mt-teal-d); min-height: 32px; display: inline-flex; align-items: center; }
/* draw-in: bars grow from their baseline, once, on first paint only */
.mt-enter .mt-chart .mc-bar { animation: mt-grow-y var(--mt-d-enter) var(--mt-ease-out) both; animation-delay: calc(var(--i, 0) * 30ms); }
.mt-enter .mt-chart .mc-hbar { animation: mt-grow-x var(--mt-d-enter) var(--mt-ease-out) both; animation-delay: calc(var(--i, 0) * 40ms); }
@keyframes mt-grow-y { from { transform: scaleY(0); } to { transform: none; } }
@keyframes mt-grow-x { from { transform: scaleX(0); } to { transform: none; } }

/* ---- one orchestrated entrance per page (first paint only, never on live refresh) ---- */
.mt-enter .mt-rise { animation: mt-rise var(--mt-d-enter) var(--mt-ease-out) both; animation-delay: calc(var(--i, 0) * 40ms); }
@keyframes mt-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ---- a changed live value: a short highlight, then nothing ---- */
.mt-flash { position: relative; }
.mt-flash::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: rgba(67,198,190,.28); pointer-events: none; animation: mt-flash 900ms ease-out forwards; }
@keyframes mt-flash { from { opacity: 1; } to { opacity: 0; } }

/* ---- loading skeleton with a real sweep, and a worded fallback ---- */
.mt-skel i { background: linear-gradient(90deg, #E9EFF4 0%, #F5F8FA 50%, #E9EFF4 100%); background-size: 200% 100%; }

@media (prefers-reduced-motion: reduce) {
  .mt-appbar, .mt-meter > i, .mt-tip, .mt-seg button, .mt-ab-pop, .mt-dr-panel, .mt-drawer details.mt-dr-group[open] > .mt-dr-items { transition: none; animation: none; }
  .mt-enter .mt-rise, .mt-enter .mt-chart .mc-bar, .mt-enter .mt-chart .mc-hbar, .mt-flash::after { animation: none; }
}
html.mt-still .mt-enter .mt-rise, html.mt-still .mt-enter .mt-chart .mc-bar, html.mt-still .mt-enter .mt-chart .mc-hbar, html.mt-still .mt-flash::after { animation: none; }
@media print { .mt-tip, .mt-seg { display: none !important; } .mt-kpis, .mt-panel { box-shadow: none; border-color: #999; } }

/* ==================================================================
   v13.4.0 phase 2a: shell everywhere
   ================================================================== */
/* «حرکت‌های رابط» off (html.mt-still, a per-browser choice): like reduced motion, but a real wait keeps its spinner */
html.mt-still *, html.mt-still *::before, html.mt-still *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
html.mt-still .mt-busy-btn[aria-busy="true"]::after { animation-duration: .75s !important; animation-iteration-count: infinite !important; }
.mt-ab-pop .mt-ab-still { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 0 10px; border-radius: var(--mt-r-sm); cursor: pointer; font: 600 13px/1.4 Vazirmatn, Tahoma, sans-serif; color: var(--mt-ink); margin-top: 4px; border-top: 1px solid var(--mt-line-soft); }
.mt-ab-pop .mt-ab-still:hover, .mt-ab-pop .mt-ab-still:focus-visible { background: var(--mt-teal-soft); }
.mt-ab-pop .mt-ab-still:focus-visible { outline: 2px solid var(--mt-teal) !important; outline-offset: -2px; }
.mt-ab-still span { flex: 1 1 auto; }
.mt-switch { position: relative; width: 36px; height: 20px; border-radius: 999px; background: #C9D5E1; flex: 0 0 auto; transition: background-color var(--mt-d2) ease; }
.mt-switch::after { content: ""; position: absolute; top: 2px; right: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform var(--mt-d2) var(--mt-ease-out); }
.mt-ab-still[aria-checked="true"] .mt-switch { background: var(--mt-teal); }
.mt-ab-still[aria-checked="true"] .mt-switch::after { transform: translateX(-16px); }
/* acting for someone else / previewing a representative: a clear badge with the existing return link */
.mt-ab-return { gap: 8px; font-weight: 800; }
.mt-ab-return::before { content: "ورود جانشین"; order: -1; padding: 2px 8px; border-radius: 999px; background: #3A2A00; color: #FFE6A3; font-size: 11px; font-weight: 800; line-height: 1.6; }
.mt-ab-return[href$="/return-manager"]::before { content: "پیش‌نمایش نماینده"; }
@media (max-width: 760px) { .mt-ab-status .mt-ab-return { gap: 10px; } }
/* the lock-up (login pages): tile mark + Persian name */
.mt-lockup { display: inline-flex; align-items: center; gap: 12px; direction: rtl; margin: 0 0 16px; color: var(--mt-navy); }
.mt-lockup .mt-lockup-mark svg { display: block; width: 48px; height: 48px; }
.mt-lockup b { font: 800 26px/1.2 Vazirmatn, Tahoma, sans-serif; letter-spacing: 0; }
.mt-lockup.on-dark { color: #fff; text-shadow: 0 2px 14px rgba(0,25,39,.6); }
.mt-lockup.on-dark .mt-lockup-mark svg { box-shadow: 0 6px 18px rgba(0,25,39,.35); border-radius: 11px; }
/* the Jalali date field (13.4.1): the calendar icon is drawn INSIDE the field itself (a background of the input, left = the end
   side in RTL, vertically centred), so it can never sit outside the frame, below it or beside a narrower input; the clear «×»
   keeps the start side. The wrapper only positions the clear button; the old floating ::after icon is retired. */
html body .jalali-filter-wrap::after { content: none !important; display: none !important; }
html body .jalali-filter-wrap { position: relative; }
html body .jalali-filter-input, html body input.jalali-date.date-input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E7C86' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: left 12px center !important; background-size: 18px 18px !important;
  padding-left: 40px !important; min-height: 40px; cursor: pointer; box-sizing: border-box; max-width: 100%;
}
html body .jalali-filter-wrap:has(> .x) .jalali-filter-input, html body .jalali-filter-wrap:has(> button.x) .jalali-filter-input { padding-right: 44px !important; }
/* the clear button: centred on the field (not on a label above it), a 40px touch area around the 30px visible circle */
html body .jalali-filter-wrap > button.x { top: 50% !important; transform: translateY(-50%) !important; width: 30px !important; height: 30px !important; line-height: 30px !important; right: 6px !important; }
html body .jalali-filter-wrap > button.x::before { content: ""; position: absolute; inset: -5px; }
html body .jalali-filter-wrap > button.x:focus-visible { outline: 2px solid var(--mt-teal, #0E7C86) !important; outline-offset: 1px; }
/* keyboard focus: the global «input:focus{outline:none}» rule has a long :not() chain; the never-matching id in :is() only lifts
   specificity so the teal ring wins on the date field */
html:is(:root, #mt-jf-focus) body .jalali-filter-input:focus-visible, html:is(:root, #mt-jf-focus) body input.jalali-date.date-input:focus-visible { outline: 2px solid var(--mt-teal, #0E7C86) !important; outline-offset: 2px; }
/* the auto-built field (a hidden input next to it): the wrapper never grows wider than its field */
html body span.jalali-filter-wrap { display: block; width: 100%; max-width: 100%; }
html body .jalali-filter-wrap > .jalali-filter-input { margin: 0; width: 100%; }
.jalali-filter-input { font-variant-numeric: tabular-nums; text-overflow: clip; }
@media (max-width: 760px) {
  html body .jalali-filter-input, html body input.jalali-date.date-input { min-height: 44px; font-size: 16px; }
}
.mt-appbar .mt-ab-btn.mt-ab-return { background: #F6C453; border-color: #F6C453; color: #3A2A00; }
.mt-appbar .mt-ab-btn.mt-ab-return:hover { background: #FFD36E; border-color: #FFD36E; color: #3A2A00; }
.mt-appbar .mt-ab-btn.mt-ab-return:focus-visible { outline-color: #FFE6A3 !important; }

/* v13.4.0 shared responsive tables (mtTable in _MT_CHART_JS): phones get one card per row with the actions visible and
   «جزئیات» for the rest; «نمایش جدول کامل» brings the real table back with horizontal scroll inside its box */
.mt-rtw{position:relative;min-width:0}
.mt-rt-full{display:none}
/* v13.5.4: no second vertical scroll inside a page — long lists use the PAGE scroll; a table scrolls sideways only when it
   is really wider than its box (.fits is set by the shared script when it is not), its header stays under the app bar */
.scroll.is-long{max-height:none}
.scroll.fits{overflow:visible}
.mt-rt-t thead th{position:sticky;top:var(--mt-sticky-top,0px);z-index:1;background:#F5F8FB;color:var(--mt-ink-2);font-size:12.5px;font-weight:700;border-bottom:1px solid var(--mt-line);white-space:nowrap}
/* v13.5.6: inside a box with overflow the header must not use the app-bar offset (it would sit over the first row): a box that
   scrolls vertically itself keeps it at its own top; a box that only clips gets a static header the shared script moves with the page */
.mt-rt-t.mt-rt-box thead th{top:0}
.mt-rt-t.mt-rt-clip thead th{position:static}
.mt-rt-t tbody tr:hover td{background:#F7FAFC}
.mt-rt-t td.rt-x{display:none}
.mt-rt-t td.rt-empty{color:var(--mt-mute);text-align:center;padding:18px}
@media(max-width:640px){
 .mt-rt-many .mt-rt-full{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;margin:0 0 8px;border-radius:var(--mt-r-ctl);border:1px solid var(--mt-line);background:#fff;font:700 13px Vazirmatn,Tahoma,sans-serif;color:var(--mt-teal-d)}
 .mt-rt-many .mt-rt-full:focus-visible{outline:2px solid var(--mt-teal)!important;outline-offset:2px}
 .mt-rt-many:not(.is-full) .scroll{overflow:visible;max-height:none}
 .mt-rt-many:not(.is-full) .mt-rt-t,.mt-rt-many:not(.is-full) .mt-rt-t tbody{display:block;min-width:0;width:auto}
 .mt-rt-many:not(.is-full) .mt-rt-t thead{display:none}
 .mt-rt-many:not(.is-full) .mt-rt-t tr{display:flex;flex-direction:row;flex-wrap:wrap;column-gap:8px;row-gap:2px;margin:0 0 10px;padding:10px 12px;background:#fff;border:1px solid var(--mt-line);border-radius:var(--mt-r-tile);box-shadow:var(--mt-e1)}
 .mt-rt-many:not(.is-full) .mt-rt-t tr.is-open{border-color:#B8D9DA}
 .mt-rt-many:not(.is-full) .mt-rt-t td{flex:1 1 100%;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:5px 0!important;border:0!important;white-space:normal!important;text-align:left;width:auto!important;background:none!important;min-width:0;overflow-wrap:anywhere}
 .mt-rt-many:not(.is-full) .mt-rt-t td::before{content:attr(data-l);flex:0 0 auto;max-width:45%;text-align:right;color:var(--mt-ink-2);font-size:12px;font-weight:700}
 .mt-rt-many:not(.is-full) .mt-rt-t td[data-l=""]::before,.mt-rt-many:not(.is-full) .mt-rt-t td.rt-x::before,.mt-rt-many:not(.is-full) .mt-rt-t td.rt-empty::before{content:none}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-t{font-weight:800;font-size:14.5px;color:var(--mt-navy);justify-content:flex-start;text-align:right}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-t::before{content:attr(data-l);font-size:12px;color:var(--mt-mute);font-weight:600;max-width:none}
 .mt-rt-many:not(.is-full) .mt-rt-t tr{position:relative}
 .mt-rt-many:not(.is-full) .mt-rt-t td[data-l="انتخاب"]{position:absolute;top:6px;left:8px;padding:0!important}
 .mt-rt-many:not(.is-full) .mt-rt-t td[data-l="انتخاب"]::before{content:none}
 .mt-rt-many:not(.is-full) .mt-rt-t td[data-l="انتخاب"] input{width:24px;height:24px;margin:10px}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-d:not(.rt-a){display:none}
 .mt-rt-many:not(.is-full) .mt-rt-t tr.is-open td.rt-d{display:flex;border-top:1px dashed var(--mt-line-soft)!important;animation:mt-pop-in var(--mt-d2) var(--mt-ease-out)}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-a{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px;border-top:1px solid var(--mt-line-soft)!important;padding-top:8px!important;margin-top:4px}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-a::before{content:none}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-a button,.mt-rt-many:not(.is-full) .mt-rt-t td.rt-a .btn{flex:1 1 auto;min-height:44px}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-a{flex:1 1 55%}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-x{display:flex;align-items:flex-end;order:99;flex:1 1 30%;padding-top:8px!important;margin-top:4px;border-top:1px solid var(--mt-line-soft)!important}
 .mt-rt-many:not(.is-full) .mt-rt-more{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:44px;border-radius:var(--mt-r-ctl);background:var(--mt-bg);color:var(--mt-ink-2);font:700 13px Vazirmatn,Tahoma,sans-serif}
 .mt-rt-many:not(.is-full) .mt-rt-more:focus-visible{outline:2px solid var(--mt-teal)!important;outline-offset:1px}
 .mt-rt-many.is-full .scroll{overflow:auto;max-height:none}
}
@media(prefers-reduced-motion:reduce){.mt-rt-t tr.is-open td.rt-d{animation:none!important}}

/* v13.4.0 key/value list (system and push status) and inline status tags */
.mt-kv{margin:0;display:grid;gap:0;border:1px solid var(--mt-line-soft);border-radius:var(--mt-r);overflow:hidden;background:#fff}
.mt-kv-row{display:grid;grid-template-columns:minmax(150px,34%) 1fr;gap:12px;padding:11px 14px;border-top:1px solid var(--mt-line-soft);align-items:baseline}
.mt-kv-row:first-child{border-top:0}
.mt-kv dt{font-weight:700;color:var(--mt-ink-2);font-size:13px}
.mt-kv dd{margin:0;color:var(--mt-ink);min-width:0;overflow-wrap:anywhere}
.mt-tag{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.7;border:1px solid var(--mt-line);background:var(--mt-soft);color:var(--mt-ink-2);vertical-align:baseline}
.mt-tag::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.85}
.mt-tag.ok{background:var(--mt-ok-bg);border-color:var(--mt-ok-line);color:var(--mt-ok)}
.mt-tag.bad{background:var(--mt-danger-bg);border-color:var(--mt-danger-line);color:var(--mt-danger)}
.mt-tag.warn{background:var(--mt-warn-bg);border-color:var(--mt-warn-line);color:var(--mt-warn)}
.mt-code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;background:var(--mt-soft);border-radius:6px;padding:1px 6px;unicode-bidi:isolate}
@media(max-width:640px){.mt-kv-row{grid-template-columns:1fr;gap:3px}}
/* public portal header: the lock-up replaces the Latin script name */
.portal-script-brand .mt-lockup-portal{margin:0 auto;justify-content:center}
.portal-script-brand .mt-lockup-portal .mt-lockup-mark svg{width:38px;height:38px}
.portal-script-brand .mt-lockup-portal b{font-size:22px}
/* notification button, medals and confirmation icons drawn as SVG (no emoji in chrome) */
.mtn-fab{display:grid!important;place-items:center}
.medal{display:inline-block;width:14px;height:14px;border-radius:50%;border:3px solid;box-sizing:border-box;vertical-align:-2px;margin-inline-end:4px}
.medal.m1{border-color:#D4A017;background:#F6E3A1}.medal.m2{border-color:#9AA8B6;background:#E3E8ED}.medal.m3{border-color:#C27C4B;background:#F1D3BC}
.mt-done-ic{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 10px;border-radius:50%;background:#E7F5EE;color:#0A7A52}
.mt-done-ic .mt-ic{width:38px;height:38px;stroke-width:2.4}
.alert-card .mt-ic{vertical-align:-3px;color:#8a5a00;margin-inline-end:4px}
.gate-icon .mt-ic{width:30px;height:30px}
/* an empty table (one message row) on a phone: the message alone, without a header row that cannot fit */
@media(max-width:640px){table.mt-rt-none{min-width:0!important;width:100%}table.mt-rt-none thead{display:none}table.mt-rt-none td.rt-empty{display:block;text-align:center;color:var(--mt-mute);padding:18px 10px}}

/* v13.4.0 one entrance per server-rendered page: the first cards rise in order, once (CSS only; nothing re-renders them) */
@media (prefers-reduced-motion: no-preference) {
  html:not(.mt-still) body.mt-shell:not(.mh-dash):not(.sp-home) .wrap > :is(.card, section, .note):nth-child(-n+7),
  html:not(.mt-still) body.mt-shell .pf > :is(.pf-card, .pf-seg, .pf-tabs, .pf-head):nth-child(-n+7) {
    animation: mt-rise var(--mt-d-enter) var(--mt-ease-out) both;
  }
  html:not(.mt-still) body.mt-shell .wrap > :nth-child(2), html:not(.mt-still) body.mt-shell .pf > :nth-child(2) { animation-delay: 40ms; }
  html:not(.mt-still) body.mt-shell .wrap > :nth-child(3), html:not(.mt-still) body.mt-shell .pf > :nth-child(3) { animation-delay: 80ms; }
  html:not(.mt-still) body.mt-shell .wrap > :nth-child(4), html:not(.mt-still) body.mt-shell .pf > :nth-child(4) { animation-delay: 120ms; }
  html:not(.mt-still) body.mt-shell .wrap > :nth-child(n+5), html:not(.mt-still) body.mt-shell .pf > :nth-child(n+5) { animation-delay: 160ms; }
}

/* people: the list is a responsive grid of person tiles with a quiet hover lift */
.pf-list{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:8px}
.pf-item{transition:border-color var(--mt-d1) ease,box-shadow var(--mt-d2) ease,transform var(--mt-d2) var(--mt-ease-out)}
.pf-item:hover{box-shadow:var(--mt-shadow);transform:translateY(-1px)}
.pf-item:focus-visible{outline:2px solid var(--mt-teal,#0E7C86);outline-offset:2px}
.pf-item b{color:var(--mt-navy,#0F2B46)}
.pf-seg a{transition:background var(--mt-d1) ease,color var(--mt-d1) ease}
@media (max-width:640px){.pf-list{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){.pf-item,.pf-item:hover{transition:none;transform:none}}
html.mt-still .pf-item:hover{transform:none}
@media (max-width:640px){.pf-kv{gap:6px}.pf-kv div{padding:6px 10px}.pf-kv b{margin-top:1px;font-size:13.5px}}
/* the dark «today» panel of the seller profile keeps its glass tiles (the light-tile rule above is for light surfaces) */
html body.mt-ds:not(.mt-tv):not(.home-entry) .day-main .mini { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.22); color: #fff; box-shadow: none; }
html body.mt-ds .day-main .mini span { color: #d6ecef; font-size: 11px; }
html body.mt-ds .day-main .mini b { color: #fff; }
/* the push page note: a quiet paragraph, not a box */
.wrap p.mini { background: none; border: 0; padding: 0; color: var(--mt-ink-2); line-height: 1.9; }

/* v13.5.2 account forms: the seller and the management password pages share one width, rhythm and button */
.mt-acct{width:min(520px,calc(100% - 24px));margin:24px auto 32px;box-sizing:border-box}
.mt-acct.password-wrap{margin:24px auto 32px}
.mt-acct>.card,.mt-acct>.password-card{background:#fff;border:1px solid var(--mt-line-soft);border-radius:var(--mt-r-lg);box-shadow:var(--mt-shadow-sm);padding:22px 24px;margin:0}
.mt-acct h2{margin:0 0 6px;font-size:var(--mt-fs-lg);font-weight:800;color:var(--mt-navy)}
.mt-acct p{margin:0 0 4px;color:var(--mt-mute);font-size:var(--mt-fs-sm);line-height:1.9}
.mt-acct form label{display:block;margin:14px 0 6px;font-size:var(--mt-fs-sm);font-weight:700;color:var(--mt-ink-2)}
.mt-acct form input{display:block;width:100%;box-sizing:border-box;height:46px;margin:0;border:1px solid var(--mt-line);border-radius:var(--mt-r-ctl);padding:0 12px;font:inherit;background:#fff}
.mt-acct form input:focus-visible{outline:2px solid var(--mt-focus);outline-offset:1px}
.mt-acct form button[type=submit]{display:block;width:100%;height:46px;margin:20px 0 0;border:0;border-radius:var(--mt-r-ctl);background:var(--mt-teal);color:#fff;font:inherit;font-weight:800;cursor:pointer}
.mt-acct form button[type=submit]:hover{background:var(--mt-teal-d)}
.mt-acct .mt-acct-msg{margin:0 0 12px;padding:11px 14px;border-radius:var(--mt-r);font-size:var(--mt-fs-sm);font-weight:700}
.mt-acct .mt-acct-msg.ok{background:var(--mt-ok-bg);color:var(--mt-ok);border:1px solid var(--mt-ok-line)}
.mt-acct .mt-acct-msg.bad{background:var(--mt-danger-bg);color:var(--mt-danger);border:1px solid var(--mt-danger-line)}

/* v13.5.3 access accounts (/admin/agent-access): one shared grid. Every row has the same three areas in the same columns
   (person, login, account actions); inside the login area the labels sit above their fields and the fields and the save
   button share rows (subgrid), so fields and buttons line up from row to row whatever the length of a name or a label. */
.acc-wrap{container-type:inline-size}
.acc-list{display:grid;grid-template-columns:minmax(190px,1fr) minmax(0,2.3fr) minmax(176px,.8fr);column-gap:20px;margin:0}
.acc-head,.acc-row{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:start}
.acc-head{padding:10px 14px;background:var(--mt-soft,#f4f7fa);border:1px solid var(--mt-line-soft);border-radius:var(--mt-r) var(--mt-r) 0 0;font-size:var(--mt-fs-sm);font-weight:800;color:var(--mt-ink-2)}
.acc-row{padding:16px 14px;border:1px solid var(--mt-line-soft);border-top:0;background:#fff}
.acc-row:last-child{border-radius:0 0 var(--mt-r) var(--mt-r)}
.acc-row:target{box-shadow:inset -3px 0 0 var(--mt-teal)}
.acc-row :is(input,button,a,summary){scroll-margin-top:104px;scroll-margin-bottom:24px}
.acc-who{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.acc-name{margin:0;font-size:15px;font-weight:800;line-height:1.6;overflow-wrap:anywhere;color:var(--mt-navy)}
.acc-name a{color:var(--mt-brand-d);text-decoration:none}
.acc-name a:hover{text-decoration:underline}
.acc-badge{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:999px;font-size:var(--mt-fs-xs);font-weight:800;border:1px solid transparent}
.acc-badge.ok{background:var(--mt-ok-bg);color:var(--mt-ok);border-color:var(--mt-ok-line)}
.acc-badge.warn{background:var(--mt-warn-bg);color:var(--mt-warn);border-color:var(--mt-warn-line)}
.acc-badge.off{background:#eef1f4;color:var(--mt-mute);border-color:var(--mt-line)}
.acc-badge.none{background:var(--mt-danger-bg);color:var(--mt-danger);border-color:var(--mt-danger-line)}
.acc-ext{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column;gap:3px;font-size:var(--mt-fs-sm)}
.acc-ext li{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}
.acc-ext b{font-variant-numeric:tabular-nums;color:var(--mt-ink)}
.acc-ext small{color:var(--mt-mute);font-size:var(--mt-fs-xs)}
.acc-hist{font-size:var(--mt-fs-xs);color:var(--mt-mute)}
.acc-hist summary{cursor:pointer;min-height:28px;display:inline-flex;align-items:center;color:var(--mt-brand-d);font-weight:700}
.acc-cred{min-width:0;display:flex;flex-direction:column;gap:10px}
.acc-pw{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:var(--mt-fs-xs);color:var(--mt-mute);line-height:1.7}
.acc-pw b{color:var(--mt-ok);font-weight:800}
.acc-pw.none b{color:var(--mt-danger)}
.acc-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;grid-template-rows:auto auto auto;column-gap:10px;row-gap:6px;margin:0}
.acc-f{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:6px;margin:0;min-width:0}
.acc-f>span{font-size:var(--mt-fs-sm);font-weight:700;color:var(--mt-ink-2);align-self:end;line-height:1.5}
.acc-f>input{box-sizing:border-box;width:100%;min-width:0;height:var(--mt-ctl,40px);margin:0;border:1px solid var(--mt-line);border-radius:var(--mt-r-ctl);padding:0 12px;font:inherit;font-size:var(--mt-fs);background:#fff;color:var(--mt-ink)}
.acc-f>input[dir=ltr]{text-align:left}
.acc-f>input:focus-visible{outline:none;border-color:var(--mt-teal);box-shadow:var(--mt-focus)}
.acc-hint{grid-column:1/-1;margin:0;font-size:var(--mt-fs-xs);color:var(--mt-mute);line-height:1.7}
.acc-ro{display:flex;flex-direction:column;gap:2px}
.acc-ro small{font-size:var(--mt-fs-sm);color:var(--mt-ink-2);font-weight:700}
.acc-ro b{font-size:var(--mt-fs);text-align:start}
.acc-ro p{margin:4px 0 0;font-size:var(--mt-fs-xs);color:var(--mt-mute)}
.acc-dup{border:1px solid var(--mt-warn-line);background:var(--mt-warn-bg);color:var(--mt-warn);border-radius:var(--mt-r);padding:10px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center}
.acc-dup b{font-size:var(--mt-fs-sm)}
.acc-dup p{grid-column:1;margin:0;font-size:var(--mt-fs-xs);line-height:1.7;color:var(--mt-ink-2)}
.acc-dup form{grid-column:2;grid-row:1/span 2;margin:0}
.acc-acts{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:0}
.acc-acts form{margin:0;display:block}
.acc-btn{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:var(--mt-ctl,40px);
  padding:6px 14px;margin:0;border-radius:var(--mt-r-ctl);border:1px solid var(--mt-line);background:#fff;color:var(--mt-ink);font:inherit;font-size:var(--mt-fs-sm);
  font-weight:800;line-height:1.4;text-align:center;text-decoration:none;cursor:pointer;white-space:normal;overflow-wrap:break-word;box-shadow:none}
.acc-btn:hover{background:var(--mt-soft,#f4f7fa)}
.acc-btn:focus-visible{outline:none;box-shadow:var(--mt-focus)}
.acc-btn.primary{background:var(--mt-teal);border-color:var(--mt-teal);color:#fff}
.acc-btn.primary:hover{background:var(--mt-teal-d)}
.acc-btn.warn{background:var(--mt-warn-bg);border-color:var(--mt-warn-line);color:var(--mt-warn)}
.acc-btn.ok{background:var(--mt-ok-bg);border-color:var(--mt-ok-line);color:var(--mt-ok)}
.acc-btn.danger-ghost{background:#fff;border-color:var(--mt-danger-line);color:var(--mt-danger)}
.acc-btn.danger-ghost:hover{background:var(--mt-danger-bg)}
.acc-acts .access-archive{margin:0}
.acc-form .acc-save{grid-row:2;grid-column:3;align-self:end;width:auto;min-width:96px}
.acc-muted{color:var(--mt-mute)}
.acc-empty{margin:0;padding:24px;text-align:center;color:var(--mt-mute);border:1px solid var(--mt-line-soft);border-top:0;border-radius:0 0 var(--mt-r) var(--mt-r);grid-column:1/-1}
@container (max-width:860px){
  .acc-list{grid-template-columns:minmax(0,1fr)}
  .acc-head{display:none}
  .acc-row{grid-template-columns:minmax(0,1fr);row-gap:14px;border-top:1px solid var(--mt-line-soft);border-radius:var(--mt-r);margin-bottom:12px}
  .acc-acts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
}
@container (max-width:560px){
  .acc-form{grid-template-columns:minmax(0,1fr);grid-template-rows:none}
  .acc-f{grid-row:auto;grid-template-rows:auto auto}
  .acc-form .acc-save{grid-row:auto;grid-column:auto;width:100%}
  .acc-dup{grid-template-columns:minmax(0,1fr)}
  .acc-dup form{grid-column:1;grid-row:auto}
}
/* the one-time view of a newly issued temporary password */
.acc-issued{max-width:560px;margin:24px auto;background:#fff;border:1px solid var(--mt-line-soft);border-radius:var(--mt-r-lg);padding:22px 24px;box-shadow:var(--mt-shadow-sm)}
.acc-issued h2{margin:0 0 12px;font-size:var(--mt-fs-lg);color:var(--mt-navy)}
.acc-issued-warn{margin:0 0 14px;padding:10px 12px;border-radius:var(--mt-r);background:var(--mt-warn-bg);border:1px solid var(--mt-warn-line);color:var(--mt-ink);font-size:var(--mt-fs-sm);line-height:1.8}
.acc-issued-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0 0 12px;font-size:var(--mt-fs-sm)}
.acc-issued-kv dt{color:var(--mt-ink-2);font-weight:700}
.acc-issued-kv dd{margin:0;font-weight:800;text-align:left}
.acc-secret{display:grid;gap:8px;margin:0 0 12px}
.acc-secret-label{font-size:var(--mt-fs-sm);font-weight:700;color:var(--mt-ink-2)}
.acc-secret code{display:block;font:800 24px/1.6 Consolas,Menlo,monospace;letter-spacing:2px;background:#f4f9fc;border:2px dashed var(--mt-teal);border-radius:var(--mt-r);padding:10px 14px;text-align:center;overflow-wrap:anywhere}
.acc-secret code[hidden]{display:none}
.acc-secret-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.acc-secret-status{margin:0;min-height:1.6em;font-size:var(--mt-fs-sm);color:var(--mt-ok);font-weight:700}
.acc-issued .acc-hint{margin:0 0 14px}
.acc-issued-acts{display:flex;justify-content:flex-start}
.acc-issued-acts .acc-btn{width:auto}

/* v13.5.4 contextual help: one «?» control beside a section title or a field label (click/tap/keyboard, never hover only);
   the panel is placed inside the viewport by the shared script (_MT_HELP_JS), so a table or card never clips it */
.mt-help-w{display:inline-flex;align-items:center;vertical-align:middle;margin-inline-start:6px;position:relative}
/* doubled class: page-local «.pf button» style rules must not reshape the shared control */
button.mt-help.mt-help{box-sizing:border-box;display:inline-grid;place-items:center;width:28px;height:28px;min-width:28px;min-height:28px;padding:0;margin:0;
  border-radius:999px;border:1px solid var(--mt-line);background:#fff;color:var(--mt-brand-d);font:inherit;font-size:14px;font-weight:800;
  line-height:1;cursor:pointer;box-shadow:none;flex:none}
button.mt-help.mt-help:hover{background:var(--mt-brand-soft)}
button.mt-help.mt-help:focus-visible{outline:none;box-shadow:var(--mt-focus)}
button.mt-help.mt-help[aria-expanded="true"]{background:var(--mt-brand-d);border-color:var(--mt-brand-d);color:#fff}
.mt-help-pop{position:fixed;z-index:10050;box-sizing:border-box;display:block;padding:12px 14px;border-radius:var(--mt-r);
  background:#fff;color:var(--mt-ink);border:1px solid var(--mt-line);box-shadow:var(--mt-shadow-lg);font-size:var(--mt-fs-sm);
  font-weight:500;line-height:1.9;text-align:start;white-space:normal;overflow-wrap:anywhere;direction:rtl}
.mt-help-pop[hidden]{display:none}
@media print{.mt-help-w{display:none}}
/* one shared row of actions (a decision form and its sibling buttons): equal heights, one gap, wraps as a group */
.mt-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}
.mt-actions>form{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin:0}
.mt-actions button,.mt-actions .btn,.mt-actions a.nav{min-height:var(--mt-ctl,40px);margin:0}
.acc-title{display:flex;align-items:center;gap:4px;margin:4px 0 12px}
.acc-title h2{margin:0;font-size:var(--mt-fs-lg);color:var(--mt-navy)}
/* a shared action row inside a phone card: its buttons join the card's own action row (one height, one gap, full width) */
@media(max-width:640px){.mt-rt-many:not(.is-full) .mt-rt-t td.rt-a .mt-actions,.mt-rt-many:not(.is-full) .mt-rt-t td.rt-a .mt-actions>form{display:contents}
 .mt-rt-many:not(.is-full) .mt-rt-t td.rt-a:has(.mt-actions){flex-basis:100%}}
/* the «جزئیات» toggle of a phone card never breaks inside its word (the card cells allow breaking anywhere) */
@media(max-width:640px){.mt-rt-many:not(.is-full) .mt-rt-t td.rt-x{min-width:max-content}.mt-rt-many:not(.is-full) .mt-rt-more{white-space:nowrap;overflow-wrap:normal}}
/* a left-to-right value cell (phone, path) keeps its label on the right like every other card line */
@media(max-width:640px){.mt-rt-many:not(.is-full) .mt-rt-t td[dir="ltr"]{flex-direction:row-reverse}}
/* v13.5.4 the state of call data when Issabel cannot be reached: «stale» (the last data read, with its time) or «unavailable»
   (nothing in place of the call figures). One shared notice for the dashboard, the seller home and the call-only pages. */
.mt-cdr-state{display:flex;flex-direction:column;gap:4px;box-sizing:border-box;margin:0 0 14px;padding:12px 16px;border-radius:var(--mt-r-tile);
  border:1px solid var(--mt-danger-line);background:var(--mt-danger-bg);color:var(--mt-ink);font-size:var(--mt-fs-sm,13px);line-height:1.9}
.mt-cdr-state b{color:var(--mt-danger);font-size:14.5px;font-weight:800}
.mt-cdr-state.is-stale{border-color:var(--mt-warn-line);background:var(--mt-warn-bg)}
.mt-cdr-state.is-stale b{color:var(--mt-warn,#8a5a00)}
/* v13.5.4: an open modal dialog owns the scroll: the page behind it is locked at its position (restored on close) and the
   dialog's own scroll never chains to the page */
html.mt-scroll-lock body{position:fixed;left:0;right:0;width:100%;overflow:hidden}
dialog[open]{overscroll-behavior:contain}
/* v13.5.4: a help control where a panel or block has no title of its own */
.mt-help-line{display:flex;align-items:center;gap:6px;margin:6px 0 10px;color:var(--mt-ink-2);font-size:var(--mt-fs-sm,13px)}
.mt-help-line .mt-help-w{margin-inline-start:0}
/* a table wider than its box scrolls sideways in its own box; its header is moved down with the page by the shared script
   (a sticky header cannot stick to the page from inside a sideways scroll box) */
.mt-thead-follow{position:relative;z-index:2;will-change:transform}
.mt-thead-follow th{box-shadow:0 1px 0 var(--mt-line)}
/* a sticky/following table header is opaque (the same tint on white): rows pass under it, never through it */
.mt-rt-t thead th,.mt-thead-follow th{background-color:#F2F4F6!important;background-image:none!important}

/* ==================================================================
   v13.5.8 extension management (/admin/extension): one person = one identity; rows sorted into current / ended / hidden /
   needs review / voided. Operate mode: tokens of the design system, no page-local styles.
   ================================================================== */
.ext-page{background:var(--mt-soft);color:var(--mt-ink);margin:0}
.ext-wrap{max-width:1080px;margin:0 auto;padding:20px 16px 48px;display:grid;gap:16px}
.ext-head h1{margin:0;font-size:22px;font-weight:800;line-height:1.4}
.ext-sub{margin:4px 0 0;color:var(--mt-mute);font-size:14px}
.ext-panel{background:#fff;border:1px solid var(--mt-line);border-radius:12px;padding:16px;display:grid;gap:12px;min-width:0}
.ext-panel h2{margin:0;font-size:16px;font-weight:700}
.ext-panel-h{display:flex;align-items:center;gap:4px}
.ext-flash{border-radius:var(--mt-radius);padding:10px 14px;font-size:14px;line-height:1.8}
.ext-flash.ok{background:var(--mt-ok-bg);border:1px solid var(--mt-ok-line);color:var(--mt-ok)}
.ext-flash.bad{background:var(--mt-danger-bg);border:1px solid var(--mt-danger-line);color:var(--mt-danger)}
.ext-tabs{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--mt-line);padding-bottom:10px}
.ext-tab{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;border-radius:999px;border:1px solid var(--mt-line);
  color:var(--mt-ink);text-decoration:none;font-size:13px;font-weight:600;background:#fff}
.ext-tab:hover{background:var(--mt-soft)}
.ext-tab.on{background:var(--mt-brand);border-color:var(--mt-brand);color:#fff}
.ext-count{font-variant-numeric:tabular-nums;min-width:20px;text-align:center;border-radius:999px;padding:0 6px;font-size:12px;
  background:var(--mt-soft);color:var(--mt-mute)}
.ext-tab.on .ext-count{background:rgba(255,255,255,.2);color:#fff}
.ext-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ext-row{border:1px solid var(--mt-line);border-radius:10px;padding:12px 14px;display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:start;min-width:0}
.ext-row.is-void{background:var(--mt-soft)}
.ext-row-main{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;min-width:0}
.ext-name{font-size:15px;font-weight:700}
.ext-period{display:inline-flex;flex-wrap:wrap;gap:6px;color:var(--mt-ink);font-size:13px;font-variant-numeric:tabular-nums}
.ext-shift{color:var(--mt-mute);font-size:13px}
.ext-row-side{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.ext-row-acts{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.ext-row-acts:empty{display:none}
.ext-row > .ext-edit,.ext-row > .ext-note,.ext-row > form{grid-column:1/-1}
.ext-badge{display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid transparent;white-space:nowrap}
.ext-badge.ok{background:var(--mt-ok-bg);color:var(--mt-ok);border-color:var(--mt-ok-line)}
.ext-badge.warn{background:var(--mt-warn-bg);color:var(--mt-warn);border-color:var(--mt-warn-line)}
.ext-badge.danger{background:var(--mt-danger-bg);color:var(--mt-danger);border-color:var(--mt-danger-line)}
.ext-badge.mute{background:var(--mt-soft);color:var(--mt-mute);border-color:var(--mt-line)}
.ext-note{margin:0;color:var(--mt-mute);font-size:13px;line-height:1.9}
.ext-empty{margin:0;color:var(--mt-mute);padding:12px 0}
.ext-edit{border-top:1px dashed var(--mt-line);padding-top:8px}
.ext-edit > summary{cursor:pointer;font-weight:600;font-size:13px;color:var(--mt-brand);min-height:32px;display:flex;align-items:center;gap:6px}
.ext-edit > summary:focus-visible{outline:2px solid rgba(11,106,147,.45);outline-offset:2px;border-radius:6px}
.ext-danger-zone > summary{color:var(--mt-danger)}
.ext-new{border:1px solid var(--mt-warn-line);background:var(--mt-warn-bg);border-radius:10px;padding:8px 12px}
.ext-new > summary{color:var(--mt-warn)}
.ext-form{display:grid;gap:12px;padding-top:8px}
.ext-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 12px;align-items:end}
.ext-grid[hidden]{display:none}
.ext-wide{grid-column:1/-1}
.ext-f{display:grid;gap:4px;min-width:0;font-size:13px}
.ext-f > span,.ext-l{color:var(--mt-mute);font-weight:600;display:flex;align-items:center;gap:2px;min-height:24px}
.ext-l label{color:inherit}
.ext-f input,.ext-f select{width:100%;min-height:38px;padding:0 10px;font-size:14px;box-sizing:border-box}
.ext-check{display:flex;align-items:center;gap:6px;font-size:14px;flex-wrap:wrap}
.ext-check label{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.ext-check input[type=checkbox]{width:18px;height:18px;accent-color:var(--mt-brand)}
.ext-presets{display:flex;flex-wrap:wrap;gap:6px}
.ext-chip{min-height:30px!important;font-size:12px!important;padding:0 10px!important;font-variant-numeric:tabular-nums}
.ext-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}
.ext-inline{display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.ext-grow{flex:1 1 220px}
.ext-sm{min-height:30px!important;font-size:12px!important;padding:0 11px!important}
@media (max-width:900px){.ext-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){
  .ext-wrap{padding:14px 12px 40px}
  .ext-grid{grid-template-columns:1fr}
  .ext-row{grid-template-columns:1fr}
  .ext-row-side{justify-content:flex-start}
  .ext-actions button,.ext-inline button{width:100%}
}
.ext-table{width:100%;border-collapse:collapse;font-size:13px}
.ext-table th{text-align:start;color:var(--mt-mute);font-weight:700;padding:8px 10px;border-bottom:1px solid var(--mt-line);background:#F2F4F6}
.ext-table td{padding:8px 10px;border-bottom:1px solid var(--mt-line);vertical-align:middle}
.ext-table td:last-child{display:flex;flex-wrap:wrap;gap:6px}