/* POSFIELD-INTEGRATION-NEXT — barcode panel, Quick Sale / Price Check (js/cashier-app.js). Uses the app's tokens. */
.pf-scan-panel { background: var(--bg-2, #fff); color: var(--text, #111); border: 1px solid var(--border, #ddd); border-inline-start: 4px solid var(--warning, #d97706); border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; }
.pf-scan-panel[hidden] { display: none; }
.pf-scan-title { font-weight: 700; font-size: 14px; overflow-wrap: anywhere; }
.pf-scan-hint { font-size: 12px; color: var(--text-dim, #555); margin-top: 2px; }
.pf-scan-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.qs-root { display: flex; flex-direction: column; gap: 10px; max-width: 720px; }
.qs-modes, .qs-pay { display: flex; gap: 6px; }
.qs-mode { flex: 1; padding: 10px; border-radius: 10px; border: 1px solid var(--border, #ddd); background: var(--bg-2, #fff); color: var(--text, #111); font-weight: 700; cursor: pointer; }
.qs-mode.active { background: var(--primary, #2563eb); color: #fff; border-color: transparent; }
.qs-scan { font-size: 18px; padding: 12px; }
.qs-results { display: flex; flex-direction: column; gap: 4px; }
.qs-result { display: flex; justify-content: space-between; gap: 8px; padding: 8px 10px; border: 1px solid var(--border, #ddd); border-radius: 8px; background: var(--bg-2, #fff); color: var(--text, #111); cursor: pointer; text-align: start; }
.qs-result-name { overflow-wrap: anywhere; min-width: 0; }
.qs-cart { display: flex; flex-direction: column; gap: 6px; }
.qs-empty { color: var(--text-dim, #555); padding: 16px; text-align: center; border: 1px dashed var(--border, #ddd); border-radius: 10px; }
.qs-line { display: grid; grid-template-columns: 1fr auto auto auto; gap: 8px; align-items: center; padding: 6px 8px; border: 1px solid var(--border, #ddd); border-radius: 10px; }
.qs-line-name { overflow-wrap: anywhere; min-width: 0; font-weight: 600; }
.qs-line-qty { display: inline-flex; gap: 6px; align-items: center; }
.qs-line-total { white-space: nowrap; }
.qs-totals { display: flex; flex-direction: column; gap: 2px; }
.qs-tot { display: flex; justify-content: space-between; }
.qs-tot-final { font-size: 20px; font-weight: 800; }
.qs-credit { display: flex; flex-direction: column; gap: 6px; }
.qs-credit[hidden], .qs-sale[hidden], .qs-last[hidden] { display: none; }
.qs-complete { padding: 14px; font-size: 17px; }
.qs-keys { font-size: 11px; color: var(--text-dim, #555); text-align: center; }
.qs-last { border: 1px solid var(--border, #ddd); border-inline-start: 4px solid var(--success, #059669); border-radius: 12px; padding: 10px 12px; }
.qs-last-head { font-weight: 700; overflow-wrap: anywhere; }
.qs-last-sync, .qs-last-print { font-size: 12px; margin-top: 2px; }
.qs-price-card { display: flex; gap: 12px; border: 1px solid var(--border, #ddd); border-radius: 12px; padding: 12px; align-items: flex-start; }
.qs-price-img { width: 96px; height: 96px; object-fit: cover; border-radius: 8px; flex: none; }
.qs-price-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.qs-price-name { font-weight: 700; font-size: 16px; overflow-wrap: anywhere; }
.qs-price-value { font-size: 24px; font-weight: 800; }
.qs-price-note { font-size: 11px; color: var(--text-dim, #555); }
.pos-customer-slot { margin: 6px 0; }
@media (max-width: 480px) { .qs-line { grid-template-columns: 1fr auto; } .qs-price-img { width: 64px; height: 64px; } }
.qs-context { font-size: 12px; color: var(--text-dim, #555); text-align: center; }

/* Quick Sale is a till of its own: while it is open, the till's permanent invitation ring (css/posfield-experience.css,
   «the till, found without looking») and its «sale left open» mark (the basket is shared and is on this very screen)
   are set down, so nothing in the bar reads as the place you are. Leaving Quick Sale with a basket brings them back.
   js/navigation.js switchScreen toggles body.pf-on-quick-sale. */
html body.pf-app.pf-on-quick-sale :is(.ds-nav-item, .nav-btn, .more-menu-item)[data-screen="pos"] {
  border-color: transparent; box-shadow: none; animation: none;
}
html body.pf-app.pf-on-quick-sale :is(.ds-nav-item, .nav-btn, .more-menu-item)[data-screen="pos"]::after { content: none; }