/* رها (راهکار هوشمند ایستا) — RTL، وزیرمتن؛ پالت از لوگو: کرم + فیروزه‌ای + نارنجی سفال. */
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/Vazirmatn-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/Vazirmatn-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}

:root {
  /* ── هویت رها — استخراج از static/icons/raha-pal-e.png ── */
  /* سطوح */
  --bg: #fff9ed;           /* کرم لوگوی رها */
  --paper: #fff9ed;
  --surface: #f3ebdc;      /* فرورفتهٔ گرم */
  --card: #ffffff;
  --elevated: #ffffff;
  --ink: #1a2e30;          /* متن روی کرم — نزدیک به فیروزه */
  --muted: #5f6f70;
  --line: #e4dac8;
  --line-strong: #cfc3ae;
  /* برند */
  --primary: #206c70;      /* فیروزه‌ای مسیر لوگو */
  --primary-dark: #175458;
  --primary-strong: #175458;
  --primary-tint: #e6f3f3;
  --on-primary: #fff9ed;
  --accent: #d08c60;       /* نارنجی سرپیکان لوگو */
  --accent-tint: #f8ebe1;
  /* معنایی */
  --ok: #2f6b45;      --ok-ink: #245738;      --ok-soft: #e5f0e8;
  --warn: #b33c32;    --warn-ink: #962f27;    --warn-soft: #f9e6e3;
  --pending: #b07a2e; --pending-ink: #8f621f; --pending-soft: #f7ebda;
  --info: #206c70;    --info-ink: #175458;    --info-soft: #e6f3f3;
  --btn-bg: #f1e9db;
  --chip-bg: #ebe3d4;
  --input-bg: #fffcf6;
  --code-bg: #f1e9db;
  --link: var(--primary);
  --placeholder: #7a8c8d;   /* کنتراست بهتر از خاکستری خام روی کرم */
  /* کنترل‌های فرم با رنگ برند (نه آبی مرورگر) */
  accent-color: var(--primary);
  /* مقیاس فاصله / شعاع / سایه / حرکت — شعاع‌ها گرد (هم‌خوان با قوس لوگو) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px;
  --touch-min: 44px;        /* حداقل هدف لمس (WCAG / iOS HIG) */
  --r-sm: 10px; --r: 14px; --r-lg: 18px; --r-pill: 999px;
  --radius: 14px;
  --sh-1: 0 1px 2px rgba(32, 108, 112, .06);
  --sh-2: 0 2px 10px rgba(32, 108, 112, .08), 0 1px 2px rgba(26, 46, 48, .05);
  --sh-3: 0 12px 32px rgba(32, 108, 112, .14), 0 2px 8px rgba(26, 46, 48, .08);
  --shadow: var(--sh-2);
  --dur: 150ms;
  --ease: cubic-bezier(.2, .6, .2, 1);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font-family: "Vazirmatn", "Segoe UI", Tahoma, sans-serif;
  background:
    radial-gradient(1100px 460px at 100% -8%, rgba(208, 140, 96, .14), transparent 55%),
    radial-gradient(900px 400px at 0% 100%, rgba(32, 108, 112, .10), transparent 50%),
    var(--paper);
  background-attachment: fixed;
  color: var(--ink);
  line-height: 1.7;
  font-size: 15px;
  -webkit-text-size-adjust: 100%;
}

/* --- نوار بالا --- */
.topbar {
  background: var(--primary);
  color: var(--on-primary);
  border-bottom: 3px solid var(--accent);
}
.topbar__in {
  max-width: 720px; margin: 0 auto;
  padding: calc(10px + var(--safe-top)) calc(16px + var(--safe-right)) 10px calc(16px + var(--safe-left));
  display: flex; flex-direction: column; gap: 8px;
}
.topbar__row {
  display: flex; align-items: center; gap: 12px; min-width: 0;
}
.topbar__when {
  flex: 1 1 auto;
  min-width: 0;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px;
  color: rgba(255, 250, 244, .92);
  line-height: 1.25;
  font-size: .78rem;
  font-weight: 600;
}
.topbar__when-clock {
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  font-size: .9rem;
  direction: ltr;
  unicode-bidi: plaintext;
}
.topbar__when-date { white-space: nowrap; }
.topbar__when-occ {
  width: 100%;
  font-size: .7rem;
  font-weight: 600;
  color: rgba(255, 250, 244, .78);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
@media (max-width: 767.98px) {
  .topbar__when {
    order: 3;
    flex: 1 1 100%;
    padding-top: 2px;
    border-top: 1px solid rgba(255,250,244,.14);
    margin-top: 2px;
  }
  .topbar__when-occ { display: none; } /* روی موبایل در title نگه می‌داریم */
}
.brand {
  color: var(--on-primary); text-decoration: none; font-weight: 700;
  font-size: 1.15rem; letter-spacing: .02em; flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 8px;
}
.brand__mark {
  width: 48px; height: 48px; flex: 0 0 auto;
  padding: 6px; box-sizing: border-box;
  border-radius: 13px;
  background: var(--bg);
  object-fit: contain;
  /* PNG شفاف روی بج کرم — قوس نازک روی نوار فیروزه خوانا می‌ماند */
  box-shadow: 0 0 0 1px rgba(255,250,244,.28);
}
.brand__text { line-height: 1.15; }
.brand__name { display: block; }
.brand__sub {
  display: block; font-size: .62rem; font-weight: 400;
  color: rgba(255, 250, 244, .72); letter-spacing: 0;
}
@media (max-width: 420px) {
  .brand__sub { display: none; }
  .who__pos { display: none; }
}
@media (max-width: 767.98px) {
  .who__pos { display: none !important; }
  .who--link { max-width: min(42vw, 160px); }
  .logout { padding: 8px 10px; font-size: .78rem; min-height: var(--touch-min); }
}
.who { margin-inline-start: auto; text-align: end; line-height: 1.25; min-width: 0; }
.who--link {
  display: inline-flex; align-items: center; gap: 8px;
  color: inherit; text-decoration: none; max-width: min(46vw, 220px);
}
.who--link:hover { opacity: .92; }
.who__text { min-width: 0; text-align: end; overflow: hidden; }
.who__name {
  display: block; font-weight: 700; font-size: .9rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.who__pos {
  display: block; font-size: .72rem; color: rgba(255, 250, 244, .72);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.logout {
  color: rgba(255, 250, 244, .88); text-decoration: none; font-size: .82rem;
  border: 1px solid rgba(255, 250, 244, .28); padding: 8px 12px; border-radius: 8px; flex: 0 0 auto;
  min-height: var(--touch-min); display: inline-flex; align-items: center; justify-content: center;
  touch-action: manipulation;
}
.logout:hover { background: var(--primary-dark); }

.wrap {
  max-width: 720px; margin: 0 auto;
  padding: 18px calc(16px + var(--safe-right)) calc(72px + var(--safe-bottom)) calc(16px + var(--safe-left));
}
.wrap--auth {
  max-width: 420px;
  padding-top: calc(12px + var(--safe-top));
  padding-bottom: calc(32px + var(--safe-bottom));
}

/* --- پیام‌های فلش --- */
.flash-stack { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.flash-stack:empty { display: none; margin: 0; }
.flash {
  padding: 12px 14px; border-radius: var(--radius); font-size: .92rem;
  border: 1px solid var(--line); background: var(--card); white-space: pre-line;
  box-shadow: var(--shadow); overflow-wrap: anywhere;
}
.flash:empty { display: none; padding: 0; border: 0; margin: 0; }
/* اگر تگ سطح خالی بود، مثل info نشان بده */
.flash-- {
  border-inline-start: 4px solid var(--ok);
  background: var(--ok-soft); color: var(--ok-ink);
}
.flash--success, .flash--info {
  border-inline-start: 4px solid var(--ok);
  background: var(--ok-soft); color: var(--ok-ink);
}
.flash--warning {
  border-inline-start: 4px solid var(--accent);
  background: var(--pending-soft); color: var(--pending-ink);
}
.flash--error {
  border-inline-start: 4px solid var(--warn);
  background: var(--warn-soft); color: var(--warn-ink);
}
.body--auth .flash-stack { max-width: 380px; margin-inline: auto; }
.body--auth .topbar { display: none; }

/* --- کارت و فرم ورود --- */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 22px; }
.auth { max-width: 400px; margin: 2vh auto 0; padding: 24px 14px; }
.auth__brand {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  margin-bottom: 22px; text-align: center;
}
.auth__logo {
  border-radius: 22px; box-shadow: var(--sh-2);
  width: 96px; height: 96px; padding: 12px; box-sizing: border-box;
  object-fit: contain;
  background: var(--bg);
}
.auth__app {
  font-weight: 700; font-size: 1.55rem; color: var(--ink);
  letter-spacing: .04em;
}
.auth__tagline {
  color: var(--muted); font-size: .9rem; line-height: 1.75;
  max-width: 28ch; margin: 0;
}
.body--auth .topbar { background: transparent; color: var(--ink); box-shadow: none; }
.body--auth .topbar__in { padding-top: 10px; }
.body--auth .brand { color: var(--primary); }
.login-card { max-width: 380px; margin: 0 auto; padding: 26px 22px; border-radius: var(--r-lg); }
.login-title { margin: 0 0 6px; font-size: 1.25rem; }
.login-sub { margin: 0 0 22px; color: var(--muted); font-size: .9rem; line-height: 1.7; }
.auth__switch { margin-top: 1.1rem; text-align: center; }
.auth__switch a { color: var(--link); font-weight: 700; text-decoration: none; }
.auth__switch a:hover { text-decoration: underline; }
.auth__hint { margin: 0; font-size: .78rem; color: var(--muted); }
.pin-toggle { display: inline-flex; align-items: center; justify-content: center; }
.pin-toggle__icon { display: block; width: 20px; height: 20px; }
.form { display: flex; flex-direction: column; gap: 14px; }
.field { display: flex; flex-direction: column; gap: 6px; font-size: .85rem; color: var(--muted); }
.field__label { color: var(--muted); font-size: .78rem; font-weight: 700; }
.field input, .field select, .field textarea {
  font: inherit; padding: 11px 12px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--input-bg); color: var(--ink); text-align: start;
  width: 100%; max-width: 100%;
  min-height: var(--touch-min);
  touch-action: manipulation;
}
.field textarea { resize: vertical; min-height: 72px; line-height: 1.6; }
.field input:focus, .field select:focus, .field textarea:focus,
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible {
  outline: 3px solid var(--accent); outline-offset: 2px; border-color: var(--primary);
}
.field input::placeholder, .field textarea::placeholder { color: var(--placeholder); }
.field__row { display: flex; gap: 8px; align-items: stretch; }
.field__row input { flex: 1; min-width: 0; }
.field__error { color: var(--warn-ink); font-size: .82rem; font-weight: 700; display: block; margin-top: 4px; }
.field--check {
  flex-direction: row; align-items: center; gap: .5rem;
  font-size: .9rem; color: var(--ink);
}
.field--check input { width: auto; max-width: none; accent-color: var(--primary); }
.field__input--otp {
  letter-spacing: .35em; font-size: 1.25rem; font-weight: 700;
  text-align: center !important; font-variant-numeric: tabular-nums;
}
.pin-toggle {
  flex: 0 0 auto; font: inherit; font-weight: 700; font-size: .82rem;
  padding: 0 14px; border: 1px solid var(--line); border-radius: 9px;
  background: var(--btn-bg); color: var(--muted); cursor: pointer; white-space: nowrap;
  min-width: var(--touch-min); min-height: var(--touch-min);
  touch-action: manipulation;
}
.pin-toggle:hover { filter: brightness(.97); }

/* --- دکمه‌ها --- */
.btn {
  font: inherit; font-weight: 700; cursor: pointer; border: 1px solid transparent;
  border-radius: 9px; padding: 10px 16px; font-size: .9rem; background: var(--btn-bg); color: var(--ink);
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none;
  overflow-wrap: anywhere;
  min-height: var(--touch-min);
  touch-action: manipulation;
  transition: filter var(--dur) var(--ease), background-color var(--dur) var(--ease),
    border-color var(--dur) var(--ease), opacity var(--dur) var(--ease);
}
.btn:hover { filter: brightness(.97); }
.btn--primary { background: var(--primary); color: var(--on-primary); }
.btn--ok { background: var(--ok); color: #fff; }
.btn--warn { background: var(--warn); color: #fff; }
.btn--ghost { background: transparent; border-color: var(--line-strong); color: var(--ink); }
.btn--block { width: 100%; padding: 12px; }
.btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.btn:disabled, .btn[aria-busy="true"] { opacity: .62; cursor: wait; pointer-events: none; }

/* --- جعبهٔ متن آزاد (composer) — عمل اصلی صفحه، نه دکوراسیون --- */
.cartable__composer {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-2);
  padding: 16px 16px 14px;
  margin-bottom: 14px;
  border-inline-start: 4px solid var(--accent);
}

.cartable__self {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-1);
  padding: 12px 14px 10px;
  margin-bottom: 16px;
}
.cartable__self-title {
  margin: 0 0 8px; font-size: .98rem; font-weight: 700; color: var(--ink);
}
.self-task-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
  align-items: end;
}
.self-task-form .field { margin: 0; }
.self-task-form__desc { grid-column: 1 / -1; margin: 0; }
.self-task-form__more {
  grid-column: 1 / -1;
  margin: 0;
}
.self-task-form__more > summary {
  cursor: pointer; list-style: none; font-size: .8rem; font-weight: 700;
  color: var(--link); padding: 6px 0; min-height: 36px;
  display: inline-flex; align-items: center;
  touch-action: manipulation;
}
.self-task-form__more > summary::-webkit-details-marker { display: none; }
.self-task-form__more > summary::after { content: " ▾"; font-size: .75em; opacity: .7; }
.self-task-form__more[open] > summary::after { content: " ▴"; }
.self-task-form__actions {
  grid-column: 1 / -1;
  display: flex; flex-wrap: wrap; gap: 8px;
}
@media (max-width: 640px) {
  .self-task-form { grid-template-columns: 1fr; }
  .self-task-form__actions .btn {
    flex: 1 1 auto; min-height: 44px;
  }
}
.composer__head { margin-bottom: 8px; }
.composer__kicker {
  margin: 0 0 2px; font-size: .72rem; font-weight: 700;
  color: var(--accent); letter-spacing: .02em;
}
.composer__title {
  margin: 0; font-size: 1.12rem; font-weight: 700; color: var(--ink);
  letter-spacing: -.01em;
}
.composer { display: flex; gap: 10px; margin-bottom: 8px; align-items: stretch; }
.composer__input {
  flex: 1; font: inherit; padding: 14px 16px; border: 1px solid var(--line-strong);
  border-radius: 12px; background: var(--input-bg); color: var(--ink);
  min-height: 52px; box-shadow: inset 0 1px 2px rgba(32,108,112,.05);
}
.composer__input:focus { outline: 3px solid var(--accent); outline-offset: 2px; border-color: var(--primary); }
.composer__input::placeholder { color: var(--placeholder); }
.composer__hint { color: var(--muted); font-size: .82rem; margin: 0; line-height: 1.55; max-width: 48ch; }
.composer__assist {
  margin: 0; border-top: 1px dashed var(--line); padding-top: 6px;
}
.composer__assist-sum {
  cursor: pointer; list-style: none; font-size: .8rem; font-weight: 700;
  color: var(--link); padding: 8px 0; min-height: 40px;
  display: inline-flex; align-items: center; gap: 4px;
  touch-action: manipulation;
}
.composer__assist-sum::-webkit-details-marker { display: none; }
.composer__assist-sum::after { content: "▾"; font-size: .75em; opacity: .7; }
.composer__assist[open] > .composer__assist-sum::after { content: "▴"; }
.composer__assist-body { padding: 2px 0 4px; }
.composer__examples {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
  margin: 6px 0 0;
}
.composer__examples-label { color: var(--muted); font-size: .72rem; font-weight: 700; }
.composer__example {
  font: inherit; font-size: .78rem; color: var(--ink); cursor: pointer;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 6px 11px; max-width: 100%; overflow-wrap: anywhere; text-align: start;
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
  touch-action: manipulation;
}
.composer__example:hover { background: var(--accent-tint); border-color: var(--accent); }
.composer__example:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* پیشنهاد نام — کوتاه و فیروزه‌ای؛ کمتر شبیه خوشهٔ pill */
.composer__names {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
  margin: 0 0 8px;
}
.composer__names-label { color: var(--muted); font-size: .72rem; font-weight: 700; }
.composer__name {
  font: inherit; font-size: .78rem; color: var(--primary-dark); cursor: pointer;
  background: var(--primary-tint); border: 1px solid transparent; border-radius: var(--r-sm);
  padding: 5px 11px; max-width: 100%; overflow-wrap: anywhere; text-align: start;
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.composer__name:hover { background: var(--accent-tint); border-color: var(--accent); color: var(--ink); }
.composer__name:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.composer__names-extra {
  display: inline; flex: 0 0 auto;
}
.composer__names-extra > summary {
  list-style: none; cursor: pointer; font: inherit; font-size: .78rem; font-weight: 700;
  color: var(--primary-dark); background: var(--surface); border: 1px dashed var(--line);
  border-radius: var(--r-sm); padding: 5px 11px; display: inline-block;
}
.composer__names-extra > summary::-webkit-details-marker { display: none; }
.composer__names-extra[open] > summary { display: none; }
.composer__names-extra[open] {
  display: contents;
}
@media (max-width: 767.98px) {
  /* فاصله از FAB پشتیبانی (سمت شروع RTL) تا نام‌ها روی هم نیفتند */
  .composer__names { padding-inline-start: 52px; }
}

/* --- جانشینی موقت (Epic C2) --- */
.delegate__hint { color: var(--muted); font-size: .82rem; margin: 0 0 12px; line-height: 1.7; max-width: 52ch; }
.delegate-form { margin-bottom: 12px; }
.delegate-form__row {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
}
.delegate-form__row .field { flex: 1 1 160px; min-width: 0; }
.delegate-form__row .btn { flex: 0 0 auto; align-self: flex-end; min-height: var(--touch-min); }
.delegate-form__actions { margin-top: 12px; }
.delegate-scope {
  margin: 12px 0 0; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--paper, var(--surface, transparent));
}
.delegate-scope__legend {
  font-size: .9rem; font-weight: 700; padding: 0 4px;
}
.delegate-scope__hint { margin: 4px 0 8px; font-size: .82rem; }
.delegate-scope__opts {
  display: flex; flex-wrap: wrap; gap: 8px 14px;
}
.delegate-scope__opt {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .9rem; font-weight: 600; cursor: pointer;
  min-height: 40px;
}
@media (max-width: 640px) {
  .delegate-scope__opt { flex: 1 1 45%; min-height: 44px; }
  .delegate-form__actions .btn { width: 100%; min-height: 44px; }
}
.delegate-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.delegate-list__item {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 10px 14px;
}
.delegate-list__main { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; }
.delegate-list__who { font-weight: 700; }
.delegate-list__item form { margin: 0; }

/* --- حالت اصلاح پس از رد برداشت (بنر + حاشیهٔ کهربایی composer) --- */
.composer-correct {
  background: var(--pending-soft); border: 1px solid var(--accent);
  border-radius: var(--radius); padding: 10px 14px; margin-bottom: 10px;
  font-size: .9rem; font-weight: 700; display: flex; flex-wrap: wrap;
  align-items: center; gap: 8px;
}
.composer-correct__badge {
  background: var(--accent); color: #fff; border-radius: 999px;
  font-size: .72rem; padding: 2px 10px; font-weight: 700;
}
.cartable__composer--correcting .composer__input {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--pending-soft);
}

/* --- بلوک‌ها و کارها --- */
.block { margin-bottom: 26px; }
.block__title { font-size: 1rem; margin: 0 0 10px; display: flex; align-items: center; gap: 8px; }
.block__title--sub { font-size: .95rem; }
.count { background: var(--chip-bg); color: var(--muted); border-radius: 999px; font-size: .72rem; padding: 1px 9px; font-weight: 700; }

.task {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--sh-1); padding: 16px 16px 16px 14px; margin-bottom: 0;
  display: flex; align-items: flex-start; gap: 14px;
  transition: box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.task:hover { box-shadow: var(--sh-2); border-color: var(--line-strong); }
.task--overdue { border-inline-start: 5px solid var(--warn); }
.task--approve { border-inline-start: 5px solid var(--pending); background: linear-gradient(90deg, var(--pending-soft) 0%, var(--card) 28%); }
.task--collab { border-inline-start: 5px solid var(--primary); }
.task--email { border-inline-start: 5px solid var(--ok); }
.task--email-new { background: linear-gradient(90deg, var(--pending-soft) 0%, var(--card) 32%); }
.email-detail { margin-top: .75rem; }
.email-detail__body {
  white-space: pre-wrap;
  font-family: inherit;
  font-size: .9rem;
  margin: .5rem 0;
  max-height: 16rem;
  overflow: auto;
}
.email-reply { margin-top: .75rem; }
.block--email-compose { margin-bottom: 1rem; }
.task__main { flex: 1; min-width: 0; }
.task__title { font-weight: 700; font-size: 1.02rem; overflow-wrap: anywhere; word-break: break-word; line-height: 1.45; }
.task__meta { color: var(--muted); font-size: .8rem; margin-top: 8px; display: flex; flex-direction: column; gap: 8px; overflow-wrap: anywhere; }
.task__meta-line { line-height: 1.55; }
.task__tags { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.task__note { color: var(--warn-ink); font-size: .8rem; margin-top: 6px; overflow-wrap: anywhere; }
.task__actions {
  display: flex; flex-direction: column; gap: 8px; align-items: stretch;
  flex: 0 0 auto; min-width: min(100%, 168px);
}
.muted { color: var(--muted); font-size: .82rem; }

.tag { font-size: .68rem; font-weight: 700; padding: 2px 8px; border-radius: 8px; display: inline-flex; align-items: center; gap: 4px; }
.tag::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; opacity: .6; }
.tag--overdue { background: var(--warn-soft); color: var(--warn-ink); }
.tag--overdue::before { background: var(--warn); }
.tag--escalated { background: var(--warn-soft); color: var(--warn-ink); }
.tag--escalated::before { background: var(--warn); }
.tag--pending { background: var(--pending-soft); color: var(--pending-ink); }
.tag--pending::before { background: var(--pending); }
.tag--urgent { background: var(--warn-soft); color: var(--warn-ink); }
.tag--urgent::before { background: var(--warn); }
.tag--high { background: var(--pending-soft); color: var(--pending-ink); }
.tag--high::before { background: var(--pending); }

