/* ---------- خاموت — سیستم طراحی فولاد صنعتی ---------- */
:root {
  /* رنگ‌ها */
  --ink: #1b2733;          /* سرمه‌ای فولادی — سایدبار */
  --ink-2: #24384a;
  --molten: #e85d1f;       /* نارنجی فولاد گداخته — فقط برای سطح رنگی و حاشیه، نه متن */
  --molten-light: #ff7a3d;
  --molten-dark: #c74a12;
  /* --molten روی سفید فقط ۳.۴۹:۱ است؛ این دو برای «متن/سطح دکمه» استفاده می‌شوند */
  --molten-on-light: #b8430f;   /* نارنجی به‌عنوان متن روی زمینه روشن — 5.46:1 */
  --molten-surface: #c74a12;    /* زمینه دکمه اصلی با متن سفید — 4.75:1 */
  --paper: #f3f5f7;
  --card: #ffffff;
  --line: #dde3e9;         /* خط تزئینی کارت‌ها */
  --line-strong: #7f8d9b;  /* حاشیه فیلدهای فرم — 3.39:1 طبق WCAG 1.4.11 */
  --muted: #5a6875;        /* 5.23:1 روی paper — قبلا #6b7a89 بود و رد می‌شد */
  --row-alt: #f7f9fa;      /* راه‌راه جدول — مات، تا کنتراست قابل محاسبه بماند */
  --ok: #2f9e63;           /* آماده / موفق */
  --warn: #e6a817;         /* در انتظار تایید */
  --info: #3b82c4;         /* ارسال شده */
  --danger: #d9483b;       /* لغو / عقب‌افتاده — سطح رنگی، نه متن */
  --danger-text: #c62828;  /* قرمز به‌عنوان متن روی زمینه روشن — 5.14:1 */
  --ok-text: #157347;      /* سبز به‌عنوان متن — 5.56:1 روی راه‌راه */

  /* فاصله‌ها — واحد پایه ۴px */
  --sp-xs: 4px;
  --sp-sm: 8px;
  --sp-md: 12px;
  --sp-lg: 16px;
  --sp-xl: 24px;

  /* شعاع گوشه */
  --r-sm: 6px;             /* تگ‌ها و بج‌ها */
  --r-md: 10px;            /* دکمه‌ها و فیلدها */
  --r-lg: 14px;            /* کارت‌ها */
  --r-xl: 20px;            /* مودال و کارت ورود */
  --r-pill: 999px;

  /* سایه — سیستم درخشش رنگی (سایه مشکی فقط برای سطوح غیرتعاملی) */
  --sh-sm: 0 1px 3px rgba(20,30,40,.06);
  --sh-md: 0 4px 14px rgba(20,30,40,.09);
  --sh-lg: 0 12px 34px rgba(10,18,28,.16);
  --glow-molten: 0 4px 16px rgba(232,93,31,.32);
  --glow-ok: 0 4px 16px rgba(47,158,99,.30);
  --glow-warn: 0 4px 16px rgba(230,168,23,.32);
  --glow-info: 0 4px 16px rgba(59,130,196,.30);
  --glow-danger: 0 4px 16px rgba(217,72,59,.30);
  --sh-focus: 0 0 0 4px rgba(232,93,31,.18);

  /* حرکت — هیچ ریزتعاملی بیشتر از ۳۰۰ms نباشد */
  --ease-bounce: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: .12s;
  --t-base: .2s;

  /* حداقل اندازه لمسی — کارگاه: دست پر، دستکش، عجله */
  --touch: 44px;

  --bs-body-font-family: "Vazirmatn", Tahoma, sans-serif;
}
[data-bs-theme="dark"] {
  --paper: #14191f;
  --card: #1c242d;
  --line: #2c3844;
  --line-strong: #687c91;      /* حاشیه فیلد در تاریک — 3.64:1 */
  --row-alt: #212b35;          /* راه‌راه جدول در تم تاریک */
  --muted: #8fa0b0;
  /* نارنجی پایه روی کارت تیره ۴.۴۹:۱ است — برای متن نسخه روشن‌تر لازم است */
  --molten-on-light: #f2703a;  /* 5.34:1 روی کارت تیره */
  --danger-text: #ef7168;      /* 5.40:1 روی کارت تیره */
  --ok-text: #4ade80;          /* 9.00:1 روی کارت تیره */
  --molten-surface: #c74a12;
  --ink: #10161d;
  --ink-2: #1a232d;
  --sh-sm: 0 1px 3px rgba(0,0,0,.3);
  --sh-md: 0 4px 14px rgba(0,0,0,.34);
  --sh-lg: 0 12px 34px rgba(0,0,0,.5);
}

html, body { font-family: "Vazirmatn", Tahoma, sans-serif; background: var(--paper); }
body { min-height: 100vh; }

