@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-Regular.woff2)format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-Medium.woff2)format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-Bold.woff2)format("woff2");font-weight:700;font-display:swap}

/* ==========================================================================
   بانک قطعات — «میز کار»
   خاکستری سرد کارگاه، سبز سولدرماسک برای کنش، برنجی فقط برای شمارهٔ قفسه.
   برنجی در کل برنامه هیچ کار دیگری نمی‌کند؛ چشم که دنبالش بگردد، قفسه را
   پیدا می‌کند. همین یک قرار، کل ناوبری بصری برنامه است.
   ========================================================================== */

:root{
  /* سطح‌ها */
  --bg:#e8ecea; --bg-2:#dfe4e2; --card:#fff; --card-2:#f6f8f7;
  --line:#d6dcda; --line-soft:#e6eae9;
  /* متن */
  --ink:#131d1b; --ink-2:#3c4a47; --muted:#697874;
  /* رنگ کنش */
  --accent:#0f6d5c; --accent-ink:#0b5245; --accent-soft:#e3efeb; --accent-line:#bcd9d1;
  /* برنجی قفسه */
  --tag:#7d550f; --tag-bg:#f7ecd2; --tag-line:#e4d0a4;
  /* هشدار */
  --warn:#96361a; --warn-bg:#fbe5dd; --warn-line:#f0c7b8;
  /* سایه */
  --sh-1:0 1px 2px rgba(19,29,27,.06);
  --sh-2:0 2px 6px rgba(19,29,27,.08), 0 1px 2px rgba(19,29,27,.05);
  --sh-3:0 12px 32px rgba(19,29,27,.16), 0 3px 10px rgba(19,29,27,.10);
  /* اندازه */
  --r:12px; --r-sm:9px; --r-xs:7px;
  --sp:4px;
  --code:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --tap:34px;
}
html[data-theme=dark]{
  --bg:#121817; --bg-2:#171f1d; --card:#1c2523; --card-2:#222c2a;
  --line:#2c3a37; --line-soft:#26312f;
  --ink:#e3ebe8; --ink-2:#c3cfcc; --muted:#8c9d99;
  --accent:#4fbfa4; --accent-ink:#7fd6c0; --accent-soft:#17302b; --accent-line:#28473f;
  --tag:#e0b268; --tag-bg:#2e2718; --tag-line:#453a22;
  --warn:#e08e70; --warn-bg:#36211a; --warn-line:#4d3024;
  --sh-1:none; --sh-2:none; --sh-3:0 16px 40px rgba(0,0,0,.55);
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;padding:0}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 8px)}
body{
  font-family:Vazirmatn,Tahoma,system-ui,sans-serif;
  background:var(--bg); color:var(--ink);
  font-size:15px; line-height:1.7;
  -webkit-text-size-adjust:100%;
  padding-top:env(safe-area-inset-top,0px);
  overscroll-behavior-y:none;
}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:none;background:none;padding:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-xs)}
::selection{background:var(--accent-soft);color:var(--accent-ink)}

/* نشان برنامه */
.mark svg{display:block;width:100%;height:100%}
.mark svg rect{fill:var(--accent)}
.mark svg rect.b{fill:var(--tag-bg)}
.mark.sm{width:24px;height:24px;flex:0 0 auto}

/* ---------- قفل ---------- */
.lock{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);z-index:60;padding:20px}
.lock-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:28px 22px;width:min(350px,100%);display:grid;gap:10px;box-shadow:var(--sh-2);
  justify-items:stretch;text-align:center}
.lock-box .mark{width:40px;height:40px;margin:0 auto 4px}
.lock-box h1{margin:0;font-size:19px}
.lock-box p{margin:0 0 6px;color:var(--muted);font-size:13px}
.lock-box input{padding:12px;border-radius:var(--r-sm);border:1px solid var(--line);
  background:var(--bg);text-align:center}