.create-task-form--ai { margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px dashed var(--line); }
.task-detail__ask-link { margin: 0 0 16px; }

/* تقویم مهلت — عرض نزدیک به کانبان؛ شبکه ماه غالب، «بدون مهلت» زیر شبکه */
.wrap--calendar {
  max-width: 1400px;
  padding-inline: calc(20px + var(--safe-right)) calc(20px + var(--safe-left));
}
.cal-board__head {
  display: flex; flex-wrap: wrap; gap: 12px;
  justify-content: space-between; align-items: flex-start;
  margin-bottom: 16px;
}
.cal-board__nav { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cal-board__nav-period,
.cal-board__nav-tools {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.cal-board__filter-more,
.due-board__filter-more,
.customers-filters__more {
  flex: 1 1 100%;
  margin: 0;
}
.cal-board__filter-more > summary,
.due-board__filter-more > summary,
.customers-filters__more > summary {
  cursor: pointer; list-style: none; font-size: .85rem; font-weight: 700;
  color: var(--link); padding: 8px 0; min-height: 44px;
  display: inline-flex; align-items: center; gap: 6px;
}
.cal-board__filter-more > summary::-webkit-details-marker,
.due-board__filter-more > summary::-webkit-details-marker,
.customers-filters__more > summary::-webkit-details-marker { display: none; }
.cal-board__filter-more > summary::after,
.due-board__filter-more > summary::after,
.customers-filters__more > summary::after { content: "▾"; font-size: .75em; opacity: .7; }
.cal-board__filter-more[open] > summary::after,
.due-board__filter-more[open] > summary::after,
.customers-filters__more[open] > summary::after { content: "▴"; }
.cal-board__filter-more-body,
.due-board__filter-more-body,
.customers-filters__more-body {
  display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end;
  padding: 4px 0 2px;
}
.page-actions {
  margin: 0 0 1rem;
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
}
.page-actions--after-list { margin-top: 1.25rem; }
.muted--after-list { margin-top: 1rem; }
.page-actions__link {
  color: var(--link); font-weight: 700; text-decoration: none;
}
.page-actions__link:visited { color: var(--link); }
.page-actions__link:hover { text-decoration: underline; }
.customers-filters {
  margin-bottom: 1rem;
  display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end;
}
main a:not(.btn):visited {
  color: var(--link);
}
.cal-board__filters {
  display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end;
  margin-bottom: 16px;
}
.cal-board__filters .field--inline {
  display: flex; flex-direction: column; gap: 4px; margin: 0;
}
.cal-board__filters select {
  font: inherit; padding: 8px 10px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--card); color: var(--ink); min-width: 8rem;
}
.cal-board__body {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.cal-board__main { min-width: 0; width: 100%; }
.cal-unscheduled {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 14px 16px;
  box-shadow: var(--sh-1);
}
.cal-unscheduled__head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-bottom: 4px;
}
.cal-unscheduled__title { margin: 0; font-size: 1rem; }
.cal-unscheduled__count {
  font-weight: 700; font-size: .9rem; color: var(--accent);
  background: var(--accent-tint); padding: 2px 9px; border-radius: 999px;
}
.cal-unscheduled__hint { margin: 0 0 12px; font-size: .78rem; line-height: 1.5; }
.cal-unscheduled__list {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 10px;
}
.cal-unscheduled__item {
  padding: 10px 12px; border-radius: 10px; background: var(--paper);
  border: 1px solid var(--line);
}
.cal-unscheduled__item--draggable {
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
}
.cal-unscheduled__item.is-dragging {
  opacity: .55;
  cursor: grabbing;
}
.cal-unscheduled__link {
  display: block; font-weight: 700; font-size: .88rem; color: var(--ink);
  text-decoration: none; overflow-wrap: anywhere;
}
.cal-unscheduled__link:hover { color: var(--primary); }
.cal-unscheduled__meta {
  display: flex; flex-wrap: wrap; gap: 4px 8px; margin-top: 4px; font-size: .75rem;
}
.cal-unscheduled__empty {
  padding: 8px 0; font-size: .85rem;
  grid-column: 1 / -1;
}
.cal-unscheduled__more {
  display: inline-block; margin-top: 12px; font-size: .82rem; font-weight: 700;
  color: var(--link); text-decoration: none;
}
.cal-unscheduled__more:hover { text-decoration: underline; }
.cal-unscheduled__more-btn { margin-top: 12px; }
.cal-unscheduled__due {
  display: flex; gap: 6px; align-items: center; margin-top: 8px;
}
.cal-unscheduled__due .due-quick__input { flex: 1 1 auto; min-width: 0; }
.cal-grid { display: flex; flex-direction: column; gap: 6px; }
.cal-grid__weekdays, .cal-grid__week {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px;
}
.cal-grid__wd {
  text-align: center; font-size: .82rem; font-weight: 700;
  color: var(--muted); padding: 6px 4px;
}
.cal-grid__day {
  min-height: 118px; padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius); background: var(--card);
}
.cal-grid__day--drop {
  outline: 2px solid var(--primary);
  background: color-mix(in srgb, var(--primary) 12%, var(--card));
}
.cal-grid--week .cal-grid__day { min-height: 168px; }
.cal-grid__day--today { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.cal-grid__day--empty { background: transparent; border-color: transparent; }
.cal-grid__day--has { background: color-mix(in srgb, var(--card) 92%, var(--primary)); }
.cal-grid__daynum {
  display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
  font-size: .92rem; font-weight: 700; margin-bottom: 6px;
  color: var(--ink); text-decoration: none;
}
.cal-grid__daynum:hover { color: var(--primary); }
.cal-grid__daymon { font-weight: 500; color: var(--muted); font-size: .75rem; }
.cal-grid__daycount {
  margin-inline-start: auto;
  font-size: .68rem; font-weight: 700;
  background: var(--primary); color: #fff;
  border-radius: 999px; padding: 0 7px; line-height: 1.45;
}
.cal-grid__tasks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.cal-grid__task {
  display: flex; flex-direction: column; gap: 1px;
  font-size: .78rem; line-height: 1.35;
  text-decoration: none; color: var(--ink);
  padding: 4px 6px; border-radius: 6px; background: var(--surface, #f3ebdc);
  border-inline-start: 3px solid transparent;
}
.cal-grid__task-title {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal-grid__task-who {
  font-size: .68rem; color: var(--muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal-grid__task--high { background: #fef3c7; }
.cal-grid__task--urgent { background: #fde8e8; color: #9b1c1c; font-weight: 700; }
.cal-grid__task--st-returned { border-inline-start-color: var(--warn); }
.cal-grid__task--st-done_pending { border-inline-start-color: var(--pending); }
.cal-grid__task--st-open { border-inline-start-color: var(--primary); }
.cal-grid__task--overdue {
  outline: 1px solid var(--warn);
  color: var(--warn-ink);
  font-weight: 700;
}
.cal-grid__more {
  display: block; font-size: .72rem; font-weight: 700;
  color: var(--link); padding: 2px 4px; text-decoration: none;
}
.cal-grid__more:hover { text-decoration: underline; }

.cal-day-list {
  display: flex; flex-direction: column; gap: 8px;
  max-width: 720px;
}
.cal-day-card {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 10px; padding: 12px 14px;
  border-inline-start: 3px solid var(--primary);
  box-shadow: var(--sh-1);
}
.cal-day-card--returned { border-inline-start-color: var(--warn); }
.cal-day-card--done_pending { border-inline-start-color: var(--pending); }
.cal-day-card--overdue { border-inline-start-color: var(--warn); }
.cal-day-card__title {
  display: block; font-weight: 700; font-size: 1rem;
  color: var(--ink); text-decoration: none; margin-bottom: 8px;
}
.cal-day-card__title:hover { color: var(--primary); }
.cal-day-card__meta {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  font-size: .78rem; color: var(--muted);
}
.cal-day-card__who, .cal-day-card__proj { font-weight: 600; }

@media (min-width: 1100px) {
  .cal-grid__day { min-height: 136px; padding: 10px; }
  .cal-grid--week .cal-grid__day { min-height: 200px; }
  .cal-grid__daynum { font-size: 1rem; }
  .cal-grid__task { font-size: .82rem; padding: 5px 7px; }
  .cal-grid__weekdays, .cal-grid__week { gap: 8px; }
}
@media (max-width: 720px) {
  .wrap--calendar {
    padding-inline: calc(12px + var(--safe-right)) calc(12px + var(--safe-left));
  }
  .cal-grid { gap: 3px; }
  .cal-grid__weekdays, .cal-grid__week { gap: 3px; }
  .cal-grid__wd { font-size: .72rem; padding: 4px 2px; }
  .cal-grid__day { min-height: 64px; padding: 4px; }
  .cal-grid--week .cal-grid__day { min-height: 96px; }
  .cal-grid__daynum { font-size: .78rem; margin-bottom: 3px; }
  .cal-grid__task { font-size: .65rem; padding: 2px 4px; }
  .cal-grid__task-who { display: none; }
  .cal-unscheduled__list { grid-template-columns: 1fr; }
}
.tag--returned { background: var(--warn-soft); color: var(--warn-ink); }
.tag--returned::before { background: var(--warn); }
.tag--delegate { background: var(--chip-bg); color: var(--muted); }
.tag--delegate::before { opacity: .35; }
.tag--inbox {
  background: transparent; color: var(--muted); font-weight: 600;
  border: 1px solid var(--line); padding-inline: 7px;
}
.tag--inbox::before { display: none; }
.task--approve .tag--inbox { background: var(--pending-soft); color: var(--pending-ink); border-color: transparent; }

.return { position: relative; width: 100%; }
.return summary { list-style: none; }
.return summary::-webkit-details-marker { display: none; }
.return__form { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.return__form input {
  font: inherit; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--input-bg); color: var(--ink);
  min-height: var(--touch-min); width: 100%;
}

.empty {
  color: var(--muted); background: var(--card); border: 1px dashed var(--line-strong);
  border-radius: var(--r-lg); padding: 28px 20px; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  box-shadow: var(--sh-1); line-height: 1.7;
}
.empty__title { margin: 0; font-weight: 700; font-size: 1.02rem; color: var(--ink); }
.empty__hint { margin: 0; max-width: 36ch; font-size: .9rem; }
.empty__actions {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  margin-top: 6px;
}
/* لیست‌های تو در تو: empty داخل li بدون double-card شلوغ */
.search-results__item > .empty,
.list__item > .empty,
li > .empty {
  width: 100%; box-sizing: border-box;
}

/* --- حالت خالی/خوش‌آمد (اولین‌ورود) --- */
.welcome {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--sh-1); padding: 32px 22px; text-align: center;
}
.welcome__mark {
  width: 48px; height: 48px; margin: 0 auto 12px; border-radius: 14px;
  background: linear-gradient(145deg, var(--primary) 0%, var(--primary-strong) 100%);
  box-shadow: var(--sh-2);
  position: relative;
}
.welcome__mark::after {
  content: ""; position: absolute; inset: 14px 12px 18px;
  border: 3px solid #fff; border-top: 0; border-radius: 0 0 4px 4px;
  opacity: .92;
}
.welcome__title { font-size: 1.2rem; margin: 0 0 8px; }
.welcome__text { color: var(--muted); font-size: .92rem; line-height: 1.9; margin: 0 auto 12px; max-width: 48ch; }
.welcome__examples-intro { color: var(--muted); font-size: .78rem; margin: 0 auto 10px; max-width: 48ch; }
.welcome__examples {
  display: flex; flex-direction: column; gap: 8px; align-items: stretch;
  max-width: 48ch; margin: 0 auto;
}
.welcome__example {
  display: flex; flex-direction: column; gap: 5px; align-items: stretch;
  width: 100%; text-align: start; font: inherit; color: var(--ink);
  background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
  padding: 12px 16px; cursor: pointer; overflow-wrap: anywhere;
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.welcome__example:hover { background: var(--pending-soft); border-color: var(--accent); }
.welcome__example:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.welcome__example-label { font-size: .72rem; color: var(--muted); font-weight: 400; }
.welcome__example-text { font-weight: 700; }

.footlinks { margin-top: 30px; text-align: center; color: var(--muted); font-size: .82rem; display: flex; gap: 10px; justify-content: center; }
.footlinks a { color: var(--link); text-decoration: none; }
/* روی موبایل botnav جایگزین این پیوندهاست؛ نمایش‌شان زیر نوار شلوغ و تکراری است */
@media (max-width: 767.98px) {
  .footlinks { display: none; }
}

@media (max-width: 640px) {
  .task { flex-direction: column; align-items: stretch; gap: 12px; }
  .task__actions { min-width: 0; width: 100%; gap: 14px; }
  .task__actions .btn,
  .task__actions .btn--lg,
  .task-actions .btn,
  .task-actions .btn--lg { width: 100%; }
  .task-actions { width: 100%; gap: 14px; }
  .composer { flex-direction: column; }
  .composer .btn { width: 100%; }
}

/* ===================================================================
   دسترس‌پذیری — skip-link، focus سراسری، متن فقط برای صفحه‌خوان
   =================================================================== */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; inset-inline-start: 8px; top: -48px; z-index: 100;
  background: var(--primary); color: #fff; padding: 10px 16px; border-radius: 9px;
  text-decoration: none; font-weight: 700; transition: top .15s ease;
}
.skip-link:focus { top: calc(8px + var(--safe-top)); }

/* حلقهٔ فوکوس یکدست و قابل‌دیدن روی همهٔ عناصر تعاملی */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
  border-radius: 6px;
}

/* ===================================================================
   دکمهٔ بزرگ برای کاربر کم‌سواد (لمس راحت، متن درشت‌تر)
   =================================================================== */
.btn--lg {
  min-height: 52px; padding: 13px 22px; font-size: 1.02rem; border-radius: 12px;
}

/* ===================================================================
   پنل درون‌صفحه‌ای «برداشت→تأیید» (به‌جای پیام فلش)
   =================================================================== */
.proposal {
  background: var(--card); border: 1px solid var(--line);
  border-inline-start: 4px solid var(--accent);
  border-radius: var(--r-lg); box-shadow: var(--sh-2);
  padding: 16px 16px 14px; margin-bottom: 20px;
}
.proposal__label { font-size: .95rem; font-weight: 700; margin-bottom: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; line-height: 1.45; }
.proposal__badge {
  background: var(--accent); color: #fff; border-radius: 8px;
  font-size: .72rem; padding: 3px 10px; font-weight: 700;
}
.proposal__card {
  margin: 0 0 14px; display: flex; flex-direction: column; gap: 8px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
  padding: 12px 14px;
}
.proposal__row { display: flex; gap: 10px; }
.proposal__row dt { flex: 0 0 56px; color: var(--muted); font-size: .82rem; margin: 0; font-weight: 700; }
.proposal__row dd { flex: 1; min-width: 0; margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.proposal__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.proposal__actions--col { flex-direction: column; }
.proposal__actions form { margin: 0; }
.proposal__actions--col form { width: 100%; }
.proposal__actions > form:first-child { flex: 1 1 12rem; }
.proposal__actions > form:first-child .btn { width: 100%; }
.proposal__hint { color: var(--muted); font-size: .8rem; margin: 12px 2px 0; line-height: 1.55; }
.proposal__hint b { color: var(--ink); }

/* ===================================================================
   وضعیت کارت‌ها — مرز رنگی گویاتر
   =================================================================== */
.task--waiting { border-inline-start: 4px solid var(--pending); }
.task--returned { border-inline-start: 4px solid var(--warn); }

/* ===================================================================
   استپر عمودی وضعیت (partial فقط‌خواندنی) — HTML/CSS خالص، RTL
   =================================================================== */
.track { margin-top: 10px; }
.track > summary {
  cursor: pointer; color: var(--link); font-size: .82rem; font-weight: 700;
  list-style: none; display: inline-flex; align-items: center; gap: 6px; padding: 4px 2px;
}
.track > summary::-webkit-details-marker { display: none; }
.track > summary::before { content: "▸"; font-size: .7em; transition: transform .15s ease; }
.track[open] > summary::before { transform: rotate(-90deg); }

.stepper { list-style: none; margin: 10px 0 4px; padding: 0 4px; }
.step { position: relative; display: flex; gap: 12px; padding-bottom: 16px; }
/* خط عمودی رابط بین گام‌ها (سمت راست در RTL) */
.step::before {
  content: ""; position: absolute; top: 22px; bottom: 0;
  inset-inline-start: 10px; width: 2px; background: var(--line);
}
.step--last::before { display: none; }
.step__dot {
  flex: 0 0 22px; width: 22px; height: 22px; border-radius: 999px;
  background: var(--chip-bg); color: var(--muted); border: 2px solid var(--line);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .72rem; z-index: 1; line-height: 1;
}
.step--current .step__dot { background: var(--primary); color: #fff; border-color: var(--primary); }
.step--returned .step__dot { background: var(--warn-soft); color: var(--warn-ink); border-color: var(--warn); }
.step__body { flex: 1; min-width: 0; padding-top: 1px; }
.step__head { font-size: .9rem; overflow-wrap: anywhere; }
.step__pos { font-weight: 700; }
.step__holder { color: var(--muted); font-weight: 400; }
.step__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 3px; font-size: .76rem; color: var(--muted); }
.step__verb { border-radius: 999px; padding: 1px 8px; font-weight: 700; background: var(--chip-bg); color: var(--muted); }
.step__verb--approve { background: var(--ok-soft); color: var(--ok-ink); }
.step__verb--inform { background: var(--pending-soft); color: var(--pending-ink); }
.step__badge { background: var(--primary); color: #fff; border-radius: 999px; padding: 1px 8px; font-weight: 700; }
.step--returned .step__verb { background: var(--warn-soft); color: var(--warn-ink); }
.step__note { font-size: .78rem; color: var(--warn-ink); margin-top: 4px; }
.stepper__empty { color: var(--muted); font-size: .82rem; }

/* ===================================================================
   صفحهٔ آفلاین
   =================================================================== */
.offline-card { max-width: 420px; margin: 8vh auto 0; text-align: center; }
.offline-card__logo {
  width: 72px; height: 72px; border-radius: 18px; margin: 0 auto 10px;
  padding: 10px; box-sizing: border-box;
  box-shadow: var(--sh-2); display: block; object-fit: contain; background: var(--bg);
}
.offline-card__brand {
  margin: 0 0 6px; font-weight: 800; font-size: 1.15rem;
  color: var(--primary); letter-spacing: .04em;
}
.offline-card__icon { font-size: 2.6rem; margin-bottom: 8px; }
.offline-card__title { font-size: 1.25rem; margin: 0 0 8px; color: var(--ink); }
.offline-card__text { color: var(--muted); font-size: .92rem; margin: 0 0 18px; line-height: 1.75; }
.body--offline { background: var(--bg); }
.body--offline .topbar { background: var(--primary); }

/* ===================================================================
   حالت تیره — override توکن‌ها؛ همهٔ کنتراست‌ها WCAG AA (راستی‌آزمایی‌شده)
   =================================================================== */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f1c1d;
    --paper: #0f1c1d;
    --surface: #162628;
    --card: #1c2f31;
    --elevated: #24383a;
    --ink: #eef6f6;
    --muted: #9bb0b1;
    --line: #2d4446;
    --line-strong: #3d585a;
    --primary: #4aa0a4;
    --primary-dark: #3a8589;
    --primary-strong: #3a8589;
    --primary-tint: #1a3032;
    --on-primary: #0f1c1d;
    --accent: #e0a57a;
    --accent-tint: #3a2a20;
    --ok: #3d8f5c;      --ok-ink: #8fd9ab;   --ok-soft: #1c3224;
    --warn: #d05a4f;    --warn-ink: #ff9a8f; --warn-soft: #3a2320;
    --pending: #d49a45; --pending-ink: #e6b877; --pending-soft: #33291a;
    --info: #4aa0a4;    --info-ink: #8cc8cb; --info-soft: #1a3032;
    --btn-bg: #24383a;
    --chip-bg: #24383a;
    --input-bg: #142224;
    --code-bg: #24383a;
    --link: #7ec4c7;
    --placeholder: #8aa0a1;
    --sh-1: 0 1px 2px rgba(0,0,0,.45);
    --sh-2: 0 1px 2px rgba(0,0,0,.45), 0 2px 10px rgba(0,0,0,.38);
    --sh-3: 0 12px 30px rgba(0,0,0,.55), 0 3px 8px rgba(0,0,0,.4);
    --shadow: var(--sh-2);
  }
  .btn:hover { filter: brightness(1.12); }
  .proposal__card { background: #162628; }
  .topbar { border-bottom-color: var(--accent); }
  .brand__mark { background: var(--card); }
}

/* ===================================================================
   چیدمان دسکتاپ — کارتابلِ ایمیل‌وارِ دو‌ستونه (تجربهٔ متمایز دسکتاپ ≥۱۰۲۴px)
   ستون اصلی سیالِ «کارهای من» (راست در RTL) + ریلِ باریکِ «منتظر تأیید شما» (چپ).
   موبایل/تبلت دست‌نخورده تک‌ستون می‌ماند؛ جای‌گذاری با grid-column، ترتیب DOM = ترتیب بصری.
   =================================================================== */
@media (min-width: 1024px) {
  .wrap--board { max-width: 1060px; }
  .topbar__in { max-width: 1060px; }   /* هم‌راستایی برند/خروج با ستون‌ها */

  .cartable {
    display: grid;
    grid-template-columns: minmax(0, 720px);
    justify-content: center;
    gap: 20px 24px;
    align-items: start;
  }
  .cartable > .cartable__hero { grid-column: 1 / -1; margin-bottom: 0; }
  .cartable__composer { grid-column: 1 / -1; }
  .cartable__composer .composer__hint { margin-bottom: 0; }
  .cartable__composer .composer__examples { margin-bottom: 0; }
  .cartable > .proposal   { grid-column: 1 / -1; margin-bottom: 0; }
  .cartable > .cartable__tools { grid-column: 1 / -1; margin-bottom: 0; }
  .cartable > .block      { grid-column: 1 / -1; margin-bottom: 0; }

  .block--inbox .task--approve .task__actions { flex-direction: row; flex-wrap: wrap; }
}

/* ===================================================================
   کاهش حرکت — احترام به prefers-reduced-motion
   =================================================================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===================================================================
   فاز ۰٫۲ — پنل جزئیات کارت (Trello-like) + آپلود عکس
   =================================================================== */
body:has(.task-detail) { overflow: hidden; }

.task__link {
  color: inherit; text-decoration: none; display: block;
}
.task__link:hover .task__title { color: var(--link); }
.task__link:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 6px; }

.task-detail {
  position: fixed; inset: 0; z-index: 200;
  display: flex; justify-content: flex-start; align-items: stretch;
}
.task-detail__backdrop {
  position: absolute; inset: 0; background: rgba(15, 22, 33, .45);
  border: 0; cursor: default;
}
.task-detail__panel {
  position: relative; z-index: 1; width: min(100%, 520px); max-width: 100%;
  background: var(--elevated); border-inline-start: 1px solid var(--line);
  box-shadow: var(--sh-3); display: flex; flex-direction: column;
  max-height: 100%; overflow: hidden;
}
.task-detail__head {
  padding: 16px 18px 14px; border-bottom: 1px solid var(--line);
  flex: 0 0 auto; background: var(--card);
}
.task-detail__close {
  display: inline-flex; align-items: center; gap: 4px;
  color: var(--muted); text-decoration: none;
  font-size: .85rem; font-weight: 700; margin-bottom: 10px;
  padding: 4px 0;
}
.task-detail__close:hover { color: var(--ink); }
.task-detail__title { margin: 0 0 10px; font-size: 1.22rem; overflow-wrap: anywhere; line-height: 1.4; }
.task-detail__meta { display: flex; flex-wrap: wrap; gap: 6px; }
.task-detail__body {
  flex: 1 1 auto; overflow-y: auto; padding: 14px 18px 28px;
  padding-bottom: calc(28px + var(--safe-bottom));
  background: var(--surface);
}
.task-detail__section {
  margin-bottom: 14px; background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r); padding: 14px 14px 12px; box-shadow: var(--sh-1);
}
.task-detail__section-title {
  font-size: .9rem; margin: 0 0 10px; display: flex; align-items: center; gap: 8px;
  color: var(--muted); font-weight: 700; letter-spacing: .01em;
}
.task-detail__text, .task-detail__note { margin: 0; font-size: .92rem; overflow-wrap: anywhere; }
.task-detail__note { color: var(--warn-ink); }

.detail-facts { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.detail-facts__row { display: flex; gap: 10px; font-size: .88rem; }
.detail-facts__row dt { flex: 0 0 56px; color: var(--muted); margin: 0; }
.detail-facts__row dd { flex: 1; margin: 0; font-weight: 700; overflow-wrap: anywhere; }

.attach-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.attach-list__item { display: flex; flex-direction: column; gap: 4px; }
.attach-list__thumb {
  display: block; border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--line); max-width: 280px;
}
.attach-list__thumb img { display: block; width: 100%; height: auto; }
.attach-list__file { color: var(--link); font-weight: 700; text-decoration: none; }
.attach-list__meta { font-size: .76rem; }
.attach-form, .collab-form, .subtask-form, .create-task-form, .search-form, .checklist-form, .recurrence-form {
  display: flex; flex-direction: column; gap: 10px; margin-top: 10px;
}
.collab-list, .subtask-list, .search-results {
  list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px;
}
.search-results__item {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 12px 14px;
}
.subtask-list__item a, .search-results__item a { font-weight: 700; color: var(--link); text-decoration: none; }
.progress {
  position: relative; margin-top: 10px; height: 22px; border-radius: 999px;
  background: var(--btn-bg); overflow: hidden; border: 1px solid var(--line);
}
.progress__bar {
  height: 100%; background: var(--ok); border-radius: 999px; min-width: 0;
  transition: width .2s ease;
}
.progress__label {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: .72rem; font-weight: 700; color: var(--ink);
}
.block--create {
  margin-bottom: 16px; background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 12px 14px; box-shadow: var(--shadow);
}
.block--create > summary { cursor: pointer; font-weight: 700; list-style: none; }
.block--create > summary::-webkit-details-marker { display: none; }

.activity-feed { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.activity-feed__item {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 10px 12px;
}
.activity-feed__item--system { border-inline-start: 3px solid var(--line); }
.activity-feed__item--comment { border-inline-start: 3px solid var(--primary); }
.activity-feed__head { display: flex; justify-content: space-between; gap: 8px; font-size: .76rem; color: var(--muted); margin-bottom: 4px; }
.activity-feed__who { font-weight: 700; color: var(--ink); }
.activity-feed__body { margin: 0; font-size: .88rem; overflow-wrap: anywhere; white-space: pre-line; }
.activity-feed__empty { list-style: none; }

.comment-form { display: flex; flex-direction: column; gap: 8px; }
.comment-form__input {
  font: inherit; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--input-bg); color: var(--ink); resize: vertical; min-height: 56px;
}
.comment-form__input:focus { outline: 2px solid var(--primary); outline-offset: 1px; }

.done-form { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.task-actions { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.task-actions__primary,
.task-actions__secondary { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.task-actions__toggle {
  width: 100%;
  min-height: var(--touch-min);
  list-style: none;
  cursor: pointer;
  touch-action: manipulation;
}
.task-actions__toggle::-webkit-details-marker { display: none; }
.return > summary.task-actions__toggle { display: inline-flex; }
.task-actions--panel { gap: 14px; }
.task-actions--panel .btn--lg { width: 100%; }
.return__form {
  display: flex; flex-direction: column; gap: 8px; margin-top: 8px;
  padding: 10px; border-radius: 10px; background: var(--surface);
  border: 1px solid var(--line);
}
.return__form input {
  font: inherit; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--input-bg); color: var(--ink);
  min-height: var(--touch-min); width: 100%;
}
.task-detail__section--actions {
  background: var(--primary-tint); border: 1px solid var(--line);
  border-radius: var(--r); padding: 14px; margin-bottom: 14px;
  box-shadow: none;
}
.task-detail__section--actions .task-detail__section-title { color: var(--primary); }
.task-detail__collab-done { margin-bottom: 1rem; }
.task-detail__collab-done .btn--lg { width: 100%; }
.task-detail__hint {
  background: var(--ok-soft); color: var(--ok-ink); border-radius: var(--radius);
  padding: 12px 14px; font-size: .9rem; font-weight: 700; margin: 0 0 16px;
}
.photo-field { display: flex; flex-direction: column; gap: 4px; }
.photo-field__label { font-size: .76rem; color: var(--muted); font-weight: 700; }
.photo-field__input {
  font: inherit; font-size: .82rem; padding: 8px; border: 1px dashed var(--line);
  border-radius: 9px; background: var(--paper); color: var(--ink); max-width: 100%;
}
/* پوشش فارسی روی «Choose File» مرورگر — خودِ input شفاف روی دکمه */
.file-fa {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; max-width: 100%;
}
.file-fa__btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 10px 14px; border-radius: 10px;
  background: var(--surface); border: 1px solid var(--line-strong);
  color: var(--ink); font: inherit; font-weight: 700; font-size: .88rem;
  pointer-events: none;
}
.file-fa__name {
  font-size: .78rem; color: var(--muted); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; max-width: 14rem;
}
.file-fa input[type="file"] {
  position: absolute; inset: 0; opacity: 0; cursor: pointer;
  width: 100%; height: 100%; font-size: 0;
}
.photo-field .file-fa { width: 100%; }
.photo-field .file-fa__btn { background: var(--paper); border-style: dashed; }

@media (min-width: 768px) {
  .task-detail { justify-content: flex-end; }
  .task-detail__panel { border-radius: var(--radius) 0 0 var(--radius); }
}

@media (max-width: 520px) {
  .task-detail__panel { width: 100%; border-inline-start: 0; }
}

/* --- ناوبری بالا --- */
.topbar__nav-wrap {
  display: flex; flex-wrap: nowrap; align-items: center;
  justify-content: flex-start; gap: 4px; min-width: 0;
  padding-top: 4px; border-top: 1px solid rgba(255,250,244,.14);
}
.topbar__nav {
  display: flex; flex-wrap: nowrap; gap: 4px; align-items: center;
  /* رشد نکن — وگرنه در بردِ عریض «بیشتر» به لبهٔ مخالف پرتاب می‌شود */
  flex: 0 1 auto; min-width: 0;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.topbar__nav::-webkit-scrollbar { display: none; }
.topbar__nav a {
  color: var(--on-primary); text-decoration: none; font-size: .84rem; opacity: .88;
  padding: 10px 12px; border-radius: 10px; line-height: 1.35;
  white-space: nowrap; flex: 0 0 auto;
  min-height: var(--touch-min); display: inline-flex; align-items: center;
  touch-action: manipulation;
}
.topbar__nav a:hover { opacity: 1; background: rgba(255,250,244,.10); }
.topbar__nav a.is-active,
.topbar__nav a[aria-current="page"] {
  opacity: 1; background: var(--accent); font-weight: 700; color: #fff;
}
.topbar__install {
  font: inherit; font-size: .82rem; color: var(--on-primary); background: transparent;
  border: 1px solid rgba(255,250,244,.28); border-radius: 999px; padding: 3px 10px;
  cursor: pointer; opacity: .9; line-height: 1.4; width: 100%; text-align: start;
}
.topbar__install:hover { opacity: 1; background: var(--primary-dark); }
.topbar__install[hidden] { display: none !important; }

.topbar__more {
  position: relative; flex: 0 0 auto; margin-inline-start: 2px;
}
.topbar__more > summary {
  list-style: none; cursor: pointer; color: var(--on-primary); font-size: .84rem; opacity: .88;
  padding: 10px 12px; border-radius: 10px; line-height: 1.35; user-select: none;
  white-space: nowrap; display: inline-flex; align-items: center; gap: 4px;
  min-height: var(--touch-min); touch-action: manipulation;
}
.topbar__more > summary::-webkit-details-marker { display: none; }
.topbar__more > summary::after { content: "▾"; font-size: .7em; opacity: .75; }
.topbar__more[open] > summary,
.topbar__more > summary:hover { opacity: 1; background: rgba(255,250,244,.12); }
/* fixed: تا overflow ناو و body--tg پنل را نبرد (به‌ظاهر «کار نمی‌کند») */
.topbar__more-panel {
  position: fixed; z-index: 400; inset-inline-end: 12px; top: 0;
  min-width: 11rem; max-width: min(18rem, calc(100vw - 24px));
  max-height: min(70vh, calc(100dvh - 72px));
  overflow-y: auto; overscroll-behavior: contain;
  padding: 8px; display: flex; flex-direction: column; gap: 2px;
  background: var(--primary); border: 1px solid rgba(255,250,244,.18);
  border-radius: 12px; box-shadow: var(--sh-3);
  color: var(--on-primary);
}
.topbar__more:not([open]) > .topbar__more-panel { display: none; }
.topbar__more-panel a {
  display: flex; align-items: center; border-radius: 8px; padding: 10px 12px !important;
  color: var(--on-primary); text-decoration: none; font-size: .84rem; opacity: .92;
  min-height: var(--touch-min); touch-action: manipulation;
}
.topbar__more-panel a:hover { opacity: 1; background: rgba(255,250,244,.12); }
.topbar__more-panel .topbar__install {
  margin: 4px 0 0; border-radius: 8px; padding: 8px 10px;
}

/* ── ناوبری پایین موبایل (bottom-nav) — دسترسی شست ── */
.botnav {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 90;
  display: flex; justify-content: space-around; align-items: stretch;
  background: var(--card); border-top: 1px solid var(--line);
  padding-bottom: var(--safe-bottom);
  box-shadow: 0 -1px 2px rgba(16,32,48,.06);
  max-height: calc(64px + var(--safe-bottom));
  overflow: hidden;
}
.botnav__item {
  flex: 1 1 0; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 3px; padding: 8px 4px 6px;
  color: var(--muted); text-decoration: none; font-size: .68rem; font-weight: 700;
  min-height: 54px; max-height: 64px; min-width: 0; overflow: hidden;
  touch-action: manipulation;
}
.botnav__item--btn {
  appearance: none; background: transparent; border: 0; font: inherit;
  cursor: pointer; color: inherit;
}
.botnav__icon {
  width: 24px !important; height: 24px !important;
  max-width: 24px; max-height: 24px;
  display: block; flex: 0 0 24px;
}
.botnav__label { line-height: 1; flex: 0 0 auto; }
.botnav__item.is-active { color: var(--accent); }
.botnav__item.is-active .botnav__icon { stroke-width: 2.1; color: var(--accent); }
.botnav__item:active { background: var(--surface); }
.botnav__item:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; border-radius: 8px; }
/* در دسکتاپ نویگیشن بالا کافی است */
@media (min-width: 768px) { .botnav { display: none !important; } }
/* در اتاق گفتگو (composer پایین) و صفحات ورود مخفی تا تداخل نکند؛ لیست گفتگو بات‌نَو دارد */
.body--tg-room .botnav, .body--auth .botnav { display: none !important; }
.body--tg-room .botnav-sheet, .body--auth .botnav-sheet { display: none !important; }
/* فضای امن برای محتوا تا نوار پایین چیزی را نپوشاند (فقط موبایل) */
@media (max-width: 767.98px) {
  .wrap { padding-bottom: calc(76px + var(--safe-bottom)); }
  /* لیست گفتگو هم بات‌نَو دارد؛ اتاق گفتگو نه */
  .body--tg:not(.body--tg-room) .wrap--tg {
    padding-bottom: calc(76px + var(--safe-bottom));
  }
}

.botnav-sheet {
  border: 0; border-radius: 16px 16px 0 0; padding: 0;
  width: min(100vw, 420px); max-width: 100%; margin: auto 0 0;
  background: var(--card); color: var(--ink);
  box-shadow: 0 -8px 28px rgba(16,32,48,.18);
}
.botnav-sheet:not([open]) { display: none; }
.botnav-sheet[open] {
  display: flex; flex-direction: column;
  max-height: min(85dvh, 560px);
}
.botnav-sheet::backdrop { background: rgba(15, 28, 29, .48); }
.botnav-sheet__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 14px 16px 8px; border-bottom: 1px solid var(--line);
}
.botnav-sheet__title { margin: 0; font-size: 1rem; }
.botnav-sheet__close {
  appearance: none; border: 0; background: transparent; color: var(--muted);
  font-size: 1.1rem; line-height: 1; padding: 6px 8px; cursor: pointer; border-radius: 8px;
}
.botnav-sheet__close:hover { background: var(--surface); color: var(--ink); }
.botnav-sheet__nav {
  display: flex; flex-direction: column; padding: 8px 10px calc(14px + var(--safe-bottom));
  gap: 2px; overflow-y: auto; min-height: 0; flex: 1 1 auto;
}
.botnav-sheet__nav a,
.botnav-sheet__install {
  display: block; width: 100%; text-align: start; text-decoration: none;
  color: var(--ink); font: inherit; font-weight: 700; font-size: .95rem;
  padding: 14px 12px; border-radius: 12px; border: 0; background: transparent; cursor: pointer;
}
.botnav-sheet__nav a:hover,
.botnav-sheet__install:hover { background: var(--surface); }
.botnav-sheet__install[hidden] { display: none !important; }
.botnav-sheet__jump {
  display: block; width: 100%; text-align: start; text-decoration: none;
  color: var(--accent); font: inherit; font-weight: 800; font-size: .95rem;
  padding: 14px 12px; border-radius: 12px; border: 0; background: var(--surface); cursor: pointer;
  margin-bottom: 4px;
}

/* گروه‌بندی منوی «بیشتر» (IA یک خانه، سه در) */
.nav-more-group {
  display: flex; flex-direction: column; gap: 2px;
  margin-top: 8px; padding-top: 8px;
  border-top: 1px solid rgba(255,250,244,.14);
}
.nav-more-group:first-of-type { margin-top: 4px; padding-top: 0; border-top: 0; }
.nav-more-group__label {
  margin: 0 0 2px; padding: 4px 12px 2px;
  font-size: .72rem; font-weight: 800; letter-spacing: .02em;
  opacity: .72; color: inherit;
}
.botnav-sheet__nav .nav-more-group {
  border-top-color: var(--line);
  margin-top: 10px; padding-top: 10px;
}
.botnav-sheet__nav .nav-more-group:first-of-type { margin-top: 6px; padding-top: 0; border-top: 0; }
.botnav-sheet__nav .nav-more-group__label { color: var(--muted); opacity: 1; }
.nav-more-group--advanced .nav-more-group__label { opacity: .85; }

/* hub فروش — اکشن‌های اصلی + ابزارهای جمع‌شونده */
.sales-hub-tabs {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin: 0 0 12px; padding: 4px;
  border: 1px solid var(--line); border-radius: 12px;
  background: color-mix(in srgb, var(--primary) 8%, var(--card));
}
.sales-hub-tabs__item {
  flex: 1 1 5.5rem;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: var(--touch-min); padding: 8px 10px;
  border-radius: 10px; font-weight: 700; font-size: .88rem;
  color: var(--muted); text-decoration: none; touch-action: manipulation;
}
.sales-hub-tabs__item:hover { color: var(--ink); background: color-mix(in srgb, var(--card) 70%, transparent); }
.sales-hub-tabs__item.is-active {
  background: var(--card); color: var(--primary-strong, var(--primary));
  box-shadow: var(--sh-1);
}
.sales-hub-tabs__badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.35rem; height: 1.35rem; padding: 0 5px;
  border-radius: 999px; font-size: .72rem; font-weight: 800;
  background: var(--accent); color: #fff; line-height: 1;
}
.sales-hub-actions {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  margin: 0 0 10px;
}
.sales-tools {
  margin: 0 0 14px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--card); padding: 0;
}
.sales-tools__sum {
  list-style: none; cursor: pointer; font-weight: 700; font-size: .9rem;
  padding: 12px 14px; min-height: var(--touch-min);
  display: flex; align-items: center; touch-action: manipulation;
  color: var(--ink);
}
.sales-tools__sum::-webkit-details-marker { display: none; }
.sales-tools__sum::after {
  content: "▾"; margin-inline-start: auto; opacity: .55; font-size: .85em;
}
.sales-tools[open] > .sales-tools__sum::after { content: "▴"; }
.sales-tools__body {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 0 14px 14px; margin: 0;
}
.cartable__truth-hint {
  margin: 0 0 12px; font-size: .88rem; color: var(--muted); line-height: 1.65; max-width: 52ch;
}
.table-view__advanced-note {
  margin: 0 0 12px; font-size: .88rem; color: var(--muted); line-height: 1.65; max-width: 48ch;
}

.topbar__jump {
  appearance: none; border: 1px solid rgba(255,250,244,.28); background: rgba(255,250,244,.08);
  color: var(--on-primary); font: inherit; font-size: .78rem; font-weight: 700;
  padding: 10px 12px; border-radius: 8px; cursor: pointer; white-space: nowrap;
  margin-inline-start: 6px;
  min-height: var(--touch-min); display: inline-flex; align-items: center;
  touch-action: manipulation;
}
.topbar__jump:hover { background: rgba(255,250,244,.16); }
@media (max-width: 767.98px) {
  .topbar__jump { display: none; }
}

.jump-palette {
  border: 0; border-radius: 16px; padding: 0;
  width: min(100vw - 24px, 480px); max-width: 100%;
  background: var(--card); color: var(--ink);
  box-shadow: 0 16px 48px rgba(16,32,48,.28);
}
.jump-palette:not([open]) { display: none; }
.jump-palette[open] { display: flex; flex-direction: column; max-height: min(80dvh, 560px); }
.jump-palette::backdrop { background: rgba(15, 28, 29, .48); }
.jump-palette__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 14px 16px 8px;
}
.jump-palette__title { margin: 0; font-size: 1rem; }
.jump-palette__close {
  appearance: none; border: 0; background: transparent; color: var(--muted);
  font-size: 1.1rem; line-height: 1; padding: 6px 8px; cursor: pointer; border-radius: 8px;
}
.jump-palette__input {
  margin: 0 16px; width: calc(100% - 32px); box-sizing: border-box;
  border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px;
  font: inherit; font-size: 1rem; background: var(--paper); color: var(--ink);
}
.jump-palette__hint { padding: 6px 16px 8px; font-size: .78rem; }
.jump-palette__results {
  overflow-y: auto; padding: 4px 10px calc(14px + var(--safe-bottom));
  display: flex; flex-direction: column; gap: 2px; min-height: 0; flex: 1 1 auto;
}
.jump-palette__group {
  margin: 8px 6px 2px; font-size: .72rem; font-weight: 800; color: var(--muted);
  text-transform: none; letter-spacing: 0;
}
.jump-palette__item {
  display: flex; flex-direction: column; gap: 2px; text-decoration: none;
  color: var(--ink); padding: 10px 12px; border-radius: 10px;
}
.jump-palette__item:hover,
.jump-palette__item.is-active { background: var(--surface); }
.jump-palette__item-label { font-weight: 700; font-size: .92rem; }
.jump-palette__item-meta { font-size: .78rem; color: var(--muted); }
.jump-palette__empty { padding: 16px 12px; color: var(--muted); font-size: .9rem; }

.record-bridges {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  margin: 0.5rem 0 1rem;
}
.record-bridges__btn {
  display: inline-flex; align-items: center;
  padding: 8px 12px; border-radius: 10px; font-size: .84rem; font-weight: 700;
  text-decoration: none; color: var(--primary); background: var(--surface);
  border: 1px solid var(--line);
}
.record-bridges__btn:hover { border-color: var(--primary); }
.record-bridges__hint { font-size: .82rem; }

/* صفحات تنظیمات پیشرفته */
.page-back {
  display: inline-flex; align-items: center; gap: 4px;
  color: var(--link); text-decoration: none; font-size: .88rem; font-weight: 700;
  margin: 0 0 10px; min-height: 40px;
}
.page-back:visited { color: var(--link); }
.page-back:hover { text-decoration: underline; }
.page-back::before { content: "›"; font-size: 1.1em; line-height: 1; }
.settings-intro { margin: 0 0 8px; max-width: 58ch; line-height: 1.7; }
.settings-nav {
  display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px;
}
.settings-nav a {
  display: inline-flex; align-items: center;
  padding: 6px 12px; border-radius: 999px; font-size: .82rem; font-weight: 700;
  text-decoration: none; color: var(--ink); background: var(--card);
  border: 1px solid var(--line);
}
.settings-nav a:hover { border-color: var(--primary); color: var(--primary); }
.settings-section {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 16px 16px 18px; margin-bottom: 18px;
}
.settings-section .block__title { margin-bottom: 8px; }
.settings-section > .muted:first-of-type { margin-top: 0; }
.settings-section .form { margin-top: 14px; }
.settings-section .search-results { margin-top: 12px; }
.settings-section .search-results__item {
  box-shadow: none; background: var(--paper);
}
.settings-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: .5rem; align-items: center; }
.settings-actions__inline { display: inline-flex; margin: 0; }
.person-assignments {
  margin-top: 10px; padding: 10px 12px; border-radius: 12px;
  background: var(--surface); border: 1px solid var(--line);
}
.person-assignments__title {
  margin: 0 0 8px; font-size: .82rem; font-weight: 700; color: var(--muted);
}
.person-assignments__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.person-assignment {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 8px; padding: 8px 10px; border-radius: 10px; background: var(--card);
  border: 1px solid var(--line);
}
.person-assignment--primary { border-color: var(--primary); }
.person-assignment__label { font-weight: 700; font-size: .9rem; }
.person-assignment__badge {
  display: inline-block; margin-inline-start: 6px; font-size: .68rem; font-weight: 700;
  padding: 1px 7px; border-radius: 999px; background: var(--primary-tint); color: var(--primary);
  vertical-align: middle;
}
.person-assignment__actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.person-assignments__empty { margin: 0 0 8px; font-size: .85rem; }
.person-assignments__add {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px;
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line);
}
.person-assignments__add .field--inline { flex: 1 1 14rem; margin: 0; min-width: 0; }
.person-assignments__add .field--inline select { width: 100%; }
.person-assignments__add .field--check { margin: 0 0 4px; }

