/* =============================================================================
   নির্মাণ ERP — ডিজাইন সিস্টেম
   পরিষ্কার, আধুনিক, প্রিমিয়াম। মোবাইল ও কম্পিউটার দুটোতেই।
   ============================================================================= */

:root{
  /* ---- রং ---- */
  --ink:#101828;          /* মূল লেখা */
  --ink-2:#475467;        /* সাধারণ লেখা */
  --muted:#98a2b3;        /* হালকা লেখা */
  --line:#eaecf0;         /* বর্ডার */
  --line-2:#d0d5dd;
  --bg:#f7f8fa;           /* পাতার পটভূমি */
  --card:#ffffff;

  --brand:#0d7a68;        /* প্রধান রং */
  --brand-d:#0a6154;
  --brand-l:#e6f4f1;
  --brand-xl:#f2faf8;

  --good:#12855a;  --good-l:#e7f6ee;
  --bad:#d92d20;   --bad-l:#fef3f2;
  --warn:#dc6803;  --warn-l:#fffaeb;
  --info:#175cd3;  --info-l:#eff8ff;

  /* ---- আকার ---- */
  --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:20px;
  --sh-1:0 1px 2px rgba(16,24,40,.05);
  --sh-2:0 4px 12px rgba(16,24,40,.07);
  --sh-3:0 12px 32px rgba(16,24,40,.12);
  --nav-w:252px;
  --top-h:62px;

  --font:'Hind Siliguri','Noto Sans Bengali','Nirmala UI','Segoe UI',system-ui,-apple-system,sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}

/* hidden সবসময় কাজ করবে (নিচের display নিয়মগুলো যেন হারাতে না পারে) */
[hidden]{display:none!important}