.lock-box button{padding:12px;border-radius:var(--r-sm);background:var(--accent);
  color:#fff;font-weight:700}
.err{color:var(--warn);font-size:13px;min-height:19px}

/* ---------- سربرگ ---------- */
.top{position:sticky;top:0;z-index:30;background:var(--bg);
  padding:calc(env(safe-area-inset-top,0px) + 8px) 14px 8px;
  border-bottom:1px solid var(--line)}
.top-row{display:flex;align-items:center;gap:9px;max-width:1180px;margin:0 auto}
.top-row h1{margin:0;font-size:16.5px;font-weight:700;flex:1;letter-spacing:-.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-actions{display:flex;gap:2px}
.icon{width:var(--tap);height:var(--tap);border-radius:var(--r-sm);font-size:16px;
  color:var(--muted);display:grid;place-items:center}
.icon:hover{background:var(--card);color:var(--ink)}
.icon:active{background:var(--bg-2)}

.search-wrap{position:relative;margin:9px auto 0;max-width:1180px}
.s-ico{position:absolute;inset-inline-start:12px;top:50%;transform:translateY(-50%);
  width:17px;height:17px;fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round;
  pointer-events:none}
#q{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);
  background:var(--card);box-shadow:var(--sh-1);transition:border-color .13s,box-shadow .13s;
  /* منطقی، نه فیزیکی: در راست‌چین «ابتدا» سمت راست است — همان‌جا که آیکون نشسته */
  padding-inline-start:40px; padding-inline-end:38px}
#q:focus{outline:none;border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft)}
#q::placeholder{color:var(--muted)}
#q::-webkit-search-cancel-button{display:none}
.clear{position:absolute;inset-inline-end:8px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border-radius:var(--r-xs);color:var(--muted);font-size:19px;
  display:grid;place-items:center}
.clear:hover{background:var(--bg-2);color:var(--ink)}

.chips-wrap{position:relative;max-width:1180px;margin:0 auto}
.chips{display:flex;gap:6px;overflow-x:auto;margin-top:9px;padding-bottom:2px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;padding:5px 12px;border-radius:999px;border:1px solid var(--line);
  background:var(--card);font-size:12.5px;color:var(--ink-2);white-space:nowrap;
  transition:background .13s,color .13s,border-color .13s}
.chip:hover{border-color:var(--accent-line)}
.chip[aria-pressed=true]{background:var(--accent);border-color:transparent;color:#fff;font-weight:500}
.chip.warn[aria-pressed=true]{background:var(--warn)}

.bar{display:flex;align-items:center;gap:6px;margin:10px auto 0;max-width:1180px;flex-wrap:wrap}
.spacer{flex:1}
.count{font-size:12px;color:var(--muted);margin:8px auto 0;max-width:1180px;
  font-variant-numeric:tabular-nums}

.views{display:flex;border:1px solid var(--line);border-radius:var(--r-sm);
  overflow:hidden;background:var(--card)}
.views button{padding:7px 11px;font-size:12.5px;color:var(--muted);
  border-inline-start:1px solid var(--line);transition:background .13s,color .13s}
.views button:first-child{border-inline-start:none}
.views button:hover{color:var(--ink);background:var(--card-2)}
.views button[aria-pressed=true]{background:var(--accent);color:#fff;font-weight:500}
#sort{padding:7px 9px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--card);font-size:12.5px;color:var(--ink-2);max-width:155px}

.primary,.ghost,.danger{padding:8px 14px;border-radius:var(--r-sm);font-size:13.5px;
  font-weight:500;transition:background .13s,border-color .13s,color .13s;white-space:nowrap}
.primary{background:var(--accent);color:#fff;box-shadow:var(--sh-1)}
.primary:hover{background:var(--accent-ink)}
.ghost{border:1px solid var(--line);background:var(--card);color:var(--ink-2)}
.ghost:hover{border-color:var(--accent-line);color:var(--ink)}
.danger{border:1px solid var(--warn-line);color:var(--warn);background:transparent}
.danger:hover{background:var(--warn-bg)}
#btnQuick[aria-pressed=true]{background:var(--accent);color:#fff;border-color:transparent}

.quick{display:flex;gap:6px;margin:9px auto 0;max-width:1180px}
.quick input{padding:10px 11px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--card);min-width:0}
#qa_name{flex:3}
#qa_shelf{flex:1.2;min-width:72px}
#qa_qty{flex:0 0 68px;text-align:center;font-family:var(--code)}
.quick button{padding:9px 13px;border-radius:var(--r-sm);font-size:13px}

/* ---------- فهرست ---------- */
.list{padding:12px 14px 4px;display:grid;gap:7px;max-width:920px;margin:0 auto}
.list.view-table,.list.view-cards{max-width:1180px}

.row{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--sh-1);overflow:hidden;transition:border-color .13s,box-shadow .13s}
.row:hover{border-color:var(--accent-line);box-shadow:var(--sh-2)}
.row-main{display:flex;align-items:stretch}

/* برچسب قفسه — تنها عنصر برنجی برنامه */
.tag{flex:0 0 auto;min-width:68px;display:grid;place-content:center;text-align:center;
  background:var(--tag-bg);color:var(--tag);border-inline-end:1px solid var(--tag-line);
  padding:9px 7px;cursor:pointer;transition:background .13s}
.tag:hover{background:var(--card-2)}
.tag b{font-family:var(--code);font-size:18px;line-height:1.2;letter-spacing:.4px;
  display:block;direction:ltr;font-weight:700}
.tag small{font-size:10px;opacity:.8;display:block;margin-top:1px}
.tag.none{background:transparent;color:var(--muted);border-inline-end-color:var(--line-soft);cursor:default}

.info{flex:1;min-width:0;padding:9px 12px;cursor:pointer}
.name{font-weight:700;font-size:14.5px;display:flex;gap:7px;align-items:baseline;flex-wrap:wrap;
  line-height:1.5}
.name .mpn{font-family:var(--code);font-size:12px;color:var(--muted);font-weight:400;direction:ltr}
.meta{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:6px;
  white-space:nowrap;overflow:hidden}
.meta>span:first-child{overflow:hidden;text-overflow:ellipsis}

.qty{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;padding:7px 9px;border-inline-start:1px solid var(--line-soft);min-width:62px}
.qty-n{font-family:var(--code);font-size:17px;font-weight:700;cursor:text;min-width:36px;
  text-align:center;border-radius:var(--r-xs);transition:color .13s,background .13s}
.qty-n:hover{background:var(--bg-2)}
.qty-n.low{color:var(--warn)}
.qty-btns{display:flex;gap:4px}
.qty-btns button{width:28px;height:25px;border-radius:var(--r-xs);background:var(--bg-2);
  color:var(--muted);font-size:15px;line-height:1;transition:background .13s,color .13s}
.qty-btns button:hover{background:var(--accent-soft);color:var(--accent)}
.qty-edit{width:58px;padding:2px 4px;border:1px solid var(--accent);border-radius:var(--r-xs);
  background:var(--card);font-family:var(--code);font-size:15px;text-align:center;
  -moz-appearance:textfield}
.qty-edit::-webkit-outer-spin-button,.qty-edit::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

.badges{display:inline-flex;gap:5px;flex:0 0 auto}
.badges span{font-size:10.5px;border-radius:999px;padding:0 7px;white-space:nowrap;
  border:1px solid var(--line);color:var(--muted);line-height:1.65}
.b-file{border-color:var(--tag-line)!important;color:var(--tag)!important;background:var(--tag-bg)}
.b-spec{opacity:.9}

/* ---------- جزئیات ---------- */
.detail{border-top:1px dashed var(--line);padding:11px 13px;display:none;background:var(--card-2)}
.row.open .detail{display:block}
.detail.always{display:block;border-top:none;padding:0;background:transparent}
.detail p{margin:0 0 9px;font-size:13.5px;color:var(--ink-2)}
.specs{display:grid;grid-template-columns:auto 1fr;gap:3px 14px;font-size:12.5px;margin:0 0 6px}
.specs dt{color:var(--muted);font-family:var(--code);direction:ltr;text-align:right}
.specs dd{margin:0;direction:ltr;text-align:right;word-break:break-word;color:var(--ink-2)}
.specs .grp{grid-column:1/-1;font-size:11.5px;font-weight:700;color:var(--accent);
  margin:10px 0 3px;padding-bottom:3px;border-bottom:1px solid var(--accent-line);
  letter-spacing:.2px}
.specs .grp:first-child{margin-top:0}
.spec-count{font-size:11px;color:var(--muted);margin:0 0 9px;font-family:var(--code)}
.app-notes{background:var(--accent-soft);border:1px solid var(--accent-line);
  border-radius:var(--r-sm);padding:9px 11px;margin:0 0 9px}
.app-notes strong{display:block;font-size:12.5px;color:var(--accent-ink);margin-bottom:2px}
.app-notes p{margin:0;font-size:13px;color:var(--ink-2)}
.own-note{font-size:13px;color:var(--muted)}
.pill{display:inline-block;background:var(--accent-soft);color:var(--accent-ink);
  border-radius:999px;padding:1px 9px;font-size:11.5px;margin:0 0 6px 5px}
.links{display:flex;gap:10px;flex-wrap:wrap;font-size:13px;align-items:center}
.links a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent-line)}
.links a:hover{border-bottom-color:var(--accent)}
.links .edit{margin-inline-start:auto;color:var(--muted);text-decoration:underline;font-size:12.5px}
.links .edit:hover{color:var(--ink)}

