/* Caisse tactile : grandes cibles, panier toujours visible. */
.pos-bar { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .45rem clamp(1rem, 3vw, 2rem); background: var(--surface); border-bottom: 1px solid var(--line); }
.pos-bar .tabs { border: 0; margin: 0; flex: 1; }
.pos-state { display: flex; align-items: center; gap: .45rem; font-size: .85rem; color: var(--muted); }
.pos-state i { width: 10px; height: 10px; border-radius: 50%; background: var(--good); }
.pos-state.off i { background: var(--bad); }
.pos-main { padding: 1rem clamp(1rem, 3vw, 2rem) 6rem; }
.pos-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, min(420px, 40vw)); gap: 1rem; align-items: start; }
.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .6rem; margin-top: .8rem; }
.tile { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; text-align: start; min-height: 86px; padding: .65rem .75rem; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); font-weight: 600; line-height: 1.25; }
.tile:hover { border-color: var(--brand); }
.tile small { color: var(--brand); font-weight: 700; font-size: .95rem; }
.cart { position: sticky; top: .8rem; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: .9rem; display: flex; flex-direction: column; gap: .6rem; max-height: calc(100dvh - 140px); }
.cart-lines { overflow-y: auto; min-height: 80px; display: flex; flex-direction: column; gap: .4rem; }
.cart-line { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .2rem .6rem; padding: .45rem 0; border-bottom: 1px dashed var(--line); }
.cart-line .ctl { display: flex; align-items: center; gap: .3rem; }
.cart-line .ctl button { min-width: 40px; min-height: 40px; padding: 0; font-size: 1.15rem; }
.cart-line .ctl b { min-width: 2.2rem; text-align: center; }
.cart-total { display: flex; justify-content: space-between; align-items: baseline; font-size: 1.5rem; font-weight: 700; border-top: 2px solid var(--ink); padding-top: .5rem; }
.cart-sub { display: flex; justify-content: space-between; color: var(--muted); font-size: .9rem; }
.pay-btn { min-height: 58px; font-size: 1.15rem; }
.methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.methods button { min-height: 52px; }
.methods button.on { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
.quick { display: flex; flex-wrap: wrap; gap: .4rem; }
.quick button { min-height: 44px; }
.big-amount { font-size: 2rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.change { font-size: 1.4rem; font-weight: 700; color: var(--good); }
.pay-list { list-style: none; padding: 0; margin: 0; }
.pay-list li { display: flex; justify-content: space-between; padding: .3rem 0; border-bottom: 1px solid var(--line); }
.mobile-pay { display: none; }
dialog .pay-panel { width: min(520px, calc(100vw - 2rem)); }

@media (max-width: 700px) {
  .pos-grid { grid-template-columns: minmax(0, 1fr); }
  .cart { position: static; max-height: none; }
  .mobile-pay { display: flex; position: fixed; inset-inline: 0; bottom: 0; z-index: 30; padding: .6rem 1rem calc(.6rem + env(safe-area-inset-bottom)); background: var(--surface); border-top: 1px solid var(--line); }
  .mobile-pay button { width: 100%; }
  .tiles { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
  .assistant { bottom: calc(84px + env(safe-area-inset-bottom)); }
}