body{font-family:var(--font);background:var(--bg);color:var(--ink);
  font-size:15.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
b,strong{font-weight:700}

/* টাকার অঙ্ক সমান চওড়া — কলামে সুন্দর মেলে */
b,.t-val,.tbl td.r,.tbl th.r{font-variant-numeric:tabular-nums}

kbd{display:none}                       /* শর্টকাট কাজ করে, কিন্তু চোখে পড়ে না */
.muted{color:var(--muted)}
.sm{font-size:12.5px}
.bold{font-weight:700}
.r{text-align:right}
.c{text-align:center}
.bad{color:var(--bad)}
.good-t{color:var(--good)}
.warn-t{color:var(--warn)}

/* =============================================================================
   লগইন
   ============================================================================= */
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;
  background:radial-gradient(1200px 600px at 50% -10%,#125f53 0%,#0b3f37 55%,#082e29 100%);padding:20px}
.login-card{background:#fff;border-radius:var(--r-xl);padding:38px 34px;width:100%;max-width:390px;
  box-shadow:0 24px 64px rgba(0,0,0,.32)}
.login-logo{font-size:46px;text-align:center;line-height:1}
.login-card h1{margin:10px 0 2px;font-size:22px;text-align:center;letter-spacing:-.3px}
.login-card .sub{margin:0 0 22px;text-align:center;color:var(--muted);font-size:13px}
.login-card label{display:block;font-size:13px;font-weight:600;margin:14px 0 6px;color:var(--ink-2)}
.login-card input{width:100%;padding:13px 15px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-size:16px;font-family:inherit;background:#fff}
.login-card input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-l)}
.login-card button{width:100%;margin-top:24px;padding:14px;border:0;border-radius:var(--r-sm);
  background:var(--brand);color:#fff;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit}
.login-card button:hover{background:var(--brand-d)}
.login-card .foot{text-align:center;color:var(--muted);font-size:11px;margin:20px 0 0}
.err{background:var(--bad-l);border:1px solid #fecdca;color:#b42318;padding:11px 13px;
  border-radius:var(--r-sm);font-size:13.5px;margin-bottom:12px}

/* =============================================================================
   কাঠামো — বাঁ পাশে মেনু
   ============================================================================= */
.topbar{position:fixed;top:0;left:var(--nav-w);right:0;height:var(--top-h);background:#fff;
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;
  padding:0 22px;z-index:45}
.topbar .brand{display:none}
.topbar .spacer{flex:1}
.topbar .who{text-align:right;line-height:1.25}
.topbar .uname{display:block;font-size:13.5px;font-weight:600}
.topbar .urole{display:block;font-size:11.5px;color:var(--muted)}
.topbar .logout{width:36px;height:36px;border-radius:50%;background:var(--bg);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;font-size:17px}
.topbar .logout:hover{background:var(--bad-l);color:var(--bad);text-decoration:none}
.burger{display:none;background:none;border:0;color:var(--ink);font-size:24px;cursor:pointer;padding:0}
.top-title{font-size:19px;font-weight:700;letter-spacing:-.3px}

/* নগদ চিপ — সবসময় চোখের সামনে */
.cash-chip{display:flex;align-items:center;gap:9px;background:var(--good-l);
  border:1px solid #b7e4cb;border-radius:999px;padding:6px 15px 6px 11px}
.cash-chip .cc-ic{font-size:16px}
.cash-chip .cc-lb{font-size:11.5px;color:#05603a;font-weight:600}
.cash-chip .cc-val{font-size:16px;font-weight:700;color:#05603a;font-variant-numeric:tabular-nums}

.sidenav{position:fixed;top:0;bottom:0;left:0;width:var(--nav-w);background:#fff;
  border-right:1px solid var(--line);overflow-y:auto;z-index:50;
  display:flex;flex-direction:column}
/* দোকানের নাম = হোমের বোতাম (সাইডবারে) */
.nav-brand{display:flex;align-items:center;gap:11px;padding:0 20px;height:var(--top-h);
  border-bottom:1px solid var(--line);flex-shrink:0;
  color:var(--ink);text-decoration:none;transition:background .12s}
.nav-brand:hover{background:var(--bg);text-decoration:none}
.nav-brand:hover .nb-ic{transform:scale(1.06)}
.nav-brand .nb-ic{transition:transform .12s}
.nav-brand .nb-ic{width:34px;height:34px;border-radius:10px;flex-shrink:0;
  background:linear-gradient(140deg,var(--brand),#0a5c4c);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:17px}
.nav-brand .nb-tx{min-width:0}
.nav-brand b{display:block;font-size:15px;line-height:1.2;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.nav-brand small{display:block;font-size:10.5px;color:var(--muted);letter-spacing:.4px}

.nav-list{padding:12px 12px 20px;flex:1}
.nav-sep{height:1px;background:var(--line);margin:10px 8px}
.sidenav a{display:flex;align-items:center;gap:12px;padding:11px 13px;margin-bottom:2px;
  color:var(--ink-2);font-size:15px;border-radius:var(--r-sm);font-weight:500}
.sidenav a:hover{background:var(--bg);color:var(--ink);text-decoration:none}
.sidenav a.active{background:var(--brand-l);color:var(--brand-d);font-weight:700}
.sidenav .ic{font-size:17px;width:22px;text-align:center;flex-shrink:0}

.main{margin:var(--top-h) 0 0 var(--nav-w);padding:24px 26px 90px}
.main-bare{margin:0;padding:0}
.page-title{font-size:21px;font-weight:700;margin:0 0 18px;letter-spacing:-.3px}

.mobnav{display:none}

/* =============================================================================
   কার্ড, টেবিল, বাটন
   ============================================================================= */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:20px 22px;box-shadow:var(--sh-1);margin-bottom:18px}
.card h2{font-size:16px;font-weight:700;margin:0 0 14px;color:var(--ink)}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px}

.tbl{width:100%;border-collapse:collapse;font-size:14.5px}
.tbl th{text-align:left;font-weight:600;color:var(--ink-2);font-size:12.5px;
  padding:10px;border-bottom:1px solid var(--line);background:#fcfcfd}
.tbl th.r{text-align:right}
.tbl td{padding:13px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:#fcfcfd}

.pill{display:inline-block;font-size:11px;padding:2px 9px;border-radius:999px;
  background:var(--bg);color:var(--ink-2);font-weight:600;margin-right:4px}
.pill.bad{background:var(--bad-l);color:var(--bad)}
.pill.warn-pill{background:var(--warn-l);color:var(--warn)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:var(--brand);color:#fff;border:1px solid var(--brand);padding:10px 18px;
  border-radius:var(--r-sm);font-size:14.5px;font-weight:600;cursor:pointer;
  font-family:inherit;box-shadow:var(--sh-1);transition:.12s}
.btn:hover{background:var(--brand-d);border-color:var(--brand-d);text-decoration:none;color:#fff}
.btn.ghost{background:#fff;color:var(--ink-2);border-color:var(--line-2)}
.btn.ghost:hover{background:var(--bg);color:var(--ink);border-color:var(--line-2)}
.btn.big{font-size:16px;padding:13px 24px}
.btn.primary{background:var(--good);border-color:var(--good)}
.btn.primary:hover{background:#0d6f4a;border-color:#0d6f4a}
/* ফিরিয়ে আনা যায় না এমন কাজের বোতাম — লাল, যেন ভুলে চাপ না পড়ে */
.btn.danger{background:var(--bad);border-color:var(--bad)}
.btn.danger:hover{background:#b42318;border-color:#b42318}
.link-btn{background:none;border:0;color:var(--brand);font-size:13px;cursor:pointer;
  font-family:inherit;padding:4px 0;font-weight:600}
.link-btn:hover{text-decoration:underline}
.quick{display:flex;gap:10px;flex-wrap:wrap}

.flash{padding:12px 16px;border-radius:var(--r);margin-bottom:16px;font-size:14.5px;
  border:1px solid transparent}
.flash.success{background:var(--good-l);border-color:#b7e4cb;color:#05603a}
.flash.error{background:var(--bad-l);border-color:#fecdca;color:#b42318}

/* =============================================================================
   পরিসংখ্যান টাইল
   ============================================================================= */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:22px}
.tile{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;
  box-shadow:var(--sh-1);position:relative;overflow:hidden}
.tile::after{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:var(--brand)}
.tile.good::after{background:var(--good)}
.tile.warn::after{background:var(--warn)}
.tile.bad::after{background:var(--bad)}
.tile .t-ic{font-size:19px}
.tile .t-lb{font-size:12.5px;color:var(--muted);margin-top:6px;font-weight:600}
.tile .t-val{font-size:25px;font-weight:700;margin-top:3px;letter-spacing:-.6px}
.tile .t-sub{font-size:11.5px;color:var(--muted);margin-top:2px}

/**
 * ★ চাপা যায় এমন টাইল — চাপলে ওই সংখ্যার বিস্তারিত পাতায় নিয়ে যায়।
 * নিচের লাইনটা সবসময় দেখা যায় (হোভার লাগে না), তাই মোবাইলেও বোঝা যায়
 * কোথায় নিয়ে যাবে। টুলটিপ দেওয়া যেত না — .tile নিজেই ::after ব্যবহার করে।
 */
a.tile.clickable{display:block;color:inherit;text-decoration:none;cursor:pointer;
  transition:box-shadow .14s,border-color .14s,transform .14s}
a.tile.clickable:hover{text-decoration:none;box-shadow:var(--sh-2);
  border-color:var(--brand);transform:translateY(-2px)}
a.tile.clickable .t-go{display:block;margin-top:9px;padding-top:8px;
  border-top:1px dashed var(--line);
  font-size:11.5px;font-weight:700;color:var(--brand)}
a.tile.clickable:focus-visible{outline:3px solid var(--brand-l);outline-offset:2px}

.bars{display:flex;align-items:flex-end;gap:10px;height:160px;padding-top:18px}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%}
.bar-val{font-size:10.5px;color:var(--muted);font-weight:600}
.bar{width:100%;background:linear-gradient(180deg,#2aa38b,var(--brand));border-radius:6px 6px 0 0;
  margin-top:auto;min-height:4px}
.bar-lb{font-size:10.5px;color:var(--muted);margin-top:6px}

/* =============================================================================
   হোমের বড় বাটন ও গাইড
   ============================================================================= */
.big-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:14px;margin-bottom:22px}
.big-act{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--sh-1);color:var(--ink);transition:.14s}
.big-act:hover{text-decoration:none;transform:translateY(-2px);box-shadow:var(--sh-3);
  border-color:var(--line-2)}
.big-act .ba-ic{font-size:30px;line-height:1;flex-shrink:0}
.big-act .ba-tx{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.big-act .ba-tx b{font-size:16.5px}
.big-act .ba-tx small{font-size:12px;color:var(--muted);margin-top:2px}
.big-act.go{background:linear-gradient(140deg,#0d7a68,#0a5145);border-color:transparent;color:#fff;
  box-shadow:0 8px 22px rgba(13,122,104,.28)}
.big-act.go .ba-tx small{color:rgba(255,255,255,.82)}

.setup-card{border:1px solid #b7e4cb;background:linear-gradient(180deg,#f4fcf8,#fff)}
.setup-card h2{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:17px}
.setup-count{background:var(--good);color:#fff;font-size:11.5px;padding:3px 11px;border-radius:999px}
.setup-steps{display:flex;flex-direction:column;gap:9px;margin-top:14px}
.setup-step{display:flex;align-items:center;gap:13px;background:#fff;border-radius:var(--r);
  padding:13px 16px;border:1px solid var(--line);color:var(--ink)}
.setup-step:hover{border-color:var(--brand);text-decoration:none;box-shadow:var(--sh-2)}
.setup-step.done{opacity:.6}
.setup-step .ss-n{width:30px;height:30px;border-radius:50%;background:var(--brand-l);
  color:var(--brand);display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:14px;flex-shrink:0}
.setup-step.done .ss-n{background:none;font-size:19px}
.setup-step .ss-tx{display:flex;flex-direction:column;line-height:1.35;flex:1;min-width:0}
.setup-step .ss-tx b{font-size:15px}
.setup-step.done .ss-tx b{text-decoration:line-through;color:var(--muted)}
.setup-step .ss-tx small{font-size:12px;color:var(--muted)}
.setup-step .ss-go{background:var(--brand-l);color:var(--brand-d);padding:6px 14px;
  border-radius:var(--r-sm);font-size:13px;font-weight:700;white-space:nowrap}

/* =============================================================================
   ফর্ম, টুলবার, ট্যাব
   ============================================================================= */
.toolbar-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:18px}
/* -----------------------------------------------------------------------------
   সময়ের ঘর — আজ / গতকাল / গত ৭ দিন … এক ক্লিকেই
   ----------------------------------------------------------------------------- */
.range-tabs{display:flex;gap:6px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);padding:6px;margin-bottom:14px;box-shadow:var(--sh-1)}
.range-tabs .rt{padding:9px 16px;border-radius:var(--r-sm);font-size:14px;font-weight:600;
  color:var(--ink-2);text-decoration:none;white-space:nowrap;transition:background .12s,color .12s}
.range-tabs .rt:hover{background:var(--bg);color:var(--ink);text-decoration:none}
.range-tabs .rt.on{background:var(--brand);color:#fff;box-shadow:0 2px 6px rgba(13,122,104,.25)}
.range-note{display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  font-size:14px;margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid var(--line)}

.filters{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.filters input[type=text],.filters input[type=date],.filters select{
  padding:9px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-family:inherit;font-size:14px;background:#fff}
.filters input[type=text]{min-width:220px}
.filters input:focus,.filters select:focus{outline:none;border-color:var(--brand);
  box-shadow:0 0 0 3px var(--brand-l)}
.inline-lb{font-size:12.5px;color:var(--muted);font-weight:600}

.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tab{padding:8px 16px;border-radius:999px;background:#fff;border:1px solid var(--line-2);
  font-size:14px;color:var(--ink-2);font-weight:600}
.tab:hover{background:var(--bg);text-decoration:none;color:var(--ink)}
.tab.active{background:var(--brand);color:#fff;border-color:var(--brand)}

.frow{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
.frow>.fld{flex:1;min-width:160px}
.frow>div:not(.fld){font-size:14px}
.card .fld{margin-bottom:12px}
.card .fld label,.fld label{display:block;font-size:13px;font-weight:600;
  margin-bottom:6px;color:var(--ink-2)}
.card .fld input[type=text],.card .fld input[type=password],.card .fld input[type=date],
.card .fld select,.fld input[type=text],.fld select{
  width:100%;padding:10px 13px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-size:15px;font-family:inherit;background:#fff;color:var(--ink)}
.card .fld input:focus,.card .fld select:focus,.fld input:focus,.fld select:focus{
  outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-l)}
.hint{font-size:12.5px;color:var(--muted);margin:8px 0 0}
.checks{display:flex;gap:20px;flex-wrap:wrap;margin-top:14px}
.checks.col{flex-direction:column;gap:12px}
.checks label,.chk-inline{display:flex;align-items:center;gap:8px;font-size:14.5px;cursor:pointer}
.checks.col label{align-items:flex-start}
.checks.col label span{display:flex;flex-direction:column;line-height:1.4}
.checks.col label small{color:var(--muted);font-size:12px;font-weight:400}
.checks input,.chk-inline input{width:18px;height:18px;accent-color:var(--brand)}
.info-row>div{font-size:14px}

.ico{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;
  background:none;border:0;font-size:15px;cursor:pointer;border-radius:var(--r-sm);opacity:.7}
.ico:hover{background:var(--bg);opacity:1;text-decoration:none}
.del-btn:hover{background:var(--bad-l)}

/* -----------------------------------------------------------------------------
   টুলটিপ — মাউস রাখলেই বাংলায় বলে দেয় বোতামটির কাজ কী।
   যেকোনো এলিমেন্টে data-tip="..." বসালেই কাজ করে।
   ----------------------------------------------------------------------------- */
[data-tip]{position:relative}
[data-tip]::after,[data-tip]::before{
  position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%) translateY(4px);
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .13s ease,transform .13s ease;
  z-index:60}
[data-tip]::after{
  content:attr(data-tip);white-space:nowrap;background:var(--ink);color:#fff;
  font-size:12.5px;font-weight:600;line-height:1;padding:7px 11px;border-radius:7px;
  box-shadow:0 6px 18px rgba(16,24,40,.22)}
[data-tip]::before{
  content:'';bottom:calc(100% + 2px);width:0;height:0;
  border:6px solid transparent;border-top-color:var(--ink)}
[data-tip]:hover::after,[data-tip]:hover::before,
[data-tip]:focus-visible::after,[data-tip]:focus-visible::before{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
/* টেবিলের ডান দিকে টুলটিপ যেন পর্দার বাইরে না যায় */
.tbl td:last-child [data-tip]::after,.tbl th:last-child [data-tip]::after{
  left:auto;right:0;transform:translateY(4px)}
.tbl td:last-child [data-tip]:hover::after,.tbl th:last-child [data-tip]:hover::after{
  transform:translateY(0)}
.tbl td:last-child [data-tip]::before,.tbl th:last-child [data-tip]::before{
  left:auto;right:10px;transform:translateY(4px)}
.tbl td:last-child [data-tip]:hover::before,.tbl th:last-child [data-tip]:hover::before{
  transform:translateY(0)}
/* টেবিলের শিরোনামে ব্যাখ্যা থাকলে নিচে বিন্দুর দাগ — দেখলেই বোঝা যায় মাউস রাখা যাবে */
.tbl th [data-tip]{border-bottom:1px dotted var(--muted);cursor:help}
/* পাতার একদম উপরের বোতামে টুলটিপ নিচের দিকে যাবে, নাহলে পর্দার বাইরে চলে যেত */
.nav-brand[data-tip]::after,.pos-home[data-tip]::after,.pos-shop[data-tip]::after{
  bottom:auto;top:calc(100% + 8px)}
.nav-brand[data-tip]::before,.pos-home[data-tip]::before,.pos-shop[data-tip]::before{
  bottom:auto;top:calc(100% + 2px);border-top-color:transparent;border-bottom-color:var(--ink)}
/* মোবাইলে মাউস নেই — টুলটিপ দরকার নেই */
@media (hover:none){[data-tip]::after,[data-tip]::before{display:none}}

tr.inactive{opacity:.5}
/* মাল ফেরত — টেবিলের ভেতরের পরিমাণ ঘর */
.ret-qty{width:100%;padding:9px 11px;border:1.5px solid var(--line);border-radius:var(--r-sm);
  font-size:16px;font-weight:700;text-align:right;font-family:inherit;background:#fff}
.ret-qty:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-l)}
tr.cancelled{opacity:.55}
tr.cancelled td:not(:last-child){text-decoration:line-through}
.big-num{font-size:17px}
.opening-row,.total-row,.subtotal-row{background:#fcfcfd}
.total-row{border-top:2px solid var(--line)}
.pl-tbl td{padding:12px 10px}
.pl-tbl .indent{padding-left:28px;color:var(--ink-2)}

.totals-box{background:#fcfcfd;border:1px solid var(--line);border-radius:var(--r);
  padding:16px 18px;margin-top:16px;max-width:400px}
.totals-box>div{display:flex;justify-content:space-between;padding:4px 0;font-size:14.5px}
.totals-box .grand{border-top:1px solid var(--line);margin-top:8px;padding-top:10px;
  font-size:18px;font-weight:700}
.totals-box .grand b{color:var(--brand)}
.totals-box .due b{color:var(--bad)}
.totals-box .profit-row{border-top:1px dashed var(--line);margin-top:6px;padding-top:6px;font-size:13px}
.totals-box .profit-row.total{border-top:1px solid var(--line);font-weight:700;font-size:14.5px}
.two-col{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:22px;margin-top:18px}

.mini-tiles{display:flex;gap:8px;flex-wrap:wrap}
.mt{background:var(--bg);padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600}
.mt.good{background:var(--good-l);color:#05603a}
.mt.bad{background:var(--bad-l);color:#b42318}

.role-help{background:#fcfcfd;border:1px solid var(--line);border-radius:var(--r);
  padding:14px 18px;margin-top:18px;font-size:13.5px}
.role-help h3{font-size:13.5px;margin:0 0 8px;color:var(--ink)}
.role-help ul,.role-help ol{margin:0;padding-left:20px}
.role-help li{margin:5px 0}

/* পণ্য সম্পাদনা */
.var-box{border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:14px;
  background:#fcfcfd}
.var-head{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.var-n{font-weight:700;color:var(--muted);min-width:30px}
.var-head input{padding:9px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-family:inherit;font-size:14.5px}
.v-name{flex:1;min-width:160px;font-weight:600}
.v-sku{width:150px}
.var-grid,.var-price{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.var-price{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
.var-grid .g label,.var-price .g label{display:block;font-size:11.5px;color:var(--muted);
  font-weight:600;margin-bottom:4px}
.var-grid .g input,.var-price .g input,.var-price .g select{width:100%;padding:8px 11px;
  border:1px solid var(--line-2);border-radius:var(--r-sm);font-family:inherit;font-size:14px}
.rm-var{margin-left:auto;color:var(--bad);font-size:16px}

/* এন্ট্রি টেবিল */
.entry-tbl td{position:relative;vertical-align:top}
.entry-tbl input,.entry-tbl select{width:100%;padding:9px 11px;border:1px solid var(--line-2);
  border-radius:var(--r-sm);font-family:inherit;font-size:14.5px}
.entry-tbl .dropdown{position:absolute;top:100%;left:10px;right:10px;z-index:20}

/* দাম বদলানো */
.price-tbl td{padding:8px}
.price-in{width:110px;padding:9px 11px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  text-align:right;font-family:inherit;font-size:14.5px;font-weight:600}
.price-in:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-l)}
.price-in.dim{background:#fcfcfd;font-weight:400;color:var(--ink-2)}
.sm-sel{padding:7px 9px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-family:inherit;font-size:13.5px}

/* অনুমতি বাছাই */
.perm-box{border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:16px 0;background:#fcfcfd}
.perm-head{display:flex;flex-direction:column;gap:3px;margin-bottom:12px}
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:8px}
.perm-item{display:flex;align-items:center;gap:9px;padding:9px 12px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-sm);font-size:14px;cursor:pointer}
.perm-item:hover{border-color:var(--brand)}
.perm-item input{width:17px;height:17px;flex-shrink:0;accent-color:var(--brand)}
.perm-item input:checked+span{font-weight:600;color:var(--brand-d)}
.perm-foot{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:12px;
  padding-top:11px;border-top:1px solid var(--line)}

/* =============================================================================
   ড্রপডাউন
   ============================================================================= */
.dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--sh-3);max-height:320px;overflow-y:auto;z-index:30;margin-top:4px}
.dd-item{padding:11px 14px;cursor:pointer;border-bottom:1px solid var(--line)}
.dd-item:last-child{border-bottom:0}
.dd-item:hover,.dd-item.sel{background:var(--brand-xl)}
.dd-main{font-size:14.5px;font-weight:600}
.dd-meta{font-size:12px;color:var(--muted);display:flex;gap:12px;flex-wrap:wrap;margin-top:2px}
.dd-meta .due{color:var(--bad);font-weight:700}
.dd-empty{padding:18px;text-align:center;color:var(--muted);font-size:14px}

/* =============================================================================
   মডাল
   ============================================================================= */
.modal{position:fixed;inset:0;background:rgba(16,24,40,.6);display:flex;align-items:center;
  justify-content:center;z-index:100;padding:20px}
.modal-box{background:#fff;border-radius:var(--r-xl);padding:26px 28px;width:100%;max-width:640px;
  box-shadow:0 24px 60px rgba(16,24,40,.28);max-height:92vh;overflow-y:auto}
.modal-box.sm{max-width:430px}
.modal-box h3{margin:0 0 16px;font-size:18px;font-weight:700}
.modal-foot{display:flex;gap:10px;margin-top:22px}
.modal-foot.col{flex-direction:column}
.modal-foot.col .btn{width:100%}
body.modal-open{overflow:hidden}

/* ★ নিশ্চিতকরণের পপ-আপ — ব্রাউজারের সাদামাটা বাক্সের বদলে */
.confirm-modal{backdrop-filter:blur(2px);animation:cf-fade .14s ease}
.cf-box{text-align:center;padding:30px 28px 24px;animation:cf-pop .16s cubic-bezier(.2,.9,.3,1.2)}
.cf-box .cf-ic{width:60px;height:60px;margin:0 auto 16px;border-radius:50%;
  background:var(--bad-l);display:flex;align-items:center;justify-content:center;font-size:27px}
.cf-box h3{margin:0 0 8px;font-size:19px}
.cf-box .cf-msg{margin:0;font-size:14.5px;color:var(--ink-2);line-height:1.6}
.cf-box .modal-foot{margin-top:24px;gap:9px}
@keyframes cf-fade{from{opacity:0}to{opacity:1}}
@keyframes cf-pop{from{opacity:0;transform:translateY(12px) scale(.96)}
                  to{opacity:1;transform:none}}

.chg-tbl{width:100%;border-collapse:collapse;font-size:14px}
.chg-tbl th{text-align:left;font-size:12px;color:var(--muted);padding:8px;border-bottom:1px solid var(--line)}
.chg-tbl th.r{text-align:right} .chg-tbl th.c{text-align:center}
.chg-tbl td{padding:8px;border-bottom:1px solid var(--line)}
.chg-tbl input[type=text]{width:100%;padding:9px 11px;border:1px solid var(--line-2);
  border-radius:var(--r-sm);font-family:inherit;font-size:14.5px;text-align:right}
.chg-tbl input[type=checkbox]{width:18px;height:18px;accent-color:var(--brand)}

.pin-reason{background:var(--warn-l);border:1px solid #fedf89;color:#93370d;padding:11px 13px;
  border-radius:var(--r-sm);font-size:13px;margin-bottom:14px}
.done{text-align:center}
.done-ic{font-size:52px}
.done-sum{background:#fcfcfd;border:1px solid var(--line);border-radius:var(--r);
  padding:14px 18px;margin:16px 0;text-align:left}
.ds-row{display:flex;justify-content:space-between;font-size:15px;padding:4px 0}
.ds-row.due b{color:var(--bad)}

/* =============================================================================
   টোস্ট
   ============================================================================= */
.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);background:var(--ink);
  color:#fff;padding:13px 24px;border-radius:var(--r);font-size:15px;z-index:200;opacity:0;
  transition:.25s;box-shadow:var(--sh-3);max-width:86vw}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast.warn{background:#93370d}
.toast.err{background:#912018}

/* =============================================================================
   ★ বিল করার স্ক্রিন
   ============================================================================= */
/* বিল করার পাতাতেও বাঁ পাশের মেনু থাকে — তাই ততটুকু জায়গা ছেড়ে দিই */
body.bare{background:var(--bg);overflow:hidden}
.main-bare{margin-left:var(--nav-w)}
.pos{display:flex;flex-direction:column;height:100vh}

.pos-top{height:60px;background:#fff;border-bottom:1px solid var(--line);display:flex;
  align-items:center;gap:16px;padding:0 18px;flex-shrink:0;z-index:10}
.pos-home{width:36px;height:36px;border-radius:var(--r-sm);background:var(--bg);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.pos-home:hover{background:var(--line);text-decoration:none}
/* দোকানের নাম = হোমের বোতাম (POS-এ) */
.pos-shop{font-weight:700;font-size:16px;white-space:nowrap;color:var(--ink);
  text-decoration:none;padding:7px 11px;border-radius:var(--r-sm);transition:background .12s}
.pos-shop:hover{background:var(--bg);text-decoration:none}
.pos-wh{background:#fff;color:var(--ink);border:1px solid var(--line-2);
  border-radius:var(--r-sm);padding:8px 11px;font-family:inherit;font-size:13.5px}
.mode-switch{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:3px}
.mode-switch button{background:none;border:0;color:var(--ink-2);padding:7px 18px;border-radius:7px;
  font-family:inherit;font-size:14px;font-weight:700;cursor:pointer}
.mode-switch button.active{background:var(--brand);color:#fff;box-shadow:var(--sh-1)}
body.wholesale .mode-switch button.active{background:#6941c6}
.pos-stats{margin-left:auto;font-size:13.5px;color:var(--ink-2)}
.pos-stats b{color:var(--ink)}
.pos-help{width:34px;height:34px;border-radius:50%;background:var(--bg);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;font-size:16px}
.pos-help:hover{text-decoration:none;background:var(--line)}
.pos-user{font-size:13.5px;font-weight:600}

.pos-body{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 400px;overflow:hidden}
.pos-left{display:flex;flex-direction:column;overflow:hidden;padding:16px 18px;gap:12px}

.cust-bar{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);padding:11px 16px;box-shadow:var(--sh-1);position:relative}
.cb-lb{font-size:14px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.cb-in{flex:1;position:relative}
.cb-in input{width:100%;padding:10px 13px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-size:15px;font-family:inherit}
.cb-in input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-l)}
.cust-picked{display:flex;align-items:center;gap:16px;flex:1;font-size:15px}
.cust-picked .ci-name{font-size:16px;font-weight:700}
.cust-picked .ci-due b{color:var(--bad)}
.cust-picked .x{background:var(--bg);border:0;width:30px;height:30px;border-radius:50%;
  cursor:pointer;font-size:14px;color:var(--muted);margin-left:auto}
.cust-picked .x:hover{background:var(--bad-l);color:var(--bad)}

.prod-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.cat-tabs{display:flex;gap:6px;flex-wrap:wrap;flex:1}
.cat{background:#fff;border:1px solid var(--line-2);border-radius:999px;padding:8px 17px;
  font-family:inherit;font-size:14px;cursor:pointer;color:var(--ink-2);font-weight:600}
.cat:hover{border-color:var(--brand);color:var(--brand)}
.cat.active{background:var(--brand);color:#fff;border-color:var(--brand)}
body.wholesale .cat.active{background:#6941c6;border-color:#6941c6}
.prod-search{width:290px;padding:10px 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-size:15px;font-family:inherit}
.prod-search:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-l)}

.prod-grid{flex:1;overflow-y:auto;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;align-content:start;padding-bottom:10px}
.pcard{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);padding:16px;cursor:pointer;font-family:inherit;text-align:left;
  box-shadow:var(--sh-1);transition:.13s;min-height:112px}
.pcard:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:var(--sh-3)}
.pcard:active{transform:translateY(0)}
.pc-name{font-size:15px;font-weight:700;line-height:1.35;color:var(--ink)}
.pc-price{font-size:20px;font-weight:700;color:var(--brand);margin-top:auto;letter-spacing:-.4px}
.pc-price small{font-size:12px;font-weight:400;color:var(--muted)}
.pc-price .nop{color:var(--bad);font-size:13px;font-weight:600}
.pc-stock{font-size:12px;color:var(--muted)}
.pcard.low{border-color:#fedf89;background:#fffcf5}
.pcard.low .pc-stock{color:var(--warn);font-weight:700}
.pcard.out{opacity:.6;border-color:#fecdca}
.pcard.out .pc-stock{color:var(--bad);font-weight:700}
.prod-empty{text-align:center;color:var(--muted);padding:50px;font-size:15px}

.pos-right{background:#fff;border-left:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden}
.cart-head{display:flex;align-items:center;gap:10px;padding:16px 18px;
  border-bottom:1px solid var(--line);font-size:16px}
.c-count{background:var(--brand-l);color:var(--brand-d);font-size:12px;font-weight:700;
  padding:3px 11px;border-radius:999px}
.c-clear{margin-left:auto;background:none;border:0;color:var(--bad);font-size:13px;
  cursor:pointer;font-family:inherit;font-weight:600}

.cart-list{flex:1;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:9px}
.cart-blank{text-align:center;padding:50px 16px;color:var(--muted)}
.cart-blank .cb-ic{font-size:44px;opacity:.35}
.cart-blank p{margin:12px 0 0;font-size:15px}

.citem{background:#fcfcfd;border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;cursor:pointer}
.citem:hover{border-color:var(--brand);background:var(--brand-xl)}
.ci-top{display:flex;align-items:flex-start;gap:8px}
.ci-nm{font-size:14.5px;font-weight:700;line-height:1.35;flex:1}
.ci-x{background:none;border:0;color:var(--muted);font-size:15px;cursor:pointer;padding:0 2px}
.ci-x:hover{color:var(--bad)}
.ci-mid{display:flex;align-items:baseline;gap:8px;margin-top:6px;font-size:14px}
.ci-q{font-weight:700;color:var(--brand)}
.ci-mul{color:var(--muted);font-size:12px}
.ci-amt{margin-left:auto;font-weight:700;font-size:15.5px}
.ci-note{font-size:11.5px;color:var(--muted);margin-top:4px}
.ci-warn{font-size:11.5px;color:var(--warn);font-weight:600;margin-top:4px}

.sum{border-top:1px solid var(--line);padding:12px 18px;background:#fcfcfd}
.sum .row{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:14.5px}
.sum .btn-row{width:100%;background:none;border:0;font-family:inherit;cursor:pointer;
  color:var(--brand);text-align:left;padding:7px 0;font-weight:600}
.sum .btn-row:hover{color:var(--brand-d)}
.sum .btn-row b{color:var(--ink);font-weight:700}
.sum .grand{border-top:1px solid var(--line);margin-top:7px;padding-top:11px;font-size:16px;font-weight:700}
.sum .grand b{font-size:28px;color:var(--brand);letter-spacing:-.8px}
body.wholesale .sum .grand b{color:#6941c6}

.pay{padding:14px 18px;border-top:1px solid var(--line)}
.pay-lb{display:block;font-size:14px;font-weight:700;margin-bottom:8px}
.pay-main{display:flex;gap:8px}
.pay-big{flex:1;padding:13px 15px;border:1.5px solid var(--good);border-radius:var(--r-sm);
  font-size:22px;font-weight:700;font-family:inherit;text-align:right;color:var(--good);min-width:0}
.pay-big:focus{outline:none;box-shadow:0 0 0 4px var(--good-l)}
.pay-full{background:var(--good);color:#fff;border:0;border-radius:var(--r-sm);padding:0 18px;
  font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap}
.pay-methods{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:9px}
.pm{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:9px 4px;
  font-family:inherit;font-size:12.5px;cursor:pointer;font-weight:600;color:var(--ink-2)}
.pm:hover{border-color:var(--good)}
.pm.active{background:var(--good);color:#fff;border-color:var(--good)}
.txn{width:100%;margin-top:8px;padding:9px 12px;border:1px solid var(--line-2);
  border-radius:var(--r-sm);font-family:inherit;font-size:13.5px}

.due-row{display:flex;justify-content:space-between;align-items:center;margin-top:10px;
  padding:10px 14px;border-radius:var(--r-sm);background:var(--bad-l);font-size:14.5px;font-weight:600}
.due-row b{font-size:20px;color:var(--bad)}
.due-row.change{background:var(--info-l)}
.due-row.change b{color:var(--info)}
.due-row.total-due{background:var(--ink);color:#fff}
.due-row.total-due b{color:#fda29b}

.alerts{display:flex;flex-direction:column;gap:5px;padding:0 18px 10px}
.alerts span{font-size:12.5px;padding:7px 11px;border-radius:var(--r-sm);display:block}
.a-warn{background:var(--warn-l);border:1px solid #fedf89;color:#93370d}
.a-err{background:var(--bad-l);border:1px solid #fecdca;color:#b42318}

.save-btn{margin:0 18px 18px;background:var(--good);color:#fff;border:0;border-radius:var(--r);
  padding:18px;font-size:18px;font-weight:700;cursor:pointer;font-family:inherit;
  box-shadow:0 6px 18px rgba(18,133,90,.3)}
.save-btn:hover{background:#0d6f4a}
.save-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}

/* পরিমাণ বাক্স */
.qty-box h3{font-size:19px;margin-bottom:4px}
/* ★ "দোকানে আছে কত" — বিল করার সময় সবচেয়ে দরকারি তথ্য, তাই চোখে পড়ার মতো */
.qty-stock{display:inline-flex;align-items:center;gap:7px;margin-bottom:16px;
  font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px;
  background:var(--good-l);color:#05603a;border:1px solid #b7e4cb}
.qty-stock b{font-size:16.5px;font-weight:800;letter-spacing:-.2px}
.qty-stock.low{background:var(--warn-l);color:#93370d;border-color:#fedf89}
.qty-stock.none{background:var(--bad-l);color:#912018;border-color:#fecdc9}
.qty-lb{display:block;font-size:14px;font-weight:700;margin-bottom:8px}
.qty-row{display:flex;gap:8px;align-items:stretch}
.qty-row input{flex:1;padding:13px;border:1.5px solid var(--brand);border-radius:var(--r-sm);
  font-size:26px;font-weight:700;text-align:center;font-family:inherit;min-width:0}
.qty-row input:focus{outline:none;box-shadow:0 0 0 4px var(--brand-l)}
.qty-row select{padding:13px 11px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-size:16px;font-family:inherit;background:#fff}
.qbtn{width:50px;background:var(--brand-l);color:var(--brand-d);border:0;border-radius:var(--r-sm);
  font-size:24px;font-weight:700;cursor:pointer;font-family:inherit}
.qbtn:hover{background:var(--brand);color:#fff}
.qty-quick{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.qq{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);padding:7px 16px;
  font-family:inherit;font-size:14.5px;cursor:pointer;font-weight:600}
.qq:hover{background:var(--brand-l);border-color:var(--brand);color:var(--brand-d)}
.qty-note{font-size:13.5px;color:var(--brand);font-weight:600;margin-top:12px;min-height:21px}
.qty-price{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:14px;
  border-top:1px dashed var(--line);font-size:14px}
.qty-price input{width:130px;padding:9px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font-family:inherit;font-size:15px;font-weight:600;text-align:right}
.qty-price input[readonly]{background:var(--bg);color:var(--muted)}
.qp-unit{font-size:12px;color:var(--muted)}
.qty-total{margin-top:14px;padding:13px 16px;background:var(--brand-xl);
  border:1px solid #cceae3;border-radius:var(--r);font-size:15px;font-weight:600}
.qty-total .qt-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.qty-total b{font-size:23px;color:var(--brand);letter-spacing:-.5px}
/* ★ অঙ্কটা কথায় — ৳৪,৬০,০০০ দেখে ভুল পড়া ঠেকাতে */
.qty-total .qt-words{margin-top:7px;padding-top:7px;border-top:1px dashed #cceae3;
  font-size:13px;font-weight:600;color:#0a5c4c;line-height:1.5}
.qty-total .qt-words:empty{display:none}
/* দর/স্টক নিয়ে সতর্কবার্তা — টাকার ঠিক নিচে, যাতে চোখ এড়ায় না */
.qty-warn{margin-top:10px;background:var(--warn-l);border:1px solid #fedf89;
  border-left:3px solid var(--warn);border-radius:var(--r-sm);
  padding:10px 13px;font-size:13.5px;font-weight:600;color:#93370d}
.qty-warn div + div{margin-top:5px;padding-top:5px;border-top:1px dashed #fedf89}
.scale-res{margin-top:8px;font-size:13.5px}
.w-ok{background:var(--good-l);border:1px solid #b7e4cb;color:#05603a;padding:8px 11px;border-radius:var(--r-sm)}
.w-bad{background:var(--bad-l);border:1px solid #fecdca;color:#b42318;padding:8px 11px;border-radius:var(--r-sm)}

/* =============================================================================
   সাহায্য পাতা
   ============================================================================= */
.help-wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:22px;align-items:start}
.help-toc{position:sticky;top:calc(var(--top-h) + 16px);background:#fff;border:1px solid var(--line);
  border-radius:var(--r-lg);padding:16px 10px;box-shadow:var(--sh-1);
  max-height:calc(100vh - var(--top-h) - 40px);overflow-y:auto}
.toc-title{font-size:12px;font-weight:700;color:var(--muted);padding:0 10px 10px}
.help-toc a{display:block;padding:7px 11px;font-size:13.5px;color:var(--ink-2);border-radius:var(--r-sm)}
.help-toc a:hover{background:var(--brand-l);color:var(--brand-d);text-decoration:none}
.toc-print{padding:12px 10px 2px;border-top:1px solid var(--line);margin-top:10px}
.help-body section{scroll-margin-top:calc(var(--top-h) + 16px)}
.help-intro{background:linear-gradient(140deg,#0d7a68,#0a4c41);color:#fff;border:0}
.help-intro h2{color:#fff}
.help-intro .muted{color:rgba(255,255,255,.78)}
.help-body h2{font-size:18px;color:var(--ink);border-bottom:1px solid var(--line);
  padding-bottom:10px;margin:0 0 14px}
.help-body h3{font-size:15px;margin:18px 0 7px}
.help-body ul,.help-body ol{margin:8px 0;padding-left:22px}
.help-body li{margin:6px 0}
.steps li{margin:9px 0}
.help-tbl td{padding:10px}
.help-tbl td:first-child{font-weight:600}
.short-tbl td:first-child{width:90px;text-align:center}
.note{border-radius:var(--r);padding:12px 16px;margin:14px 0;font-size:14px;
  background:#fcfcfd;border:1px solid var(--line);border-left:3px solid var(--muted)}
.note.good{background:var(--good-l);border-color:#b7e4cb;border-left-color:var(--good);color:#05603a}
.note.warn{background:var(--warn-l);border-color:#fedf89;border-left-color:var(--warn);color:#93370d}
.note.bad{background:var(--bad-l);border-color:#fecdc9;border-left-color:var(--bad);color:#912018}

/* ============ নতুন করে শুরু (রিসেট) ============ */
.reset-opts{display:flex;flex-direction:column;gap:10px}
.reset-opt{display:flex;align-items:flex-start;gap:12px;cursor:pointer;
  border:1.5px solid var(--line);border-radius:var(--r);padding:14px 16px;
  background:#fff;transition:border-color .12s,background .12s}
.reset-opt:hover{border-color:var(--line-2);background:#fcfcfd}
.reset-opt input{margin-top:3px;width:18px;height:18px;accent-color:var(--bad);flex-shrink:0}
.reset-opt:has(input:checked){border-color:var(--bad);background:var(--bad-l)}
.reset-opt b{display:block;font-size:15px;margin-bottom:3px}
.reset-opt .ro-d{display:block;font-size:13px;color:var(--ink-2);line-height:1.5}
.reset-opt .ro-k{display:block;font-size:12.5px;color:var(--good);margin-top:4px;font-weight:600}
.conv-box{background:#fcfcfd;border:1px solid var(--line);border-radius:var(--r);padding:12px 16px;margin:12px 0}
.conv-row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;
  border-bottom:1px dashed var(--line)}
.conv-row:last-child{border-bottom:0}
.conv-row b{color:var(--brand)}
.formula{background:var(--ink);color:#7ee0c8;padding:11px 16px;border-radius:var(--r);
  font-size:15px;text-align:center;font-weight:600}
.calc-box{background:#fcfcfd;border:1px solid var(--line);border-radius:var(--r);
  padding:14px 18px;margin:12px 0;max-width:430px}
.calc-box>div{display:flex;justify-content:space-between;padding:5px 0;font-size:14px}
.calc-box .minus b{color:var(--bad)}
.calc-box .sub{border-top:1px solid var(--line);margin-top:5px;padding-top:7px;font-weight:700}
.calc-box .total{border-top:2px solid var(--brand);margin-top:5px;padding-top:8px;font-weight:700;font-size:16px}
.calc-box .total b{color:var(--good)}
.help-body details{background:#fcfcfd;border:1px solid var(--line);border-radius:var(--r);
  padding:11px 16px;margin:8px 0}
.help-body details summary{cursor:pointer;font-weight:600;font-size:14.5px}
.help-body details p{font-size:14px;margin:10px 0 2px;color:var(--ink-2)}
code{background:var(--bg);border:1px solid var(--line);padding:2px 7px;border-radius:5px;font-size:13px}
.lb-hint{font-weight:400;color:var(--muted);font-size:11px}

/* =============================================================================
   মোবাইল ও ট্যাব
   ============================================================================= */
@media (max-width:1180px){
  .pos-body{grid-template-columns:1fr;overflow-y:auto}
  .pos-right{border-left:0;border-top:1px solid var(--line)}
  .prod-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .pos-stats,.pos-user{display:none}
  .prod-search{width:100%}
  .two-col{grid-template-columns:1fr}
  .totals-box{max-width:none}
}

@media (max-width:900px){
  :root{--nav-w:0px}
  .burger{display:block}
  .topbar{left:0;padding:0 14px}
  .sidenav{transform:translateX(-100%);transition:transform .22s ease;width:270px;box-shadow:var(--sh-3)}
  body.nav-open .sidenav{transform:translateX(0)}
  body.nav-open::after{content:'';position:fixed;inset:0;background:rgba(16,24,40,.45);z-index:44}
  .main{margin-left:0;padding:18px 14px 96px}
  .help-wrap{grid-template-columns:1fr}
  .help-toc{position:static;max-height:none}
  .cash-chip .cc-lb{display:none}
  .big-actions{grid-template-columns:1fr 1fr;gap:10px}
  .big-act{padding:15px;gap:11px}
  .big-act .ba-ic{font-size:25px}
  .big-act .ba-tx b{font-size:14.5px}
  .big-act .ba-tx small{display:none}
  .setup-step .ss-go{display:none}
  .tiles{grid-template-columns:1fr 1fr;gap:12px}
  .tile{padding:14px 16px}
  .tile .t-val{font-size:21px}
  .card{padding:16px;border-radius:var(--r)}
  .modal-box{padding:22px 20px;border-radius:var(--r-lg)}

  /* নিচের বার — মোবাইলে মূল কাজগুলো */
  .mobnav{display:flex;position:fixed;bottom:0;left:0;right:0;height:62px;background:#fff;
    border-top:1px solid var(--line);z-index:46;box-shadow:0 -2px 12px rgba(16,24,40,.06)}
  .mobnav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;color:var(--muted);font-size:11px;font-weight:600}
  .mobnav a:hover{text-decoration:none}
  .mobnav a.active{color:var(--brand)}
  .mobnav .mi{font-size:20px;line-height:1}
  body.bare .mobnav{display:none}

  /* টেবিল মোবাইলে পাশে স্ক্রল করবে, পুরো পাতা নয় */
  .card>.tbl,.tbl{display:block;overflow-x:auto;white-space:nowrap}
  .tbl td,.tbl th{white-space:nowrap}
}

@media (max-width:560px){
  body{font-size:15px}
  .tiles{grid-template-columns:1fr}
  .big-actions{grid-template-columns:1fr}
  .pay-methods{grid-template-columns:repeat(2,1fr)}
  .prod-grid{grid-template-columns:1fr 1fr;gap:10px}
  .pcard{padding:13px;min-height:96px}
  .pc-price{font-size:17px}
  .filters{width:100%}
  .filters input[type=text]{min-width:0;width:100%}
  .modal-foot{flex-direction:column}
  .modal-foot .btn{width:100%}
}

@media print{
  .topbar,.sidenav,.mobnav,.help-toc,.quick,.toolbar-row,.btn{display:none!important}
  .main{margin:0;padding:0}
  .card{box-shadow:none;border:1px solid #ddd;page-break-inside:avoid}
  .help-wrap{grid-template-columns:1fr}
  .help-body details p{display:block!important}
}