.empty{text-align:center;color:var(--muted);padding:52px 18px;font-size:14px;
  background:var(--card);border:1px dashed var(--line);border-radius:var(--r)}
.empty b{display:block;color:var(--ink);font-size:16px;margin-bottom:6px}

.more{max-width:920px;margin:9px auto 0;padding:0 14px;text-align:center}
.more button{width:100%;padding:11px}

.foot{max-width:1180px;margin:16px auto;padding:0 14px calc(env(safe-area-inset-bottom,0px) + 18px);
  display:flex;gap:16px;align-items:center;font-size:12.5px;color:var(--muted);flex-wrap:wrap}
.link{color:var(--accent);text-decoration:underline;font-size:12.5px}
.link:hover{color:var(--accent-ink)}
.foot span{margin-inline-start:auto;font-family:var(--code);opacity:.7}

/* ---------- نمای کارتی ---------- */
.list.view-cards{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:9px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--sh-1);padding:11px;display:grid;gap:8px;cursor:pointer;
  grid-template-rows:auto 1fr auto;transition:border-color .13s,box-shadow .13s,transform .13s}
.card:hover{border-color:var(--accent-line);box-shadow:var(--sh-2)}
.card-top{display:flex;align-items:flex-start;gap:8px}
.card .tag.sm{min-width:0;border:1px solid var(--tag-line);padding:4px 9px;
  border-radius:var(--r-xs);justify-self:start}
