:root {
  --brand: #7b2d26;
  --brand-dark: #5c1f1a;
  --brand-soft: #f6ebe7;
  --gold: #c08a2e;
  --page: #f7f4ef;
  --card: #ffffff;
  --ink: #2b2523;
  --muted: #7a706b;
  --line: #e7e0d8;
  --bs-body-font-family: 'Vazirmatn', system-ui, sans-serif;
  --bs-body-bg: var(--page);
  --bs-body-color: var(--ink);
  --bs-link-color-rgb: 123, 45, 38;
  --bs-link-hover-color-rgb: 92, 31, 26;
  --bs-border-color: var(--line);
}

body {
  font-family: var(--bs-body-font-family);
  background: var(--page);
  color: var(--ink);
  min-height: 100vh;
}

.ltr { direction: ltr; unicode-bidi: isolate; }
.num { font-variant-numeric: tabular-nums; }
.text-muted, .form-text { color: var(--muted) !important; }

/* ─── ناوبری ─── */
.app-nav { background: var(--brand); box-shadow: 0 2px 10px rgba(60, 20, 15, .18); }
.app-nav .navbar-brand { color: #fff; font-weight: 800; letter-spacing: -.01em; }
.app-nav .navbar-brand .bi { color: var(--gold); }
.app-nav .nav-link { color: rgba(255, 255, 255, .78); border-radius: .5rem; padding-inline: .75rem !important; }
.app-nav .nav-link:hover, .app-nav .nav-link:focus { color: #fff; background: rgba(255, 255, 255, .08); }
.app-nav .nav-link.active { color: #fff; background: rgba(255, 255, 255, .16); }
.app-nav .navbar-toggler { border-color: rgba(255, 255, 255, .35); }
.app-nav .navbar-toggler-icon { filter: invert(1); }
.app-nav .dropdown-menu { border-color: var(--line); box-shadow: 0 10px 30px rgba(0, 0, 0, .12); }

/* ─── دکمه‌ها ─── */
.btn-primary {
  --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark);
  --bs-btn-active-bg: var(--brand-dark); --bs-btn-active-border-color: var(--brand-dark);
  --bs-btn-disabled-bg: var(--brand); --bs-btn-disabled-border-color: var(--brand);
}
.btn-outline-primary {
  --bs-btn-color: var(--brand); --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand);
  --bs-btn-active-bg: var(--brand); --bs-btn-active-border-color: var(--brand);
}
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: #c99a8f; box-shadow: 0 0 0 .2rem rgba(123, 45, 38, .15);
}
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }

/* ─── کارت‌ها ─── */
.card { border-color: var(--line); border-radius: .9rem; box-shadow: 0 1px 2px rgba(40, 20, 10, .04); }
.card-header { background: transparent; border-bottom-color: var(--line); font-weight: 700; padding-block: .85rem; }
.page-title { font-weight: 800; font-size: 1.35rem; margin: 0; }
.page-head { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; margin-bottom: 1.25rem; }

.stat { padding: 1rem 1.1rem; border-radius: .9rem; background: var(--card); border: 1px solid var(--line); height: 100%; display: block; color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
a.stat:hover { border-color: #cfb7ab; transform: translateY(-1px); }
.stat .label { color: var(--muted); font-size: .85rem; }
.stat .value { font-size: 1.6rem; font-weight: 800; line-height: 1.3; }

.phase { display: flex; align-items: center; gap: .6rem; font-weight: 700; }
.phase .dot { width: .7rem; height: .7rem; border-radius: 50%; flex: none; }
.phase-success .dot { background: #2f9e44; box-shadow: 0 0 0 4px rgba(47, 158, 68, .15); }
.phase-info .dot { background: #1c7ed6; }
.phase-warning .dot { background: #f08c00; }
.phase-danger .dot { background: #e03131; }
.phase-secondary .dot { background: #adb5bd; }

.progress { height: .55rem; background: #efe8e1; border-radius: 1rem; }
.progress-bar { background: var(--brand); }

/* ─── جدول‌ها ─── */
.table { --bs-table-bg: transparent; margin-bottom: 0; }
.table > :not(caption) > * > * { padding: .7rem .75rem; border-bottom-color: var(--line); }
.table thead th { color: var(--muted); font-weight: 600; font-size: .85rem; white-space: nowrap; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: #fbf8f4; }

/* ─── برچسب وضعیت ─── */
.badge-st { display: inline-block; padding: .3em .65em; border-radius: 2rem; font-size: .78rem; font-weight: 600; white-space: nowrap; }
.st-pending { background: #eef1f4; color: #495057; }
.st-imported { background: #e7f1ff; color: #1864ab; }
.st-added, .st-joined { background: #e6f6ea; color: #2b8a3e; }
.st-member { background: #eaf6f6; color: #0b7285; }
.st-needs_invite { background: #fff4e0; color: #b35c00; }
.st-invited { background: #f3eefe; color: #6741d9; }
.st-no_telegram, .st-skipped { background: #f1f1f1; color: #6c757d; }
.st-unreachable { background: #fdeeee; color: #c92a2a; }
.st-failed { background: #ffe3e3; color: #a51111; }

.lvl { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; margin-inline-end: .4rem; }
.lvl-info { background: #adb5bd; }
.lvl-success { background: #2f9e44; }
.lvl-warning { background: #f08c00; }
.lvl-error { background: #e03131; }

.log-list { list-style: none; padding: 0; margin: 0; }
.log-list li { padding: .6rem 1rem; border-bottom: 1px solid var(--line); font-size: .9rem; }
.log-list li:last-child { border-bottom: 0; }
.log-list time { color: var(--muted); font-size: .78rem; white-space: nowrap; }

.steps { counter-reset: step; list-style: none; padding: 0; }
.steps li { position: relative; padding-inline-start: 2.2rem; margin-bottom: .6rem; }
.steps li::before {
  counter-increment: step; content: counter(step);
  position: absolute; inset-inline-start: 0; top: 0;
  width: 1.6rem; height: 1.6rem; border-radius: 50%;
  background: var(--brand-soft); color: var(--brand); font-weight: 700; font-size: .85rem;
  display: grid; place-items: center;
}

.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 1rem; }
.login-card { width: 100%; max-width: 380px; }
.brand-mark { width: 3rem; height: 3rem; border-radius: .9rem; background: var(--brand); color: var(--gold); display: grid; place-items: center; font-size: 1.5rem; margin-inline: auto; }

.ts-wrapper.form-select, .ts-wrapper.form-control { padding: 0; }
.ts-control { border-radius: var(--bs-border-radius); }
.jdp-container { font-family: var(--bs-body-font-family) !important; }

@media (max-width: 575.98px) {
  .page-title { font-size: 1.15rem; }
  .stat .value { font-size: 1.3rem; }
  .table > :not(caption) > * > * { padding: .55rem .5rem; }
}