/* Renox Invoices — پوستهٔ پنل کاربر و صفحات عمومی */

@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}
@font-face{font-family:'Vazirmatn';src:url('../fonts/Vazirmatn-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap}

:root{
  --bg:#080d12;
  --bg2:#0e161e;
  --panel:#111c25;
  --panel2:#16232e;
  --line:#1f313e;
  --line2:#27404f;
  --txt:#e7f2f8;
  --dim:#8fa9b9;
  --dim2:#657e8e;
  --brand:#078fc3;
  --accent:#23c5f5;
  --good:#2fbf8f;
  --warn:#e0a63a;
  --bad:#e0604f;
  --r:14px;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--bg);color:var(--txt);
  font-family:'Vazirmatn',Tahoma,system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:14.5px;line-height:1.75;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body[dir="ltr"]{font-family:'Vazirmatn',-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent);text-decoration:none}
img{max-width:100%}
input,select,textarea,button{font-family:inherit;font-size:inherit;color:inherit}
::selection{background:rgba(35,197,245,.28)}

/* ---------- نوار بالا ---------- */
/* پس‌زمینه عمداً کاملاً مات است (نه شیشه‌ای): روی آیفون نوار وضعیت روی همین نوار
   می‌افتد و هر شفافیتی آنجا به شکل یک نوار مه‌آلود دیده می‌شود. */
.topbar{
  position:sticky;top:0;z-index:40;background:#080d12;
  border-bottom:1px solid var(--line);
}
.topbar-in{max-width:1400px;margin:0 auto;display:flex;align-items:center;gap:14px;padding:10px 16px}
.brandmark{display:flex;align-items:center;gap:9px;font-weight:800;font-size:16px;white-space:nowrap}
.brandmark .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent)}
.spacer{flex:1}

