:root{font-family:"Inter",system-ui,sans-serif;color:#172634;background:#edf1f3;--ink:#172634;--accent:#075c53;--line:#d5dfe3}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#12302e;color:white;padding:16px max(18px,calc((100vw - 1280px)/2))}
.brand,.account,.actions,.inline{display:flex;align-items:center;gap:10px}
.brand strong{font-size:1.35rem}
.brand span{color:#b9dfd8}
main{max-width:1316px;padding:20px 18px;margin:auto}
.login,.card{background:white;border:1px solid var(--line);border-radius:16px;padding:20px;min-width:0}
.login{max-width:430px;margin:8vh auto}
h1,h2,h3,p{margin:0 0 12px}
h1{font-size:1.55rem}h2{font-size:1.2rem}h3{font-size:1rem}
nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
nav a{color:var(--accent);padding:8px}
button,input,select{font:inherit;border:1px solid var(--line);border-radius:8px;padding:9px 11px;color:var(--ink);background:white}
button{cursor:pointer;font-weight:600}
button:disabled{opacity:.5;cursor:default}
button.primary,.selected{color:white;background:var(--accent);border-color:var(--accent)}
:focus-visible{outline:3px solid #258780;outline-offset:2px}
label{display:grid;gap:5px;font-size:.9rem;min-width:0}
input,select{width:100%;min-width:0}
.login form{display:grid;gap:14px}
#login-message{margin-top:12px}
.inline{align-items:end;margin-bottom:10px}
.inline label{flex:1}
.layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px;align-items:start}
.products{display:grid;gap:9px;margin:12px 0}
.product,.cart-line,details{border:1px solid var(--line);border-radius:10px;padding:12px}
.product .actions{display:flex;flex-wrap:wrap;align-items:end}
.product .actions label{flex:1;min-width:140px}
.meta{color:#425663;font-size:.88rem;margin-bottom:8px;overflow-wrap:anywhere}
.offer{color:#075c53;font-weight:600}
.cart-line{margin-bottom:10px}
.cart-line .inline{margin:0;flex-wrap:wrap}
.cart-line .inline label{min-width:78px}
.notice{background:#dceee8;border-radius:8px;padding:10px 14px}
.notice.error{background:#f9e4e2;color:#8b241e}
dl{display:grid;grid-template-columns:1fr auto;gap:8px}
dd{margin:0;font-weight:700}
.complete{width:100%}
#retry{width:100%;margin-top:8px}
#summary{margin:15px 0;font-size:1.2rem;font-weight:700}
details{margin-bottom:8px}summary{cursor:pointer;overflow-wrap:anywhere}
details ul{padding-left:22px}
dialog{border:1px solid var(--line);border-radius:12px;max-width:min(480px,94vw)}
dialog::backdrop{background:#10242399}
.sticker{width:50mm;height:30mm;padding:2mm;text-align:center;background:white;color:#000;display:grid;align-content:center;justify-items:center;overflow:hidden;border:1px dashed #bbb;font-family:Arial,sans-serif}
.sticker .title{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:8pt}
.sticker .price{font-size:11pt;font-weight:bold}
.sticker canvas{width:45mm;height:10mm;image-rendering:pixelated;display:block}
.sticker .sku{font-size:8pt}
#labels{max-height:52vh;overflow:auto}
@media(max-width:760px){.layout{grid-template-columns:1fr}.top{flex-wrap:wrap}.card{padding:14px}}
@media print{
  body>header,body>main,.label-controls{display:none!important}
  html,body{background:white;margin:0}
  dialog[open]{position:static;margin:0;border:0;padding:0;max-width:none;max-height:none;overflow:visible}
  dialog::backdrop{display:none}
  #labels{max-height:none;overflow:visible}
  .sticker{border:0;break-after:page;break-inside:avoid}
  .sticker:last-child{break-after:auto}
}
.language{display:flex;align-items:center}.language select{width:auto}
.wrap,.product-form .actions{flex-wrap:wrap}
.product-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));align-items:end;gap:14px;margin-bottom:20px}
.check{display:flex;align-items:center;gap:8px}.check input{width:auto}
.product-image{width:65px;height:65px;object-fit:cover;border-radius:6px;float:right;margin-left:10px}
#payment-total{margin:12px 0;font-weight:bold}
.receipt-controls{margin-bottom:12px;align-items:end}
#receipt{width:72mm;padding:2mm;color:#000;background:#fff;font:10pt "Noto Sans Bengali",system-ui,sans-serif;overflow-wrap:anywhere}
#receipt.narrow{width:52mm}
#receipt h2{text-align:center;margin:0 0 4px}
#receipt p{margin:0 0 4px}
#receipt .receipt-items{border-block:1px dashed #222;padding-block:6px;margin:8px 0}
.receipt-row{display:flex;justify-content:space-between;gap:6px;break-inside:avoid}
.receipt-row strong{white-space:nowrap}
#receipt .receipt-total{border-top:1px dashed #222;padding-top:5px;font-weight:bold}
@page labels{size:50mm 30mm;margin:0}
@page thermal{size:auto;margin:0}
@media print{
  #label-dialog{page:labels}
  #receipt-dialog{page:thermal}
  .receipt-controls{display:none!important}
  #receipt{padding:1mm}
}

.catalog-source{max-width:260px}

.inventory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr));gap:14px;margin:15px 0 24px}
.inventory-panel{border:1px solid var(--line);padding:16px;border-radius:12px;background:#f8fafb}
.inventory-panel form{display:grid;gap:10px}
.purchase-line{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;border:1px solid #d4dfe1;border-radius:10px;padding:10px;margin:10px 0;background:#fff}
.purchase-line button{align-self:end;width:46px}.inventory-filter{max-width:240px;margin:10px 0}
#camera-pane{margin:10px 0;padding:12px;border:1px solid var(--line);border-radius:10px}
#camera-video{display:block;width:100%;max-height:260px;object-fit:contain;background:#111}
@media(max-width:560px){.purchase-line{grid-template-columns:1fr}.inline.wrap{flex-wrap:wrap}}

#receipt-mail-status{color:#147d51;font-weight:700;font-size:.9rem;align-self:center}