.card .tag.sm b{font-size:15px}
.thumb{margin-inline-start:auto;width:46px;height:46px;object-fit:contain;
  border-radius:var(--r-xs);background:#fff;border:1px solid var(--line)}
.card .card-body{min-width:0}
.card .name{font-weight:700;font-size:14px;line-height:1.45;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .mpn{font-family:var(--code);font-size:11.5px;color:var(--muted);direction:ltr;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .meta{font-size:11.5px;color:var(--muted);margin-top:2px}
.card .qty{border:none;border-top:1px solid var(--line-soft);flex-direction:row;
  justify-content:space-between;padding:7px 0 0;min-width:0}

/* ---------- نمای جدولی ---------- */
.list.view-table{display:block;padding-inline:10px}
.tbl{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;font-size:13px;
  box-shadow:var(--sh-1)}
.tbl thead th{position:sticky;top:0;background:var(--card-2);z-index:2;text-align:start;
  font-size:11.5px;font-weight:500;color:var(--muted);padding:9px 10px;
  border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:6px 10px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.tbl tbody tr:last-child td{border-bottom:none}
.tbl tbody tr{cursor:pointer;transition:background .1s}
.tbl tbody tr:hover{background:var(--accent-soft)}
.t-shelf{white-space:nowrap;font-family:var(--code);color:var(--tag);font-weight:700;
  direction:ltr;text-align:start;width:1%;cursor:pointer}
.t-shelf small{opacity:.7;font-weight:400}
.t-name{font-weight:500}
.tbl .mpn{font-family:var(--code);font-size:11.5px;color:var(--muted);direction:ltr;
  margin-inline-start:6px}
.t-dim{color:var(--muted);font-size:12px;white-space:nowrap;max-width:140px;
  overflow:hidden;text-overflow:ellipsis}
.t-qty{width:1%}
.t-qty .qty{border:none;flex-direction:row;gap:7px;padding:0;min-width:0}
.t-qty .qty-n{font-size:14px}
@media(max-width:680px){.hide-s{display:none}}

/* ---------- گروه قفسه ---------- */
.shelf-head{display:flex;align-items:baseline;gap:9px;margin:16px 2px 3px;
  padding-bottom:5px;border-bottom:2px solid var(--tag-line)}
.shelf-head b{font-size:14px;color:var(--tag);font-family:var(--code);direction:ltr}
.shelf-head span{font-size:11.5px;color:var(--muted)}
.shelf-head .mv{margin-inline-start:auto;font-size:11.5px;color:var(--accent);
  text-decoration:underline}
.list.view-shelf .shelf-head:first-child{margin-top:0}

/* ==========================================================================
   پنجره‌ها — روی دسکتاپ کارت وسط، روی موبایل شیت چسبیده به کف
   ========================================================================== */
dialog{border:none;padding:0;background:transparent;max-width:640px;width:100%;
  color:var(--ink)}
dialog::backdrop{background:rgba(8,16,15,.55);backdrop-filter:blur(2px)}
.sheet{background:var(--card);border:1px solid var(--line);border-radius:16px;
  box-shadow:var(--sh-3);display:flex;flex-direction:column;max-height:86vh;overflow:hidden}
.sheet.tall{height:86vh}
.grab{display:none}
.sheet-head{display:flex;align-items:center;gap:8px;font-size:15.5px;
  padding:14px 16px;border-bottom:1px solid var(--line-soft);flex:0 0 auto}
.sheet-head strong{flex:1;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sheet-body{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:14px 16px;display:grid;gap:12px;align-content:start}
.sheet>.sheet-body:last-child{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 16px)}
.sheet-foot{display:flex;gap:8px;align-items:center;flex:0 0 auto;
  padding:12px 16px calc(env(safe-area-inset-bottom,0px) + 12px);
  border-top:1px solid var(--line-soft);background:var(--card-2)}
.hint{margin:0;font-size:12.5px;color:var(--muted);line-height:1.65}

/* زبانه‌های پنجرهٔ قطعه */
.tabs{display:flex;gap:4px;padding:0 16px;flex:0 0 auto;
  border-bottom:1px solid var(--line-soft);background:var(--card)}
.tabs button{padding:10px 14px;font-size:13.5px;color:var(--muted);font-weight:500;
  border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .13s,border-color .13s}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected=true]{color:var(--accent);border-bottom-color:var(--accent)}
.panel{display:grid;gap:12px}

.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grid label{display:grid;gap:4px;font-size:12.5px;color:var(--muted);min-width:0}
.grid label.f-2{grid-column:1/-1}
.grid label.row{display:flex;align-items:center;gap:9px;color:var(--ink);font-size:13.5px}
.grid input,.grid select,.grid textarea,#askQ,#shopText{
  width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--bg);color:var(--ink);font-size:14px;
  transition:border-color .13s,box-shadow .13s}
.grid input:focus,.grid select:focus,.grid textarea:focus,#askQ:focus{
  outline:none;border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft)}