.credits-chip{
  display:flex;align-items:center;gap:7px;background:var(--panel);border:1px solid var(--line2);
  border-radius:999px;padding:5px 13px;font-size:12.5px;white-space:nowrap;
}
.credits-chip b{color:var(--accent);font-size:14px}
/* هرچه اعتبار کمتر شود، چیپ پررنگ‌تر هشدار می‌دهد */
.credits-chip.warn{border-color:rgba(224,166,58,.55);background:rgba(224,166,58,.10);color:#f5d190}
.credits-chip.warn b{color:var(--warn)}
.credits-chip.low{border-color:rgba(224,140,60,.7);background:rgba(224,120,60,.14);color:#ffc9a0}
.credits-chip.low b{color:#ff9d55}
.credits-chip.zero{border-color:rgba(224,96,79,.75);background:rgba(224,96,79,.16);color:#ffb4a8;animation:creditPulse 2.2s ease-in-out infinite}
.credits-chip.zero b{color:#ff7a66}
@keyframes creditPulse{0%,100%{box-shadow:0 0 0 0 rgba(224,96,79,.35)}50%{box-shadow:0 0 0 6px rgba(224,96,79,0)}}
.tb-btn.renew{background:linear-gradient(120deg,var(--brand),var(--accent));color:#04212d;border-color:transparent;font-weight:800}
.tb-btn.renew:hover{filter:brightness(1.08)}

.tb-btn{
  background:var(--panel);border:1px solid var(--line2);border-radius:10px;
  padding:7px 12px;cursor:pointer;font-size:13px;font-weight:600;color:var(--txt);
  display:inline-flex;align-items:center;gap:6px;transition:.18s;white-space:nowrap;
}
.tb-btn:hover{background:var(--panel2);border-color:var(--accent)}
.tb-btn.ghost{background:transparent}

.langsw{display:flex;gap:2px;padding:3px;border-radius:9px;background:var(--panel);border:1px solid var(--line)}
.langsw button{border:0;background:transparent;color:var(--dim);font-size:12px;font-weight:700;padding:4px 10px;border-radius:7px;cursor:pointer;transition:.18s}
.langsw button.active{background:linear-gradient(90deg,var(--brand),var(--accent));color:#04212d}

/* ---------- تب‌ها ---------- */
.tabs{max-width:1400px;margin:0 auto;display:flex;gap:6px;padding:0 16px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{
  background:transparent;border:0;border-bottom:2px solid transparent;color:var(--dim);
  padding:11px 14px;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;transition:.18s;
}
.tab:hover{color:var(--txt)}
.tab.active{color:var(--accent);border-bottom-color:var(--accent)}

/* ---------- چیدمان ---------- */
.wrap{max-width:1400px;margin:0 auto;padding:18px 16px 60px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
@media(max-width:1100px){.split{grid-template-columns:1fr}}

.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.card + .card{margin-top:14px}
.card h3{font-size:14.5px;font-weight:800;margin-bottom:4px;display:flex;align-items:center;gap:8px}
.card h3 .ic{font-size:16px}
.card .hint{font-size:12px;color:var(--dim2);line-height:1.8;margin-bottom:12px}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}

/* ---------- فرم ---------- */
.grid{display:grid;gap:10px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:1fr 1fr 1fr}
@media(max-width:620px){.g2,.g3{grid-template-columns:1fr}}

.f{display:block}
.f > span{display:block;font-size:12px;color:var(--dim);margin-bottom:5px;font-weight:600}
.f > span em{font-style:normal;color:var(--dim2);font-weight:400}

.in,select.in,textarea.in{
  width:100%;background:var(--bg2);border:1px solid var(--line2);border-radius:10px;
  padding:9px 12px;color:var(--txt);transition:.15s;outline:0;
}
.in:focus,select.in:focus,textarea.in:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(35,197,245,.12)}
.in::placeholder{color:#4c6273}
textarea.in{resize:vertical;min-height:72px;line-height:1.8}
.in.ltr{direction:ltr;text-align:left}
select.in{cursor:pointer;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--dim) 50%),linear-gradient(135deg,var(--dim) 50%,transparent 50%);background-position:calc(14px) calc(50% - 2px),calc(19px) calc(50% - 2px);background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-left:32px}
body[dir="ltr"] select.in{background-position:calc(100% - 19px) calc(50% - 2px),calc(100% - 14px) calc(50% - 2px);padding-left:12px;padding-right:32px}

.seg{display:flex;gap:4px;background:var(--bg2);border:1px solid var(--line2);border-radius:10px;padding:3px}
.seg button{flex:1;border:0;background:transparent;color:var(--dim);padding:7px 10px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:700;transition:.16s}
.seg button.active{background:var(--brand);color:#fff}
.seg.sm button{padding:5px 8px;font-size:12px}

.btn{
  border:0;border-radius:11px;padding:11px 18px;font-weight:800;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.18s;font-size:14px;
}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.primary{background:linear-gradient(120deg,var(--brand),var(--accent));color:#04212d}
.btn.primary:hover:not(:disabled){filter:brightness(1.08)}
.btn.soft{background:var(--panel2);color:var(--txt);border:1px solid var(--line2)}
.btn.soft:hover:not(:disabled){border-color:var(--accent)}
.btn.danger{background:rgba(224,96,79,.14);color:#ffb4a8;border:1px solid rgba(224,96,79,.4)}
.btn.block{width:100%}
.btn.sm{padding:7px 12px;font-size:12.5px;border-radius:9px}

/* ---------- ردیف‌های اقلام ---------- */
.items-head,.item-row{display:grid;grid-template-columns:34px minmax(0,1fr) 78px 130px 130px 34px;gap:8px;align-items:start}
.items-head{font-size:11.5px;color:var(--dim2);font-weight:700;padding:0 2px 6px}
.item-row{padding:8px;border:1px solid var(--line);border-radius:11px;background:var(--bg2);margin-bottom:8px}
.item-row .rn{padding-top:9px;text-align:center;color:var(--dim);font-weight:700;font-size:13px}
.item-row .lt{padding-top:9px;text-align:center;font-weight:800;color:var(--accent);font-size:13px;direction:ltr}
.item-row textarea{min-height:42px}

.xrow{background:transparent;border:0;color:var(--dim2);cursor:pointer;font-size:17px;padding:6px 0;transition:.15s}
.xrow:hover{color:var(--bad)}
@media(max-width:760px){
  .items-head{display:none}
  .item-row{grid-template-columns:28px 1fr 30px;gap:7px}
  .item-row .desc-c{grid-column:2/4}
  .item-row .qty-c,.item-row .unit-c{grid-column:2/4}
  .item-row .lt{grid-column:2/4;text-align:start;padding-top:0}
  .item-row .m-lbl{display:block;font-size:11px;color:var(--dim2);margin-bottom:3px}
}
.m-lbl{display:none}

/* ---------- جمع ---------- */
.totbox{background:var(--bg2);border:1px solid var(--line2);border-radius:12px;padding:12px 14px;margin-top:10px}
.totline{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 0;font-size:13.5px;color:var(--dim)}
.totline b{color:var(--txt);direction:ltr;font-weight:700}
.totline.sum{border-top:1px solid var(--line2);margin-top:6px;padding-top:11px;font-size:16px;color:var(--txt);font-weight:800}
.totline.sum b{color:var(--accent);font-size:18px}
.totline.disc b{color:#ffa08e}

/* ---------- تم ---------- */
.themes{display:flex;flex-wrap:wrap;gap:9px}
.swatch{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:.16s;position:relative;outline:0}
.swatch:hover{transform:scale(1.08)}
.swatch.active{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.18)}
.swatch span{position:absolute;inset:0;display:none}

/* ---------- پیش‌نمایش ---------- */
.preview-col{position:sticky;top:106px}
@media(max-width:1100px){.preview-col{position:static}}
.pv-bar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:10px}
.pv-stage{
  background:#22333d;border:1px solid var(--line);border-radius:var(--r);
  padding:14px 0;overflow:auto;max-height:calc(100vh - 190px);
}
@media(max-width:1100px){.pv-stage{max-height:none}}
.pv-stage .rnx-pages{transform-origin:top center}

/* ---------- جدول آرشیو ---------- */
.filters{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;align-items:end}
@media(max-width:980px){.filters{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.filters{grid-template-columns:1fr}}

.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th{text-align:start;font-size:12px;color:var(--dim2);font-weight:700;padding:0 10px 9px;white-space:nowrap}
.tbl td{padding:11px 10px;border-top:1px solid var(--line)}
.tbl tr:hover td{background:var(--panel2)}
.tbl .num{direction:ltr;font-weight:700;color:var(--accent);white-space:nowrap}
.tbl .amt{direction:ltr;font-weight:800;white-space:nowrap}
.tbl .acts{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.kind-pill{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap}
.kind-pill.inv{background:rgba(35,197,245,.15);color:#8fe2ff}
.kind-pill.pro{background:rgba(224,166,58,.15);color:#f5cf86}
@media(max-width:820px){
  .tbl thead{display:none}
  .tbl tr{display:block;border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:8px;background:var(--bg2)}
  .tbl td{display:flex;justify-content:space-between;gap:10px;border:0;padding:5px 4px}
  .tbl td::before{content:attr(data-l);color:var(--dim2);font-size:12px}
  .tbl .acts{justify-content:flex-start}
}
.empty{text-align:center;color:var(--dim2);padding:44px 12px;font-size:14px}

/* ---------- داشبورد ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;position:relative;overflow:hidden}
.stat::after{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:3px;background:linear-gradient(var(--brand),var(--accent))}
.stat .lbl{font-size:12px;color:var(--dim2);font-weight:600}
.stat .val{font-size:21px;font-weight:800;margin-top:4px;direction:ltr;text-align:start;letter-spacing:.2px}
.stat .val small{font-size:12px;color:var(--dim);font-weight:600;margin-inline-start:4px}
.stat .sub{font-size:11.5px;color:var(--dim2);margin-top:3px}
.stat .up{color:var(--good)}
.stat .down{color:var(--bad)}
.stat.wide .val{font-size:17px;direction:inherit}

.chartbox{margin-top:14px}
.chart{display:flex;align-items:flex-end;gap:6px;height:210px;padding:10px 4px 0;border-bottom:1px solid var(--line2)}
.bar{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px;height:100%;position:relative}
.bar .fill{width:100%;max-width:42px;border-radius:7px 7px 0 0;background:linear-gradient(180deg,var(--accent),var(--brand));min-height:3px;transition:height .5s cubic-bezier(.2,.8,.2,1)}
.bar .fill.zero{background:var(--line2)}
.bar .tip{position:absolute;bottom:100%;margin-bottom:6px;background:#04161f;border:1px solid var(--line2);border-radius:8px;padding:3px 8px;font-size:11px;white-space:nowrap;opacity:0;pointer-events:none;transition:.15s;direction:ltr;z-index:5}
.bar:hover .tip{opacity:1}
.chart-x{display:flex;gap:6px;padding-top:7px}
.chart-x span{flex:1;text-align:center;font-size:10.5px;color:var(--dim2);min-width:0;overflow:hidden;white-space:nowrap}

.toplist{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.toprow{display:flex;align-items:center;gap:10px;padding:8px 4px;border-top:1px solid var(--line)}
.toprow:first-child{border-top:0}
.toprow .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.toprow .cnt{font-size:11.5px;color:var(--dim2);white-space:nowrap}
.toprow .amt{direction:ltr;font-weight:800;color:var(--accent);white-space:nowrap}

/* ---------- مودال ---------- */
.modal{position:fixed;inset:0;background:rgba(2,7,11,.78);backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;padding:18px;z-index:120}
.modal.show{display:flex}
.modal .box{
  background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:22px;
  width:min(470px,100%);max-height:90vh;overflow:auto;box-shadow:0 26px 70px rgba(0,0,0,.6);
  animation:pop .22s cubic-bezier(.2,.9,.3,1.1);
}
.modal .box.wide{width:min(720px,100%)}
@keyframes pop{from{transform:translateY(14px) scale(.97);opacity:0}to{transform:none;opacity:1}}
.modal h4{font-size:17px;font-weight:800;margin-bottom:8px}
.modal p{color:var(--dim);font-size:13.5px;line-height:1.95;margin-bottom:16px}
.modal .acts{display:flex;gap:9px;flex-wrap:wrap}
.modal .acts .btn{flex:1;min-width:130px}

/* ---------- توست ---------- */
.toast{
  position:fixed;left:50%;transform:translateX(-50%) translateY(20px);bottom:26px;
  background:#04212d;border:1px solid var(--accent);color:var(--txt);
  border-radius:12px;padding:11px 20px;font-weight:700;font-size:13.5px;z-index:200;
  opacity:0;pointer-events:none;transition:.28s;box-shadow:0 12px 40px rgba(0,0,0,.5);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.bad{border-color:var(--bad)}

/* ---------- اسپینر ---------- */
.spin{width:19px;height:19px;border:2.5px solid rgba(255,255,255,.22);border-top-color:#fff;border-radius:50%;animation:sp .7s linear infinite;display:inline-block}
@keyframes sp{to{transform:rotate(360deg)}}

/* ---------- تقویم شمسی ---------- */
.jcal{background:var(--panel);border:1px solid var(--line2);border-radius:14px;padding:12px;width:min(320px,100%)}
.jcal-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.jcal-hd b{font-size:14.5px;font-weight:800}
.jcal-nav{background:var(--bg2);border:1px solid var(--line2);border-radius:8px;width:30px;height:30px;cursor:pointer;color:var(--txt);font-size:15px;line-height:1}
.jcal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.jcal-grid .dow{text-align:center;font-size:10.5px;color:var(--dim2);padding:3px 0;font-weight:700}
.jcal-grid button{background:transparent;border:1px solid transparent;border-radius:8px;padding:7px 0;cursor:pointer;color:var(--txt);font-size:13px;transition:.13s}
.jcal-grid button:hover{background:var(--panel2);border-color:var(--line2)}
.jcal-grid button.today{border-color:var(--accent);color:var(--accent)}
.jcal-grid button.sel{background:var(--brand);color:#fff;font-weight:800}
.jcal-grid button.blank{visibility:hidden}
.jcal-ft{display:flex;gap:8px;margin-top:10px}

/* ---------- صفحهٔ قیمت ---------- */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:16px}
.plan{
  background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:22px 20px;
  position:relative;display:flex;flex-direction:column;gap:9px;transition:.2s;
}
.plan:hover{border-color:var(--accent);transform:translateY(-3px)}
.plan.hot{border-color:var(--accent);box-shadow:0 0 0 1px rgba(35,197,245,.25),0 16px 46px rgba(7,143,195,.16)}
.plan .badge{position:absolute;top:-11px;inset-inline-start:20px;background:linear-gradient(120deg,var(--brand),var(--accent));color:#04212d;font-size:11.5px;font-weight:800;padding:3px 12px;border-radius:999px}
.plan .pname{font-size:16px;font-weight:800}
.plan .pcr{font-size:13px;color:var(--dim)}
.plan .pcr b{color:var(--accent);font-size:20px;font-weight:800}
.plan .pprice{font-size:26px;font-weight:800;direction:ltr;text-align:start;margin-top:auto}
.plan .pprice small{font-size:13px;color:var(--dim);font-weight:600;margin-inline-start:5px}
.plan .per{font-size:11.5px;color:var(--dim2)}

/* ---------- فوتر ---------- */
.foot{border-top:1px solid var(--line);margin-top:40px;padding:22px 16px 40px;text-align:center;color:var(--dim2);font-size:12.5px}
.foot a{color:var(--dim)}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media print{
  .topbar,.tabs,.pv-bar,.no-print,.expbar,.foot,.modal{display:none!important}
  .wrap{padding:0;max-width:none}
  .pv-stage{background:#fff;border:0;padding:0;max-height:none;overflow:visible}
  .pv-fit{width:auto!important;height:auto!important;overflow:visible!important;margin:0!important}
  .card{border:0;background:#fff;padding:0}
  /* موقع چاپ فقط برگهٔ فاکتور روی کاغذ برود، نه فرم و ستون کناری */
  body.printing .split > div:first-child,
  body.printing [data-panel]:not([data-panel="new"]):not([data-panel="view"]){display:none!important}
  body.printing .preview-col{width:100%!important;max-width:none!important}
}

/* لایهٔ اندازه‌گیریِ پیش‌نمایش A4 */
.pv-fit{position:relative}
.pv-fit .rnx-pages{width:210mm;margin:0}

/* نوار اعلان PWA (نسخهٔ جدید / نصب روی دستگاه) */
.pwa-bar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom));
  display:flex;align-items:center;gap:9px;z-index:220;
  background:#04212d;border:1px solid var(--accent);border-radius:14px;
  padding:9px 12px;font-size:13px;font-weight:600;box-shadow:0 14px 44px rgba(0,0,0,.55);
  max-width:calc(100vw - 24px);
}
.pwa-bar span{white-space:normal}

/* کادر واریز در مودال تمدید */
.paybox{background:var(--bg2);border:1px dashed var(--accent);border-radius:13px;padding:13px 15px}
.payline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13.5px;color:var(--dim)}
.payline + .payline{margin-top:7px}
.payline.sub{font-size:12.5px}
.payline b{color:var(--txt);font-weight:800}
.payline b.cardno{direction:ltr;letter-spacing:1.5px;font-size:16px;color:var(--accent);cursor:pointer;user-select:all}
.btn.receipt{background:linear-gradient(120deg,#229ED9,#3fc0f0);color:#03212e;width:100%;font-size:14.5px}
.btn.receipt:hover{filter:brightness(1.08)}

/* لوگوی برنامه در نوار بالا و کارت ورود */
.brandmark img{width:28px;height:28px;border-radius:8px;flex:none}
.loginlogo{display:block;width:64px;height:64px;border-radius:17px;margin:0 auto 12px;
  box-shadow:0 8px 24px rgba(7,143,195,.28)}

/* ============================================================
   چیدمان موبایل — هدف: هیچ اسکرول افقی، هیچ زوم هنگام تایپ
   ============================================================ */

/* ردیف دوم نوار بالا (اعتبار / تمدید / پشتیبانی) */
.topbar-in.row2{padding-top:0;padding-bottom:9px;gap:8px;flex-wrap:wrap}
.pv-title{font-weight:800;font-size:13px;white-space:nowrap}
.tb-btn[disabled],.tb-btn.locked{opacity:.4;cursor:not-allowed;filter:grayscale(.5)}
.tb-btn.locked:hover{border-color:var(--line2);background:var(--panel)}

/* کادر پیش‌نمایش: زوم فقط داخل همین کادر اسکرول می‌سازد، نه کل صفحه */
.pv-stage{overscroll-behavior:contain}
.pv-stage.tall{max-height:calc(100vh - 170px)}

@media(max-width:760px){
  /* ورودی‌ها باید ۱۶px باشند وگرنه iOS موقع فوکوس صفحه را زوم می‌کند */
  .in,select.in,textarea.in{font-size:16px}
  body{font-size:15px}

  .topbar-in{padding:9px 12px;gap:9px}
  .topbar-in.row2{padding:0 12px 9px}
  .brandmark{font-size:14.5px;gap:7px;min-width:0;overflow:hidden;text-overflow:ellipsis}
  .brandmark img{width:24px;height:24px}
  .tb-btn{padding:7px 10px;font-size:12.5px}
  .credits-chip{padding:5px 11px;font-size:12px}

  /* تب‌ها: چهار تا کنار هم، بدون اسکرول افقی */
  .tabs{padding:0 8px;gap:0}
  .tab{flex:1 1 0;min-width:0;padding:10px 4px;font-size:12.5px;text-align:center;
       overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  .wrap{padding:14px 12px 70px}
  .card{padding:13px;border-radius:12px}

  /* پیش‌نمایش تمام‌عرض */
  .split{gap:14px}
  .pv-stage{padding:10px 0;max-height:70vh}
  .pv-stage.tall{max-height:78vh}
  .pv-bar{gap:6px}
  .pv-bar .tb-btn{padding:7px 9px;font-size:12px}
  .pv-bar .zoomb{padding:7px 10px}

  /* دکمه‌های عملیات: تمام‌عرض و زیر هم تا متنشان نشکند */
  .modal .acts{flex-direction:column}
  .modal .acts .btn{width:100%;min-width:0}
  .modal .box{padding:18px;border-radius:15px}

  .filters{grid-template-columns:1fr;gap:8px}
  .stats{grid-template-columns:1fr 1fr;gap:9px}
  .stat{padding:11px 13px}
  .stat .val{font-size:17px}
  .stat.wide .val{font-size:15px}
  .chart{height:170px}
}

@media(max-width:420px){
  .tab{font-size:11.5px;padding:10px 2px}
  .stats{grid-template-columns:1fr}
  /* نام برنامه هیچ‌وقت حذف نمی‌شود؛ فقط کوچک‌تر می‌شود */
  .brandmark{font-size:13px}
  .brandmark img{width:22px;height:22px}
}

/* ردیف اقلام روی موبایل: شرح تمام‌عرض، «تعداد» و «مبلغ واحد» کنار هم */
@media(max-width:760px){
  .item-row{
    grid-template-columns:26px 1fr 1fr 28px;
    grid-template-areas:
      "rn desc desc x"
      ".  qty  unit ."
      ".  lt   lt   .";
    gap:7px 8px;padding:10px;
  }
  .item-row .rn{grid-area:rn}
  .item-row .desc-c{grid-area:desc}
  .item-row .qty-c{grid-area:qty}
  .item-row .unit-c{grid-area:unit}
  .item-row .lt{grid-area:lt;text-align:start;padding-top:2px}
  .item-row .xrow{grid-area:x}
  .item-row .m-lbl{display:block;font-size:11px;color:var(--dim2);margin-bottom:3px}
  .item-row textarea{min-height:54px}
}

/* ---------- فیلدهای تازهٔ فرم ---------- */
.fhint{display:block;font-size:11px;color:var(--dim2);margin-top:5px;line-height:1.7}
.ferr{display:none;font-size:11.5px;color:#ff9d8e;margin-top:5px;font-weight:600;line-height:1.7}
.in.bad{border-color:var(--bad);box-shadow:0 0 0 3px rgba(224,96,79,.12)}
.in.locked{background:#0a1219;color:var(--dim);cursor:pointer;border-style:dashed}

.in-prefix{display:flex;align-items:stretch;gap:0}
.in-prefix>span{display:flex;align-items:center;padding:0 11px;background:var(--panel2);
  border:1px solid var(--line2);border-inline-end:0;border-radius:10px 0 0 10px;
  font-weight:800;color:var(--accent);font-size:13px;direction:ltr}
body[dir="rtl"] .in-prefix>span{border-radius:0 10px 10px 0;border-inline-end:1px solid var(--line2);border-inline-start:0}
.in-prefix .in{border-radius:0 10px 10px 0}
body[dir="rtl"] .in-prefix .in{border-radius:10px 0 0 10px}

.seg.wrapseg{flex-wrap:wrap}
.seg.wrapseg button{flex:1 1 auto;min-width:96px}

/* مهر و امضا */
.marks-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
@media(max-width:620px){.marks-grid{grid-template-columns:1fr}}
.markbox{background:var(--bg2);border:1px solid var(--line2);border-radius:12px;padding:12px}
.mk-title{font-size:12.5px;font-weight:700;color:var(--dim);margin-bottom:8px}
.mk-prev{background:#fff;border-radius:9px;min-height:84px;display:flex;align-items:center;
  justify-content:center;padding:8px;overflow:hidden}
.mk-prev img{max-height:70px;max-width:100%;object-fit:contain}
.mk-empty{color:#8aa0ad;font-size:11.5px;text-align:center;line-height:1.7}
.mk-acts{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
.mk-acts .btn{flex:1;min-width:110px}

/* نوار انتخاب و حذف گروهی در آرشیو */
.bulkbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:0 0 12px;
  border-bottom:1px solid var(--line);margin-bottom:10px}
.pickall{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--dim);cursor:pointer}
.pickall input,.pick{width:17px;height:17px;accent-color:#078fc3;cursor:pointer}
.bulkcount{font-size:12.5px;color:var(--accent);font-weight:700}
.pickcell{width:34px;text-align:center}
@media(max-width:820px){
  .tbl td.pickcell{justify-content:flex-start}
  .tbl td.pickcell::before{content:""}
  .bulkbar{gap:8px}
  .bulkbar .btn{flex:1 1 auto}
}

/* فرم ثبت‌نام */
.req{color:#ff9d8e;font-weight:800}
.reqnote{background:rgba(35,197,245,.08);border:1px solid rgba(35,197,245,.28);border-radius:11px;
  padding:10px 13px;font-size:12.5px;color:#9fdcf2;line-height:1.9;margin-bottom:14px}
.lockwarn{background:rgba(224,166,58,.10);border:1px solid rgba(224,166,58,.32);border-radius:11px;
  padding:10px 13px;font-size:12.5px;color:#f5d190;line-height:1.9;margin:14px 0 10px}

/* جدول ادمین: ستون تیک */
.adm-tbl td.pickcell,.adm-tbl th.pickcell{width:34px;text-align:center}
@media(max-width:900px){.adm-tbl td.pickcell::before{content:""}}

/* ---------- جلوگیری از سرریز افقی ----------
   ورودی‌ها عرض ذاتی دارند (size پیش‌فرض) و داخل flex/grid کوچک نمی‌شوند؛
   min-width:0 اجازه می‌دهد واقعاً جمع شوند. */
.grid > *, .split > *, .f, .card, .in-prefix{min-width:0}
.in, select.in, textarea.in{min-width:0;max-width:100%}
.in-prefix .in{flex:1 1 auto;min-width:0}
.seg{min-width:0;flex-wrap:wrap}
.seg button{min-width:0}
/* کادرِ برگه باید بتواند از عرض صحنه بزرگ‌تر شود تا زوم، اسکرولِ داخلِ صحنه بدهد */
.pv-stage{max-width:100%}
img{height:auto}

/* ---------- ناحیهٔ امن iOS (نوار وضعیت و ناچ) ----------
   در حالت وب‌اپ با status-bar-style: black-translucent، صفحه زیر نوار وضعیت می‌رود.
   این پدینگ نوار بالا را پایین می‌آورد و پس‌زمینه‌اش ناحیهٔ ناچ را هم می‌پوشاند. */
/* ناحیهٔ امن + کمی نفس‌کشیدن تا ردیف اول به ساعت و ناچ نچسبد */
.topbar{padding-top:calc(env(safe-area-inset-top, 0px) + 4px)}
body{padding-left:env(safe-area-inset-left, 0px);padding-right:env(safe-area-inset-right, 0px)}
.wrap{padding-bottom:calc(60px + env(safe-area-inset-bottom, 0px))}
.modal{padding-top:calc(18px + env(safe-area-inset-top, 0px));
       padding-bottom:calc(18px + env(safe-area-inset-bottom, 0px))}

/* ---------- کادر وضعیت سفارش (صفحهٔ ورود و صفحهٔ پیگیری) ---------- */
.statusbox{border-radius:13px;padding:14px 16px;font-weight:700;font-size:13.5px;line-height:1.95}
.statusbox.wait{background:rgba(224,166,58,.12);border:1px solid rgba(224,166,58,.4);color:#f5d190}
.statusbox.ok{background:rgba(47,191,143,.12);border:1px solid rgba(47,191,143,.4);color:#9fe9cd}
.statusbox.no{background:rgba(224,96,79,.12);border:1px solid rgba(224,96,79,.4);color:#ffb4a8}

/* ---------- دکمهٔ بستن همیشه‌در‌دسترس روی مودال‌ها ---------- */
.modal .box{position:relative}
.xclose{position:absolute;top:9px;inset-inline-end:9px;z-index:2;
  width:32px;height:32px;line-height:1;border-radius:9px;cursor:pointer;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  color:#cfe3ee;font:inherit;font-size:15px;font-weight:700;
  display:flex;align-items:center;justify-content:center;transition:.18s}
.xclose:hover{background:rgba(255,255,255,.15);color:#fff}
.modal .box > h4{padding-inline-end:38px}

/* ---------- نمایش کوچکِ مهر و امضا در صفحهٔ فاکتور (فقط وضعیت، بدون آپلود) ---------- */
.marks-mini{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.mk-mini{flex:1;min-width:130px;background:var(--bg2);border:1px solid var(--line2);border-radius:11px;
  padding:9px;display:flex;flex-direction:column;align-items:center;gap:6px}
.mk-mini img{max-height:54px;max-width:100%;object-fit:contain;background:#fff;border-radius:6px;padding:3px}
.mk-mini .mk-empty{font-size:11.5px;color:var(--dim2);min-height:54px;display:flex;align-items:center;text-align:center}
.mk-mini .mk-lbl{font-size:11.5px;color:var(--dim)}
.mk-mini.has .mk-lbl{color:#9fe9cd}
.mk-mini .btn{width:100%}
/* هشدار نرم (نه خطا) زیر فیلدها */
.fwarn{display:none;font-size:11.5px;color:#f5d190;margin-top:5px;line-height:1.8}
/* نشانهٔ «فقط همین فاکتور» روی تصویری که هیچ‌وقت روی سرور ذخیره نشده */
.mk-once{font-style:normal;font-size:10px;background:rgba(224,166,58,.16);color:#f5d190;
  border:1px solid rgba(224,166,58,.34);border-radius:999px;padding:1px 6px;margin-inline-start:4px}

/* ---------- تیک ارزش افزوده ---------- */
.vatline{display:flex;align-items:center;gap:9px;cursor:pointer;margin-top:6px;
  background:var(--bg2);border:1px solid var(--line2);border-radius:10px;padding:10px 12px}
.vatline input{width:19px;height:19px;accent-color:#078fc3;flex:none}
.vatline span{font-size:13px;font-weight:600}

/* ---------- نوار اشتراک منقضی‌شده ---------- */
.expbar{position:sticky;top:0;z-index:39;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:rgba(224,96,79,.16);border-bottom:1px solid rgba(224,96,79,.45);
  color:#ffc9bf;font-size:13px;font-weight:700;padding:10px 16px}
.expbar[hidden]{display:none}
/* وقتی منقضی است، دکمهٔ صدور معنی ندارد */
body.is-expired [data-act="issue"]{opacity:.5}

/* ---------- سرتیترِ بخشِ «یک‌بار ثبت می‌شود» در پروفایل ---------- */
.lockhead{margin:22px 0 10px;font-size:12px;font-weight:700;color:var(--dim2);
  display:flex;align-items:center;gap:9px;letter-spacing:.3px}
.lockhead::after{content:"";flex:1;height:1px;background:var(--line)}