/* ---------- سایدبار ---------- */
.sidebar {
  width: 232px; background: var(--ink); color: #cdd8e2;
  position: fixed; inset-inline-start: 0; inset-inline-end: auto; top: 0; z-index: 1030;
  display: flex; flex-direction: column; transition: transform .25s;
  /* ارتفاع ثابت است تا nav داخلش اسکرول شود؛ dvh نوار آدرس موبایل را حساب می‌کند */
  height: 100vh;
  height: 100dvh;
}
.side-head {
  display: flex; align-items: center; flex-shrink: 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.sidebar .brand {
  display: flex; align-items: center; gap: .6rem; padding: 1rem 1.1rem;
  color: #fff; text-decoration: none; flex: 1; min-width: 0;
}
.sidebar .brand svg { flex-shrink: 0; }
.sidebar .brand .t1 { font-weight: 800; font-size: 1.05rem; line-height: 1.2; }
.sidebar .brand .t2 { font-size: .7rem; color: #93a5b5; }
.side-close {
  flex: none; display: none; align-items: center; justify-content: center;
  width: 44px; height: 44px; margin-inline-end: .4rem;
  background: none; border: 0; border-radius: var(--r-md);
  color: #cdd8e2; cursor: pointer;
}
.side-close:hover { background: var(--ink-2); color: #fff; }
.sidebar nav {
  padding: .6rem .55rem; flex: 1; min-height: 0;
  overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
}
.sidebar nav a {
  display: flex; align-items: center; gap: .65rem; padding: .6rem .8rem; margin-bottom: 2px; min-height: var(--touch);
  color: #cdd8e2; text-decoration: none; border-radius: var(--r-md); font-size: .92rem;
}
.sidebar nav a:hover { background: var(--ink-2); color: #fff; }
.sidebar nav a.active { background: var(--molten-surface); color: #fff; font-weight: 600; }
.sidebar nav a.active:hover { background: #a83c0c; }
.sidebar nav .sec { font-size: .68rem; color: #7c8ea0; margin: .9rem .8rem .3rem; letter-spacing: .5px; }
.sidebar .foot {
  padding: .8rem 1rem; border-top: 1px solid rgba(255,255,255,.08);
  font-size: .8rem; flex-shrink: 0;
}

/* پرده پشت منو در موبایل — کلیک رویش منو را می‌بندد */
.side-backdrop {
  position: fixed; inset: 0; z-index: 1029;
  background: rgba(0,0,0,.5);
  opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s;
}
.side-backdrop.show { opacity: 1; visibility: visible; }
body.sidebar-open { overflow: hidden; }

.main { margin-inline-start: 232px; padding: 0; }
.topbar {
  background: var(--card); border-bottom: 1px solid var(--line);
  padding: .6rem 1.4rem; display: flex; align-items: center; gap: .8rem;
  position: sticky; top: 0; z-index: 1020;
}
.topbar h1 { font-size: 1.05rem; font-weight: 700; margin: 0; flex: 1; }
.content { padding: 1.4rem; }

@media (max-width: 992px) {
  .sidebar { transform: translateX(100%); }
  .sidebar.open { transform: none; box-shadow: 0 0 40px rgba(0,0,0,.4); }
  .side-close { display: flex; }
  .main { margin-inline-start: 0; }
}

/* در دسکتاپ منو همیشه باز است، پس پرده هرگز نباید ظاهر شود */
@media (min-width: 993px) {
  .side-backdrop { display: none; }
}

/* ---------- کارت‌ها ---------- */
.card { border: 1px solid var(--line); background: var(--card); border-radius: var(--r-lg); }
.stat-card { border-inline-start: 6px solid var(--molten); }
.stat-card .num { font-size: 1.7rem; font-weight: 800; }
.stat-card .lbl { color: var(--muted); font-size: .85rem; }
.stat-card.s-warn { border-inline-start-color: var(--warn); }
.stat-card.s-ok { border-inline-start-color: var(--ok); }
.stat-card.s-info { border-inline-start-color: var(--info); }

.btn-molten { background: var(--molten-surface); border-color: var(--molten-surface); color: #fff; }
.btn-molten:hover { background: #a83c0c; border-color: #a83c0c; color: #fff; }

.table th { font-size: .82rem; color: var(--muted); font-weight: 600; }
.table td { vertical-align: middle; font-size: .92rem; }

/* ---------- تایم‌لاین وضعیت به شکل خاموت ---------- */
.khamoot-track { display: flex; align-items: center; margin: .8rem 0 1rem; }
.khamoot-track .node { display: flex; flex-direction: column; align-items: center; gap: .35rem; min-width: 84px; }
.khamoot-track .dot {
  width: 22px; height: 22px; border-radius: 6px; border: 3px solid var(--line);
  background: var(--card); position: relative;
}
.khamoot-track .node.done .dot { border-color: var(--molten); background: var(--molten); }
.khamoot-track .node.done .dot::after {
  content: "✓"; color: #fff; font-size: .75rem; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
}
.khamoot-track .lbl { font-size: .74rem; color: var(--muted); }
.khamoot-track .node.done .lbl { color: var(--molten); font-weight: 700; }
.khamoot-track .bar { flex: 1; height: 4px; background: var(--line); border-radius: 2px; margin: 0 -20px 22px; }
.khamoot-track .bar.done { background: var(--molten); }

/* ---------- فرم سفارش ---------- */
.item-row { background: var(--paper); border: 1px dashed var(--line); border-radius: var(--r-md); padding: var(--sp-md); margin-bottom: var(--sp-sm); }
.est-badge { font-variant-numeric: tabular-nums; }

/* شکل شماتیک محصول */
.shape-box { width: 54px; height: 42px; border: 3px solid var(--molten); border-radius: 5px; position: relative; }
.shape-box::before, .shape-box::after {
  content: ""; position: absolute; width: 12px; height: 3px; background: var(--molten);
  top: -3px; inset-inline-start: -6px; transform: rotate(-38deg);
}
.shape-box::after { top: 4px; transform: rotate(38deg); }
.shape-line { width: 54px; height: 3px; background: var(--molten); position: relative; margin: 20px 0; }
.shape-line::before, .shape-line::after {
  content: ""; position: absolute; width: 10px; height: 3px; background: var(--molten);
}
.shape-line::before { inset-inline-start: -2px; top: -7px; transform: rotate(50deg); }
.shape-line::after { inset-inline-end: -2px; top: -7px; transform: rotate(-50deg); }

/* ---------- عمومی ---------- */
.badge-status { font-size: .78rem; padding: .38em .7em; }
.overdue { color: #d33 !important; font-weight: 700; }
a { text-decoration: none; }
.num { font-variant-numeric: tabular-nums; }
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem;
  background: linear-gradient(160deg, var(--ink) 0%, var(--ink-2) 55%, #37506a 100%); }
.login-card { width: 100%; max-width: 400px; }

/* ---------- پرینت ---------- */
@media print {
  .no-print, .sidebar, .topbar { display: none !important; }
  .main { margin: 0 !important; }
  .content { padding: 0 !important; }
  body { background: #fff !important; }
  .card { border: none !important; box-shadow: none !important; }
  .print-sheet { font-size: 13px; }
}
.print-sheet table { border-collapse: collapse; width: 100%; }
.print-sheet th, .print-sheet td { border: 1px solid #444; padding: 6px 8px; text-align: center; }


/* ---------- بهبودهای ظاهری ---------- */
.btn { border-radius: var(--r-md); transition: transform var(--t-fast) var(--ease-bounce), box-shadow var(--t-base); }
.btn:active { transform: scale(.96); }
.form-control, .form-select { border-radius: var(--r-md); border-color: var(--line-strong); }
.form-control:focus, .form-select:focus {
  border-color: var(--molten); box-shadow: var(--sh-focus);
}
.card { box-shadow: var(--sh-sm); }
.table-hover tbody tr:hover { background: rgba(232,93,31,.05); }
.nav-pills .nav-link { color: var(--muted); font-weight: 600; border-radius: var(--r-md); min-height: var(--touch); }
.nav-pills .nav-link.active { background: var(--molten-surface); }
.alert { border-radius: var(--r-md); }
.price-input { max-width: 130px; }
::placeholder { color: var(--muted) !important; opacity: 1; }
.sms-check { background: var(--paper); border: 1px dashed var(--line); border-radius: var(--r-md); padding: var(--sp-sm) var(--sp-md); margin-bottom: var(--sp-sm); }


/* دراپ‌داون جستجوی مشتری */
.cust-dropdown {
  position: absolute; top: 100%; inset-inline: 0; z-index: 1050;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md);
  box-shadow: var(--sh-lg); max-height: 260px; overflow-y: auto; margin-top: var(--sp-xs);
}
.cust-item { padding: .55rem .8rem; cursor: pointer; font-size: .92rem; }
.cust-item:hover { background: rgba(232,93,31,.08); }
.form-control.is-valid { border-color: #2f9e63; background-image: none; }


/* ---------- صفحه ورود (سبک مخابرات من: شماره‌محور و تمیز) ---------- */
/* ---------- صفحه ورود (split screen) ---------- */
.auth-body { min-height: 100dvh; background: var(--paper); }
.auth-split { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 100dvh; }

/* پنل برند — همیشه تیره، مستقل از تم */
.auth-brand {
  position: relative; overflow: hidden; color: #fff;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: clamp(1.5rem, 4vw, 3rem);
  background:
    radial-gradient(900px 480px at 88% -12%, rgba(232,93,31,.28), transparent 62%),
    radial-gradient(700px 400px at 5% 108%, rgba(59,130,196,.18), transparent 60%),
    linear-gradient(158deg, #16212c 0%, #1b2733 45%, #24384a 100%);
}
/* نقش‌مایه میلگرد — تزئینی و کم‌رنگ، پشت محتوا */
.auth-brand::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: repeating-linear-gradient(115deg,
      rgba(255,255,255,.05) 0 2px, transparent 2px 26px);
  mask-image: linear-gradient(to bottom, transparent, #000 35%, #000 75%, transparent);
}
.auth-brand > * { position: relative; z-index: 1; }
.auth-brand .b-logo { max-height: 76px; max-width: 210px; object-fit: contain; }
.auth-brand .b-name { font-size: clamp(1.35rem, 2.4vw, 1.9rem); font-weight: 800; margin: .9rem 0 .35rem; letter-spacing: -.3px; }
.auth-brand .b-tag { color: #cfdae5; font-size: .95rem; line-height: 1.9; max-width: 42ch; }
.auth-brand .b-points { list-style: none; padding: 0; margin: 1.6rem 0 0; display: grid; gap: .7rem; }
.auth-brand .b-points li { display: flex; align-items: center; gap: .6rem; color: #dfe8f0; font-size: .92rem; }
.auth-brand .b-points .icon { color: var(--molten-light); flex-shrink: 0; }
.auth-brand .b-foot { color: #a9bccd; font-size: .84rem; display: flex; flex-wrap: wrap; gap: .35rem 1.2rem; }
.auth-brand .b-foot b { color: #fff; }

/* پنل فرم */
.auth-panel {
  display: flex; align-items: center; justify-content: center;
  padding: clamp(1.5rem, 4vw, 3rem); background: var(--card); position: relative;
}
.auth-form { width: 100%; max-width: 380px; }
.auth-form h1 { font-size: 1.32rem; font-weight: 800; margin: 0 0 .3rem; }
.auth-form .sub { color: var(--muted); font-size: .88rem; margin-bottom: 1.5rem; line-height: 1.8; }
.auth-theme { position: absolute; top: 1rem; inset-inline-end: 1rem; }

/* سگمنت انتخاب حالت ورود */
.auth-seg { display: grid; grid-auto-flow: column; gap: .25rem; background: var(--paper);
  border: 1px solid var(--line); border-radius: var(--r-md); padding: .25rem; margin-bottom: 1.4rem; }
.auth-seg button {
  border: 0; background: transparent; color: var(--muted); font-weight: 600; font-size: .88rem;
  padding: .55rem .4rem; border-radius: calc(var(--r-md) - 3px); min-height: 40px;
  display: flex; align-items: center; justify-content: center; gap: .4rem; cursor: pointer;
  transition: background var(--t-fast), color var(--t-fast);
}
.auth-seg button[aria-selected="true"] { background: var(--molten-surface); color: #fff; }
.auth-seg button:not([aria-selected="true"]):hover { color: var(--molten-on-light); }

.auth-phone { font-variant-numeric: tabular-nums; letter-spacing: 3px; font-weight: 700; }
.auth-divider { display: flex; align-items: center; gap: .8rem; color: var(--muted); font-size: .8rem; margin: 1.4rem 0 1rem; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.auth-alt { display: flex; align-items: center; justify-content: center; gap: .4rem;
  font-size: .86rem; color: var(--muted); }
.auth-alt a { font-weight: 700; }

@media (max-width: 900px) {
  .auth-split { grid-template-columns: 1fr; min-height: auto; }
  .auth-brand { padding: 1.5rem 1.25rem; }
  .auth-brand .b-points, .auth-brand .b-tag { display: none; }   /* موبایل: فقط هویت، بدون شلوغی */
  .auth-brand .b-name { font-size: 1.2rem; margin: .5rem 0 .2rem; }
  .auth-brand .b-logo { max-height: 52px; }
  .auth-panel { min-height: auto; padding: 1.75rem 1.25rem 2.5rem; }
}

/* ---------- صفحه پیگیری ---------- */
.track-body { background: var(--paper); min-height: 100vh; }
.track-header {
  background: linear-gradient(135deg, var(--ink), var(--ink-2));
  color: #fff; padding: .9rem 1.4rem;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .6rem;
}

/* ---------- ریزه‌کاری‌های بیشتر ---------- */
.sidebar nav a { transition: background var(--t-fast), color var(--t-fast); }
.sidebar nav a.active { box-shadow: var(--glow-molten); }
.topbar { box-shadow: 0 1px 0 var(--line); }
.stat-card { transition: transform var(--t-fast) var(--ease-bounce), box-shadow var(--t-fast); }
.stat-card:hover { transform: translateY(-2px); box-shadow: var(--sh-md); }
.btn-molten:focus-visible { box-shadow: var(--sh-focus); }
h2.fw-bold { display: flex; align-items: center; gap: .4rem; }


/* بند انگشتی عکس محصول در فرم سفارش */
.pt-thumb { height: 31px; width: 38px; object-fit: contain; border: 1px solid var(--line); border-radius: var(--r-sm); background: #fff; }


/* ---------- درخشش رنگی برای دکمه‌های عملیات (به‌جای سایه مشکی) ---------- */
.btn-molten { box-shadow: var(--glow-molten); }
.btn-molten:hover { box-shadow: var(--glow-molten); }
.btn-success { box-shadow: var(--glow-ok); }
.btn-outline-danger:hover { box-shadow: var(--glow-danger); }

/* دکمه‌های اصلی عملیات کارگاه: هدف لمسی امن برای دست دستکش‌دار */
.btn-lg, .card .btn-molten, .card .btn-success { min-height: var(--touch); }

/* بج وضعیت — با پالت وضعیت */
.badge-status { border-radius: var(--r-pill); }

/* کارت‌های آمار: نوار رنگی ضخیم‌تر برای خوانایی سریع از فاصله */
.stat-card .num { line-height: 1.2; }

/* درخشش کارت سفارش فوری در صف */
.table-warning { box-shadow: inset 4px 0 0 var(--warn); }

/* عنوان بخش‌ها — جداکننده نقطه‌چین */
.card > h6.fw-bold:first-child {
  border-bottom: 2px dashed var(--line);
  padding-bottom: var(--sp-sm);
  margin-bottom: var(--sp-md) !important;
}

/* احترام به تنظیم «کاهش حرکت» سیستم کاربر */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}


/* ---------- انتقال وضعیت با نوار رنگی کنار ردیف (به‌جای فقط بج) ---------- */
tr.st-pending  td:first-child { box-shadow: inset 5px 0 0 var(--warn); }
tr.st-queue    td:first-child { box-shadow: inset 5px 0 0 var(--muted); }
tr.st-ready    td:first-child { box-shadow: inset 5px 0 0 var(--ok); }
tr.st-shipped  td:first-child { box-shadow: inset 5px 0 0 var(--info); }
tr.st-canceled td:first-child { box-shadow: inset 5px 0 0 var(--danger); }
tr.st-canceled { opacity: .6; }


/* نوار سابقه مشتری در فرم سفارش */
.cust-info {
  background: var(--paper); border: 1px dashed var(--line); border-radius: var(--r-md);
  padding: var(--sp-sm) var(--sp-md); font-size: .88rem;
}


/* ---------- آیکون‌های SVG (جایگزین ایموجی) ---------- */
.icon {
  display: inline-block; vertical-align: -.18em; flex: 0 0 auto;
}
.sidebar nav a {
  display: flex; align-items: center; gap: .55rem;
}
.sidebar nav a .icon { opacity: .85; }
.sidebar nav a.active .icon,
.sidebar nav a:hover .icon { opacity: 1; }
.btn .icon { vertical-align: -.2em; }


/* ---------- پیام‌های شناور ---------- */
.toast-stack {
  position: fixed; inset-block-start: 1rem; inset-inline-end: 1rem;
  z-index: 1080; display: flex; flex-direction: column; gap: .5rem;
  max-width: min(420px, calc(100vw - 2rem));
}
.app-toast {
  display: flex; align-items: flex-start; gap: .55rem;
  padding: .7rem .9rem; border-radius: var(--r-md);
  background: var(--card, #fff); border: 1px solid var(--line);
  border-inline-start: 4px solid var(--muted);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
  animation: toast-in .22s ease-out;
}
.app-toast .icon { margin-top: .12rem; }
.app-toast.toast-ok { border-inline-start-color: var(--ok); }
.app-toast.toast-ok .icon { color: var(--ok); }
.app-toast.toast-err { border-inline-start-color: var(--danger); }
.app-toast.toast-err .icon { color: var(--danger); }
.toast-text { flex: 1; font-size: .9rem; line-height: 1.55; }
.toast-close {
  background: none; border: 0; color: var(--muted);
  font-size: 1.15rem; line-height: 1; cursor: pointer; padding: 0 .15rem;
}
.toast-close:hover { color: var(--danger); }
.toast-hide { opacity: 0; transform: translateY(-6px); transition: .25s ease; }
@keyframes toast-in { from { opacity: 0; transform: translateY(-10px); } }
@media print { .toast-stack { display: none; } }


/* ---------- صفحه‌بندی مشترک ---------- */
.pager {
  display: flex; flex-wrap: wrap; align-items: center; gap: .3rem;
  justify-content: center; padding-top: var(--sp-md);
}
.pager a, .pager .current {
  min-width: 2rem; padding: .25rem .55rem; text-align: center;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  text-decoration: none; font-size: .88rem;
}
.pager a { color: inherit; }
.pager a:hover { background: var(--paper); border-color: var(--molten); }
.pager .current { background: var(--molten); border-color: var(--molten); color: #fff; font-weight: 700; }
.pager-info { margin-inline-start: auto; color: var(--muted); font-size: .82rem; }


/* ---------- تقویم شمسی ---------- */
.datepicker-plot-area { font-family: "Vazirmatn", Tahoma, sans-serif !important; }
[data-bs-theme="dark"] .datepicker-plot-area {
  background: var(--ink-2) !important; color: #e7edf3 !important;
}
[data-bs-theme="dark"] .datepicker-plot-area .datepicker-day-view .table-days td span,
[data-bs-theme="dark"] .datepicker-plot-area .datepicker-header .btn-today,
[data-bs-theme="dark"] .datepicker-plot-area .datepicker-navigator .pwt-btn { color: #e7edf3 !important; }


/* ---------- دکمه شناور «ثبت سریع» ---------- */
.fab-wrap {
  /* سایدبار در RTL سمت inline-start (راست) است و z-index:1030 دارد؛
     دکمه شناور باید سمت مقابل بنشیند وگرنه کامل زیرش پنهان می‌شود. */
  position: fixed; inset-inline-end: 20px; inset-block-end: 20px;
  z-index: 1000; display: flex; flex-direction: column;
  align-items: flex-start; gap: 10px;
}
.fab-btn {
  width: 56px; height: 56px; border-radius: 50%; border: none;
  background: linear-gradient(135deg, var(--molten-light), var(--molten-dark));
  color: #fff; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 20px rgba(232, 93, 31, .45), inset 0 1px 0 rgba(255, 255, 255, .25);
  cursor: pointer; transition: transform .2s ease-out, box-shadow .2s ease;
}
.fab-btn:hover { box-shadow: 0 10px 28px rgba(232, 93, 31, .55); }
.fab-wrap.open .fab-btn { transform: rotate(45deg); }
.fab-menu {
  display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-sm);
  opacity: 0; transform: translateY(8px); pointer-events: none;
  transition: opacity .2s ease, transform .2s ease-out;
}
.fab-wrap.open .fab-menu { opacity: 1; transform: none; pointer-events: auto; }
.fab-item {
  display: flex; align-items: center; gap: var(--sp-sm);
  background: var(--card); color: inherit;
  border: 1px solid var(--line); border-radius: var(--r-pill);
  padding: 8px 14px; text-decoration: none;
  box-shadow: var(--sh-md); font-size: .85rem; font-weight: 600;
  white-space: nowrap;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.fab-item:hover { border-color: var(--molten); color: var(--molten-dark); }
.fab-item .icon { color: var(--molten); }
@media print { .fab-wrap { display: none; } }

/* ---------- نوار پایین موبایل ---------- */
/* در دسکتاپ اصلا وجود ندارد؛ زیر ۹۹۲ px جای دکمه شناور را می‌گیرد. */
.botbar { display: none; }

@media (max-width: 992px) {
  .botbar {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    position: fixed; inset-inline: 0; bottom: 0; z-index: 1025;
    background: var(--card);
    border-top: 1px solid var(--line);
    /* روی آیفون نوار خانه نباید روی دکمه‌ها بیفتد */
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-shadow: 0 -2px 14px rgba(0, 0, 0, .08);
  }
  .botbar-item {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 6px; min-height: 73px; padding: 9px 2px;
    background: none; border: 0;
    color: var(--muted); text-decoration: none;
    font-size: .86rem; font-weight: 600; line-height: 1.1;
    font-family: inherit; cursor: pointer;
  }
  .botbar-item .icon { color: currentColor; }
  .botbar-item.active { color: var(--molten-on-light); }
  .botbar-item:active { background: var(--row-alt); }
  .botbar-item:focus-visible { outline: 2px solid var(--molten); outline-offset: -3px; border-radius: var(--r-md); }

  /* دکمه ثبت سفارش — بالاتر از خط نوار می‌نشیند تا شاخص باشد */
  .botbar-fab {
    justify-self: center;
    width: 68px; height: 68px; margin-top: -26px;
    border-radius: 50%; border: 4px solid var(--card);
    background: linear-gradient(135deg, var(--molten-light), var(--molten-dark));
    color: #fff; display: flex; align-items: center; justify-content: center;
    box-shadow: 0 5px 16px rgba(232, 93, 31, .45);
    cursor: pointer; text-decoration: none;
  }
  .botbar-fab:focus-visible { outline: 3px solid var(--molten-dark); outline-offset: 2px; }

  /* نوار پایین جای دکمه شناور را کامل می‌گیرد.
     پرتال مشتری این کلاس را ندارد و دکمه شناورش سر جای خودش می‌ماند. */
  .fab-wrap.has-botbar { display: none; }

  /* محتوا زیر نوار پنهان نشود. .main فقط در پنل کارکنان هست —
     یعنی دقیقا همان جایی که نوار پایین وجود دارد. */
  .main .content { padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
}

@media print { .botbar { display: none !important; } }


/* ================================================================
   دسترس‌پذیری — طبق ممیزی ui-ux-pro-max
   ================================================================ */

/* ---------- ۱) حلقه فوکوس سراسری (WCAG 2.4.7 / 2.4.11) ----------
   قبلا فقط فیلدهای فرم و btn-molten حلقه فوکوس داشتند؛ لینک‌ها، دکمه‌های
   جدول، سایدبار، صفحه‌بندی و دکمه شناور با کیبورد قابل تشخیص نبودند. */
:where(a, button, [role="button"], input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--molten-on-light);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}
/* بوت‌استرپ ۵.۳ روی .btn/.nav-link/.btn-close مقدار outline:0 می‌گذارد و با specificity
   بالاتر قاعده بالا را خنثی می‌کند — این‌ها را صریح برمی‌گردانیم. */
.btn:focus-visible,
.nav-link:focus-visible,
.btn-close:focus-visible,
.page-link:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible,
.dropdown-item:focus-visible,
.btn-check:focus-visible + .btn {
  outline: 3px solid var(--molten-on-light) !important;
  outline-offset: 2px;
}
/* روی زمینه تیره سایدبار، حلقه نارنجی کم‌کنتراست است */
.sidebar :where(a, button):focus-visible,
.fab-btn:focus-visible {
  outline-color: #ffb38a;
}
/* مرورگرهای قدیمی که focus-visible ندارند حداقل فوکوس معمولی را نشان دهند */
:where(a, button):focus:not(:focus-visible) { outline: none; }

/* ---------- ۲) فوکوس نباید زیر نوار چسبان پنهان شود (WCAG 2.4.11) ---------- */
html { scroll-padding-top: 4.5rem; }

/* ---------- ۳) حداقل اندازه هدف اشاره‌گر ۲۴×۲۴ (WCAG 2.5.8) ----------
   دکمه‌های ریز ویرایش/حذف محموله زیر این حد بودند. */
.btn-sm.py-0 { min-height: 28px; min-width: 28px; }
.table td .btn-sm { min-height: 30px; }
.toast-close { min-width: 28px; min-height: 28px; }
.pager a, .pager .current { min-height: 32px; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- ۴) نارنجی به‌عنوان متن: نسخه کنتراست‌دار ---------- */
.khamoot-track .node.done .lbl,
.fab-item:hover,
.text-molten { color: var(--molten-on-light); }

/* ---------- ۵) وضعیت غیرفعال خوانا (MD: opacity 0.38–0.5) ---------- */
.btn:disabled, .btn.disabled, :disabled { opacity: .55; cursor: not-allowed; }

/* ---------- ۶) نشانگر ردیف جدول با کیبورد ---------- */
.table-hover tbody tr:focus-within { background: rgba(232,93,31,.08); }

/* ---------- ۷) احترام به تم سیستم در اولین بازدید ----------
   تم ذخیره‌شده کاربر (data-bs-theme روی html) همیشه اولویت دارد. */
@media (prefers-color-scheme: dark) {
  html:not([data-bs-theme]) body { background: #14191f; color: #e7edf3; }
}

/* ---------- ۸) قرمز خطر: کنتراست در هر دو زمینه ----------
   قرمز بوت‌استرپ روی سایدبار سرمه‌ای فقط ۳.۳۵:۱ بود و توکن --danger
   روی کارت سفید ۴.۲۵:۱ — هر دو رد می‌شدند. */
/* سایدبار همیشه زمینه تیره دارد، پس در هر دو تم قرمز روشن لازم است */
.sidebar .text-danger,
.sidebar a.text-danger { color: #ef7168 !important; }   /* 5.22:1 روی سایدبار */
.overdue { color: var(--danger-text) !important; }      /* توکن تم‌آگاه */

/* لینک خروج سایدبار: هدف اشاره‌گر زیر ۲۴px بود */
.sidebar .foot a { padding: 6px 10px; display: inline-flex; align-items: center;
  min-height: 28px; border-radius: var(--r-sm); }
.sidebar .foot a:hover { background: rgba(239,113,104,.14); }

/* ---------- ۹) دکمه‌های outline بوت‌استرپ ----------
   رنگ متن پیش‌فرض بوت‌استرپ در هیچ‌کدام از دو تم به ۴.۵:۱ نمی‌رسد:
   outline-danger روی item-row روشن ۴.۱۴ و روی کارت تیره ۳.۴۶؛
   outline-secondary روی کارت تیره ۳.۳۴. با توکن تم‌آگاه جایگزین شد. */
.btn-outline-danger { --bs-btn-color: var(--danger-text); --bs-btn-border-color: var(--danger-text); }
.btn-outline-secondary { --bs-btn-color: var(--muted); --bs-btn-border-color: var(--line-strong); }
.btn-outline-primary { --bs-btn-color: var(--molten-on-light); --bs-btn-border-color: var(--molten-on-light); }
.btn-outline-success { --bs-btn-color: var(--ok-text); --bs-btn-border-color: var(--ok-text); }
.btn-outline-success:hover { --bs-btn-hover-bg: #146c43; --bs-btn-hover-border-color: #146c43; }
/* روی حالت hover متن سفید روی زمینه پر می‌نشیند — آنجا مشکلی نیست */
.btn-outline-danger:hover { --bs-btn-hover-bg: var(--danger-text); --bs-btn-hover-border-color: var(--danger-text); }
.btn-outline-primary:hover { --bs-btn-hover-bg: var(--molten-surface); --bs-btn-hover-border-color: var(--molten-surface); }

/* ---------- ۱۰) لینک‌های متنی ----------
   آبی پیش‌فرض بوت‌استرپ روی زمینه‌های alert به ۴.۵:۱ نمی‌رسد (۳.۵۰ روی alert-secondary).
   لینک درون alert رنگ متن خود alert را به ارث می‌برد — کنتراستش تضمین‌شده است —
   و زیرخط می‌گیرد تا رنگ تنها نشانه‌ی لینک بودن نباشد (قاعده color-not-only). */
/* بوت‌استرپ ۵.۳ رنگ لینک را از --bs-link-color-rgb می‌خواند، نه --bs-link-color.
   (a { color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity,1)) }) */
:root {
  --bs-link-color: #b8430f;       --bs-link-color-rgb: 184, 67, 15;
  --bs-link-hover-color: #8f330a; --bs-link-hover-color-rgb: 143, 51, 10;
}
[data-bs-theme="dark"] {
  --bs-link-color: #f2703a;       --bs-link-color-rgb: 242, 112, 58;
  --bs-link-hover-color: #ff8b52; --bs-link-hover-color-rgb: 255, 139, 82;
}

/* ردیف «فوری»: بوت‌استرپ .table-warning را در تم تاریک تطبیق نمی‌دهد و زرد روشن
   می‌ماند؛ لینک و دکمه‌های تم تاریک روی آن ناخوانا می‌شوند. */
[data-bs-theme="dark"] .table-warning > td {
  --bs-table-color: #f3e6c4;
  --bs-table-bg: #3a2f14;
  background: #3a2f14; color: #f3e6c4;
}
[data-bs-theme="dark"] .table-warning > td a { color: #ffc06b; }
[data-bs-theme="dark"] .table-warning > td .btn-outline-secondary { --bs-btn-color: #e0cfa4; --bs-btn-border-color: #8a7742; }

/* :not(.btn) مهم است — وگرنه رنگ متن دکمه داخل alert هم عوض می‌شود و ناخوانا می‌گردد */
.alert a:not(.btn) { color: inherit; text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
/* لینک درون پاراگراف و متن راهنما هم باید بدون تکیه بر رنگ قابل تشخیص باشد */
.content p a:not(.btn), .form-text a, .alert a:not(.btn) { text-decoration: underline; }

/* ================================================================
   به‌روزرسانی ظاهر — لایه مشترک
   ================================================================ */

/* ---------- جدول‌های داده ---------- */
.table { --bs-table-border-color: var(--line); margin-bottom: 0; }
.table > thead > tr > th {
  background: var(--paper);
  border-bottom: 2px solid var(--line);
  font-size: .78rem; font-weight: 700; color: var(--muted);
  letter-spacing: .2px; white-space: nowrap;
  padding-block: .55rem;
}
.table > tbody > tr > td { padding-block: .6rem; }
/* راه‌راه ملایم: ردیف‌ها در جدول‌های بلند گم نشوند */
.table-hover > tbody > tr:nth-child(even) > td { background: var(--row-alt); }
.table-hover > tbody > tr:hover > td { background: rgba(232,93,31,.07); }
/* ستون عملیات آخر جدول همیشه جمع‌وجور */
.table td:last-child .btn-sm { white-space: nowrap; }

/* ---------- سربرگ داخل کارت ---------- */
.card-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-md); flex-wrap: wrap;
  padding-bottom: var(--sp-sm); margin-bottom: var(--sp-md);
  border-bottom: 1px solid var(--line);
}
.card-head h2 { margin: 0; font-weight: 700; display: flex; align-items: center; gap: .4rem; }
.card-head .icon { color: var(--molten-on-light); }
.card-head .head-meta { color: var(--muted); font-size: .82rem; }

/* ---------- حالت خالی ---------- */
.empty-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: var(--sp-sm); text-align: center;
  padding: var(--sp-xl) var(--sp-lg); color: var(--muted);
}
.empty-state .icon { width: 40px; height: 40px; color: var(--line-strong); }
.empty-state .es-title { font-weight: 700; color: inherit; font-size: .95rem; }
.empty-state .es-hint { font-size: .84rem; max-width: 46ch; line-height: 1.7; }
td > .empty-state { padding-block: var(--sp-lg); }

/* ---------- نوار فیلتر ---------- */
.filter-bar { background: var(--card); }
.filter-bar .form-label { font-size: .76rem; color: var(--muted); margin-bottom: .2rem; font-weight: 600; }

/* فیلترهای فعال — هر کدام با یک ضربدر برداشته می‌شود */
.filter-chips {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
  margin-top: .8rem; padding-top: .7rem; border-top: 1px solid var(--line);
}
.filter-chips .chip {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .2rem .55rem; min-height: 26px;
  background: var(--row-alt); border: 1px solid var(--line-strong);
  border-radius: 999px; font-size: .8rem;
  color: var(--bs-body-color); text-decoration: none;
}
.filter-chips .chip:hover {
  border-color: var(--molten-on-light); color: var(--molten-on-light);
}
.filter-chips .chip-x { display: inline-flex; opacity: .6; }
.filter-chips .chip:hover .chip-x { opacity: 1; }

/* سرستون‌های قابل مرتب‌سازی */
.th-sort {
  display: inline-flex; align-items: center; gap: .25rem;
  color: inherit; text-decoration: none; white-space: nowrap;
}
.th-sort::after {
  content: "↕"; font-size: .8em; opacity: .35; line-height: 1;
}
.th-sort:hover { color: var(--molten-on-light); }
.th-sort:hover::after { opacity: .7; }
.th-sort.desc, .th-sort.asc { color: var(--molten-on-light); }
.th-sort.desc::after { content: "↓"; opacity: 1; }
.th-sort.asc::after  { content: "↑"; opacity: 1; }

/* ---------- بازخورد ثبت فرم ---------- */
.btn .spin {
  width: 14px; height: 14px; border-radius: 50%;
  border: 2px solid currentColor; border-inline-start-color: transparent;
  display: inline-block; vertical-align: -2px; margin-inline-end: .4rem;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .btn .spin { animation-duration: 2s; } }

/* سربرگ بخش داخل کارت — فقط فرزند مستقیم، تا h6 داخل فرم/ردیف فلکس درگیر نشود */
.card > h6.fw-bold {
  padding-bottom: .45rem;
  margin-bottom: .8rem;
  border-bottom: 1px solid var(--line);
}
.card > h6.fw-bold .icon { color: var(--molten-on-light); }
/* کارتی که .card-head دارد سربرگ خودش را می‌سازد */
.card > .card-head + h6.fw-bold { border-top: 0; }


/* ---------- ۱۱) رنگ‌های معنایی متن بوت‌استرپ ----------
   .text-success و .text-danger پیش‌فرض بوت‌استرپ در تم تاریک (۳.۴۶) و حتی روی
   راه‌راه تم روشن (۴.۲۹) رد می‌شوند. با توکن تم‌آگاه جایگزین شدند.
   سایدبار استثناست چون همیشه زمینه تیره دارد و بالاتر جدا تنظیم شده. */
.text-success { color: var(--ok-text) !important; }
:not(.sidebar) > .text-danger,
.table .text-danger,
.content .text-danger { color: var(--danger-text) !important; }

/* ---------- ۱۲) چک‌باکس و رادیو ----------
   پیش‌فرض بوت‌استرپ ۱۶×۱۶px است و از حداقل ۲۴×۲۴ (WCAG 2.5.8) کمتر می‌ماند.
   در کارگاه با دست دستکش‌دار هم زدنش سخت است. به ۲۴px می‌رسانیم و
   فاصله‌های .form-check را متناسبش می‌کنیم. */
.form-check { padding-inline-start: 2rem; min-height: 1.5rem; }
.form-check .form-check-input { width: 1.5rem; height: 1.5rem; margin-inline-start: -2rem; margin-top: 0; }
.form-check-label { padding-top: .15rem; cursor: pointer; }
.form-check-input { cursor: pointer; }
/* چک‌باکس داخل جدول نباید ردیف را بلند کند */
.table .form-check { margin-bottom: 0; }

/* ---------- ۱۳) گزارش‌ها ---------- */
.range-banner {
  display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;
  background: var(--card); border: 1px solid var(--line);
  border-inline-start: 4px solid var(--molten-surface);
  border-radius: var(--r-md); padding: .5rem .8rem; margin-bottom: var(--sp-md);
  font-size: .88rem;
}
.range-banner .icon { color: var(--molten-on-light); }
/* جداکننده تزئینی است؛ رنگش را به muted می‌بریم و از درخت دسترس‌پذیری هم حذفش می‌کنیم */
.range-banner .sep { color: var(--muted); }
.kpi-row .stat-card .num { font-size: 1.45rem; }
.kpi-row .stat-card .lbl { font-size: .78rem; line-height: 1.5; }

/* سربرگ مخصوص چاپ — روی صفحه پنهان، فقط در پرینت دیده می‌شود */
.print-only { display: none; }
@media print {
  .print-only { display: block; }
  .report-print-head {
    display: flex; justify-content: space-between; align-items: flex-start;
    border-bottom: 2px solid #222; padding-bottom: 6px; margin-bottom: 10px;
  }
  .report-print-head h2 { margin: 0; font-size: 16px; }
  .kpi-row .stat-card { border: 1px solid #999 !important; }
  /* جدول‌ها هنگام چاپ نباید وسط ردیف بشکنند */
  .table tr { break-inside: avoid; }
  thead { display: table-header-group; }
}

/* ---------- ۱۴) بنر و لینک سایت در پنل ورود ---------- */
/* بنر پشت لایه تیره می‌نشیند. شفافیت ۱۵٪ عمدی است: حتی اگر مدیر یک عکس
   کاملا سفید آپلود کند، کم‌کنتراست‌ترین متن پنل (پانویس) روی نتیجه ترکیب‌شده
   ۴.۸۲:۱ می‌ماند. با ۳۰٪ همان متن به ۲.۹۱ می‌افتاد و ناخوانا می‌شد. */
.auth-brand.has-banner::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background-image: var(--login-banner);
  background-size: cover; background-position: center;
  opacity: .15;
}
.auth-brand.has-banner { background-blend-mode: normal; }
.auth-brand.has-banner > * { position: relative; z-index: 1; }

.b-site {
  display: inline-flex; align-items: center; gap: .45rem;
  margin-top: 1.6rem; padding: .5rem .95rem;
  border: 1px solid rgba(255,255,255,.35); border-radius: var(--r-pill);
  color: #fff; font-size: .88rem; font-weight: 600; text-decoration: none;
  transition: background var(--t-fast), border-color var(--t-fast);
}
.b-site:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.6); color: #fff; }
.b-site .icon { color: var(--molten-light); }
@media (max-width: 900px) { .b-site { display: none; } }

/* ---------- پیش‌نمایش پنل ورود در صفحه پروفایل ---------- */
.login-preview {
  position: relative; overflow: hidden; color: #fff; min-height: 240px;
  padding: 1.25rem; margin: 0 1rem 1rem; border-radius: var(--r-md);
  background:
    radial-gradient(500px 260px at 88% -12%, rgba(232,93,31,.28), transparent 62%),
    linear-gradient(158deg, #16212c 0%, #1b2733 45%, #24384a 100%);
}
.login-preview .lp-bg {
  position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .15;
}
.login-preview .lp-content { position: relative; z-index: 1; }
.login-preview .lp-logo { max-height: 40px; max-width: 130px; object-fit: contain; margin-bottom: .5rem; }
.login-preview .lp-name { font-weight: 800; font-size: 1.05rem; }
.login-preview .lp-tag { color: #cfdae5; font-size: .82rem; line-height: 1.8; margin-top: .25rem; }
.login-preview .lp-points { list-style: none; padding: 0; margin: .8rem 0 0; display: grid; gap: .35rem; }
.login-preview .lp-points li { display: flex; align-items: center; gap: .4rem; color: #dfe8f0; font-size: .8rem; }
.login-preview .lp-points .icon { color: var(--molten-light); flex-shrink: 0; }
.login-preview .lp-site {
  display: inline-flex; align-items: center; gap: .35rem; margin-top: .9rem;
  border: 1px solid rgba(255,255,255,.35); border-radius: var(--r-pill);
  padding: .3rem .7rem; font-size: .78rem;
}

/* ---------- ۱۵) سهم درصدی در تاپ محصول‌ها ---------- */
.share { color: var(--muted); font-size: .78rem; margin-inline-start: .3rem; }
.share-bar {
  height: 4px; background: var(--line); border-radius: 2px;
  margin-top: .3rem; overflow: hidden; max-width: 120px;
}
.share-bar span { display: block; height: 100%; background: var(--molten-surface); border-radius: 2px; }

/* ---------- متغیرهای قابل درج در متن پیامک ---------- */
.tpl-ph {
  display: inline-block; cursor: pointer; user-select: none;
  margin: 2px 2px 2px 0; padding: 2px 7px;
  background: var(--row-alt); border: 1px solid var(--line);
  border-radius: var(--r-sm); color: var(--molten-on-light);
  font-size: .82em; font-family: inherit;
}
.tpl-ph:hover { border-color: var(--molten); background: var(--card); }
.tpl-ph:focus-visible { outline: 2px solid var(--molten); outline-offset: 1px; }

/* ---------- اندازه تیتر بخش‌ها ---------- */
/* تیتر هر کارت از نظر معنایی h2 است (زیر h1 صفحه در نوار بالا) ولی
   اندازه‌اش باید همان h6 قبلی بماند وگرنه بوتسترپ خیلی بزرگش می‌کند. */
.content h2:not(.h1):not(.h2):not(.h3):not(.h4):not(.h5):not(.h6),
.modal-title {
  font-size: 1rem;
  line-height: 1.5;
  margin-bottom: .5rem;
}
.content h2:last-child { margin-bottom: 0; }
/* تیترهایی که کلاس اندازه بوتسترپ دارند اندازه خودشان را نگه می‌دارند */

/* ---------- فهرست ثبت ارسال (جریان موبایل) ---------- */
.ship-list { display: grid; gap: 10px; }
.ship-card {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 14px 16px; min-height: 76px; text-decoration: none; color: inherit;
  box-shadow: var(--sh-sm); transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.ship-card:hover { border-color: var(--molten); box-shadow: var(--glow-molten); }
.ship-card:focus-visible { outline: 2px solid var(--molten); outline-offset: 2px; }
.ship-card:active { background: var(--row-alt); }
.ship-main { min-width: 0; }
.ship-code { font-weight: 800; font-size: 1.05rem; }
.ship-cust { font-weight: 600; }
.ship-proj { color: var(--muted); font-size: .85rem; }
.ship-side { text-align: start; flex: none; }
.ship-kg { font-weight: 700; margin-top: .35rem; }
.ship-hint { color: var(--muted); font-size: .72rem; }

/* ---------- مقایسه دوره ---------- */
.cmp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.cmp { border: 1px solid var(--line); border-radius: var(--r-md); padding: 10px 12px; }
.cmp-l { display: block; font-size: .78rem; color: var(--muted); }
.cmp-n { display: block; font-size: 1.25rem; font-weight: 800; line-height: 1.3; }
.cmp-n small { font-size: .62em; font-weight: 400; color: var(--muted); }
.cmp-d { display: block; font-size: .85rem; font-weight: 700; }
.cmp-b { display: block; font-size: .72rem; color: var(--muted); }

/* ---------- کارنامه مشتری ---------- */
.scorecard { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.scorecard > div { border: 1px solid var(--line); border-radius: var(--r-md); padding: 10px 12px; }
.scorecard span { display: block; font-size: .76rem; color: var(--muted); }
.scorecard b { font-size: 1.15rem; font-variant-numeric: tabular-nums; }

/* ---------- تفکیک وزن بر اساس سایز میلگرد ---------- */
.size-split-title {
  font-size: .78rem; color: var(--muted); margin: .7rem 0 .35rem;
}
.size-split { display: flex; flex-wrap: wrap; gap: 8px; }
.size-chip {
  display: flex; align-items: baseline; gap: 8px;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 6px 12px;
}
.size-chip .ss-name { font-size: .82rem; color: var(--muted); }
.size-chip .ss-kg { font-weight: 700; }
.size-chip .ss-pct { font-size: .76rem; color: var(--molten-on-light); }

/* در صفحه سفارش، ستون وزن واقعی کنار تقریبی */
.size-table td.actual { font-weight: 700; }
.size-table td.est { color: var(--muted); }

/* ---------- تب‌های صف کارگاه در داشبورد ---------- */
.queue-tabs { gap: .25rem; }
.queue-tabs .nav-link { padding: .3rem .85rem; font-size: .88rem; display: inline-flex; align-items: center; gap: .4rem; }
/* شمارنده روی هر دو تم و هر دو حالت خوانا بماند: از رنگ متن خود دکمه ته‌رنگ می‌گیرد */
.queue-tabs .nav-link .badge { background: color-mix(in srgb, currentColor 16%, transparent); color: inherit; font-weight: 600; }

/* ---------- پلاک خودرو ---------- */
/* ظاهر پلاک واقعی: نوار آبی «ایران» در چپ، بعد دو رقم، حرف، سه رقم و کد شهر.
   رنگ‌ها ثابت‌اند (سفید و مشکی) چون پلاک در تم تاریک هم پلاک است. */
.plate-input, .plate {
  display: inline-flex; align-items: stretch; direction: ltr;
  border: 2px solid #111; border-radius: 8px; background: #fff; overflow: hidden;
  font-variant-numeric: tabular-nums; max-width: 100%;
}
.plate-ir {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  background: #16357a; color: #fff; padding: 3px 5px; flex: none;
}
.plate-ir .flag { display: flex; flex-direction: column; width: 15px; height: 10px; border: 1px solid rgba(255,255,255,.5); }
.plate-ir .flag i { flex: 1; }
.plate-ir .flag .g { background: #239f40; }
.plate-ir .flag .w { background: #fff; }
.plate-ir .flag .r { background: #da0000; }
.plate-ir b { font-size: .55rem; line-height: 1; font-weight: 700; }
.plate-box {
  border: 0; border-radius: 0; background: #fff; color: #111;
  text-align: center; font-weight: 800; font-size: 1.2rem; padding: .3rem .2rem; min-width: 0;
}
.plate-box:focus { outline: 2px solid var(--molten); outline-offset: -2px; }
.plate-left, .plate-region { width: 3.1rem; }
.plate-middle { width: 4.1rem; }
.plate-letter { width: 3.4rem; font-size: 1.15rem; text-align: center; appearance: none; -webkit-appearance: none; cursor: pointer; }
.plate-div { width: 2px; background: #111; flex: none; }
/* نمایش فقط‌خواندنی — همان ظاهر، کوچک‌تر */
.plate-view .plate-cell {
  display: inline-flex; align-items: center; justify-content: center;
  color: #111; font-weight: 800; font-size: .95rem; padding: .15rem .3rem; min-width: 1.6rem;
}
.plate-view .plate-cell-letter { min-width: 1.9rem; }
.plate-view .plate-ir b { font-size: .5rem; }
/* در چاپ، نوار آبی و پس‌زمینه سفید باید واقعا چاپ شوند */
@media print {
  .plate, .plate-input { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---------- جایگذاری پلاک در فرم ---------- */
/* ویجت باید مثل بقیه فیلدها زیر برچسبش بنشیند نه کنارش، ارتفاعش با فیلد همسایه
   یکی باشد، و در ستون باریک به‌جای سرریز، خودش جمع شود. */
.plate-input { display: flex; width: max-content; max-width: 100%; min-height: 38px; }
.plate-input .plate-box { flex: 0 1 auto; min-width: 0; font-size: 1.1rem; padding-block: .2rem; }
/* کنار فیلدهای بزرگ (form-control-lg) */
.plate-input.plate-lg { min-height: 48px; }
.plate-lg .plate-box { font-size: 1.3rem; }
/* کنار فیلدهای کوچک (form-control-sm) */
.plate-input.plate-sm { min-height: 32px; }
.plate-sm .plate-box { font-size: 1rem; padding: .15rem .2rem; }
.plate-sm .plate-left, .plate-sm .plate-region { width: 2.5rem; }
.plate-sm .plate-middle { width: 3.2rem; }
.plate-sm .plate-letter { width: 2.8rem; font-size: .95rem; }
.plate-sm .plate-ir b { font-size: .5rem; }

/* ---------- ورودی مبلغ ---------- */
.amount-wrap { display: block; }
/* مبلغ به حروف زیر فیلد — نقشش یادآوری است نه تزئین، پس کم‌رنگ ولی خوانا */
.amount-words {
  min-height: 1.15rem; margin-top: .3rem; font-size: .82rem; line-height: 1.5;
  color: inherit; font-weight: 600;
}
.amount-words:empty { display: none; }

/* ---------- راهنمای اپراتور موبایل ---------- */
.phone-hint { font-size: .78rem; color: var(--muted); min-height: 1rem; margin-top: .2rem; }
.phone-hint:empty { display: none; }

/* ---------- درصد تغییر روی کارت آمار ---------- */
.stat-delta {
  display: inline-flex; align-items: center; gap: .2rem;
  font-size: .78rem; font-weight: 700; margin-top: .15rem;
}
.stat-delta.up { color: var(--ok-text); }
.stat-delta.down { color: var(--danger-text); }
.stat-delta.flat { color: var(--muted); font-weight: 600; }
.stat-delta .cmp { color: var(--muted); font-weight: 500; }