.grid textarea{resize:vertical;line-height:1.7}
.grid label.row input{width:auto}
.grid code{font-family:var(--code);font-size:11px;background:var(--bg-2);
  padding:1px 4px;border-radius:4px;direction:ltr;display:inline-block}

.lookup{display:grid;gap:7px}
.lookup input{padding:10px 11px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--bg)}
.lookup-btns{display:flex;gap:7px}
.lookup-btns button{flex:1;padding:9px 12px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--card);font-size:13px;color:var(--ink-2);
  transition:border-color .13s,color .13s}
.lookup-btns button:hover{border-color:var(--accent-line);color:var(--accent)}
.lookup-out{display:grid;gap:6px}
.cand{border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 11px;text-align:start;
  background:var(--bg);font-size:13px;display:grid;gap:2px;width:100%;
  transition:border-color .13s}
.cand b{font-family:var(--code);direction:ltr;text-align:start}
.cand span{color:var(--muted);font-size:12px;display:block;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.cand:hover{border-color:var(--accent)}

.ask-out{white-space:pre-wrap;font-size:14px;line-height:1.9;color:var(--ink-2)}
#shopText{font-family:var(--code);font-size:12.5px;line-height:1.9;resize:vertical}

/* ---------- فایل‌ها ---------- */
.files{display:grid;gap:10px}
.files-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.files-head strong{font-size:13.5px}
.files-head .hint{font-family:var(--code);font-size:11px;direction:ltr}
.file-list{display:grid;gap:6px}
.file-list.view{margin:0 0 9px}
.file-row{display:flex;gap:6px;align-items:center}
.file-row .x{width:32px;height:32px;border-radius:var(--r-xs);color:var(--warn);
  font-size:18px;flex:0 0 auto;display:grid;place-items:center}
.file-row .x:hover{background:var(--warn-bg)}
.file-chip{flex:1;min-width:0;display:flex;align-items:center;gap:9px;text-decoration:none;
  border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;background:var(--bg);
  color:var(--ink);font-size:13px;transition:border-color .13s}
.file-chip:hover{border-color:var(--accent-line)}
.file-chip .fk{flex:0 0 auto;font-size:10.5px;color:var(--tag);background:var(--tag-bg);
  border:1px solid var(--tag-line);border-radius:999px;padding:0 8px}
.file-chip .fn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-chip .fs{flex:0 0 auto;font-size:11px;color:var(--muted);font-family:var(--code)}
.drop{border:1.5px dashed var(--line);border-radius:var(--r);padding:18px 14px;
  text-align:center;display:grid;gap:9px;justify-items:center;background:var(--bg);
  transition:border-color .13s,background .13s}
.drop.hot{border-color:var(--accent);background:var(--accent-soft)}
.drop.off{opacity:.55}
.d-ico{width:26px;height:26px;fill:none;stroke:var(--muted);stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.drop p{margin:0;font-size:13.5px}
.drop-btns{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}
.drop-btns button{padding:8px 14px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--card);font-size:12.5px;transition:border-color .13s,color .13s}
.drop-btns button:hover{border-color:var(--accent-line);color:var(--accent)}

/* ---------- پنجرهٔ نمایش ---------- */
.view-head{display:flex;gap:10px;align-items:stretch;margin-bottom:2px}
.view-head .tag{border:1px solid var(--tag-line);border-radius:var(--r-sm);min-width:84px}
.view-head .qty{border:1px solid var(--line);border-radius:var(--r-sm);min-width:76px}
#dlgView .sheet-head .icon{color:var(--accent)}

/* ---------- پشتیبان ---------- */
.bk-group{border:1px solid var(--line);border-radius:var(--r);padding:12px;display:grid;
  gap:9px;background:var(--bg)}
.bk-group>strong{font-size:13.5px}
.bk-row{display:flex;gap:11px;align-items:center;flex-wrap:wrap}
.bk-row button{flex:0 0 auto;min-width:160px}
.bk-row .hint{flex:1;min-width:160px}
.snaps{display:grid;gap:5px;max-height:230px;overflow:auto}
.snap{display:flex;align-items:center;gap:9px;font-size:12.5px;border:1px solid var(--line);
  border-radius:var(--r-sm);padding:6px 10px;background:var(--card)}
.sn-when{font-family:var(--code);direction:ltr;white-space:nowrap}
.sn-why{color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sn-n{color:var(--tag);white-space:nowrap}
.snap button{padding:5px 10px;font-size:12px;border-radius:var(--r-xs);white-space:nowrap}

/* ---------- پیام ---------- */
.toast{position:fixed;inset-inline:0;bottom:calc(env(safe-area-inset-bottom,0px) + 18px);
  margin:auto;width:fit-content;max-width:calc(100% - 28px);background:var(--ink);
  color:var(--bg);padding:10px 18px;border-radius:999px;font-size:13.5px;z-index:99;
  display:flex;align-items:center;gap:14px;box-shadow:var(--sh-3)}
.toast .undo{color:var(--tag);font-weight:700;text-decoration:underline;font-size:13px;
  white-space:nowrap}

/* ==========================================================================
   موبایل
   ========================================================================== */
@media(max-width:560px){
  :root{--tap:38px}
  body{font-size:15px}
  .top{padding-inline:12px}
  .list{padding-inline:12px}
  .bar{gap:5px}
  .views button{padding:7px 9px}
  #sort{max-width:132px;flex:1}
  .bar .primary,.bar .ghost{padding:8px 11px;font-size:13px}
  .quick{flex-wrap:wrap}
  #qa_name{flex:1 0 100%}
  .quick button{flex:1}
  .tag{min-width:62px}
  .tag b{font-size:17px}

  /* شیت کف‌چسب */
  dialog{max-width:100%;margin:0;top:auto;bottom:0;
    position:fixed;height:auto;max-height:100%}
  dialog::backdrop{background:rgba(8,16,15,.6)}
  .sheet{border-radius:18px 18px 0 0;border-bottom:none;max-height:92dvh;width:100%}
  .sheet.tall{height:92dvh}
  .grab{display:block;width:38px;height:4px;border-radius:2px;background:var(--line);
    margin:8px auto 0;flex:0 0 auto}
  .sheet-head{padding:10px 14px 12px}
  .sheet-body{padding:13px 14px}
  .sheet-foot{padding:11px 14px calc(env(safe-area-inset-bottom,0px) + 11px)}
  .tabs{padding-inline:14px}
  .tabs button{flex:1;padding:11px 6px;font-size:13px}

  /* زیر ۱۶ پیکسل، iOS موقع فوکوس صفحه را زوم می‌کند */
  .grid input,.grid select,.grid textarea,.lookup input,#askQ,#q,
  .quick input,.lock-box input{font-size:16px}
  .grid{grid-template-columns:1fr}
  .grid label.f-2{grid-column:auto}
  .lookup-btns{flex-direction:column}
  .lookup-btns button{padding:11px}
  .icon{width:38px;height:38px}
  .qty-btns button{width:32px;height:28px}
  .bk-row button{min-width:100%}
  .sn-why{display:none}
  .file-row .x{width:36px;height:36px}
}
@media(max-width:400px){
  .views button{padding:7px 7px;font-size:12px}
  .bar .ghost{padding:8px 9px}
}
@media(min-width:561px){
  dialog{margin:auto}
}

/* ==========================================================================
   چاپ
   ========================================================================== */
@media print{
  .top,.foot,.more,#lock,dialog,.toast{display:none!important}
  #app::before{content:attr(data-print);display:block;font-weight:700;font-size:13pt;
    margin-bottom:8pt;padding-bottom:4pt;border-bottom:2px solid #000}
  body{background:#fff;color:#000;font-size:11pt;padding:0}
  .list{max-width:none;padding:0;gap:0;display:block}
  .row{border:none;border-bottom:1px solid #ccc;border-radius:0;box-shadow:none;
    break-inside:avoid;page-break-inside:avoid;display:flex}
  .row .qty-btns,.row .badges{display:none}
  .row-main{width:100%}
  .tag{background:#fff!important;color:#000!important;border-inline-end:1px solid #ccc;min-width:58px}
  .qty{border-inline-start:1px solid #ccc}
  .qty-n{color:#000!important;font-weight:700}
  .detail{display:none!important}
  .shelf-head{break-after:avoid;page-break-after:avoid;margin:10pt 0 2pt;border-bottom:2px solid #000}
  .shelf-head b{color:#000}
  .shelf-head .mv{display:none}
  a[href]:after{content:""}
}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}