.position-edit {
  margin-top: 8px;
}
.position-edit > summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  width: fit-content;
}
.position-edit > summary::-webkit-details-marker { display: none; }
.position-edit__form {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
}
.position-edit__form .field { margin-bottom: 10px; }
@media (max-width: 640px) {
  .position-edit__form {
    padding: 10px;
  }
  .position-edit > summary {
    min-height: 44px;
    align-items: center;
  }
}
.settings-leads-form {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px;
  margin-top: .35rem; width: 100%;
  padding: 8px 10px; border-radius: 10px;
  background: var(--surface); border: 1px solid var(--line);
}
.settings-leads-form__label { font-size: .82rem; font-weight: 700; color: var(--muted); }
.settings-leads-form__opt {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: .85rem; font-weight: 600; cursor: pointer;
}
.settings-empty {
  color: var(--muted); background: var(--paper); border: 1px dashed var(--line);
  border-radius: var(--radius); padding: 16px; text-align: center; font-size: .9rem;
  margin: 12px 0 0;
}
.settings-note { margin: .75rem 0 0; max-width: 58ch; line-height: 1.7; }

.sms-occasion-form {
  display: grid;
  gap: 12px;
  max-width: 40rem;
}
.sms-occasion-form__date {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}
.sms-occasion-form__actions {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.sms-occasion-list {
  list-style: none; margin: 12px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.sms-occasion-list__item {
  display: flex; flex-wrap: wrap; gap: 10px 14px;
  justify-content: space-between; align-items: flex-start;
  padding: 12px 14px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.sms-occasion-list__item.is-inactive { opacity: .72; }
.sms-occasion-list__main { flex: 1 1 16rem; min-width: 0; }
.sms-occasion-list__title { display: block; margin-bottom: 2px; }
.sms-occasion-list__preview {
  margin: 6px 0 0; white-space: pre-wrap; line-height: 1.55; font-size: .88rem;
}
.sms-occasion-list__actions {
  display: flex; flex-wrap: wrap; gap: 6px;
  align-items: center;
}
.sms-occasion-list__actions .btn { min-height: 40px; }
@media (max-width: 640px) {
  .sms-occasion-form__date { grid-template-columns: 1fr; }
  .sms-occasion-list__actions { width: 100%; }
  .sms-occasion-list__actions .btn,
  .sms-occasion-form__actions .btn {
    flex: 1 1 auto; min-height: 44px;
  }
}

/* ========== گفتگو — هویت یکپارچه (نام‌کلاس‌های tg حفظ؛ توکن‌ها روی پالت واحد نگاشت شده‌اند) ========== */
:root {
  --tg-bg: var(--surface);
  --tg-sidebar: var(--card);
  --tg-pane: var(--surface);
  --tg-head: var(--card);
  --tg-line: var(--line);
  --tg-dialog-hover: var(--primary-tint);
  --tg-dialog-active: var(--primary-tint);
  --tg-text: var(--ink);
  --tg-muted: var(--muted);
  --tg-bubble-in: var(--card);
  --tg-bubble-out: var(--primary);   /* حباب خروجی = برند */
  --tg-compose: var(--card);
  --tg-accent: var(--primary);
  --tg-pattern: rgba(32, 108, 112, .06);
}
@media (prefers-color-scheme: dark) {
  :root { --tg-pattern: rgba(238, 246, 246, .04); }
}

.body--tg {
  background: var(--tg-bg);
  display: flex; flex-direction: column;
  height: 100dvh; max-height: 100dvh;
  overflow: hidden;
}
.body--tg .topbar { box-shadow: 0 1px 0 rgba(0,0,0,.15); flex: 0 0 auto; }
.body--tg .wrap--tg {
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.body--tg .wrap--tg > .flash-stack { flex-shrink: 0; margin: 8px 12px 0; }
.wrap--tg {
  max-width: none; margin: 0; padding: 0;
}
.wrap--tg-form {
  max-width: 520px; margin: 0 auto;
  padding: 12px calc(12px + var(--safe-right)) calc(24px + var(--safe-bottom)) calc(12px + var(--safe-left));
}
/* فرم‌های گفتگو (تبدیل به وظیفه، بازارسال، …) باید در body--tg قابل اسکرول باشند */
.body--tg .wrap--tg-form {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.tg-form-sheet {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 14px; box-shadow: var(--shadow);
  /* overflow:hidden قبلی پایین فرم را در موبایل می‌بُرید */
  overflow: visible;
}

.tg {
  display: grid;
  grid-template-columns: 1fr;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  background: var(--tg-bg);
  color: var(--tg-text);
}
@media (min-width: 860px) {
  .tg { grid-template-columns: minmax(280px, 360px) 1fr; }
  .tg-sidebar--desktop { display: flex; }
}
/* specificity با .tg-pane (display:flex) — حتماً دو کلاس تا روی موبایل مخفی بماند */
.tg-pane.tg-pane--placeholder {
  display: none;
  place-items: center;
  background: var(--tg-pane);
}
@media (min-width: 860px) {
  .tg:not(.tg--room) .tg-pane.tg-pane--placeholder { display: grid; }
}

.tg-sidebar {
  display: flex; flex-direction: column;
  background: var(--tg-sidebar);
  border-inline-end: 1px solid var(--tg-line);
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
.tg-sidebar--desktop { display: none; }
@media (min-width: 860px) {
  .tg--room .tg-sidebar--desktop { display: flex; }
}

.tg-sidebar__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--tg-line);
  flex-shrink: 0;
}
.tg-sidebar__title {
  margin: 0; font-size: 1.15rem; font-weight: 700;
  display: flex; align-items: center; gap: 8px;
}
.tg-sidebar__actions { display: flex; gap: 4px; align-items: center; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
.tg-sidebar__list { flex: 1; overflow-y: auto; min-height: 0; }

.tg-cartable-link {
  display: inline-flex; align-items: center; justify-content: center;
  font: inherit; font-size: .78rem; font-weight: 800; text-decoration: none;
  color: var(--tg-accent); padding: 6px 10px; border-radius: 999px;
  border: 1px solid var(--tg-line); background: transparent;
  white-space: nowrap; line-height: 1.2; height: 36px; box-sizing: border-box;
}
.tg-cartable-link:hover { background: var(--tg-dialog-hover); }

.tg-create { position: relative; }
.tg-create__sum { list-style: none; cursor: pointer; }
.tg-create__sum::-webkit-details-marker { display: none; }
.tg-create__panel {
  position: absolute; inset-inline-end: 0; top: calc(100% + 4px); z-index: 40;
  min-width: 11rem; padding: 6px; display: flex; flex-direction: column; gap: 2px;
  background: var(--card); border: 1px solid var(--tg-line);
  border-radius: 12px; box-shadow: var(--sh-3);
}
.tg-create__panel a {
  display: block; padding: 10px 12px; border-radius: 8px;
  text-decoration: none; color: var(--tg-text); font-weight: 700; font-size: .9rem;
}
.tg-create__panel a:hover { background: var(--tg-dialog-hover); }

.tg-filter { display: block; padding: 8px 12px 6px; border-bottom: 1px solid var(--tg-line); flex-shrink: 0; }
.tg-filter__input {
  width: 100%; box-sizing: border-box; font: inherit; font-size: .9rem;
  padding: 8px 12px; border-radius: 10px; border: 1px solid var(--tg-line);
  background: var(--input-bg); color: var(--tg-text);
}
.tg-filter__input:focus { outline: 2px solid var(--accent); outline-offset: 1px; }

.tg-icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--touch-min); height: var(--touch-min); min-width: var(--touch-min); min-height: var(--touch-min);
  border-radius: 50%;
  color: var(--tg-accent); text-decoration: none; background: transparent;
  border: 0; cursor: pointer; font-size: 1.2rem;
  touch-action: manipulation;
}
.tg-icon-btn:hover { background: var(--tg-dialog-hover); }
.tg-icon-form { display: inline-flex; margin: 0; padding: 0; }

/* ردیف فهرست: لینک + آرشیو/بازگردانی + حالت انتخاب */
.tg-dialog-row {
  display: flex; align-items: stretch; gap: 0;
  border-bottom: 1px solid transparent;
  position: relative;
}
.tg-dialog-row:hover { background: var(--tg-dialog-hover); }
.tg-dialog-row--active { background: var(--tg-dialog-active); }
.tg-dialog-row--unread {
  background: color-mix(in srgb, var(--tg-dialog-active) 55%, transparent);
}
.tg-dialog-row .tg-dialog {
  flex: 1; min-width: 0;
  border-bottom: 0;
  background: transparent;
}
.tg-dialog-row .tg-dialog:hover { background: transparent; }
.tg-dialog-row__check {
  display: none;
  align-items: center; justify-content: center;
  flex-shrink: 0; width: 2.5rem;
  margin: 0; cursor: pointer;
}
.tg--selecting .tg-dialog-row__check { display: flex; }
.tg--selecting .tg-dialog-row__action { display: none; }
.tg-dialog-row__cb {
  width: 1.15rem; height: 1.15rem; accent-color: var(--tg-accent);
  cursor: pointer;
}
.tg-dialog-row__action {
  display: flex; align-items: center; flex-shrink: 0;
  margin: 0; padding: 0 8px 0 0;
}
.tg-dialog-row__btn {
  min-height: 44px; min-width: 3.2rem;
  padding: 6px 10px; border: 0; border-radius: 8px;
  background: transparent; color: var(--tg-accent);
  font: inherit; font-size: .78rem; font-weight: 700;
  cursor: pointer; white-space: nowrap;
}
.tg-dialog-row__btn:hover { background: var(--tg-dialog-active); }
@media (min-width: 860px) {
  .tg-dialog-row__btn {
    opacity: 0.55;
  }
  .tg-dialog-row:hover .tg-dialog-row__btn,
  .tg-dialog-row:focus-within .tg-dialog-row__btn {
    opacity: 1;
  }
}

.tg-bulk-bar {
  position: sticky; bottom: 0; z-index: 30;
  flex-shrink: 0;
  margin: 0; padding: 8px 10px calc(8px + var(--safe-bottom, 0px));
  border-top: 1px solid var(--tg-line);
  background: var(--tg-sidebar);
  box-shadow: 0 -6px 16px rgba(0,0,0,.06);
}
.tg-bulk-bar__inner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
}
.tg-bulk-bar__count {
  font-size: .85rem; font-weight: 700; color: var(--tg-text);
  min-width: 4.5rem;
}

.tg-dialog {
  display: flex; gap: 12px; align-items: center;
  padding: 10px 14px; text-decoration: none; color: inherit;
  border-bottom: 1px solid transparent;
}
.tg-dialog:hover { background: var(--tg-dialog-hover); }
.tg-dialog--active { background: var(--tg-dialog-active); }
.tg-dialog__body { flex: 1; min-width: 0; }
.tg-dialog__row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.tg-dialog__title {
  font-weight: 700; font-size: .95rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tg-dialog--unread .tg-dialog__title { font-weight: 800; color: var(--tg-text); }
.tg-dialog__time { font-size: .72rem; color: var(--tg-muted); flex-shrink: 0; }
.tg-dialog__preview {
  font-size: .82rem; color: var(--tg-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1;
}
.tg-dialog--unread .tg-dialog__preview { color: var(--tg-text); font-weight: 600; }
.tg-dialog--unread .tg-dialog__time { color: var(--tg-accent); font-weight: 700; }
.tg-dialog--unread {
  background: color-mix(in srgb, var(--tg-dialog-active) 55%, transparent);
}
.tg-dialog__tag {
  display: inline; font-weight: 700; color: var(--tg-accent); margin-inline-end: 4px;
}
.tg-avatar--email {
  background: #5b8def; font-size: 1.05rem; letter-spacing: 0;
}
.tg-email-subject {
  font-weight: 700; font-size: .88rem; margin-bottom: 4px;
  overflow-wrap: anywhere;
}
.tg-compose--email {
  grid-template-columns: 1fr auto;
  grid-template-areas: "input send";
}
.tg-compose--readonly {
  display: block; text-align: center;
  padding: 14px 16px calc(14px + var(--safe-bottom));
  font-size: .88rem;
}

.tg-chathead__actions {
  display: flex; align-items: center; gap: 2px;
  flex: 0 1 auto; flex-wrap: nowrap; min-width: 0; max-width: 58%;
}
.tg-chathead__more-mobile { display: none; }
@media (max-width: 767.98px) {
  /* متن‌های نوار اتاق فضای نام مخاطب را صفر می‌کردند */
  .tg-chathead__actions { max-width: none; flex: 0 0 auto; }
  .tg-chathead__pri,
  .tg-chathead__actions .tg-members,
  .tg-chathead__actions > .tg-archive,
  .tg-chathead__actions .tg-icon-form:not(#chatNotifyForm) {
    display: none !important;
  }
  .tg-chathead__more-mobile { display: flex; }
}
.tg-chathead .tg-cartable-link { flex-shrink: 0; }
.tg-text-btn {
  font: inherit; font-size: .82rem; font-weight: 700;
  border: 0; background: transparent; color: var(--tg-accent);
  padding: 10px 12px; border-radius: 8px; cursor: pointer;
  white-space: nowrap; flex-shrink: 0; text-decoration: none;
  line-height: 1.3;
  min-height: var(--touch-min);
  display: inline-flex; align-items: center; justify-content: center;
  touch-action: manipulation;
}
.tg-text-btn:hover { background: var(--tg-dialog-hover); }
.tg-text-btn:disabled { opacity: .45; cursor: not-allowed; }

/* منوی ⋯ هدر گفتگو — عملیات فرعی تا روی عنوان نریزند */
.tg-chathead__more { position: relative; flex-shrink: 0; }
.tg-chathead__more > summary {
  list-style: none; cursor: pointer; user-select: none;
}
.tg-chathead__more > summary::-webkit-details-marker { display: none; }
.tg-chathead__more-panel {
  position: absolute; inset-inline-end: 0; top: calc(100% + 6px); z-index: 40;
  min-width: 12.5rem; max-width: min(92vw, 20rem);
  padding: 8px; display: flex; flex-direction: column; gap: 2px;
  background: var(--tg-sidebar); border: 1px solid var(--tg-line);
  border-radius: 12px; box-shadow: var(--shadow);
}
.tg-chathead__more-panel .tg-text-btn,
.tg-chathead__more-panel .tg-cartable-link {
  display: block; width: 100%; text-align: start;
  box-sizing: border-box; padding: 8px 10px; border-radius: 8px;
  border: 0; background: transparent; box-shadow: none;
  font: inherit; font-size: .88rem; font-weight: 700;
  color: var(--tg-accent); text-decoration: none; cursor: pointer;
}
.tg-chathead__more-panel .tg-text-btn:hover,
.tg-chathead__more-panel .tg-cartable-link:hover {
  background: var(--tg-dialog-hover);
}
.tg-chathead__more-panel .tg-archive-form {
  display: flex; flex-direction: column; align-items: stretch; gap: 6px;
  width: 100%; padding: 4px 2px;
}
.tg-chathead__more-panel .tg-archive-form__select { max-width: none; width: 100%; }
.tg-chathead__more-row { width: 100%; }
.tg-chathead__more-sep {
  height: 1px; margin: 6px 4px; background: var(--tg-line);
}
.tg-chathead__more-label {
  margin: 2px 8px 4px; font-size: .72rem; font-weight: 700;
}
.tg-chathead__members {
  list-style: none; margin: 0; padding: 0 2px 4px;
  max-height: 40vh; overflow-y: auto;
}
.tg-chathead__members .tg-member {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 6px; font-size: .88rem;
}

.tg-sheet {
  border: 0; padding: 0; border-radius: 16px 16px 0 0;
  width: min(100vw, 520px); max-height: min(92vh, 720px);
  background: var(--tg-sidebar); color: var(--tg-text);
  box-shadow: var(--shadow);
}
.tg-sheet::backdrop { background: rgba(0,0,0,.45); }
.tg-sheet__form {
  display: flex; flex-direction: column; gap: 10px;
  padding: 12px 14px calc(14px + var(--safe-bottom));
  max-height: min(92vh, 720px); overflow-y: auto;
}
.tg-sheet__head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.tg-sheet__title { margin: 0; font-size: 1.05rem; font-weight: 800; }
.tg-sheet__hint { margin: 0; font-size: .8rem; }
.tg-sheet__foot {
  display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px;
}

.tg-contacts {
  display: flex; flex-direction: column; gap: 8px;
  border: 1px solid var(--tg-line); border-radius: 12px; padding: 10px;
  background: var(--tg-pane);
}
.tg-contacts__search {
  width: 100%; font: inherit; padding: 8px 12px; border-radius: 10px;
  border: 1px solid var(--tg-line); background: var(--tg-compose); color: var(--tg-text);
}
.tg-contacts__list {
  max-height: 180px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 2px;
}
.tg-contacts__item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: "kind label channel" "kind sub channel";
  gap: 0 8px; align-items: center;
  text-align: start; font: inherit; color: inherit;
  border: 0; background: transparent; border-radius: 10px;
  padding: 8px 10px; cursor: pointer;
}
.tg-contacts__item:hover { background: var(--tg-dialog-hover); }
.tg-contacts__item--on { background: var(--tg-dialog-active); }
.tg-contacts__kind {
  grid-area: kind; font-size: .65rem; font-weight: 800;
  color: var(--tg-accent); min-width: 2.6rem;
}
.tg-contacts__label { grid-area: label; font-weight: 700; font-size: .88rem; }
.tg-contacts__sub { grid-area: sub; font-size: .72rem; }
.tg-contacts__channel { grid-area: channel; font-size: .68rem; }
.tg-contacts__empty { margin: 8px; font-size: .85rem; }
.tg-contacts__selected {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.tg-contacts__new-toggle {
  font: inherit; font-size: .85rem; font-weight: 700;
  border: 0; background: transparent; color: var(--tg-accent);
  padding: 4px 0; cursor: pointer; text-align: start;
}
.tg-contacts__new-field {
  display: flex; gap: 8px; align-items: center;
}
.tg-contacts__new-field .tg-form__input { flex: 1; }

.tg-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 8px; border-radius: 999px;
  background: var(--tg-dialog-active); font-size: .75rem; font-weight: 700;
}
.tg-chip__x {
  border: 0; background: transparent; color: inherit;
  cursor: pointer; font-size: 1rem; line-height: 1; padding: 0 2px;
}

.tg-btn {
  font: inherit; font-weight: 700; font-size: .9rem;
  border: 0; border-radius: 10px; padding: 10px 16px;
  background: var(--tg-accent); color: #fff; cursor: pointer;
}
.tg-btn:hover { filter: brightness(1.06); }
.tg-btn--ghost {
  background: transparent; color: var(--tg-text);
  border: 1px solid var(--tg-line);
}
.tg-btn--sm { padding: 8px 12px; font-size: .82rem; }
.tg-form__input--area { min-height: 110px; resize: vertical; }
.tg-form__actions {
  display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px;
}
.tg-compose__attach--inline {
  width: auto; height: auto; border-radius: 10px;
  padding: 8px 10px; gap: 8px; justify-content: flex-start;
  color: var(--tg-text); background: var(--tg-dialog-hover);
}

.tg-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.35em; height: 1.35em; padding: 0 6px; border-radius: 999px;
  background: var(--tg-accent); color: #fff; font-size: .72rem; font-weight: 700;
  flex-shrink: 0;
}
.tg-badge--head { font-size: .7rem; }

.tg-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .85rem; color: #fff; flex-shrink: 0;
  letter-spacing: -.02em;
  overflow: hidden;
}
.tg-avatar--sm { width: 32px; height: 32px; font-size: .7rem; }
.tg-avatar--photo { padding: 0; background: #dce3eb; }
.tg-avatar--photo img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
/* پالت آواتار هم‌راستا با رها (فیروزه / سفال / کرم) — بدون بنفش تلگرامی */
.tg-avatar--tone-0 { background: #206c70; }
.tg-avatar--tone-1 { background: #d08c60; }
.tg-avatar--tone-2 { background: #3a8589; }
.tg-avatar--tone-3 { background: #b8734a; }
.tg-avatar--tone-4 { background: #175458; }
.tg-avatar--tone-5 { background: #c9a078; }
.tg-avatar--tone-6 { background: #4aa0a4; }
.tg-avatar--tone-7 { background: #8a5a3a; }

.tg-avatar-wrap {
  position: relative;
  flex-shrink: 0;
  display: inline-flex;
}
.tg-presence {
  position: absolute;
  bottom: 0;
  inset-inline-end: 0;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #22c55e;
  border: 2px solid var(--tg-sidebar, var(--card));
  box-sizing: border-box;
  pointer-events: none;
}
.tg-avatar-wrap:has(.tg-avatar--sm) .tg-presence {
  width: 9px;
  height: 9px;
  border-width: 1.5px;
}
.tg-presence-label {
  color: #22c55e;
  font-weight: 700;
  font-size: .75rem;
}
.tg-presence-label--sm {
  font-size: .68rem;
  margin-inline-start: 4px;
}
.tg-members li {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.tg-name--tone-0 { color: #e17076; }
.tg-name--tone-1 { color: #7bc862; }
.tg-name--tone-2 { color: #c9a227; }
.tg-name--tone-3 { color: #65aadd; }
.tg-name--tone-4 { color: #a695e7; }
.tg-name--tone-5 { color: #ee7aae; }
.tg-name--tone-6 { color: #6ec9cb; }
.tg-name--tone-7 { color: #faa774; }

.tg-empty { text-align: center; padding: 40px 20px; color: var(--tg-muted); }
.tg-empty .empty__title,
.tg-empty__title { margin: 0 0 6px; font-size: 1.05rem; font-weight: 700; color: var(--tg-text); }
.tg-empty .empty__hint,
.tg-empty__hint { margin: 0; font-size: .88rem; max-width: 36ch; display: inline-block; }
.tg-empty .empty__actions,
.tg-empty__actions {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  margin: 14px 0 0;
}
.tg-empty__illus { font-size: 2.5rem; margin-bottom: 10px; opacity: .7; }

.tg-pane {
  display: flex; flex-direction: column;
  min-height: 0; min-width: 0; height: 100%;
  overflow: hidden;
  background: var(--tg-pane);
  background-image:
    radial-gradient(var(--tg-pattern) 1px, transparent 1px);
  background-size: 18px 18px;
}
.tg-chathead {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; background: var(--tg-head);
  border-bottom: 1px solid var(--tg-line); flex-shrink: 0;
  min-width: 0; overflow: visible;
}
.tg-chathead__back { transform: scaleX(-1); flex-shrink: 0; }
@media (min-width: 860px) {
  .tg-chathead__back { display: none; }
}
.tg-chathead__meta {
  flex: 1 1 auto; min-width: 0; overflow: hidden;
}
.tg-chathead__title {
  font-weight: 700; font-size: 1rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tg-chathead__sub {
  font-size: .75rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tg-chathead > .tg-avatar,
.tg-chathead > .tg-avatar-wrap { flex-shrink: 0; }
@media (max-width: 520px) {
  .tg-chathead__pri { padding-inline: 6px; font-size: .78rem; }
}
@media (max-width: 767.98px) {
  .tg-chathead__meta { flex: 1 1 0; }
}

.tg-members { position: relative; }
.tg-members__panel {
  position: absolute; inset-inline-end: 0; top: 100%; z-index: 5;
  min-width: 220px; margin-top: 6px; padding: 10px;
  background: var(--tg-sidebar); border: 1px solid var(--tg-line);
  border-radius: 12px; box-shadow: var(--shadow);
}
.tg-members__panel ul { list-style: none; margin: 0; padding: 0; }
.tg-members__panel li {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 4px; font-size: .88rem;
}
.tg-members__add {
  display: flex; gap: 6px; align-items: center; margin-top: 8px;
  padding-top: 8px; border-top: 1px solid var(--tg-line);
}
.tg-members__notify {
  margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--tg-line);
}
.tg-members__notify-label {
  margin: 0; font-size: .86rem; font-weight: 700; color: var(--tg-text);
}
.tg-members__select {
  flex: 1; font: inherit; font-size: .82rem; padding: 6px 8px;
  border-radius: 8px; border: 1px solid var(--tg-line); background: var(--input-bg);
  color: var(--tg-text); min-width: 0;
}

.tg-thread {
  flex: 1; overflow-y: auto; min-height: 0;
  padding: 12px 12px 8px;
  display: flex; flex-direction: column; gap: 6px;
  /* stretch نکن: در موبایل/Safari ردیف تمام‌عرض می‌شود و هر دو حباب راست می‌چسبند */
  align-items: flex-start;
}

/* عرض = خود حباب؛ طرفین با margin فیزیکی (مثل تلگرام: ارسالی راست، دریافتی چپ) */
.tg-msg {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  width: fit-content;
  max-width: min(85%, 480px);
  box-sizing: border-box;
  flex: 0 0 auto;
}
/* ارسالی → راست فیزیکی صفحه */
.tg-msg--out {
  margin-left: auto;
  margin-right: 0;
  /* در RTL، flex-start = راست؛ در LTR با margin-left:auto هم راست می‌ماند */
  align-self: flex-start;
  flex-direction: row;
}
/* دریافتی → چپ فیزیکی صفحه؛ direction:ltr تا آواتار بیرون (چپ) بماند */
.tg-msg--in {
  margin-left: 0;
  margin-right: auto;
  /* در RTL، flex-end = چپ */
  align-self: flex-end;
  flex-direction: row;
  direction: ltr;
}
.tg-msg--in .tg-bubble {
  direction: rtl;
  text-align: start;
}
.tg-msg--flash .tg-bubble {
  outline: 2px solid var(--tg-accent); outline-offset: 2px;
}
.tg-quote-ref {
  display: block; text-decoration: none; color: inherit;
  margin: 0 0 6px; padding: 6px 8px; border-radius: 8px;
  border-inline-start: 3px solid var(--tg-accent);
  background: rgba(0,0,0,.06); font-size: .82rem; line-height: 1.35;
}
.tg-bubble--out .tg-quote-ref { background: rgba(255,255,255,.12); border-color: #cfe2ff; }
.tg-quote-ref__who { display: block; font-weight: 800; opacity: .9; margin-bottom: 2px; }
.tg-quote-ref__body { display: block; opacity: .85; overflow-wrap: anywhere; }
.tg-forward-ref {
  margin: 0 0 6px; padding: 6px 8px; border-radius: 8px;
  border-inline-start: 3px solid var(--primary);
  background: rgba(32, 108, 112, .08); font-size: .82rem; line-height: 1.35;
}
.tg-bubble--out .tg-forward-ref { background: rgba(255,255,255,.12); border-color: #9fd4d6; }
.tg-forward-ref__who { display: block; font-weight: 800; opacity: .9; margin-bottom: 2px; }
.tg-forward-ref__body { display: block; opacity: .85; overflow-wrap: anywhere; }
.tg-task-ref { color: var(--tg-accent); font-weight: 700; text-decoration: underline; }
.tg-bubble--out .tg-task-ref { color: #cfe2ff; }
.tg-task-ref--chip {
  display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 4px 6px;
  max-width: 100%; margin: 1px 0; padding: 2px 8px; border-radius: 8px;
  text-decoration: none; font-weight: 700; line-height: 1.35;
  background: rgba(32, 108, 112, .1); border: 1px solid rgba(32, 108, 112, .22);
  vertical-align: baseline;
}
.tg-bubble--out .tg-task-ref--chip {
  background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.28); color: #fff;
}
.tg-task-ref__id { font-variant-numeric: tabular-nums; opacity: .9; }
.tg-task-ref__title { font-weight: 700; overflow-wrap: anywhere; }
.tg-task-ref__status {
  font-size: .72em; font-weight: 800; opacity: .85;
  padding: 1px 6px; border-radius: 999px;
  background: rgba(0,0,0,.06);
}
.tg-bubble--out .tg-task-ref__status { background: rgba(255,255,255,.16); }
.tg-task-ref--open .tg-task-ref__status { color: #0b6e4f; background: rgba(11,110,79,.12); }
.tg-task-ref--returned .tg-task-ref__status { color: #9a3412; background: rgba(154,52,18,.12); }
.tg-task-ref--done_pending .tg-task-ref__status { color: #92400e; background: rgba(146,64,14,.12); }
.tg-task-ref--closed .tg-task-ref__status { color: #475569; background: rgba(71,85,105,.12); }
.tg-bubble--out .tg-task-ref--open .tg-task-ref__status,
.tg-bubble--out .tg-task-ref--returned .tg-task-ref__status,
.tg-bubble--out .tg-task-ref--done_pending .tg-task-ref__status,
.tg-bubble--out .tg-task-ref--closed .tg-task-ref__status { color: #fff; }
.tg-task-card__status { font-weight: 800; }
.tg-task-card__status--open { color: #0b6e4f; }
.tg-task-card__status--returned { color: #9a3412; }
.tg-task-card__status--done_pending { color: #92400e; }
.tg-task-card__status--closed { color: #64748b; }
.tg-bubble--out .tg-task-card__status { color: #cfe2ff; }
.tg-bubble__later-form { display: inline; margin: 0; padding: 0; }
.tg-bubble__task--reply,
.tg-bubble__task--later,
.tg-bubble__task--forward {
  appearance: none; border: 0; background: transparent; cursor: pointer;
  font: inherit; font-size: .72rem; font-weight: 700;
  color: var(--tg-accent); padding: 2px 0; text-decoration: none;
}
.tg-bubble--out .tg-bubble__task--reply,
.tg-bubble--out .tg-bubble__task--later,
.tg-bubble--out .tg-bubble__task--forward { color: #cfe2ff; }
.tg-bubble {
  max-width: min(100%, 420px); padding: 6px 10px 4px;
  border-radius: 14px; font-size: .92rem; line-height: 1.45;
  box-shadow: 0 1px 1px rgba(0,0,0,.08);
  position: relative;
}
.tg-bubble--in {
  background: var(--tg-bubble-in); color: var(--tg-text);
  border-bottom-left-radius: 4px;
}
.tg-bubble--out {
  background: var(--tg-bubble-out); color: var(--on-primary);
  border-bottom-right-radius: 4px;
}
.tg-bubble__name { font-size: .78rem; font-weight: 700; margin-bottom: 2px; }
.tg-bubble__text { white-space: pre-wrap; overflow-wrap: anywhere; }
.tg-bubble__meta {
  text-align: end; font-size: .68rem; color: var(--tg-muted);
  margin-top: 4px; line-height: 1.35;
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: flex-end; gap: 6px 10px;
}
.tg-bubble--out .tg-bubble__meta { color: rgba(255,255,255,.72); }
.tg-bubble__meta time { margin-inline-start: 0; flex: 0 0 auto; }
.tg-bubble__actions {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px;
}
@media (max-width: 767.98px) {
  .tg-bubble__actions {
    gap: 8px 12px;
    margin-top: 4px;
    width: 100%;
    justify-content: flex-start;
  }
  .tg-bubble__actions .tg-bubble__task,
  .tg-bubble__actions .tg-text-btn {
    font-size: .78rem;
    padding: 4px 0;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
  }
}
.tg-bubble__read {
  font-size: .68rem; font-weight: 700; opacity: .9;
  white-space: nowrap;
}
.tg-bubble__read--done { opacity: 1; }
.tg-bubble__read--sent { opacity: .75; }
.tg-bubble__task {
  font-size: .72rem; font-weight: 700; text-decoration: none;
  color: var(--tg-accent); padding: 2px 0;
}
.tg-bubble--out .tg-bubble__task { color: #cfe2ff; }
.tg-bubble__task--make { opacity: .85; }
.tg-bubble__task--make:hover { opacity: 1; text-decoration: underline; }

.tg-bubble--announce {
  border: 1px solid var(--warn, #c9a227);
  background: linear-gradient(180deg, rgba(201,162,39,.12), transparent);
  max-width: min(92%, 480px);
}
.tg-bubble--announce.tg-bubble--out {
  background: linear-gradient(180deg, rgba(255,255,255,.18), var(--tg-bubble-out));
}
.tg-bubble__announce-label {
  font-size: .68rem; font-weight: 800; letter-spacing: .02em;
  text-transform: none; opacity: .85; margin-bottom: 4px;
}
.tg-compose__announce {
  display: flex; align-items: center; gap: 4px;
  font-size: .75rem; color: var(--tg-muted); white-space: nowrap;
  padding: 0 4px; cursor: pointer;
}
.tg-compose__announce input { accent-color: var(--warn, #c9a227); }

/* بلوک گفتگو روی جزئیات وظیفه */
.task-chat { display: flex; flex-direction: column; gap: 10px; margin-bottom: 12px; }
.task-chat__msg {
  padding: 10px 12px; border-radius: var(--radius);
  background: var(--surface, var(--card)); border: 1px solid var(--line);
}
.task-chat__head {
  display: flex; justify-content: space-between; gap: 8px;
  font-size: .8rem; margin-bottom: 4px;
}
.task-chat__who { font-weight: 700; }
.task-chat__quote {
  font-size: .78rem; border-inline-start: 3px solid var(--line);
  padding-inline-start: 8px; margin-bottom: 6px;
}
.task-chat__body { margin: 0; font-size: .9rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.task-chat__reply { display: flex; flex-direction: column; gap: 8px; }
.task-chat__reply textarea {
  width: 100%; min-height: 56px; resize: vertical;
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 8px 10px; font: inherit;
}

/* Catch Up */
.catchup { max-width: 720px; margin: 0 auto; padding: 16px 0 48px; }
.catchup__head { margin-bottom: 20px; }
.catchup__title { margin: 8px 0 4px; font-size: 1.35rem; }
.catchup__sub { margin: 0; font-size: .9rem; }
.catchup__topics { display: flex; flex-direction: column; gap: 14px; margin-bottom: 24px; }
.catchup__topic {
  padding: 14px 16px; border-radius: var(--radius);
  border: 1px solid var(--line); background: var(--card);
}
.catchup__topic h2 { margin: 0 0 8px; font-size: 1.05rem; }
.catchup__topic ul { margin: 0; padding-inline-start: 1.2rem; }
.catchup__actions h2 { font-size: 1.05rem; margin: 0 0 6px; }
.catchup__action-list { list-style: none; padding: 0; margin: 12px 0 16px; display: flex; flex-direction: column; gap: 10px; }
.catchup__action { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.catchup__card {
  display: flex; flex-direction: column; gap: 12px;
  padding: 14px 16px; border-radius: var(--radius);
  border: 1px solid var(--line); background: var(--card);
  border-inline-start: 4px solid var(--accent);
}
.catchup__card-title { margin: 0; font-weight: 700; line-height: 1.45; }
.catchup__card-hint { margin: 6px 0 0; font-size: .85rem; line-height: 1.45; }
.catchup__card-actions {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch;
}
.catchup__card-actions form { margin: 0; }
.catchup__card-actions form:first-child { flex: 1 1 8rem; }
.catchup__card-actions form:first-child .btn { width: 100%; }
.catchup__empty { color: var(--muted); }

.ask-ai__form { margin-bottom: 24px; display: flex; flex-direction: column; gap: 10px; }
.ask-ai__result {
  padding: 16px; border-radius: var(--radius);
  border: 1px solid var(--line); background: var(--card);
}
.ask-ai__result--miss { border-color: var(--warn, #c9a227); }
.ask-ai__result h2 { margin: 0 0 8px; font-size: 1.05rem; }
.ask-ai__answer { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.ask-ai__citations { margin: 12px 0 0; padding-inline-start: 1.2rem; color: var(--muted); font-size: .9rem; }
.ask-ai__meta { margin: 12px 0 0; font-size: .8rem; }
.tg-form--inline-ai { margin: 0 0 12px; }
.tg-draft-banner {
  padding: 6px 12px; font-size: .78rem;
  border-bottom: 1px solid var(--tg-line, var(--line));
  background: rgba(0,0,0,.04);
}
.tg-draft-banner[hidden] { display: none !important; }

.tg-bubble--task { padding-bottom: 8px; }
.tg-task-card {
  display: flex; flex-direction: column; gap: 4px;
  text-decoration: none; color: inherit;
  margin: 4px 0 2px; padding: 10px 12px;
  border-radius: 10px;
  background: rgba(31, 58, 95, .12);
  border: 1px solid rgba(31, 58, 95, .22);
}
.tg-bubble--out .tg-task-card {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.28);
  color: #fff;
}
.tg-task-card__label {
  font-size: .7rem; font-weight: 700; letter-spacing: .02em;
  color: var(--tg-accent); text-transform: none;
}
.tg-bubble--out .tg-task-card__label { color: #cfe2ff; }
.tg-task-card__title {
  font-weight: 700; font-size: .95rem; line-height: 1.35;
  overflow-wrap: anywhere;
}
.tg-task-card__meta {
  font-size: .72rem; opacity: .85; line-height: 1.3;
}
.tg-quote {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: 10px; padding: 10px 12px; white-space: pre-wrap;
  max-height: 160px; overflow-y: auto; font-size: .9rem;
}
.tg-quote__from { font-size: .75rem; margin-bottom: 4px; }
.tg-bubble__img-wrap { display: block; margin: 2px 0 4px; }
.tg-bubble__img {
  display: block; max-width: 100%; max-height: 260px;
  border-radius: 10px; object-fit: cover;
}
.tg-bubble__file {
  display: flex; align-items: center; gap: 8px;
  text-decoration: none; color: inherit;
  background: rgba(0,0,0,.12); border-radius: 10px; padding: 8px 10px; margin: 2px 0 4px;
}
.tg-bubble__file-icon { font-size: 1.3rem; }
.tg-bubble__file-name { display: block; font-weight: 700; font-size: .85rem; }
.tg-bubble__file-size { display: block; font-size: .72rem; color: var(--tg-muted); }

.tg-compose {
  display: grid;
  grid-template-columns: auto auto auto 1fr auto;
  grid-template-areas:
    "quote quote quote quote quote"
    "tools tools tools tools tools"
    "picker picker picker picker picker"
    "attach emoji mention input send"
    "file file file file file";
  gap: 6px 8px; align-items: end;
  padding: 8px 10px calc(8px + var(--safe-bottom));
  background: var(--tg-compose); border-top: 1px solid var(--tg-line);
  flex-shrink: 0;
}
.tg-compose__quote {
  grid-area: quote;
  display: flex; align-items: flex-start; gap: 8px;
  padding: 8px 10px; border-radius: 10px;
  background: var(--tg-dialog-hover); border-inline-start: 3px solid var(--tg-accent);
}
.tg-compose__quote[hidden] { display: none !important; }
.tg-compose__quote-body { flex: 1; min-width: 0; font-size: .82rem; line-height: 1.4; }
.tg-compose__quote-who { display: block; font-weight: 800; margin-bottom: 2px; }
.tg-compose__quote-text { display: block; color: var(--tg-muted); overflow-wrap: anywhere; }
.tg-compose__quote-clear {
  appearance: none; border: 0; background: transparent; cursor: pointer;
  color: var(--tg-muted); font-size: 1rem; padding: 2px 6px; border-radius: 6px;
}
.tg-compose__quote-clear:hover { background: var(--card); color: var(--tg-text); }
.tg-compose__attach { grid-area: attach; }
.tg-compose__attach .tg-icon-btn,
.tg-compose__attach {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--touch-min); height: var(--touch-min); border-radius: 50%; color: var(--tg-muted); cursor: pointer;
  touch-action: manipulation;
}
.tg-compose__attach:hover { color: var(--tg-accent); background: var(--tg-dialog-hover); }
.tg-compose__emoji-btn {
  grid-area: emoji;
  appearance: none; border: 0; background: transparent; cursor: pointer;
  width: var(--touch-min); height: var(--touch-min); border-radius: 50%; font-size: 1.25rem; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--tg-muted);
  touch-action: manipulation;
}
.tg-compose__emoji-btn:hover,
.tg-compose__emoji-btn[aria-expanded="true"] {
  background: var(--tg-dialog-hover);
}
.tg-compose__tools {
  grid-area: tools;
  display: flex; align-items: center; gap: 10px;
  min-height: 0;
}
.tg-compose__tools:empty { display: none; }
@media (max-width: 767.98px) {
  /* FAB پشتیبانی سمت شروع؛ لینک «کار جدید» را از زیرش بیرون بکش */
  .tg-compose__tools { padding-inline-start: 52px; }
}
.tg-compose__new-task {
  font-size: .78rem; font-weight: 800; text-decoration: none;
  color: var(--tg-accent); padding: 2px 0;
}
.tg-compose__new-task:hover { text-decoration: underline; }
.tg-compose__mention-btn {
  grid-area: mention;
  appearance: none; border: 0; background: transparent; cursor: pointer;
  width: var(--touch-min); height: var(--touch-min); border-radius: 50%; font-size: 1.05rem; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--tg-muted);
  touch-action: manipulation;
}
.tg-compose__mention-btn:hover,
.tg-compose__mention-btn[aria-expanded="true"] {
  background: var(--tg-dialog-hover); color: var(--tg-accent);
}
.tg-compose__mention-panel {
  grid-area: picker;
  display: flex; flex-direction: column; gap: 6px;
  padding: 8px; border-radius: 12px;
  background: var(--tg-dialog-hover);
  max-height: 220px;
}
.tg-compose__mention-panel[hidden] { display: none !important; }
.tg-compose__mention-search {
  font: inherit; width: 100%; padding: 8px 10px; border-radius: 10px;
  border: 1px solid var(--tg-line); background: var(--card); color: var(--tg-text);
}
.tg-compose__mention-list {
  display: flex; flex-direction: column; gap: 2px;
  overflow-y: auto; max-height: 160px;
}
.tg-compose__mention-item {
  appearance: none; border: 0; background: transparent; cursor: pointer;
  display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center;
  text-align: start; padding: 8px 10px; border-radius: 10px;
  font: inherit; color: var(--tg-text);
}
.tg-compose__mention-item:hover { background: var(--card); }
.tg-compose__mention-id { font-weight: 800; color: var(--tg-accent); }
.tg-compose__mention-title { font-weight: 700; overflow-wrap: anywhere; }
.tg-compose__mention-status {
  font-size: .72rem; font-weight: 800; opacity: .85; white-space: nowrap;
}
.tg-compose__mention-empty { margin: 4px 8px; font-size: .82rem; }
.tg-compose__emoji-panel {
  grid-area: picker;
  display: flex; flex-wrap: wrap; gap: 4px;
  padding: 8px; border-radius: 12px;
  background: var(--tg-dialog-hover);
  max-height: 140px; overflow-y: auto;
}
.tg-compose__emoji-panel[hidden] { display: none !important; }
.tg-compose__emoji-pick {
  appearance: none; border: 0; background: transparent; cursor: pointer;
  width: 36px; height: 36px; border-radius: 8px; font-size: 1.35rem; line-height: 1;
}
.tg-compose__emoji-pick:hover { background: var(--card); }
.tg-compose__input {
  grid-area: input; font: inherit; resize: none; min-height: var(--touch-min); max-height: 120px;
  padding: 10px 14px; border-radius: 21px; border: 0;
  background: var(--tg-dialog-hover); color: var(--tg-text);
}
.tg-compose__input:focus { outline: 3px solid var(--tg-accent); outline-offset: 1px; }
.tg-compose__input::placeholder { color: var(--tg-muted); }
.tg-compose__send {
  grid-area: send; width: var(--touch-min); height: var(--touch-min); border-radius: 50%; border: 0;
  background: var(--tg-accent); color: #fff; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  touch-action: manipulation;
}
.tg-compose__send:hover { filter: brightness(1.08); }
.tg-compose__file-name {
  grid-area: file; font-size: .75rem; padding-inline-start: 50px;
}

.tg-form-sheet__head {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; border-bottom: 1px solid var(--line);
}
.tg-form-sheet__head h1 { margin: 0; font-size: 1.05rem; flex: 1; min-width: 0; }
.tg-form-sheet__head .tg-cartable-link { margin-inline-start: auto; }
.tg-archive-form {
  display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap;
}
.tg-archive {
  display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.tg-archive-more > summary {
  cursor: pointer; list-style: none;
}
.tg-archive-more > summary::-webkit-details-marker { display: none; }
.tg-archive-more[open] .tg-archive-form { margin-top: 6px; }
.tg-folder-nav {
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 8px 12px 4px; border-bottom: 1px solid var(--tg-line);
}
.tg-folder-nav__chip {
  display: inline-flex; align-items: center;
  padding: 10px 14px; border-radius: 999px;
  font-size: .8rem; font-weight: 600;
  text-decoration: none; color: var(--tg-muted, var(--muted));
  border: 1px solid var(--tg-line); background: transparent;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-height: var(--touch-min);
  touch-action: manipulation;
}
.tg-folder-nav__chip:hover { background: var(--tg-dialog-hover); color: var(--tg-text); }
.tg-folder-nav__chip--active {
  background: var(--tg-accent, var(--accent));
  border-color: transparent; color: #fff;
}
.tg-folder-nav__chip--manage { min-width: 1.8rem; justify-content: center; font-weight: 700; }
.tg-folder-manage--inline {
  margin: 0; padding: 6px 12px 8px;
  border-bottom: 1px solid var(--tg-line);
}
.tg-folder-manage--inline .tg-form { padding: 8px 0; }
.tg-archive-form__select {
  font: inherit; font-size: .78rem; max-width: 9rem;
  padding: 4px 6px; border-radius: 8px; border: 1px solid var(--tg-line);
  background: var(--tg-sidebar); color: var(--tg-text);
}
.tg-folder-create__row {
  display: flex; gap: 8px; align-items: stretch;
}
.tg-folder-create__row .tg-form__input { flex: 1; }
.tg-folder-list {
  list-style: none; margin: 16px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.tg-folder-list__link {
  display: flex; justify-content: space-between; align-items: center;
  gap: 10px; padding: 12px 14px; border-radius: 12px;
  text-decoration: none; color: var(--tg-text);
  border: 1px solid var(--tg-line); background: var(--card);
}
.tg-folder-list__link:hover { background: var(--tg-dialog-hover); }
.tg-folder-list__name { font-weight: 700; }
.tg-folder-manage { margin: 0 0 16px; }
.tg-folder-manage > summary { cursor: pointer; margin-bottom: 8px; }
.tg-folder-items { display: flex; flex-direction: column; gap: 6px; }
.tg-folder-item {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; border-radius: 12px;
  border: 1px solid var(--tg-line); background: var(--card);
}
.tg-folder-item__link {
  flex: 1; min-width: 0; text-decoration: none; color: inherit;
  display: flex; flex-direction: column; gap: 2px;
}
.tg-folder-item__title { font-weight: 700; overflow-wrap: anywhere; }
.tg-folder-item__unarchive { flex-shrink: 0; }
.tg-form { padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.tg-form__hint { margin: 0; color: var(--muted); font-size: .88rem; }
.tg-form__label { font-size: .82rem; font-weight: 700; color: var(--muted); }
.tg-form__input {
  font: inherit; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 10px; background: var(--input-bg); color: var(--ink);
}
.tg-pick-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; max-height: 50vh; overflow-y: auto; }
.tg-pick {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 10px; cursor: pointer;
}
.tg-pick:hover { background: var(--paper); }
.tg-pick input { accent-color: var(--primary); }
.tg-pick__meta { display: flex; flex-direction: column; min-width: 0; }
.tg-pick__name { font-weight: 700; }
.tg-pick__sub { font-size: .78rem; }
.btn--block { width: 100%; }

/* ===================================================================
   Epic K — برد Kanban افقی (شبیه ترلو): ستون کنار هم + کارت کوتاه
   =================================================================== */
.wrap--kanban {
  max-width: none;
  padding-inline: 0;
  padding-bottom: calc(24px + var(--safe-bottom));
}
.kanban {
  padding-inline: calc(16px + var(--safe-right)) calc(16px + var(--safe-left));
}
.kanban__head {
  display: flex; flex-wrap: wrap; gap: 12px 20px;
  align-items: flex-end; justify-content: space-between;
  margin: 0 auto 14px; max-width: 1400px;
}
.kanban__kicker {
  margin: 0 0 2px; font-size: .72rem; font-weight: 700;
  color: var(--accent); letter-spacing: .04em;
}
.kanban__title {
  margin: 0; font-size: 1.35rem; font-weight: 700; color: var(--ink);
}
.kanban__hint { margin: 4px 0 0; font-size: .82rem; max-width: 42em; }
.kanban__stale {
  margin: 8px 0 0; font-size: .82rem; font-weight: 600;
  color: var(--warn-ink); background: var(--warn-soft);
  border-radius: 8px; padding: 6px 10px; max-width: 36em;
}
.kanban__actions {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  margin-inline-start: auto;
}
.kanban__filter {
  display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end;
  width: 100%;
}
.kanban__filter .field--inline {
  display: flex; flex-direction: column; gap: 4px; margin: 0;
}
.kanban__filter .field--check {
  flex-direction: row; align-items: center; gap: 8px;
  padding-bottom: 10px;
}
.kanban__filter .field--check input { accent-color: var(--primary); }
.kanban__filter select {
  font: inherit; padding: 8px 10px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--card); color: var(--ink); min-width: 9rem;
}
.kanban__filter-more {
  flex: 1 1 100%; margin: 0; border: 0; padding: 0;
}
.kanban__filter-more > summary {
  list-style: none; cursor: pointer; font-weight: 700; font-size: .88rem;
  color: var(--primary); padding: 8px 0; user-select: none;
  display: inline-flex; align-items: center; gap: 6px;
}
.kanban__filter-more > summary::-webkit-details-marker { display: none; }
.kanban__filter-more > summary::after { content: "▾"; font-size: .75em; opacity: .7; }
.kanban__filter-more[open] > summary::after { content: "▴"; }
.kanban__filter-more__body {
  display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end;
  padding: 4px 0 2px;
}
@media (min-width: 768px) {
  /* دسکتاپ: فیلترها همیشه باز؛ summary مخفی */
  .kanban__filter-more { display: contents; }
  .kanban__filter-more > summary { display: none; }
  .kanban__filter-more__body { display: contents; }
  .cal-board__filter-more,
  .due-board__filter-more,
  .customers-filters__more { display: contents; }
  .cal-board__filter-more > summary,
  .due-board__filter-more > summary,
  .customers-filters__more > summary { display: none; }
  .cal-board__filter-more-body,
  .due-board__filter-more-body,
  .customers-filters__more-body { display: contents; }
}
.hint-touch { display: none; }
.hint-desk { display: inline; }
@media (max-width: 767.98px) {
  .hint-touch { display: inline; }
  .hint-desk { display: none; }
  .cal-board__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
  }
  .cal-board__nav > .view-new-task {
    flex: 1 1 100%;
    min-height: 44px;
    width: 100%;
    justify-content: center;
  }
  .cal-board__nav > .btn:not(.view-new-task) {
    min-height: 44px;
    justify-content: center;
  }
  .cal-board__nav-period,
  .cal-board__nav-tools {
    flex: 1 1 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  .cal-board__nav-tools {
    grid-template-columns: 1fr 1fr;
  }
  .cal-board__nav-period .btn,
  .cal-board__nav-tools .btn {
    min-height: 44px;
    width: 100%;
    justify-content: center;
    text-align: center;
  }
  .cal-board__filters .field--inline { flex: 1 1 calc(50% - 8px); min-width: 8rem; }
  .cal-board__filters select { width: 100%; min-width: 0; }
}

/* ردیف افقی ستون‌ها — هرگز عمودی نشود */
.kanban__board {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 8px calc(16px + var(--safe-right)) 16px calc(16px + var(--safe-left));
  margin-inline: calc(-1 * (16px + var(--safe-right))) calc(-1 * (16px + var(--safe-left)));
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  min-height: min(70vh, 640px);
}
.kanban-col {
  flex: 0 0 280px !important;
  width: 280px;
  max-width: 85vw;
  scroll-snap-align: start;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--sh-1);
  display: flex;
  flex-direction: column;
  max-height: min(72vh, 680px);
  min-height: 220px;
}
.kanban-col__title {
  margin: 0; padding: 12px 12px 10px; font-size: .88rem; font-weight: 700;
  display: flex; align-items: center; gap: 8px;
  background: var(--card);
  border-radius: 14px 14px 0 0;
  border-bottom: 1px solid var(--line);
  flex: 0 0 auto;
}
.kanban-col__dot {
  width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto;
  background: var(--line-strong);
}
.kanban-col--open .kanban-col__dot { background: var(--primary); }
.kanban-col--returned .kanban-col__dot { background: var(--warn); }
.kanban-col--done_pending .kanban-col__dot { background: var(--pending); }
.kanban-col--closed .kanban-col__dot { background: var(--ok); }
.kanban-col--wip {
  border-color: var(--warn);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--warn) 35%, transparent);
}
.kanban-col__wip-badge {
  margin-inline-start: auto;
  font-size: .68rem; font-weight: 700;
  color: var(--warn-ink); background: var(--warn-soft);
  border-radius: 999px; padding: 1px 7px;
}
.kanban-col__wip {
  margin: 0; padding: 4px 12px 8px;
  font-size: .72rem; font-weight: 600; color: var(--warn-ink);
  background: var(--card); border-bottom: 1px solid var(--line);
}
.kanban-col__list {
  flex: 1 1 auto;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transition: background .15s ease;
}
.kanban-col__list.is-over {
  background: var(--pending-soft);
  outline: 2px dashed var(--accent); outline-offset: -4px;
}
.kanban-col__empty {
  margin: 16px 8px; font-size: .82rem; text-align: center;
  padding: 18px 8px; border: 1px dashed var(--line); border-radius: 10px;
}

.kanban-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  box-shadow: var(--sh-1);
  border-inline-start: 3px solid transparent;
  transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.kanban-card:hover { box-shadow: var(--sh-2); }
.kanban-card--movable { cursor: grab; }
.kanban-card--movable:active { cursor: grabbing; }
.kanban-card.is-dragging { opacity: .45; transform: rotate(1.5deg); }
.kanban-card--overdue { border-inline-start-color: var(--warn); }
.kanban-card--returned { border-inline-start-color: var(--warn); }
.kanban-card--pending { border-inline-start-color: var(--pending); }
.kanban-card--closed { border-inline-start-color: var(--ok); opacity: .88; }
.kanban-card__title {
  display: block; font-weight: 700; font-size: .92rem; line-height: 1.4;
  color: var(--ink); text-decoration: none; overflow-wrap: anywhere;
}
.kanban-card__title:hover { color: var(--primary); }
.kanban-card__chips {
  display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px;
}
.kanban-card__chips .tag { font-size: .64rem; }
.kanban-card--child {
  border-inline-start-style: dashed;
  opacity: .96;
}
.kanban-card__meta {
  display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center;
  margin-top: 8px; font-size: .74rem; color: var(--muted);
}
.kanban-card__who {
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.kanban-card__who .tg-avatar { flex-shrink: 0; }

.profile__card {
  display: flex; align-items: center; gap: 14px;
  margin: 12px 0 20px;
}
.profile__name { font-size: 1.1rem; }
.profile__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.profile__links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }

/* --- سفارشی‌سازی منوی بالا --- */
.nav-customize__hint { margin: 0 0 14px; line-height: 1.6; }
.nav-customize__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.nav-customize__row {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--card);
}
.nav-customize__row.is-pinned {
  border-color: color-mix(in srgb, var(--primary) 35%, var(--line));
  background: color-mix(in srgb, var(--primary) 6%, var(--card));
}
.nav-customize__check { flex: 1; min-width: 0; margin: 0; }
.nav-customize__title { font-weight: 400; font-size: .82rem; }
.nav-customize__movers { display: flex; gap: 4px; flex-shrink: 0; }
.nav-customize__movers[hidden] { display: none !important; }
.nav-customize__movers .btn {
  min-width: 44px; min-height: 44px; padding: 8px;
  display: inline-flex; align-items: center; justify-content: center;
}
.nav-customize__count { margin: 10px 0 0; font-size: .85rem; }
.nav-customize__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }

/* --- داشبورد شخصی ویجت‌محور --- */
.dashboard__head {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 14px;
}
.dashboard__head .block__title { margin: 0; }
.dashboard__head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.dashboard__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}
.dashboard__widget {
  grid-column: span var(--dash-span, 1);
  display: flex; flex-direction: column; gap: 8px;
  padding: 12px;
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--card); min-height: 110px;
}
.dashboard__widget--S { --dash-span: 1; }
.dashboard__widget--M { --dash-span: 2; }
.dashboard__widget--L { --dash-span: 4; }
.dashboard__widget.is-dragging { opacity: .55; }
.dashboard__widget.is-drag-over { border-color: color-mix(in srgb, var(--primary) 50%, var(--line)); }
.dashboard__widget-head {
  display: flex; align-items: flex-start; gap: 8px;
}
.dashboard__drag {
  border: 0; background: transparent; color: var(--muted);
  cursor: grab; padding: 0 2px; font-size: 1rem; line-height: 1.2;
}
.dashboard__drag:active { cursor: grabbing; }
.dashboard__widget-titles { flex: 1; min-width: 0; }
.dashboard__widget-title {
  margin: 0; font-size: .95rem; font-weight: 700;
}
.dashboard__widget-headline {
  margin: 2px 0 0; font-size: .78rem; line-height: 1.35;
}
.dashboard__see-all {
  font-size: .78rem; font-weight: 600; white-space: nowrap;
  color: var(--link); text-decoration: none;
}
.dashboard__see-all:hover { text-decoration: underline; }
.dashboard__rows {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.dashboard__row {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 6px 0; border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.dashboard__row:first-child { border-top: 0; padding-top: 0; }
.dashboard__row-main { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dashboard__row-title {
  font-size: .88rem; font-weight: 600; color: inherit; text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
a.dashboard__row-title:hover { color: var(--link); }
.dashboard__row-meta { font-size: .75rem; }
.dashboard__row-actions { display: flex; flex-wrap: wrap; gap: 4px; flex-shrink: 0; }
.dashboard__action-form { margin: 0; }
.dashboard__widget-msg { margin: 0; font-size: .85rem; }
.dashboard__widget-msg--error { color: var(--warn-ink, #8a4b00); }
.dashboard__empty {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  text-align: center; padding: 28px 12px;
}
.dashboard__empty-visual {
  width: 64px; height: 64px; border-radius: 14px;
  display: grid; place-items: center;
  font-size: 1.6rem; color: var(--muted);
  background: color-mix(in srgb, var(--primary) 8%, var(--card));
  border: 1px dashed color-mix(in srgb, var(--primary) 28%, var(--line));
}
.dashboard__empty-title { margin: 0; font-weight: 700; font-size: 1.05rem; }
.dashboard__empty p { margin: 0; max-width: 36rem; }
.dashboard__empty-pack { margin: 0; }
.dashboard__pack-preview { font-size: .85rem; }
.customers-row {
  display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px;
}
.customers-row__main { flex: 1 1 14rem; min-width: 0; }
.customers-row__actions {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center; flex-shrink: 0;
}
.customers-row__touch { margin: 0; }
.customers-suggest {
  margin: 0 0 1rem; padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--line));
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--primary) 8%, var(--card));
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
}
.customers-suggest p { margin: 0; font-weight: 600; }
.customers-suggest__form { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.customers-empty, .phonebook-empty {
  list-style: none; display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 24px 12px; text-align: center;
}
.profile__reminders {
  margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line);
}
.profile__reminders-title { margin: 0 0 .35rem; font-size: 1.05rem; }
.profile__reminders-list { list-style: none; margin: .75rem 0 1rem; padding: 0; display: grid; gap: 8px; }
.dashboard-edit__size {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-inline-start: 1.6rem; font-size: .82rem;
}
.dashboard-edit__size-opt {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 6px; border: 1px solid var(--line); border-radius: 6px;
}
@media (max-width: 767px) {
  .dashboard__grid { grid-template-columns: 1fr; }
  .dashboard__widget--S,
  .dashboard__widget--M,
  .dashboard__widget--L { grid-column: 1 / -1; }
  .dashboard__drag { display: none; }
}

/* کاشی لینک قدیمی (اگر جایی ماند) */
.dashboard__tile {
  display: flex; flex-direction: column; gap: 4px;
  padding: 14px 12px; min-height: 72px;
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--card); color: inherit; text-decoration: none;
}
.dashboard__tile:hover, .dashboard__tile:focus-visible {
  border-color: color-mix(in srgb, var(--primary) 40%, var(--line));
  background: color-mix(in srgb, var(--primary) 6%, var(--card));
}
.dashboard__tile-title { font-weight: 700; font-size: .95rem; }
.dashboard__tile-desc {
  font-size: .78rem; color: var(--muted); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.kanban-card__due {
  background: var(--chip-bg); color: var(--muted);
  border-radius: 999px; padding: 1px 8px; font-weight: 700;
}
.kanban-card__due--late { background: var(--warn-soft); color: var(--warn-ink); }
.kanban-card__project {
  margin-top: 6px; font-size: .72rem; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kanban-card__move-wrap { margin-top: 8px; }
.kanban-card__move-sum {
  cursor: pointer; font-size: .78rem; font-weight: 700; color: var(--link);
  list-style: none;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 40px; min-width: 4.5rem;
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.kanban-card__move-sum::-webkit-details-marker { display: none; }
.kanban-card__move {
  display: flex; gap: 6px; align-items: center; margin-top: 6px;
}
.kanban-card__move select {
  flex: 1; font: inherit; font-size: .78rem; padding: 6px 8px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--input-bg); color: var(--ink); min-width: 0;
}
.btn--sm { padding: 6px 10px; font-size: .8rem; min-height: 36px; }
@media (max-width: 767.98px) {
  .btn--sm { min-height: var(--touch-min); padding: 10px 14px; }
}

.kanban .footlinks {
  max-width: 1400px; margin: 18px auto 0;
  padding-inline: 2px;
}

@media (min-width: 1100px) {
  .kanban-col {
    flex: 1 1 0 !important;
    width: auto;
    min-width: 220px;
    max-width: none;
  }
  /* topbar را عریض نکن — منو باید مثل کارتابل/گفتگو بماند؛ فقط خودِ برد گسترده است */
}

@media (max-width: 767.98px) {
  .kanban-col { flex: 0 0 min(82vw, 300px) !important; width: min(82vw, 300px); }
  .wrap--kanban { padding-bottom: calc(88px + var(--safe-bottom)); }
}

.due-board__hint { margin: 0 0 18px; font-size: .88rem; }
.due-board__head {
  display: flex; flex-wrap: wrap; gap: 12px 20px;
  align-items: flex-start; justify-content: space-between;
  margin-bottom: 8px;
}
.due-board__nav {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.due-board__filters {
  display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end;
  width: 100%;
}
.due-board__filters .field--inline {
  display: flex; flex-direction: column; gap: 4px; margin: 0; align-items: stretch;
}
.due-board__filters .field--inline .field__label { white-space: normal; }
.due-board__filters select {
  width: 100%; min-width: 0; max-width: none;
}
.due-board__head .view-new-task { align-self: center; }
@media (max-width: 767.98px) {
  .due-board__filters .field--inline { flex: 1 1 calc(50% - 8px); min-width: 8.5rem; }
  .due-summary__item { flex: 1 1 calc(33% - 8px); min-width: 4.2rem; }
}
.due-summary {
  list-style: none; margin: 0 0 20px; padding: 0;
  display: flex; flex-wrap: wrap; gap: 8px;
}
.due-summary__item {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 8px 12px;
  min-width: 4.5rem; text-align: center;
}
.due-summary__item--overdue { border-color: var(--warn); background: var(--warn-soft); }
.due-summary__item--today { border-color: var(--primary); }
.due-summary__item--nodue { border-color: var(--accent); }
.due-summary__link {
  display: block; text-decoration: none; color: inherit; text-align: center;
}
.due-summary__link:hover .due-summary__n { color: var(--primary); }
.due-summary__n { display: block; font-weight: 700; font-size: 1.15rem; color: var(--ink); }
.due-summary__l { font-size: .75rem; color: var(--muted, #666); }
.due-bucket--nodue { scroll-margin-top: 12px; }
.due-bucket { scroll-margin-top: 12px; }
.due-quick {
  display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end;
  margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line);
}
.due-quick__form { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-end; margin: 0; }
.due-quick__field { display: flex; flex-direction: column; gap: 3px; margin: 0; }
.due-quick__label { font-size: .72rem; font-weight: 700; color: var(--muted); }
.due-quick__input, .due-quick__select {
  font: inherit; font-size: .85rem; padding: 6px 8px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--input-bg, var(--card)); color: var(--ink);
  min-width: 9rem; max-width: 100%;
}
.due-quick__select { min-width: 7rem; }
.due-bucket { margin-bottom: 22px; }
.due-bucket--overdue .block__title--sub { color: var(--warn-ink); }
.due-bucket--today .block__title--sub { color: var(--primary); }
.due-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.due-list__item {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 12px 14px; box-shadow: var(--shadow);
}
.due-list__item--overdue { border-inline-start: 4px solid var(--warn); }
.due-list__item--today { border-inline-start: 4px solid var(--primary); }
.due-list__title {
  font-weight: 700; color: var(--ink); text-decoration: none;
  overflow-wrap: anywhere;
}
.due-list__title:hover { color: var(--primary); }
.due-list__meta { font-size: .82rem; margin-top: 4px; }
.due-list__date { font-weight: 600; color: var(--ink); }
.due-list__signal { font-weight: 700; }
.due-list__signal--overdue { color: var(--warn-ink); }
.due-list__signal--today { color: var(--primary); }

.checklist { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.checklist__item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0; border-bottom: 1px solid var(--line);
}
.checklist__item--done .checklist__title { text-decoration: line-through; opacity: .7; }
.checklist__toggle { margin: 0; }
.checklist__check {
  width: 2rem; height: 2rem; border: 1px solid var(--line); border-radius: 8px;
  background: var(--input-bg); color: var(--ink); font-size: 1rem; cursor: pointer;
  flex-shrink: 0;
}
.checklist__check--static {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2rem; height: 2rem; font-size: 1rem; flex-shrink: 0;
}
.checklist__title { flex: 1; overflow-wrap: anywhere; }
.checklist__remove { margin: 0; }
.checklist-form, .recurrence-form {
  display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin-top: 8px;
}
.progress--checklist { margin-bottom: 10px; }

/* سازگاری با کلاس‌های قدیمی chat-* اگر جایی مانده باشد */
.chat-nav, .chat-toolbar, .chat-room-list, .chat-form { /* noop legacy */ }

/* ===================================================================
   بازطراحی محسوس کارتابل — هدر فشرده، ابزارها، لیست inbox، تاریخ جلالی
   =================================================================== */
.cartable__hero {
  margin: 0 0 12px;
  padding: 2px 2px 0;
  display: flex; flex-wrap: wrap; align-items: flex-end;
  justify-content: space-between; gap: 10px 16px;
}
.cartable__attention {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin: 0 0 14px; padding: 8px 10px;
  border-radius: 12px; background: rgba(32, 108, 112, .06);
  border: 1px solid rgba(32, 108, 112, .14);
}
.cartable__attention-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 12px; border-radius: 999px;
  font-size: .8rem; font-weight: 800; text-decoration: none;
  color: var(--ink); background: var(--card);
  border: 1px solid var(--line);
  min-height: 36px;
  touch-action: manipulation;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease),
    border-color var(--dur) var(--ease);
}
.cartable__attention-chip-meta {
  font-weight: 700; opacity: .78; font-size: .72rem;
}
.cartable__attention-chip--warn {
  color: var(--warn-ink); border-color: rgba(179, 60, 50, .35);
  background: var(--warn-soft);
}
.cartable__attention-chip--soft {
  color: var(--pending-ink); border-color: rgba(176, 122, 46, .3);
  background: var(--pending-soft);
  cursor: default;
}
.cartable__attention-chip.is-active,
.cartable__attention-chip[aria-current="true"] {
  background: var(--primary);
  color: var(--on-primary);
  border-color: var(--primary);
  outline: none;
  box-shadow: 0 0 0 2px rgba(32, 108, 112, .22);
}
.cartable__attention-chip--warn.is-active,
.cartable__attention-chip--warn[aria-current="true"] {
  background: var(--warn);
  color: #fff;
  border-color: var(--warn);
  box-shadow: 0 0 0 2px rgba(179, 60, 50, .25);
}
.cartable__attention-chip.is-active .cartable__attention-chip-meta,
.cartable__attention-chip[aria-current="true"] .cartable__attention-chip-meta {
  opacity: .9; color: inherit;
}
.cartable__attention-clear {
  font-size: .8rem; font-weight: 700; color: var(--link);
  margin-inline-start: auto;
  min-height: 36px; display: inline-flex; align-items: center;
  padding: 6px 8px; text-decoration: none;
  touch-action: manipulation;
}
.cartable__attention-clear:hover { text-decoration: underline; }
.cartable__templates {
  margin: 0 0 16px; padding: 12px 14px;
  border-radius: 14px; border: 1px dashed var(--line);
  background: var(--card);
}
.cartable__templates-title {
  margin: 0 0 10px; font-size: .95rem; font-weight: 800;
}
.cartable__templates-chips {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px;
}
.cartable__template-chip {
  appearance: none; border: 1px solid var(--line); background: var(--paper, #f7f7f5);
  cursor: pointer; font: inherit; font-size: .8rem; font-weight: 700;
  padding: 6px 12px; border-radius: 999px; color: var(--ink);
}
.cartable__template-chip:hover,
.cartable__template-chip.is-active {
  border-color: var(--primary); color: var(--primary);
  background: rgba(32, 108, 112, .08);
}
.cartable__templates-owner {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
}
.cartable__templates-owner[hidden] { display: none !important; }
.cartable__hero-text { min-width: 0; flex: 1 1 12rem; }
.cartable__kicker {
  margin: 0 0 2px; font-size: .72rem; font-weight: 700;
  color: var(--accent); letter-spacing: .02em;
}
.cartable__heading {
  margin: 0; font-size: 1.4rem; line-height: 1.25; font-weight: 700;
  color: var(--ink);
}
.cartable__lead {
  margin: 6px 0 0; max-width: 42ch; color: var(--muted); font-size: .9rem; line-height: 1.65;
}
.cartable__project-filter { margin: 0; flex: 0 1 auto; }
.cartable__project-field { margin: 0; }
.field--inline {
  display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px;
}
.field--inline .field__label { margin: 0; white-space: nowrap; }
.field--inline select {
  min-width: 9rem; max-width: min(100%, 16rem);
  font: inherit; padding: 8px 10px; border: 1px solid var(--line-strong);
  border-radius: 10px; background: var(--input-bg); color: var(--ink);
  min-height: var(--touch-min);
}

.cartable__tools {
  display: block;
  margin: 8px 0 22px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--sh-1);
}
.cartable__tools-sum {
  cursor: pointer; list-style: none; font-weight: 700; color: var(--ink);
  padding: 12px 14px; user-select: none;
}
.cartable__tools-sum::-webkit-details-marker { display: none; }
.cartable__tools-sum::after {
  content: "▼"; float: left; font-size: .65rem; color: var(--muted); margin-top: 4px;
}
.cartable__tools[open] > .cartable__tools-sum::after { content: "▲"; }
.cartable__tools-body {
  display: flex; flex-direction: column; gap: 10px;
  padding: 0 14px 14px;
}
.cartable__tools .block { margin-bottom: 0; }
.cartable__tools .block--create,
.cartable__tools .block--delegate {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
  padding: 12px 14px;
}
.cartable__tools .block--create > summary {
  cursor: pointer; font-weight: 700; list-style: none;
  color: var(--ink);
}
.cartable__tools .block--create > summary::-webkit-details-marker { display: none; }
.cartable__tools .block--create > summary::after {
  content: "▼"; float: left; font-size: .65rem; color: var(--muted); margin-top: 4px;
}
.cartable__tools .block--create[open] > summary::after { content: "▲"; }

.delegate__date-hint { margin: 8px 2px 0; font-size: .76rem; }
.field__input--jalali {
  font-variant-numeric: tabular-nums; letter-spacing: .04em;
  text-align: start;
}

.site-reports__toolbar {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  margin: 12px 0 16px;
}
.site-reports__actions {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.site-reports__actions .inline-form { display: inline; margin: 0; }
.site-reports__read { display: grid; gap: 12px; margin: 16px 0; }
.site-reports__read dt { font-weight: 700; font-size: .8rem; color: var(--muted); }
.site-reports__read dd { margin: 4px 0 0; white-space: pre-wrap; }
.site-reports__form textarea { width: 100%; min-height: 2.5rem; }

.inbox__head {
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.inbox__refresh { margin: 0; }
.inbox__list { display: flex; flex-direction: column; gap: 12px; }
.block--inbox { margin-bottom: 8px; }
.block--inbox > .block__title { margin-bottom: 0; }
.block--inbox .task {
  padding: 14px 14px 14px 12px;
}
.block--inbox .task__title { font-size: 1.01rem; }
.block--inbox .task__actions .btn {
  min-height: 44px;
}
.inbox-empty { margin: 4px 0 8px; }
.welcome__cta {
  margin: 0 auto 16px;
  max-width: 48ch;
}
.welcome__cta .btn { min-width: min(100%, 12rem); }

.detail-facts__row dt { color: var(--muted); font-weight: 700; font-size: .8rem; }
.detail-facts__row dd { font-size: .92rem; }

.block__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 6px; background: var(--primary);
  color: #fff; margin-inline-end: 6px; vertical-align: middle;
}
.block__icon svg { display: block; width: 14px; height: 14px; }

.welcome__or { text-align: center; margin: 14px 0 10px; font-size: .85rem; }

/* موبایل: بات‌نَو جایگزین تاپ‌نَو است — ردیف تکراری را مخفی کن تا ارتفاع آزاد شود */
@media (max-width: 767.98px) {
  .topbar__nav-wrap { display: none !important; }
  .proposal__actions { flex-direction: column; }
  .proposal__actions > form { width: 100%; }
  .proposal__actions > form .btn { width: 100%; }
  .cartable__heading { font-size: 1.22rem; }
  .cartable__hero {
    flex-direction: column; align-items: stretch; gap: 10px; margin-bottom: 10px;
  }
  .cartable__project-filter { width: 100%; }
  .cartable__project-field { width: 100%; }
  .cartable__project-field select {
    flex: 1 1 auto; min-width: 0; max-width: none; width: 100%;
  }
  .cartable__attention {
    gap: 10px; padding: 10px;
    /* اسکرول افقی نرم به‌جای شکست شلوغ */
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .cartable__attention::-webkit-scrollbar { display: none; }
  .cartable__attention-chip {
    flex: 0 0 auto;
    min-height: var(--touch-min);
    padding: 10px 14px;
    font-size: .82rem;
  }
  .cartable__attention-chip-meta { display: none; } /* کوتاه‌تر روی موبایل */
  .cartable__attention-clear {
    flex: 0 0 auto;
    min-height: var(--touch-min);
    margin-inline-start: 0;
  }
  .cartable__composer {
    padding: 12px 12px 10px;
    margin-bottom: 12px;
  }
  .composer__title { font-size: 1.05rem; }
  .cartable__self {
    padding: 10px 12px 8px;
    margin-bottom: 14px;
  }
  .cartable__self-title { font-size: .92rem; }
  .inbox__list { gap: 14px; }
}

@media (min-width: 1024px) {
  .cartable__heading { font-size: 1.55rem; }
  .cartable__composer { padding: 20px 20px 16px; }
  .composer__input { font-size: 1.02rem; }
}

/* ── ویجت شناور پشتیبانی ── */
.support-fab {
  position: fixed;
  z-index: 320; /* بالاتر از .task-detail (200) تا داخل پاپ‌آپ وظیفه هم در دسترس باشد */
  inset-inline-start: 12px;
  bottom: calc(72px + var(--safe-bottom, 0px));
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  max-width: min(100vw - 24px, 22rem);
}
@media (min-width: 768px) {
  .support-fab { bottom: 24px; inset-inline-start: 20px; }
}
.body--auth .support-fab { display: none !important; }
/* در گفتگو بالاتر از composer + ردیف «کار جدید» */
.body--tg-room .support-fab { bottom: calc(118px + var(--safe-bottom, 0px)); }
@media (min-width: 768px) {
  .body--tg-room .support-fab { bottom: 24px; }
}

.support-fab__btn {
  appearance: none; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 14px; border-radius: 999px;
  background: var(--primary); color: #fff;
  font: inherit; font-weight: 700; font-size: .85rem;
  box-shadow: var(--sh-3);
}
.support-fab__btn:hover { filter: brightness(1.06); }
.support-fab__btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.support-fab.is-open .support-fab__btn { background: var(--ink); }
.support-fab__btn-label { line-height: 1; }
/* موبایل: فقط آیکن تا روی نام‌ها/کامپوزر نیفتد (الگوی FAB فشرده) */
@media (max-width: 767.98px) {
  .support-fab__btn-label { display: none; }
  .support-fab__btn { padding: 14px; border-radius: 50%; }
  .support-fab { bottom: calc(80px + var(--safe-bottom, 0px)); }
  .body--tg-room .support-fab { bottom: calc(124px + var(--safe-bottom, 0px)); }
}

.support-fab__panel {
  width: min(100vw - 24px, 22rem);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--sh-3);
  padding: 12px 14px 14px;
}
.support-fab__panel[hidden] { display: none !important; }
.support-fab__head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-bottom: 4px;
}
.support-fab__title { margin: 0; font-size: 1rem; }
.support-fab__close {
  appearance: none; border: 0; background: transparent; cursor: pointer;
  color: var(--muted); font-size: 1.1rem; padding: 4px 8px; border-radius: 8px;
}
.support-fab__close:hover { background: var(--surface); color: var(--ink); }
.support-fab__hint { margin: 0 0 10px; font-size: .82rem; }
.support-fab__form .field { margin-bottom: 8px; }
.support-fab__form textarea,
.support-fab__form input[type="text"],
.support-fab__form select {
  width: 100%;
}
.support-fab__actions {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px;
}
.support-fab__pick {
  display: flex; flex-direction: column; gap: 6px;
  margin-bottom: 10px; padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.support-fab__picked { margin: 0; font-size: .82rem; word-break: break-word; }

.support-pick-banner {
  position: fixed; z-index: 330;
  left: 12px; right: 12px;
  /* پایین صفحه، بالای ویجت پشتیبانی — روی topbar/منو نمی‌نشیند */
  bottom: calc(72px + var(--safe-bottom, 0px));
  top: auto;
  margin-inline: auto;
  width: fit-content;
  max-width: min(calc(100vw - 24px), 28rem);
  padding: 10px 14px; border-radius: 12px;
  background: var(--primary); color: #fff;
  font-size: .9rem; font-weight: 700; text-align: center;
  box-shadow: var(--sh-3);
  pointer-events: auto;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px;
}
@media (min-width: 768px) {
  .support-pick-banner { bottom: 88px; }
}
.body--tg .support-pick-banner {
  bottom: calc(150px + var(--safe-bottom, 0px));
}
@media (min-width: 768px) {
  .body--tg .support-pick-banner { bottom: 88px; }
}
.support-pick-banner[hidden] { display: none !important; }
.support-pick-banner__cancel {
  appearance: none; cursor: pointer;
  border: 1px solid rgba(255,255,255,.55);
  background: rgba(255,255,255,.15); color: #fff;
  font: inherit; font-weight: 700; font-size: .85rem;
  padding: 6px 12px; border-radius: 999px;
  flex: 0 0 auto;
}
.support-pick-banner__cancel:hover { background: rgba(255,255,255,.28); }

body.support-picking { cursor: crosshair !important; }
/* ویجت در حالت انتخاب محو می‌شود ولی کلیک‌ها به محتوای پاپ‌آپ وظیفه می‌رسد */
body.support-picking .support-fab { opacity: .35; pointer-events: none; }
/* پس‌زمینهٔ پاپ‌آپ وظیفه در حالت انتخاب ناوبری نکند — فقط انتخاب المان */
body.support-picking .task-detail__backdrop {
  pointer-events: none;
}
.support-pick-hover {
  outline: 3px solid var(--accent) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px rgba(32, 108, 112, .22) !important;
}

/* اعلان تیکت جدید برای مدیر سیستم (polling مرورگر) */
.support-admin-toast {
  position: fixed; z-index: 340;
  inset-inline: 12px;
  bottom: calc(16px + var(--safe-bottom, 0px));
  max-width: min(calc(100vw - 24px), 26rem);
  margin-inline: auto;
  left: 0; right: 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px;
  padding: 12px 14px; border-radius: 14px;
  background: var(--ink); color: #fff;
  box-shadow: var(--sh-3);
  font-size: .88rem; font-weight: 600;
}
.support-admin-toast[hidden] { display: none !important; }
.support-admin-toast__text { flex: 1 1 12rem; line-height: 1.35; }
.support-admin-toast__link {
  color: #fff; text-decoration: none;
  background: var(--primary); padding: 6px 12px; border-radius: 999px;
  font-size: .82rem; font-weight: 700;
}
.support-admin-toast__link:hover { filter: brightness(1.08); }
.support-admin-toast__close {
  appearance: none; border: 0; cursor: pointer;
  background: rgba(255,255,255,.12); color: #fff;
  width: 28px; height: 28px; border-radius: 50%;
  font-size: 1.1rem; line-height: 1; padding: 0;
}
.support-admin-toast__close:hover { background: rgba(255,255,255,.22); }
.body--tg .support-admin-toast {
  bottom: calc(88px + var(--safe-bottom, 0px));
}


/* --- جدول مینیمال + فیلترهای آماده --- */
.table-view__head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  justify-content: space-between; margin-bottom: 10px;
}
.table-view__head .block__title { margin: 0; }
.filter-presets {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  margin: 0 0 14px;
}
.filter-presets__chip {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 36px; padding: 6px 12px; border-radius: 999px;
  font-size: .8rem; font-weight: 700; text-decoration: none;
  color: var(--ink); border: 1px solid var(--line); background: var(--card);
}
.filter-presets__chip.is-active,
.filter-presets__chip:hover {
  border-color: var(--primary); color: var(--primary);
  background: rgba(32, 108, 112, .08);
}
.filter-presets__clear {
  font-size: .78rem; font-weight: 700; color: var(--link);
  min-height: 36px; display: inline-flex; align-items: center;
}
.search-form--compact {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  align-items: end; margin-bottom: 14px;
}
.search-form__more {
  grid-column: 1 / -1;
  margin: 0;
}
.search-form__more > summary {
  cursor: pointer; list-style: none; font-size: .85rem; font-weight: 700;
  color: var(--link); padding: 8px 0; min-height: 44px;
  display: inline-flex; align-items: center; gap: 6px;
}
.search-form__more > summary::-webkit-details-marker { display: none; }
.search-form__more > summary::after { content: "▾"; font-size: .75em; opacity: .7; }
.search-form__more[open] > summary::after { content: "▴"; }
.search-form__more-body {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  align-items: end; padding: 4px 0 2px;
}
.search-form__submit { justify-self: stretch; }
@media (min-width: 768px) {
  .search-form__more { display: contents; }
  .search-form__more > summary { display: none; }
  .search-form__more-body { display: contents; }
}
.field__multi {
  width: 100%; min-height: 10rem;
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--input-bg); color: var(--ink);
  padding: 6px; font: inherit;
}
.field__multi option {
  padding: 8px 10px; border-radius: 6px; margin-block: 2px;
}
.field__multi option:checked {
  background: var(--primary-tint); color: var(--ink);
}
@media (max-width: 767.98px) {
  .table-view__head {
    flex-direction: row; align-items: center; gap: 8px;
  }
  .table-view__head .block__title { flex: 1 1 auto; min-width: 0; }
  .table-view__head .btn { flex: 0 0 auto; min-height: 40px; }
  .filter-presets__chip { min-height: 40px; }
  .search-form .search-form__submit,
  .search-form--compact .search-form__submit {
    width: 100%; min-height: 48px; grid-column: 1 / -1;
  }
  .search-form .field__label,
  .search-form--compact .field__label { text-align: start; }
  .profile__actions { display: flex; flex-direction: column; gap: 8px; }
  .profile__actions .btn { width: 100%; min-height: 48px; }
  .profile__links .btn { flex: 1 1 calc(50% - 8px); min-height: 44px; }
  .form > .btn--primary { width: 100%; min-height: 48px; }
  .dashboard-edit__size-opt {
    min-width: 44px; min-height: 40px;
    padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px;
    background: var(--surface); justify-content: center;
  }
}
.field--check {
  display: flex; align-items: center; gap: 8px;
  padding-bottom: 8px; font-size: .85rem; font-weight: 700;
}
.task-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.task-table {
  width: 100%; border-collapse: collapse; font-size: .88rem;
  background: var(--card); border-radius: 12px; overflow: hidden;
}
.task-table th, .task-table td {
  padding: 10px 12px; text-align: start; border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.task-table th {
  font-size: .75rem; font-weight: 800; color: var(--muted);
  background: rgba(0,0,0,.03);
}
.task-table a { color: var(--link); font-weight: 700; text-decoration: none; }
.task-table a:hover { text-decoration: underline; }
.task-table__row--overdue td:first-child { box-shadow: inset 3px 0 0 #c2410c; }

.tg-members > summary {
  list-style: none; cursor: pointer;
}
.tg-members > summary::-webkit-details-marker { display: none; }
.tg-quote--parent {
  opacity: .85; margin-bottom: 8px;
  border-inline-start: 3px solid var(--tg-line, var(--line));
  padding-inline-start: 10px;
}

.site-reports-outbox-banner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin: 0 0 14px; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 10px;
  background: rgba(32, 108, 112, .08); font-size: .88rem; font-weight: 700;
}
.site-reports-outbox-banner[hidden] { display: none !important; }

/* —— حسابداری (ADR-017 UI polish) —— */
.acc-subnav {
  display: flex; flex-direction: column; gap: 8px;
  margin: 0 0 1.1rem; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--card, var(--surface));
}
.acc-subnav__groups {
  display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center;
}
.acc-subnav__group-label {
  font-size: .72rem; font-weight: 800; color: var(--muted);
  width: 100%; margin: 4px 0 0;
}
.acc-subnav a.is-active,
.acc-subnav .page-actions__link.is-active {
  color: var(--ink, inherit);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.acc-subnav > summary,
.acc-subnav__sum {
  list-style: none; cursor: pointer; font-weight: 800; font-size: .9rem;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px;
  min-height: var(--touch-min); padding: 4px 0; touch-action: manipulation;
}
.acc-subnav > summary::-webkit-details-marker,
.acc-subnav__sum::-webkit-details-marker { display: none; }
.acc-subnav > summary::after,
.acc-subnav__sum::after {
  content: "▼"; margin-inline-start: auto; font-size: .65rem; color: var(--muted);
}
.acc-subnav[open] > summary::after,
.acc-subnav[open] > .acc-subnav__sum::after { content: "▲"; }
.acc-subnav__sum-title { font-weight: 800; }
.acc-subnav__sum-current {
  font-size: .8rem; font-weight: 700;
  color: var(--primary-strong, var(--primary));
}
@media (min-width: 900px) {
  /* بدنه فقط با open واقعی در دسترس است؛ اسکریپت _subnav روی ≥900px open می‌گذارد */
  .acc-subnav > summary,
  .acc-subnav__sum { display: none; }
  .acc-subnav { padding: 12px 14px; }
  .acc-subnav__body { display: block !important; }
}
@media (max-width: 899px) {
  .acc-subnav:not([open]) .acc-subnav__body { display: none; }
  .acc-subnav[open] .acc-subnav__body {
    display: flex; flex-direction: column; gap: 10px;
    padding-top: 8px; border-top: 1px solid var(--line); margin-top: 4px;
  }
}

.acc-list { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: 8px; }
.acc-list__item {
  display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--card, var(--surface));
}
.acc-list__item .acc-actions {
  display: flex; flex-wrap: wrap; gap: 8px; width: 100%;
  margin-top: 4px;
}
.acc-list__meta { color: var(--muted); font-size: .88rem; }
.acc-amount {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  direction: ltr;
  unicode-bidi: plaintext;
}

.acc-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: 1rem; }
.acc-table {
  width: 100%; border-collapse: collapse; font-size: .88rem;
  background: var(--card, var(--surface)); border-radius: 12px; overflow: hidden;
}
.acc-table th, .acc-table td {
  padding: 10px 12px; text-align: start; border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.acc-table th {
  font-size: .75rem; font-weight: 800; color: var(--muted);
  background: rgba(0,0,0,.03);
}
.acc-table .num, .acc-table td.num, .acc-table th.num {
  text-align: end; font-variant-numeric: tabular-nums;
  direction: ltr; unicode-bidi: plaintext;
}
.acc-table tfoot th { background: rgba(0,0,0,.04); font-weight: 800; }

.acc-form--narrow { max-width: 28rem; }
.acc-balance {
  display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center;
  margin: 10px 0 14px; padding: 10px 12px;
  border-radius: 10px; border: 1px solid var(--line);
  font-weight: 700; font-size: .9rem;
}
.acc-balance--ok { background: rgba(32, 108, 112, .1); }
.acc-balance--bad { background: rgba(180, 60, 40, .1); }
.acc-vline {
  border: 1px solid var(--line); border-radius: 12px;
  padding: 12px; margin-bottom: 10px;
  background: var(--card, var(--surface));
}
.acc-vline__head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; font-weight: 800; font-size: .85rem;
}
.acc-vline__grid {
  display: grid; gap: 10px;
}
@media (min-width: 720px) {
  .acc-vline__grid--amounts {
    grid-template-columns: 1fr 1fr;
  }
}
.acc-inline-forms { display: flex; flex-wrap: wrap; gap: 8px; }
.acc-date-hint { margin: 6px 2px 0; font-size: .76rem; color: var(--muted); }

/* —— لیست‌های عمومی (parties / phonebook / فروش) —— */
.list,
.item-list {
  list-style: none; margin: 1rem 0 0; padding: 0;
  display: grid; gap: 8px;
}
.list__item,
.item-list__row {
  display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline;
  padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--card, var(--surface));
}
.list__item > a,
.item-list__row > a {
  font-weight: 700; color: var(--link); text-decoration: none;
}
.list__item > a:hover,
.item-list__row > a:hover { text-decoration: underline; }
.list__item .empty,
.list .empty,
.item-list .empty,
li.empty {
  border-style: dashed; color: var(--muted);
}
.list__item.empty,
.item-list__row.empty {
  flex-direction: column; align-items: flex-start; gap: 8px;
}

/* ===================================================================
   فاز ۳ — ابزارهای مشترک فاصله/فرم/empty + هم‌ترازی ماژول‌ها
   =================================================================== */
.pre-wrap { white-space: pre-wrap; overflow-wrap: anywhere; }
.stack-mt { margin-top: 1.25rem; }
.stack-mt-sm { margin-top: 1rem; }
.stack-mt-xs { margin-top: .75rem; }
.stack-mb { margin-bottom: 1rem; }
.block--spaced { margin-top: 1.25rem; }
.block__title--spaced { margin-top: 1.5rem; }
.form--narrow { max-width: 28rem; }
.form--narrow-lg { max-width: 32rem; }
.form--spaced { margin-top: 1.25rem; }
.form--spaced-sm { margin-top: .75rem; }
.form--spaced-lg { margin-top: 1.5rem; }
.search-form--spaced { margin-top: 1rem; max-width: 36rem; }
.search-form--row {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end;
  margin-bottom: 1rem;
}
.list--spaced { margin-top: 1.25rem; }
.form-actions {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  margin-top: 8px;
}
.chip-row {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.inline-form--inline { display: inline; margin-inline-start: 8px; }
.muted--flush { margin: 0; }
.muted--after { margin-top: .75rem; }
.muted--sm { margin: 4px 0 8px; font-size: .8rem; }
.sms-reminder-fieldset {
  border: 1px solid var(--line); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 12px;
}
.sms-reminder-fieldset legend { padding-inline: 6px; }
.tg-form-sheet--compose {
  max-width: 560px; margin: 16px auto;
}
.tg-members__hint { margin: 4px 0 8px; font-size: .8rem; }
.catchup__head--spaced { margin-bottom: 1rem; }
.tg-quote--spaced { margin: 12px 0; }
.acc-list__item.empty .empty__title,
.acc-list__item.empty .dashboard__empty-title {
  margin: 0; font-weight: 700; font-size: 1.02rem; color: var(--ink);
}
.acc-list__item.empty .empty__hint { margin: 0; max-width: 36ch; }
.acc-list__item.empty .empty__actions { margin-top: 6px; }
.page-actions__link {
  min-height: var(--touch-min);
  display: inline-flex; align-items: center;
  touch-action: manipulation;
}

/* proposal — فاصله لمس و دکمهٔ ثانویه واضح‌تر */
.proposal__actions { gap: 12px; }
.proposal__actions .btn { min-height: var(--touch-min); }

/* کنتراست muted کمی قوی‌تر روی سطح گرم */
:root {
  --muted: #4f6162;
}

@media (prefers-color-scheme: dark) {
  :root {
    --muted: #9bb0b1;
  }
}

/* داشبورد ویجت خالی */
.dashboard__widget-empty {
  color: var(--muted); font-size: .88rem; margin: 0;
  padding: 12px 0;
}

/* —— هوش قیمت + هاب حسابداری (لوپ UI) —— */
.pi-subnav {
  display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center;
  margin: 0 0 1.25rem; padding: 10px 14px;
  border: 1px solid var(--line); border-radius: var(--r);
  background: var(--card, var(--surface));
  box-shadow: var(--sh-1);
}
.pi-subnav .page-actions__link {
  padding: 4px 10px; border-radius: var(--r-sm);
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.pi-subnav .page-actions__link:hover {
  background: color-mix(in srgb, var(--primary) 8%, transparent);
}
.pi-subnav .page-actions__link.is-active {
  color: var(--on-primary);
  background: var(--primary);
  font-weight: 700;
  text-decoration: none;
}
.pi-steps {
  margin: 0 0 1.25rem; padding-inline-start: 1.25rem;
  line-height: 1.8; max-width: 54ch;
}
.pi-steps li::marker { color: var(--primary); font-weight: 700; }
.pi-job-row {
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent);
  transition: background var(--dur) var(--ease);
}
.pi-job-row:last-child { border-bottom: none; }
.pi-job-row:hover { background: color-mix(in srgb, var(--primary) 4%, transparent); }
.pi-job-row__main { flex: 1 1 12rem; display: grid; gap: 4px; }
.pi-progress {
  position: relative;
  margin-top: 8px;
  height: 1.65rem;
  border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--primary) 8%, var(--card));
  border: 1px solid var(--line);
  overflow: hidden;
}
.pi-progress__bar {
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: calc(var(--pct, 0) * 1%);
  max-width: 100%;
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 45%, transparent), color-mix(in srgb, var(--primary) 65%, transparent));
  transition: width .6s var(--ease);
}
.pi-progress__label {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  height: 100%; padding: 0 12px;
  font-size: .78rem; font-weight: 700; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.pi-progress--fail .pi-progress__bar {
  background: linear-gradient(90deg, color-mix(in srgb, var(--warn) 40%, transparent), color-mix(in srgb, var(--warn) 60%, transparent));
}
.pi-progress--lg { height: 2.2rem; margin: 0 0 12px; }
.pi-progress--lg .pi-progress__label { font-size: .88rem; }
.pi-summary {
  margin: 0 0 1.25rem; padding: 14px 16px;
  border: 1px solid var(--line); border-radius: var(--r);
  background: var(--card, var(--surface));
  box-shadow: var(--sh-1);
}
.pi-stat-row {
  list-style: none; margin: 8px 0 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 8px 20px;
  font-size: .9rem; color: var(--muted);
}
.pi-stat-row li { display: flex; align-items: baseline; gap: 4px; }
.pi-stat-row strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.pi-live {
  margin: 0 0 1.25rem; padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--primary) 40%, var(--line));
  border-radius: var(--r);
  background: color-mix(in srgb, var(--primary) 6%, var(--card, var(--surface)));
}
.pi-live__title {
  margin: 0 0 10px; font-size: 1rem; font-weight: 700; color: var(--ink);
}
.pi-live--wait { margin: 0 0 1rem; padding: 8px 0; }
.pi-divar-panel {
  margin: 0 0 1rem; padding: 12px 14px;
  border: 1px dashed color-mix(in srgb, var(--primary) 35%, var(--line));
  border-radius: var(--r);
  background: color-mix(in srgb, var(--primary) 4%, var(--card, var(--surface)));
}
.pi-divar-panel__title {
  margin: 0 0 6px; font-size: .95rem; font-weight: 700;
}
.pi-divar-panel code {
  font-size: .8em; direction: ltr; unicode-bidi: isolate;
  background: var(--code-bg); padding: 1px 5px; border-radius: 4px;
}
.pi-band-stats { margin-top: 4px; }
.pi-line--live {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--line));
  box-shadow: var(--sh-1);
  animation: pi-live-pulse 1.6s ease-in-out infinite;
}
@keyframes pi-live-pulse {
  0%, 100% { background: var(--card); }
  50% { background: color-mix(in srgb, var(--primary) 8%, var(--card)); }
}
@media (prefers-reduced-motion: reduce) {
  .pi-line--live { animation: none; }
}
.pi-filter-tabs { margin-bottom: 12px; }
.pi-line {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin: 0 0 10px;
  padding: 14px 16px;
  border-radius: var(--r-lg);
  border: 1px solid var(--line);
  background: var(--card);
  box-shadow: var(--sh-1);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.pi-line:hover {
  border-color: color-mix(in srgb, var(--primary) 35%, var(--line));
}
.pi-line--review {
  border-inline-start: 5px solid var(--pending);
  background: linear-gradient(90deg, var(--pending-soft) 0%, var(--card) 28%);
}
.pi-line--bad {
  border-inline-start: 5px solid var(--warn);
}
.pi-line__head { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pi-line__title {
  margin: 0;
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.45;
  overflow-wrap: break-word;
  word-break: normal;
}
.pi-line__meta {
  margin: 0;
  line-height: 1.55;
  overflow-wrap: break-word;
  word-break: normal;
}
.pi-line__code {
  font-family: ui-monospace, "Fira Code", monospace;
  font-size: .8em; direction: ltr; unicode-bidi: isolate;
  background: var(--code-bg); padding: 1px 6px; border-radius: 4px;
}
.pi-offers {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pi-offer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "main price"
    "actions actions";
  align-items: center;
  gap: 8px 14px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface, var(--card));
}
.pi-offer--empty {
  display: block;
  border-style: dashed;
  color: var(--muted);
}
.pi-offer__main { grid-area: main; min-width: 0; }
.pi-offer__link {
  display: block;
  font-weight: 700;
  color: var(--link);
  text-decoration: none;
  line-height: 1.4;
  overflow-wrap: break-word;
  word-break: normal;
}
.pi-offer__link:hover { text-decoration: underline; }
.pi-offer__reasons {
  display: block;
  margin-top: 2px;
  font-size: .78rem;
  color: var(--muted);
  line-height: 1.4;
}
.pi-reuse {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-top: 6px;
  padding: 10px 12px;
  border-radius: var(--r-sm);
  border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line));
  background: color-mix(in srgb, var(--primary) 8%, var(--card));
}
.pi-reuse__text {
  margin: 0;
  flex: 1 1 14rem;
  font-size: .88rem;
  line-height: 1.45;
  color: var(--ink);
}
.pi-reuse__text a { font-weight: 700; color: var(--link); }
.pi-reuse__form { margin: 0; flex: 0 0 auto; }
@media (max-width: 599px) {
  .pi-reuse { flex-direction: column; align-items: stretch; }
  .pi-reuse__form .btn { width: 100%; }
}
.pi-sources {
  margin-top: 12px;
  padding: 12px;
  border-radius: var(--r-sm);
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 92%, var(--ink) 4%);
}
.pi-sources__summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 1rem;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.pi-sources__summary::-webkit-details-marker { display: none; }
.pi-sources[open] .pi-sources__summary { margin-bottom: 8px; }
.pi-sources__title {
  margin: 0 0 4px;
  font-size: 1rem;
  font-weight: 700;
}
.pi-work-cta { margin-top: 10px; gap: 8px; }
.pi-subnav__secondary { opacity: .72; font-size: .92em; }
.pi-sources__hint {
  margin: 0 0 10px;
  font-size: .82rem;
  line-height: 1.4;
}
.pi-sources__list {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pi-sources__item {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px 12px;
  padding: 8px 10px;
  border-radius: var(--r-sm);
  border: 1px solid var(--line);
  background: var(--card);
}
.pi-sources__item--off {
  opacity: .65;
}
.pi-sources__main {
  flex: 1 1 14rem;
  min-width: 0;
}
.pi-sources__link {
  font-weight: 600;
  color: var(--link);
  word-break: break-word;
}
.pi-sources__meta {
  margin: 4px 0 0;
  font-size: .8rem;
}
.pi-sources__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}
.pi-sources__actions form { margin: 0; }
.pi-sources__add { margin-top: 4px; }
.pi-sources__add-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.pi-sources__add-row .field__input {
  flex: 1 1 10rem;
  min-width: 0;
}
.pi-sources__fresh {
  margin-top: 10px;
}
@media (max-width: 599px) {
  .pi-sources__actions { width: 100%; }
  .pi-sources__actions .btn { flex: 1 1 auto; }
  .pi-sources__add-row .btn { width: 100%; }
}
.pi-offer__price {
  grid-area: price;
  justify-self: end;
  align-self: start;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--ok-ink);
  white-space: nowrap;
}
.pi-offer__actions {
  grid-area: actions;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding-top: 4px;
  border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.pi-offer__actions .btn {
  overflow-wrap: normal;
  white-space: nowrap;
  flex: 0 0 auto;
  min-width: 7.5rem;
}
@media (min-width: 700px) {
  .pi-offer {
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas: "main price actions";
    align-items: center;
  }
  .pi-offer__price { align-self: center; }
  .pi-offer__actions {
    border-top: none;
    padding-top: 0;
    justify-content: flex-end;
  }
}
.pi-pager { justify-content: center; margin-top: 1.25rem; gap: 8px; }

.pi-toolbar {
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px 14px;
}
.pi-toolbar__actions {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.pi-inline-form { display: inline; margin: 0; }
.pi-line-retry {
  margin-top: .25rem;
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding-top: 10px;
  border-top: 1px dashed color-mix(in srgb, var(--line) 60%, transparent);
}
.pi-line-retry .field__label {
  margin: 0; flex: 0 0 auto;
}
.pi-line-retry .field__input {
  min-width: min(16rem, 100%);
  flex: 1 1 12rem;
  margin: 0;
}
.pi-file {
  position: relative;
  display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center;
  overflow: hidden;
}
.pi-file .sr-only {
  inset-inline-start: 0;
  inset-block-start: 0;
  max-width: 1px !important;
}
.pi-file__btn { margin: 0; cursor: pointer; }
.pi-file__name {
  font-size: .9rem;
  word-break: break-all;
}

.pi-stat-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
  gap: 10px;
  margin: 0 0 1.25rem;
}
.pi-stat-cards .acc-list__item { margin: 0; }
.acc-amount--lg { font-size: 1.35rem; }

.acc-hub {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
  gap: 10px;
  margin: 0 0 0.5rem;
}
.acc-hub__card {
  display: grid; gap: 4px;
  padding: 14px 14px;
  min-height: 4.5rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card, var(--surface));
  text-decoration: none;
  color: inherit;
  touch-action: manipulation;
}
.acc-hub__card:hover {
  border-color: color-mix(in srgb, var(--primary) 45%, var(--line));
  background: color-mix(in srgb, var(--primary) 6%, var(--card));
}
.acc-hub__card--primary {
  border-color: color-mix(in srgb, var(--primary) 40%, var(--line));
  background: color-mix(in srgb, var(--primary) 10%, var(--card));
}
.acc-hub__card strong { font-size: .95rem; }
.acc-hub__card .muted { font-size: .82rem; line-height: 1.45; }

@media (max-width: 599px) {
  .pi-offer {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .pi-offer__actions .btn { flex: 1 1 auto; min-width: 0; }
  .pi-line { padding: 10px 10px; }
  .pi-summary { padding: 10px 12px; }
  .pi-stat-row { gap: 6px 12px; font-size: .84rem; }
  .pi-filter-tabs { overflow-x: auto; flex-wrap: nowrap; gap: 4px; -webkit-overflow-scrolling: touch; }
  .sales-hub-tabs__item { flex: 0 0 auto; font-size: .8rem; white-space: nowrap; }
  .pi-subnav { gap: 4px 8px; padding: 8px 10px; }
  .pi-progress { height: 1.5rem; }
  .pi-progress__label { font-size: .7rem; padding: 0 6px; }
  .pi-toolbar { flex-direction: column; align-items: stretch; }
  .pi-toolbar__actions { width: 100%; }
  .pi-toolbar__actions .btn { flex: 1 1 auto; min-height: var(--touch-min, 44px); }
  .pi-line-retry { flex-direction: column; align-items: stretch; }
  .pi-line-retry .field__input { min-width: 0; width: 100%; }
}

