/* POS-specific tokens — extends sales-tokens.css with touch-first sizing */

/* ==== Products grid ==== */
.pos-grid,
.pgrid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));
  gap:10px;
  padding:16px;
  align-content:start;
  background:var(--bg);
}
.pcard{all:unset; background:var(--surface); border:1.5px solid var(--line); border-radius:8px; padding:0; cursor:pointer; display:flex; flex-direction:column; transition:border-color .12s, background .12s, transform .1s; overflow:hidden; position:relative; box-shadow:0 1px 2px rgba(0,0,0,.4);}
.pcard:hover{border-color:var(--ink-3);}
.pcard.is-added{border-color:var(--accent); outline:2px solid var(--accent-tint); outline-offset:2px; box-shadow:0 1px 2px rgba(0,0,0,.4);}
.pcard:active{transform:translateY(1px);}
.pcard .img{aspect-ratio:4 / 3; background:var(--surface-2); display:grid; place-items:center; color:var(--ink-4); position:relative; border-bottom:1.5px solid var(--line);}
.pcard .pos-detail-btn{all:unset; position:absolute; top:8px; left:8px; width:26px; height:26px; border-radius:4px; background:var(--surface); border:1px solid var(--line); display:grid; place-items:center; color:var(--ink-3); opacity:.96; z-index:2;}
.pcard .pos-detail-btn:hover{border-color:var(--ink-4); color:var(--ink); background:var(--surface-2);}
.pcard .img .add{position:absolute; top:8px; right:8px; width:26px; height:26px; border-radius:4px; background:var(--surface); border:1px solid var(--line); display:grid; place-items:center; color:var(--ink-3); opacity:0; transition:opacity .1s; font-size:18px; line-height:1;}
.pcard.is-confirmed .img .add{background:var(--accent); border-color:var(--accent); color:#000; opacity:1; font-size:15px; font-weight:800;}
.pcard:hover .img .add{opacity:1;}
.pcard .info{padding:10px 12px; display:flex; flex-direction:column; gap:3px; min-width:0;}
.pcard .nm{font-size:14.5px; font-weight:500; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pcard .cat{font-size:12px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pcard .foot{padding:10px 12px 12px; display:flex; justify-content:space-between; align-items:baseline; border-top:1px solid var(--line-2);}
.pcard .price{font-size:15px; font-weight:600; color:var(--accent-ink); font-family:"JetBrains Mono", ui-monospace, monospace;}
.pcard .unit{font-size:12px; color:var(--ink-4);}
.pos-product-swatch{width:58px; height:58px; border-radius:8px; display:grid; place-items:center; font-size:15px; font-weight:700; border:1px solid; position:relative; overflow:hidden; letter-spacing:0;}
.pos-product-swatch .bar{position:absolute; top:0; left:0; right:0; height:7px;}

/* ==== Cart panel ==== */
.pos-cart{display:flex; flex-direction:column; min-height:0; background:var(--surface); border-left:1px solid var(--line);}
.pos-cart-head{padding:14px 16px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:10px;}
.pos-cart-title{font-size:15px; font-weight:600; color:var(--ink);}
.pos-cart-count{font-size:11.5px; color:var(--ink-4); background:var(--surface-2); padding:2px 8px; border-radius:10px;}
.pos-cart-lines{flex:1; overflow-y:auto; padding:4px 0;}
.pos-cart-line{display:flex; align-items:center; gap:10px; padding:12px 44px 12px 16px; border-bottom:1px solid var(--line-2); position:relative;}
.pos-cart-line-main{flex:1; min-width:0;}
.pos-cart-line-name{font-size:13.5px; color:var(--ink); font-weight:500; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-cart-line-sub{font-size:11.5px; color:var(--ink-3); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-cart-line-total{font-size:14px; color:var(--ink); font-weight:600; white-space:nowrap; min-width:70px; text-align:right;}
.pos-weight-edit-btn{all:unset; cursor:pointer; height:28px; padding:0 9px; border-radius:5px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink-3); font-size:11.5px; font-weight:600; white-space:nowrap;}
.pos-weight-edit-btn:hover{border-color:var(--ink-4); color:var(--ink);}
.pos-cart-qty{display:flex; align-items:center; gap:2px; background:var(--surface-2); border:1px solid var(--line); border-radius:6px; padding:2px;}
.pos-qty-btn{all:unset; cursor:pointer; width:26px; height:26px; display:grid; place-items:center; color:var(--ink-2); font-size:16px; border-radius:4px;}
.pos-qty-btn:hover{background:var(--surface-3); color:var(--ink);}
.pos-qty-v{min-width:20px; text-align:center; font-size:12.5px; color:var(--ink); font-weight:600;}
.pos-cart-rm{all:unset; cursor:pointer; position:absolute; top:8px; right:10px; width:24px; height:24px; display:grid; place-items:center; color:var(--ink-4); font-size:18px; line-height:1; border-radius:4px; flex-shrink:0;}
.pos-cart-rm:hover{background:var(--red-tint); color:var(--red);}

/* Cart empty */
.pos-cart-empty{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px 24px; text-align:center;}
.pos-cart-empty-ill{width:72px; height:72px; border-radius:50%; background:var(--surface-2); color:var(--ink-4); display:grid; place-items:center; margin-bottom:16px; border:1px dashed var(--line);}
.pos-cart-empty-title{font-size:14px; color:var(--ink-2); font-weight:500; margin-bottom:4px;}
.pos-cart-empty-hint{font-size:12px; color:var(--ink-4); line-height:1.5;}

/* Cart totals + footer */
.pos-cart-totals{padding:12px 16px; background:var(--surface-2); border-top:1px solid var(--line);}
.pos-cart-row{display:flex; justify-content:space-between; align-items:baseline; padding:3px 0; font-size:13px;}
.pos-cart-row span:first-child{color:var(--ink-3);}
.pos-cart-row span:last-child{color:var(--ink-2); font-weight:500;}
.pos-cart-grand{display:flex; justify-content:space-between; align-items:baseline; padding:10px 0 0; margin-top:8px; border-top:1px solid var(--line);}
.pos-cart-grand-l{font-size:14px; font-weight:600; color:var(--ink);}
.pos-cart-grand-v{font-size:22px; font-weight:700; color:var(--ink); letter-spacing:-.02em;}
.pos-cart-foot{padding:12px 14px; display:flex; gap:8px; background:var(--surface);}
.pos-charge-btn{
  all:unset; cursor:pointer; flex:1;
  height:54px; border-radius:8px;
  background:var(--accent); color:#000;
  font-size:16px; font-weight:700; letter-spacing:-.01em;
  display:grid; place-items:center;
  transition:background .1s;
}
.pos-charge-btn:hover{background:var(--accent-ink);}
.pos-charge-btn:disabled{opacity:.35; cursor:not-allowed;}
.pos-secondary-btn{
  all:unset; cursor:pointer;
  width:54px; height:54px; border-radius:8px;
  background:var(--surface); border:1px solid var(--line);
  color:var(--ink-2);
  display:grid; place-items:center;
}
.pos-secondary-btn:hover{border-color:var(--ink-4); color:var(--ink);}
.pos-secondary-btn.is-open{border-color:var(--accent); color:var(--accent-ink); background:var(--accent-tint);}
.pos-secondary-btn.has-customer{border-color:var(--accent); color:#000; background:var(--accent);}

/* ==== Customer during checkout ==== */
.pos-customer-flow{flex:1; display:grid; grid-template-columns:1fr 420px; min-height:0; background:var(--bg); position:relative;}
.pos-customer-cart{position:relative;}
.pos-customer-foot{position:relative;}
.pos-customer-avatar{width:34px; height:34px; border-radius:7px; display:grid; place-items:center; background:var(--surface-2); border:1px solid var(--line); color:var(--ink); font-size:11px; font-weight:800; flex-shrink:0;}
.pos-customer-name{font-size:13px; color:var(--ink); font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-customer-meta{font-size:11.5px; color:var(--ink-4); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-customer-summary-row{padding:8px 0; border-bottom:1px solid var(--line); margin-bottom:6px;}
.pos-customer-summary-row span:last-child{max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--accent-ink); font-weight:800;}
.pos-customer-popover{position:absolute; right:14px; bottom:78px; width:370px; max-height:560px; display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:8px; box-shadow:0 20px 58px rgba(0,0,0,.42); z-index:25; overflow:hidden;}
.pos-customer-popover.compact{width:330px; padding:8px;}
.pos-customer-pop-title{font-size:13px; font-weight:800; color:var(--ink); line-height:1.2;}
.pos-customer-pop-sub{font-size:11.5px; color:var(--ink-4); margin-top:3px;}
.pos-customer-pop-head{display:flex; align-items:flex-start; gap:12px; padding:12px 12px 10px; border-bottom:1px solid var(--line);}
.pos-customer-pop-head button{all:unset; cursor:pointer; margin-left:auto; height:28px; padding:0 10px; border-radius:5px; border:1px solid var(--line); color:var(--ink-2); background:var(--surface-2); font-size:12px; font-weight:700;}
.pos-customer-action{all:unset; cursor:pointer; display:grid; grid-template-columns:32px minmax(0, 1fr); gap:10px; padding:10px; border-radius:6px; color:var(--ink-2);}
.pos-customer-action:hover{background:var(--surface-2); color:var(--ink);}
.pos-customer-action-icon{width:32px; height:32px; border-radius:6px; display:grid; place-items:center; border:1px solid var(--line); background:var(--surface-2); color:var(--accent-ink); font-size:16px; font-weight:800;}
.pos-customer-action strong{display:block; font-size:13px; color:var(--ink); line-height:1.2;}
.pos-customer-action em{display:block; font-style:normal; color:var(--ink-4); font-size:11.5px; margin-top:3px; line-height:1.25;}
.pos-customer-action.muted .pos-customer-action-icon{color:var(--ink-4);}
.pos-customer-action.danger strong{color:var(--red);}
.pos-customer-action.danger .pos-customer-action-icon{color:var(--red);}
.pos-customer-mini{display:grid; grid-template-columns:34px minmax(0, 1fr); gap:10px; align-items:center; padding:10px; margin-top:6px; margin-bottom:4px; border-radius:6px; background:var(--accent-tint);}
.pos-customer-search{height:38px; display:flex; align-items:center; gap:8px; margin:12px; padding:0 10px; border:1px solid var(--line); border-radius:6px; background:var(--surface-2);}
.pos-customer-search input{all:unset; min-width:0; flex:1; color:var(--ink); font-size:13px;}
.pos-customer-list{display:grid; gap:0; overflow:auto; max-height:250px;}
.pos-customer-row{display:grid; grid-template-columns:34px minmax(0, 1fr); align-items:center; gap:10px; padding:10px 12px; border-top:1px solid var(--line-2);}
.pos-customer-row.selected{background:var(--accent-tint);}
.pos-customer-row span{font-size:10.5px; color:var(--accent-ink); font-weight:800; white-space:nowrap;}
.pos-customer-form{display:grid; gap:10px; padding:12px;}
.pos-customer-form label{display:grid; gap:5px;}
.pos-customer-form span{font-size:10.5px; color:var(--ink-4); text-transform:uppercase; letter-spacing:.07em; font-weight:800;}
.pos-customer-form input{height:38px; border:1px solid var(--line); border-radius:6px; background:var(--surface-2); color:var(--ink); padding:0 10px; font-size:13px; outline:none;}
.pos-customer-conflict{margin:0 12px 12px; padding:10px; display:grid; gap:4px; border:1px solid var(--red); border-radius:7px; background:var(--red-tint); color:var(--red);}
.pos-customer-conflict strong{font-size:12.5px;}
.pos-customer-conflict span{font-size:11.5px; line-height:1.35; color:currentColor; opacity:.9;}
.pos-customer-receipt-only{margin:0 12px 12px; padding:10px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2); color:var(--ink-3); font-size:11.5px; line-height:1.35;}
.pos-customer-save-row{display:grid; grid-template-columns:28px minmax(0, 1fr); gap:10px; align-items:center; margin:0 12px 12px; padding:10px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2);}
.pos-customer-save-row .check{width:28px; height:28px; border-radius:6px; display:grid; place-items:center; background:var(--accent); color:#000; font-size:14px; font-weight:900;}
.pos-customer-save-row strong{display:block; color:var(--ink); font-size:12.5px;}
.pos-customer-save-row em{display:block; color:var(--ink-4); font-size:11.5px; font-style:normal; margin-top:2px;}
.pos-customer-pop-foot{display:flex; gap:10px; padding:12px; border-top:1px solid var(--line); background:var(--surface-2);}
.pos-customer-pop-foot .btn{height:42px; flex:1; justify-content:center;}

/* ==== Search / category tabs ==== */
.cat-controls{display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid var(--line); background:var(--surface);}
.cat-controls .find{flex:1; display:flex; align-items:center; gap:10px; height:44px; padding:0 14px; background:var(--surface); border:1px solid var(--line); border-radius:6px; min-width:0;}
.cat-controls .find input{all:unset; flex:1; font-size:15px; color:var(--ink); min-width:0;}
.cat-controls .find input::placeholder{color:var(--ink-4);}
.scan-btn{all:unset; cursor:pointer; display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 14px; background:#050506; color:#fff; border:1px solid #050506; border-radius:6px; font-size:13.5px; font-weight:500; white-space:nowrap; box-sizing:border-box;}
.scan-btn:hover{background:#161618; border-color:#2D2D31;}
.scan-btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
.scan-btn svg{flex-shrink:0;}
.cats-wrap{display:flex; align-items:center; border-bottom:1px solid var(--line); background:var(--surface); position:relative;}
.cats-wrap .scroll-btn{all:unset; cursor:pointer; width:36px; height:44px; display:grid; place-items:center; color:var(--ink-3); background:var(--surface); flex-shrink:0; z-index:2;}
.cats-wrap .scroll-btn:hover{color:var(--ink); background:var(--surface-2);}
.cats-wrap .scroll-btn.left{border-right:1px solid var(--line); box-shadow:4px 0 8px -4px rgba(0,0,0,.06);}
.cats-wrap .scroll-btn.right{border-left:1px solid var(--line); box-shadow:-4px 0 8px -4px rgba(0,0,0,.06);}
.cats{display:flex; gap:0; padding:0 8px; overflow-x:auto; scroll-behavior:smooth; flex:1; scrollbar-width:none;}
.cats::-webkit-scrollbar{display:none;}
.cats button{all:unset; cursor:pointer; padding:12px 16px; font-size:14px; color:var(--ink-3); position:relative; display:inline-flex; align-items:center; gap:8px; white-space:nowrap; flex-shrink:0;}
.cats button:hover{color:var(--ink);}
.cats button.on{color:var(--ink); font-weight:500;}
.cats button.on::after{content:""; position:absolute; left:16px; right:16px; bottom:-1px; height:2px; background:var(--accent);}
.cats .count{font-size:11.5px; color:var(--ink-4); font-family:"JetBrains Mono", ui-monospace, monospace; padding:1px 6px; background:var(--surface-2); border-radius:3px;}
.cats button.on .count{background:var(--accent-tint); color:var(--accent-ink);}
.pos-view-more{position:relative; flex-shrink:0; border-left:1px solid var(--line);}
.pos-view-more-btn{all:unset; cursor:pointer; height:44px; padding:0 12px; display:inline-flex; align-items:center; gap:7px; color:var(--ink-3); background:var(--surface); font-size:13px; font-weight:500; white-space:nowrap;}
.pos-view-more-btn:hover{color:var(--ink); background:var(--surface-2);}
.pos-view-more-btn svg{flex-shrink:0;}
.pos-view-menu{position:absolute; top:48px; right:8px; width:286px; padding:8px; background:var(--surface); border:1px solid var(--line); border-radius:6px; box-shadow:0 20px 58px rgba(0,0,0,.34); z-index:30;}
.pos-view-menu-title{padding:4px 6px 8px; color:var(--ink-4); font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; font-weight:700;}
.pos-view-option{all:unset; cursor:pointer; width:100%; min-height:54px; display:flex; align-items:center; gap:10px; padding:8px; border-radius:5px; color:var(--ink-2); box-sizing:border-box;}
.pos-view-option:hover{background:var(--surface-2); color:var(--ink);}
.pos-view-option.on{background:var(--accent-tint); color:var(--ink);}
.pos-view-icon{width:30px; height:30px; border-radius:5px; display:grid; place-items:center; background:var(--surface-2); color:var(--ink-3); flex-shrink:0;}
.pos-view-option.on .pos-view-icon{background:var(--accent); color:#000;}
.pos-view-label{display:block; font-size:13px; font-weight:600; color:var(--ink); line-height:1.2;}
.pos-view-sub{display:block; font-size:11.5px; color:var(--ink-4); margin-top:2px; line-height:1.25;}
.pos-view-check{margin-left:auto; color:var(--accent); display:grid; place-items:center; flex-shrink:0;}
.pos-view-density{margin-top:8px; padding:10px 8px 8px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:12px;}
.pos-stepper{display:flex; align-items:center; height:30px; border:1px solid var(--line); border-radius:5px; overflow:hidden; background:var(--surface-2);}
.pos-stepper button{all:unset; cursor:pointer; width:30px; height:30px; display:grid; place-items:center; color:var(--ink-2); font-size:16px; font-weight:700;}
.pos-stepper button:hover{background:var(--surface-3); color:var(--ink);}
.pos-stepper span{min-width:34px; text-align:center; color:var(--ink); font-family:"JetBrains Mono", ui-monospace, monospace; font-size:13px; font-weight:700; border-left:1px solid var(--line); border-right:1px solid var(--line);}
.pos-list-table-wrap{padding:0; background:var(--surface); min-width:0;}
.pos-list-table{width:100%; border-collapse:collapse; table-layout:fixed; font-size:13px;}
.pos-list-table thead th{position:sticky; top:0; z-index:1; height:34px; padding:0 12px; background:var(--surface); color:var(--ink-4); border-bottom:1px solid var(--line); text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.07em; font-weight:700; white-space:nowrap;}
.pos-list-table thead th:nth-child(1){width:92px;}
.pos-list-table thead th:nth-child(3){width:118px;}
.pos-list-table thead th:nth-child(4){width:66px;}
.pos-list-table thead th:nth-child(5){width:92px;}
.pos-list-table tbody td{height:40px; padding:0 12px; border-bottom:1px solid var(--line-2); color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;}
.pos-list-table tbody tr:hover td{background:var(--surface-2);}
.pos-list-table tbody tr.is-selected td{background:var(--accent-tint); border-bottom-color:rgba(0,210,190,.28);}
.pos-list-table tbody tr.is-selected td:first-child{box-shadow:inset 3px 0 0 var(--accent);}
.pos-list-table .sku{font-size:11.5px; color:var(--ink-3);}
.pos-list-table .num{text-align:right;}
.pos-list-product{display:flex; align-items:center; gap:8px; min-width:0; color:var(--ink); font-weight:600;}
.pos-list-product span:last-child{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-list-color{width:7px; height:18px; border-radius:2px; flex-shrink:0;}
/* ==== Weight entry modal ==== */
.pos-modal-scrim{
  position:absolute; inset:0; background:rgba(0,0,0,.6); backdrop-filter:blur(2px);
  z-index:20;
  display:flex; align-items:center; justify-content:center;
}
.pos-modal{
  width:440px; max-width:92%;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
  display:flex; flex-direction:column;
  overflow:hidden;
}
.pos-modal-head{padding:16px 20px; border-bottom:1px solid var(--line); display:flex; align-items:flex-start; gap:10px;}
.pos-modal-title{font-size:16px; font-weight:600; color:var(--ink); line-height:1.2;}
.pos-modal-sub{font-size:12.5px; color:var(--ink-3); margin-top:3px;}
.pos-modal-x{all:unset; cursor:pointer; width:32px; height:32px; display:grid; place-items:center; color:var(--ink-3); border-radius:6px; font-size:22px; line-height:1; margin-left:auto; flex-shrink:0;}
.pos-modal-x:hover{background:var(--surface-2); color:var(--ink);}
.pos-modal-body{padding:18px 20px;}
.pos-modal-foot{padding:12px 14px; display:flex; gap:10px; background:var(--surface-2); border-top:1px solid var(--line);}

.pos-detail-layer{position:absolute; inset:0; z-index:18; display:flex; align-items:center; justify-content:center; padding:18px; background:rgba(0,0,0,.34);}
.pos-detail-card{width:390px; max-width:calc(100% - 24px); background:var(--surface); border:1px solid var(--line); border-radius:10px; box-shadow:0 16px 42px rgba(0,0,0,.42); overflow:hidden;}
.pos-detail-head{display:flex; align-items:flex-start; gap:12px; padding:14px 14px 12px; border-bottom:1px solid var(--line);}
.pos-detail-swatch{width:48px; height:48px; border-radius:8px; display:grid; place-items:center; font-size:13px; font-weight:700; border:1px solid; position:relative; overflow:hidden; letter-spacing:0; flex-shrink:0;}
.pos-detail-swatch .bar{position:absolute; top:0; left:0; right:0; height:6px;}
.pos-detail-title-wrap{min-width:0; flex:1;}
.pos-detail-title{font-size:15px; font-weight:650; color:var(--ink); line-height:1.2;}
.pos-detail-sub{font-size:12px; color:var(--ink-4); margin-top:4px; line-height:1.25;}
.pos-detail-close{all:unset; cursor:pointer; width:30px; height:30px; display:grid; place-items:center; color:var(--ink-3); border-radius:5px; font-size:21px; line-height:1; flex-shrink:0;}
.pos-detail-close:hover{background:var(--surface-2); color:var(--ink);}
.pos-detail-body{padding:12px 14px 14px;}
.pos-detail-row{display:flex; align-items:baseline; justify-content:space-between; gap:14px; min-height:30px; border-bottom:1px solid var(--line-2); font-size:13px;}
.pos-detail-row span{color:var(--ink-4); white-space:nowrap;}
.pos-detail-row strong{color:var(--ink); font-weight:600; text-align:right; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-detail-note{margin-top:12px; padding:10px; border-radius:7px; background:var(--surface-2); color:var(--ink-3); font-size:12px; line-height:1.4;}

.pos-add-flow{flex:1; display:grid; grid-template-columns:1fr 420px; min-height:0; background:var(--bg); position:relative;}
.pos-add-shop{position:relative; display:flex; flex-direction:column; min-width:0; min-height:0; background:var(--bg);}
.pos-add-note{height:42px; display:flex; align-items:center; padding:0 16px; border-bottom:1px solid var(--line); background:var(--surface); color:var(--ink-3); font-size:12.5px;}
.pos-add-flow .pcard .img .add{opacity:1;}
.pos-add-toast{position:absolute; left:16px; bottom:16px; min-height:42px; max-width:560px; padding:0 10px 0 14px; display:flex; align-items:center; gap:12px; background:var(--surface); border:1px solid var(--line); border-radius:7px; box-shadow:0 12px 34px rgba(0,0,0,.36); color:var(--ink); font-size:13px; z-index:12;}
.pos-add-toast span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-add-toast button{all:unset; cursor:pointer; height:28px; padding:0 9px; border-radius:5px; color:var(--accent-ink); font-weight:700; font-size:12px;}
.pos-add-toast button:hover{background:var(--accent-tint);}
.pos-add-flow.side-entry{grid-template-columns:1fr 420px;}
.pos-add-flow.side-entry .pcard .img .add{display:none;}
.pos-entry-sheet-layer{position:absolute; inset:0; z-index:18; display:flex; align-items:flex-end; background:rgba(0,0,0,.42);}
.pos-entry-sheet-layer .pos-side-entry-panel{width:100%; max-height:78%; border-left:none; border-top:1px solid var(--line); border-radius:16px 16px 0 0; box-shadow:0 -16px 48px rgba(0,0,0,.45); overflow:hidden;}
.pos-side-entry-panel{display:flex; flex-direction:column; min-height:0; background:var(--surface); border-left:1px solid var(--line);}
.pos-side-entry-head{height:52px; display:flex; align-items:center; gap:10px; padding:0 14px; border-bottom:1px solid var(--line);}
.pos-side-entry-kicker{font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-4); font-weight:800;}
.pos-side-entry-close{all:unset; cursor:pointer; margin-left:auto; width:30px; height:30px; display:grid; place-items:center; color:var(--ink-3); border-radius:5px; font-size:21px; line-height:1;}
.pos-side-entry-close:hover{background:var(--surface-2); color:var(--ink);}
.pos-side-entry-product{display:grid; grid-template-columns:48px minmax(0, 1fr); gap:12px; padding:14px; border-bottom:1px solid var(--line);}
.pos-side-entry-name{font-size:15px; color:var(--ink); font-weight:650; line-height:1.2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-side-entry-meta{font-size:12px; color:var(--ink-4); margin-top:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pos-side-entry-display{margin:14px; padding:16px; border:1px solid var(--line-2); border-radius:10px; background:var(--surface-2); text-align:center;}
.pos-side-entry-label{font-size:10.5px; color:var(--ink-4); text-transform:uppercase; letter-spacing:.08em; font-weight:700; margin-bottom:6px;}
.pos-side-entry-value{font-size:42px; line-height:1; color:var(--ink); font-weight:800;}
.pos-side-entry-value span{font-size:16px; color:var(--ink-3); margin-left:6px; font-weight:600;}
.pos-side-count-stepper{display:grid; grid-template-columns:46px minmax(0, 1fr) 46px; align-items:center; gap:10px;}
.pos-side-count-stepper button{all:unset; cursor:pointer; height:46px; display:grid; place-items:center; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); font-size:24px; font-weight:800; line-height:1;}
.pos-side-count-stepper button:hover{border-color:var(--accent); color:var(--accent-ink);}
.pos-side-entry-total{font-size:15px; color:var(--accent-ink); font-weight:700; margin-top:8px;}
.pos-side-entry-quicks{display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; padding:0 14px 12px;}
.pos-side-entry-quicks button{all:unset; cursor:pointer; height:36px; display:grid; place-items:center; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink-2); font-size:12.5px; font-weight:700;}
.pos-side-entry-quicks button:hover{border-color:var(--accent); color:var(--accent-ink);}
.pos-side-entry-pad{display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; padding:0 14px 14px; align-content:start;}
.pos-side-entry-pad button{all:unset; cursor:pointer; height:48px; display:grid; place-items:center; border:1px solid var(--line); border-radius:8px; background:var(--surface-2); color:var(--ink); font-size:19px; font-weight:750; font-family:"JetBrains Mono", ui-monospace, monospace;}
.pos-side-entry-pad button:hover{background:var(--surface-3);}
.pos-side-entry-foot{position:relative; padding:0 14px 18px; display:flex; gap:10px; background:transparent; border-top:0;}
.pos-side-entry-foot::after{content:""; position:absolute; left:14px; right:14px; bottom:0; height:1px; background:var(--line);}
.pos-side-entry-foot .btn{height:46px; flex:1; justify-content:center;}

.pos-weight-display{padding:16px; background:var(--surface-2); border:1px solid var(--line-2); border-radius:10px; text-align:center; margin-bottom:14px;}
.pos-weight-label{font-size:10.5px; color:var(--ink-4); text-transform:uppercase; letter-spacing:.08em; font-weight:600; margin-bottom:6px;}
.pos-weight-value{font-size:46px; font-weight:700; color:var(--ink); letter-spacing:-.03em; line-height:1;}
.pos-weight-unit{font-size:18px; color:var(--ink-3); font-weight:500; margin-left:6px;}
.pos-weight-total{margin-top:8px; font-size:15px; color:var(--accent-ink); font-weight:600;}

.pos-quicks{display:flex; gap:6px; margin-bottom:14px;}
.pos-quick{all:unset; cursor:pointer; flex:1; height:38px; border:1px solid var(--line); border-radius:6px; display:grid; place-items:center; font-size:13px; color:var(--ink-2); font-weight:500; background:var(--surface);}
.pos-quick:hover{border-color:var(--accent); color:var(--accent-ink);}

.pos-numpad{display:grid; grid-template-columns:repeat(3, 1fr); gap:6px;}
.pos-num{all:unset; cursor:pointer; height:54px; border:1px solid var(--line); border-radius:8px; background:var(--surface-2); color:var(--ink); font-size:20px; font-weight:600; display:grid; place-items:center; font-family:"JetBrains Mono", ui-monospace, monospace;}
.pos-num:hover{background:var(--surface-3);}
.pos-num:active{transform:scale(.97);}

/* ==== Tender / success screens (centered over the product area) ==== */
.pos-tender{position:absolute; inset:0; z-index:15; display:grid; place-items:center; padding:24px; background:rgba(0,0,0,.42); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);}
.pos-tender-dialog{width:min(460px, 100%); max-height:calc(100% - 24px); display:flex; flex-direction:column; overflow:hidden; background:var(--surface); border:1px solid var(--line); border-radius:8px; box-shadow:0 24px 70px rgba(0,0,0,.46);}
.pos-tender-dialog.success{width:min(430px, 100%);}
.pos-tender.mobile{padding:14px; align-items:center;}
.pos-tender-dialog.mobile{width:100%; max-height:calc(100% - 16px);}
.pos-tender-dialog.mobile.success{width:100%;}
.pos-tender-head{height:52px; display:flex; align-items:center; gap:12px; padding:0 14px; border-bottom:1px solid var(--line); background:var(--surface);}
.pos-tender-back{all:unset; cursor:pointer; height:36px; padding:0 10px; display:inline-flex; align-items:center; gap:6px; border-radius:6px; color:var(--ink-2); font-size:13px;}
.pos-tender-back:hover{background:var(--surface-2); color:var(--ink);}
.pos-tender-title{font-size:15px; font-weight:600; color:var(--ink);}

.pos-tender-body{flex:0 0 auto; overflow:hidden; padding:18px; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:16px;}
.pos-tender-due{text-align:center; margin-bottom:8px;}
.pos-due-label{font-size:11px; color:var(--ink-4); text-transform:uppercase; letter-spacing:.08em; font-weight:600; margin-bottom:6px;}
.pos-due-v{font-size:42px; font-weight:700; color:var(--ink); letter-spacing:-.02em; line-height:1; font-family:"JetBrains Mono", ui-monospace, monospace;}

.pos-tender-input{width:100%; max-width:380px; padding:18px 20px; background:var(--surface); border:1px solid var(--line); border-radius:12px; text-align:center;}
.pos-tender-input-label{font-size:10.5px; color:var(--ink-4); text-transform:uppercase; letter-spacing:.08em; font-weight:600; margin-bottom:6px;}
.pos-tender-input-v{font-size:38px; font-weight:700; color:var(--accent-ink); letter-spacing:-.02em; line-height:1; font-family:"JetBrains Mono", ui-monospace, monospace;}
.pos-tender-input-change{font-size:13px; color:var(--ink-3); margin-top:8px;}
.pos-tender-input-change .v{color:var(--green); font-weight:600; font-family:"JetBrains Mono", ui-monospace, monospace;}
.pos-tender-dialog .pos-due-v{font-size:36px;}
.pos-tender-dialog .pos-tender-input{padding:14px 18px;}
.pos-tender-dialog .pos-tender-input-v{font-size:34px;}
.pos-tender-dialog .pos-quickamt{height:38px;}
.pos-tender-dialog .pos-num{height:44px;}

.pos-quickamts{display:flex; gap:8px; flex-wrap:wrap; justify-content:center; width:100%; max-width:380px;}
.pos-quickamt{all:unset; cursor:pointer; flex:1; min-width:80px; height:44px; border:1px solid var(--line); border-radius:8px; display:grid; place-items:center; font-size:14px; color:var(--ink); font-weight:600; background:var(--surface); font-family:"JetBrains Mono", ui-monospace, monospace;}
.pos-quickamt.exact{background:var(--accent-tint); border-color:var(--accent); color:var(--accent-ink);}
.pos-quickamt:hover{border-color:var(--accent); color:var(--accent-ink);}

/* Success screen */
.pos-success{display:flex; flex-direction:column; align-items:center; justify-content:center; padding:32px; text-align:center; background:var(--surface);}
.pos-success-tick{width:72px; height:72px; border-radius:50%; background:var(--green-tint); color:var(--green); display:grid; place-items:center; margin-bottom:18px;}
.pos-success-title{font-size:22px; font-weight:700; color:var(--ink); margin-bottom:8px; letter-spacing:-.01em;}
.pos-success-amt{font-size:32px; font-weight:700; color:var(--ink); letter-spacing:-.02em; font-family:"JetBrains Mono", ui-monospace, monospace; margin-bottom:6px;}
.pos-success-sub{font-size:13px; color:var(--ink-3); margin-bottom:24px;}
.pos-success-change{display:inline-flex; align-items:center; gap:8px; background:var(--green-tint); color:var(--green); padding:10px 16px; border-radius:8px; margin-bottom:24px; font-size:14px; font-weight:600;}
.pos-success-change .v{font-family:"JetBrains Mono", ui-monospace, monospace; font-size:18px;}
.pos-success-actions{display:flex; gap:10px; width:100%; max-width:380px;}
.pos-success-btn{all:unset; cursor:pointer; flex:1; height:52px; border-radius:8px; display:grid; place-items:center; font-size:14.5px; font-weight:600;}
.pos-success-btn.primary{background:var(--accent); color:#000;}
.pos-success-btn.secondary{background:var(--surface); border:1px solid var(--line); color:var(--ink);}

/* Top bar (register) */
.pos-topbar{height:48px; display:flex; align-items:center; padding:0 16px; gap:14px; background:var(--surface); border-bottom:1px solid var(--line); flex-shrink:0;}
.pos-topbar-brand{display:flex; align-items:center; gap:10px;}
.pos-topbar-brand .sq{width:26px; height:26px; border-radius:5px; background:var(--accent); color:#000; display:grid; place-items:center; font-weight:700; font-size:12px;}
.pos-topbar-brand .name{font-size:13px; font-weight:600; color:var(--ink);}
.pos-topbar-sep{width:1px; height:20px; background:var(--line);}
.pos-topbar-meta{font-size:11.5px; color:var(--ink-3); display:flex; align-items:center; gap:6px;}
.pos-topbar-meta b{color:var(--ink); font-weight:500;}
.pos-topbar-user{margin-left:auto; display:flex; align-items:center; gap:8px;}
.pos-user-avatar{width:26px; height:26px; border-radius:5px; background:var(--ink); color:#000; display:grid; place-items:center; font-weight:600; font-size:11.5px;}