.mkspos{width:calc(100vw - 28px);max-width:1660px;margin:8px auto;font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:#111}.top{display:flex;justify-content:space-between;align-items:center;margin:4px 0 10px}.top h1{margin:0;font-size:28px}.top p{margin:2px 0;color:#666}.pill{background:#111;color:#fff;border-radius:999px;padding:9px 13px;font-size:13px}.layout{display:grid;grid-template-columns:minmax(680px,1.45fr) minmax(470px,.8fr);gap:12px}.panel{background:#fff;border:1px solid #e8e8e8;border-radius:18px;padding:14px;box-shadow:0 3px 18px rgba(0,0,0,.04)}.right{position:sticky;top:8px;align-self:start;max-height:calc(100vh - 16px);overflow:auto}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}.newcust{display:none;background:#fafafa;border:1px solid #eee;border-radius:14px;padding:10px}.mkspos input,.mkspos select{padding:10px 11px;border:1px solid #dcdcdc;border-radius:12px;background:#fff;min-width:165px}.mkspos button{padding:10px 13px;border-radius:12px;border:1px solid #111;background:#111;color:white;font-weight:700;cursor:pointer}.mkspos button.secondary{background:#fff;color:#111;border-color:#ddd}.mkspos button.small{padding:6px 9px;min-width:auto}.mkspos hr{border:0;border-top:1px solid #eee;margin:12px 0}.results{display:none;border:1px solid #eee;border-radius:12px;overflow:hidden;margin:8px 0}.results button{display:block;width:100%;text-align:left;background:#fff;color:#111;border:0;border-radius:0}.results button:hover{background:#f7f7f7}.selectedbox{background:#f7fff9;border:1px solid #d9f2df;border-radius:14px;padding:10px;margin:8px 0}.tiles{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:9px}.tile{border:1px solid #eee;border-radius:15px;padding:9px;background:#fff;cursor:pointer;min-height:220px}.tile:hover{box-shadow:0 5px 18px rgba(0,0,0,.07)}.tile.out{border-color:#f4c9c9;background:#fff8f8}.tile img{width:100%;height:118px;object-fit:cover;border-radius:11px;background:#f4f4f4}.tile .name{font-weight:800;font-size:13px;line-height:1.15;margin-top:7px}.meta,.stock,small{color:#666;font-size:12px}.stock{margin-top:4px;font-weight:800}.stock.ok{color:#166b2c}.stock.bad{color:#9f1d1d}.carttable,.ordertable{width:100%;border-collapse:collapse}.carttable th,.carttable td,.ordertable th,.ordertable td{border-bottom:1px solid #eee;padding:7px 5px;font-size:13px;text-align:left}.carttable input{min-width:58px;width:62px;padding:7px}.totline{display:flex;justify-content:space-between;margin:6px 0;font-weight:800}.grand{font-size:20px;border-top:1px solid #eee;padding-top:8px}.ship,.closegrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.ship label{font-size:12px;color:#666;display:flex;flex-direction:column;gap:4px}.payrow{display:grid;grid-template-columns:1fr 118px 44px;gap:7px;margin:6px 0}.payrow input,.payrow select{min-width:0}.balance{font-weight:900;margin:7px 0}.balance.ok{color:#166b2c}.balance.bad{color:#a51d1d}.notice{padding:10px 12px;border:1px solid #eee;border-radius:12px;background:#fafafa;margin:8px 0}.success{background:#f0fff4;border-color:#cdeed4}.danger{background:#fff1f1;border-color:#ffd0d0}.zgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.metric{border:1px solid #eee;border-radius:14px;padding:10px}.metric span{display:block;font-size:12px;color:#666}.metric strong{font-size:18px}.payline{display:flex;justify-content:space-between;border-top:1px solid #eee;padding:6px 0}.loading{opacity:.65;pointer-events:none}.lock{position:fixed;z-index:999999;inset:0;background:rgba(0,0,0,.62);display:none;align-items:center;justify-content:center}.lock.active{display:flex}.lockbox{width:min(420px,calc(100vw - 30px));background:#fff;border-radius:22px;padding:22px;box-shadow:0 18px 60px rgba(0,0,0,.28);text-align:center}.lockbox input{width:90%;margin:8px 0;text-align:center;font-size:22px;letter-spacing:5px}@media(max-width:1180px){.layout{grid-template-columns:1fr}.right{position:static;max-height:none}.tiles{grid-template-columns:repeat(4,1fr)}}@media(max-width:780px){.tiles{grid-template-columns:repeat(2,1fr)}.ship,.closegrid,.payrow{grid-template-columns:1fr}.mkspos{width:calc(100vw - 14px)}}
.topactions{display:flex;gap:10px;align-items:center}.modal{position:fixed;z-index:999998;inset:0;background:rgba(0,0,0,.48);display:none;align-items:center;justify-content:center;padding:18px}.modal.active{display:flex}.modalbox{background:#fff;border-radius:20px;padding:16px;max-width:760px;width:min(760px,calc(100vw - 28px));max-height:calc(100vh - 36px);overflow:auto;box-shadow:0 20px 70px rgba(0,0,0,.3)}.modalbox.wide{max-width:1080px;width:min(1080px,calc(100vw - 28px))}.modalhead{display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid #eee;margin-bottom:10px}.modalhead h2{margin:0 0 10px}.right h2{margin-top:4px}
/* v0.3.5 touch/tablet polish */
.mkspos button{min-height:44px}.mkspos input,.mkspos select{min-height:44px;font-size:16px}.topactions button{white-space:nowrap}.modal{padding:8px;align-items:flex-start;overflow:auto}.modalbox{margin:8px auto;border-radius:16px;padding:12px;width:min(720px,calc(100vw - 16px));max-height:calc(100dvh - 18px)}.modalbox.wide{width:min(980px,calc(100vw - 16px));max-width:980px}.modalhead{position:sticky;top:-12px;background:#fff;z-index:5;padding-top:4px}.modalhead h2{font-size:20px}.zgrid{grid-template-columns:repeat(2,1fr)}.zmeta{background:#f7f7f7;border:1px solid #eee;border-radius:12px;padding:8px;margin-bottom:8px;font-size:13px}.numpad{position:fixed;z-index:1000000;inset:0;background:rgba(0,0,0,.32);display:none;align-items:flex-end;justify-content:center}.numpad.active{display:flex}.numpadbox{background:#fff;border-radius:20px 20px 0 0;padding:14px;width:min(420px,100vw);box-shadow:0 -12px 40px rgba(0,0,0,.22)}.numpadvalue{text-align:right;font-size:30px;font-weight:900;padding:8px 12px;border:1px solid #eee;border-radius:12px;margin-bottom:10px;background:#fafafa}.numpadgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.numpadgrid button{font-size:22px;min-height:54px;border-radius:15px}.numpadgrid .done{grid-column:span 1;background:#111;color:#fff}.ordertable{font-size:13px}.ordertable select,.ordertable input{min-width:120px;width:100%;margin:3px 0}.ordertable button{width:100%}@media(max-width:900px){.top{align-items:flex-start;gap:8px;flex-direction:column}.topactions{width:100%;overflow:auto;padding-bottom:4px}.layout{grid-template-columns:1fr}.panel{padding:10px}.tiles{grid-template-columns:repeat(3,1fr)}.tile{min-height:190px}.tile img{height:92px}.right{max-height:none}.modalbox.wide{width:calc(100vw - 12px)}.payrow{grid-template-columns:1fr 120px 44px}.zgrid{grid-template-columns:1fr 1fr}.closegrid{grid-template-columns:1fr 1fr}.ordertable,.ordertable thead,.ordertable tbody,.ordertable tr,.ordertable td,.ordertable th{display:block}.ordertable thead{display:none}.ordertable tr{border:1px solid #eee;border-radius:14px;margin:8px 0;padding:8px}.ordertable td{border:0;padding:4px 0}}@media(max-width:560px){.tiles{grid-template-columns:repeat(2,1fr)}.closegrid,.ship,.payrow,.zgrid{grid-template-columns:1fr}.modalbox{padding:10px}.numpadgrid button{min-height:50px}}
/* v0.3.6 cashier security + order management polish */
body.mkspos-fullscreen{overflow:hidden}.mkspos{height:100dvh;overflow:hidden}.mkspos .layout{height:calc(100dvh - 92px);overflow:hidden}.mkspos .left,.mkspos .right{overflow:auto}.lockbox input[type=password]{-webkit-text-security:disc}.ordersbox{display:grid;grid-template-rows:auto auto 1fr auto;gap:8px;max-height:calc(100dvh - 18px);overflow:hidden}.orderfilters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:8px;align-items:center}.orderslist{overflow:auto;border:1px solid #eee;border-radius:14px;max-height:42dvh;background:#fafafa;padding:8px}.ordercard{width:100%;display:grid!important;grid-template-columns:1fr auto;gap:8px;text-align:left;background:#fff!important;color:#111!important;border:1px solid #eee!important;border-radius:14px!important;margin:6px 0!important;padding:10px!important}.ordercard small{display:block;margin-top:3px}.orderdetail{max-height:32dvh;overflow:auto}.detailbox{border:1px solid #ddd;background:#fff;border-radius:14px;padding:12px;margin-top:8px}.detailbox label{display:block;font-size:12px;color:#666;margin:8px 0}.detailbox select,.detailbox input{width:100%;min-width:0}.numpadvalue{letter-spacing:3px}.modalhead button{min-width:88px}@media(max-width:900px){.mkspos .layout{height:calc(100dvh - 135px)}.orderfilters{grid-template-columns:1fr 1fr}.orderslist{max-height:38dvh}.orderdetail{max-height:33dvh}}@media(max-width:560px){.orderfilters{grid-template-columns:1fr}.orderslist{max-height:34dvh}.ordercard{grid-template-columns:1fr}.orderdetail{max-height:35dvh}}

/* v0.3.8 layout and contained modal fixes */
.mkspos .layout{grid-template-columns:minmax(560px,1.35fr) minmax(400px,.75fr);gap:10px;height:calc(100dvh - 82px)}
.panel{padding:10px}.top h1{font-size:24px}.top{margin-bottom:6px}.right h2{font-size:18px;margin:0 0 6px}.carttable th,.carttable td{padding:5px 4px}.ship{grid-template-columns:1fr 1fr}.totline{font-size:14px;margin:4px 0}.grand{font-size:17px}.modalbox{max-height:calc(100dvh - 14px);overflow:hidden;display:flex;flex-direction:column}.modalbody{overflow:auto}.ordersbox{max-height:calc(100dvh - 14px);min-height:0}.orderslist{max-height:34dvh;min-height:160px}.orderdetail{max-height:38dvh;overflow:auto}.detailbox{padding:10px}.detailbox .carttable{font-size:12px}.mkspos input,.mkspos select{min-height:40px;padding:8px 10px}.mkspos button{min-height:40px;padding:8px 11px}.payrow{grid-template-columns:1fr 110px 42px}.tiles{grid-template-columns:repeat(4,minmax(118px,1fr));gap:8px}.tile{min-height:185px}.tile img{height:90px}.modalhead{flex:0 0 auto}.modalhead + *{min-height:0}
@media(max-width:1180px){.mkspos .layout{grid-template-columns:1fr;overflow:auto}.mkspos{overflow:auto}.right{position:static}.tiles{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){body.mkspos-fullscreen{overflow:auto}.mkspos{height:auto;min-height:100dvh;overflow:auto}.mkspos .layout{height:auto;overflow:visible}.mkspos .left,.mkspos .right{overflow:visible}.orderslist{max-height:32dvh}.orderdetail{max-height:40dvh}.ship{grid-template-columns:1fr 1fr}.topactions{flex-wrap:wrap;overflow:visible}.modalbox.wide{width:calc(100vw - 10px)}}
@media(max-width:700px){.ship,.payrow{grid-template-columns:1fr}.tiles{grid-template-columns:repeat(2,1fr)}}


/* v0.3.9 narrow patch: tablet-safe modal sizing for Previous / Manage Orders only */
#ordersModal.modal{position:fixed!important;z-index:1000002!important;left:0!important;right:0!important;top:0!important;bottom:0!important;width:100vw!important;height:100dvh!important;display:none;align-items:flex-start!important;justify-content:center!important;box-sizing:border-box!important;overflow:hidden!important;background:rgba(0,0,0,.52)!important;padding:72px 10px 10px!important;}
#ordersModal.modal.active{display:flex!important;}
#ordersModal .modalbox.wide.ordersbox{width:min(1100px,calc(100vw - 20px))!important;max-width:1100px!important;height:calc(100dvh - 92px)!important;max-height:calc(100dvh - 92px)!important;min-height:0!important;overflow:hidden!important;display:grid!important;grid-template-rows:auto auto minmax(170px,1fr) minmax(180px,1fr)!important;box-sizing:border-box!important;margin:0 auto!important;padding:12px!important;}
#ordersModal .modalhead{position:sticky!important;top:0!important;background:#fff!important;z-index:4!important;margin-bottom:6px!important;padding-bottom:6px!important;}
#ordersModal .orderfilters{min-height:0!important;}
#ordersModal .orderslist,#ordersModal .orderdetail{min-height:0!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important;}
#ordersModal .orderslist{max-height:none!important;}
#ordersModal .orderdetail{max-height:none!important;}
#ordersModal .ordercard{min-height:64px!important;}
#ordersModal .detailbox{margin-bottom:14px!important;}
@media (min-width:768px) and (max-width:1024px){
  #ordersModal.modal{padding:82px 8px 8px!important;}
  #ordersModal .modalbox.wide.ordersbox{width:calc(100vw - 16px)!important;height:calc(100dvh - 98px)!important;max-height:calc(100dvh - 98px)!important;grid-template-rows:auto auto minmax(190px,1fr) minmax(220px,1.1fr)!important;}
  #ordersModal .orderfilters{grid-template-columns:1.4fr 1fr 1fr auto!important;gap:7px!important;}
  #ordersModal .orderfilters input,#ordersModal .orderfilters select,#ordersModal .orderfilters button{min-width:0!important;width:100%!important;}
}
@media (max-width:767px){
  #ordersModal.modal{padding:68px 6px 6px!important;}
  #ordersModal .modalbox.wide.ordersbox{width:calc(100vw - 12px)!important;height:calc(100dvh - 76px)!important;max-height:calc(100dvh - 76px)!important;grid-template-rows:auto auto minmax(160px,1fr) minmax(190px,1fr)!important;}
  #ordersModal .orderfilters{grid-template-columns:1fr!important;}
}


/* v0.4.0 narrow patch: tighter product tiles + tablet order modal layers */
.tiles{grid-template-columns:repeat(4,minmax(106px,1fr));gap:7px}
.tile{min-height:166px;padding:8px;border-radius:14px}
.tile img{height:81px;border-radius:10px}
.tile .name{font-size:12px}.meta,.stock,.tile small{font-size:11px}
#ordersModal{z-index:1000010;align-items:flex-start;justify-content:center;padding-top:calc(4dvh + env(safe-area-inset-top));}
#ordersModal .modalbox.ordersbox{width:85vw;max-width:85vw;height:85dvh;max-height:85dvh;min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden;position:relative}
#ordersModal .modalhead{position:sticky;top:0;z-index:10;background:#fff}
#ordersModal .orderslist{max-height:none;min-height:0;height:100%;overflow:auto}
#ordersModal .orderdetail{display:none!important}
.order-edit-modal{position:fixed;z-index:1000020;inset:0;background:rgba(0,0,0,.42);display:none;align-items:flex-start;justify-content:center;padding-top:calc(7dvh + env(safe-area-inset-top));}
.order-edit-modal.active{display:flex}
.order-edit-box{width:80vw;max-width:80vw;height:80dvh;max-height:80dvh;background:#fff;border-radius:18px;box-shadow:0 22px 70px rgba(0,0,0,.34);overflow:hidden;display:flex;flex-direction:column}
.order-edit-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid #eee;background:#fff;position:sticky;top:0;z-index:2}
.order-edit-head h3{margin:0;font-size:20px}.order-edit-body{padding:12px;overflow:auto;min-height:0}.order-edit-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.order-edit-actions label{font-size:12px;color:#666;display:flex;flex-direction:column;gap:5px}.order-edit-actions .full{grid-column:1/-1}.order-edit-actions button{width:100%}
@media(min-width:768px) and (max-width:1024px){
  .tiles{grid-template-columns:repeat(4,minmax(98px,1fr));gap:6px}.tile{min-height:154px;padding:7px}.tile img{height:70px}
  #ordersModal{padding-top:58px}#ordersModal .modalbox.ordersbox{width:85vw;max-width:85vw;height:82dvh;max-height:82dvh}.orderfilters{grid-template-columns:1fr 1fr 1fr auto}.order-edit-modal{padding-top:66px}.order-edit-box{width:80vw;max-width:80vw;height:78dvh;max-height:78dvh}.order-edit-actions{grid-template-columns:1fr 1fr}.ordercard{padding:9px!important}
}
@media(max-width:767px){#ordersModal .modalbox.ordersbox{width:94vw;max-width:94vw;height:84dvh;max-height:84dvh}.order-edit-box{width:92vw;max-width:92vw;height:80dvh;max-height:80dvh}.order-edit-actions{grid-template-columns:1fr}.tiles{grid-template-columns:repeat(3,minmax(88px,1fr));}.tile{min-height:145px}.tile img{height:64px}}

/* v0.4.1 inventory mode integration */
.mkspos.inventory-mode .tile{border-color:#111;box-shadow:0 0 0 2px rgba(0,0,0,.08)}
.mkspos.inventory-mode .tile::after{content:'Inventory';display:block;margin-top:6px;font-size:11px;font-weight:800;color:#111;background:#f1f1f1;border-radius:999px;padding:4px 7px;text-align:center}
.inventorybox{width:min(980px,85vw)!important;height:min(720px,85dvh)!important;max-height:85dvh!important;overflow:hidden!important}
.inventorybox .modalbody{overflow:auto;min-height:0;padding-right:4px}
.inventory-form{display:grid;grid-template-columns:1.2fr .7fr 1.5fr auto;gap:8px;margin:10px 0;align-items:center}
.inventory-lines{border:1px solid #eee;border-radius:14px;background:#fafafa;max-height:30dvh;overflow:auto;padding:8px}
.inventory-selected{margin:8px 0}
@media(max-width:900px){.inventorybox{width:calc(100vw - 18px)!important;height:calc(100dvh - 88px)!important;max-height:calc(100dvh - 88px)!important;margin-top:68px!important}.inventory-form{grid-template-columns:1fr 1fr}.inventory-form button{grid-column:span 2}.inventory-lines{max-height:34dvh}}
@media(max-width:560px){.inventory-form{grid-template-columns:1fr}.inventory-form button{grid-column:auto}}

/* v0.5.0 tablet modal lift + desktop keyboard patch */
body > .modal{
  position:fixed!important;
  z-index:2147483000!important;
  left:0!important;right:0!important;top:0!important;bottom:0!important;
  width:100vw!important;height:100dvh!important;
  display:none;align-items:center!important;justify-content:center!important;
  padding:clamp(10px,2vw,18px)!important;
  box-sizing:border-box!important;overflow:hidden!important;
  background:rgba(0,0,0,.52)!important;
}
body > .modal.active{display:flex!important;}
body > .modal .modalbox{
  width:min(920px,calc(100vw - 24px))!important;
  max-width:calc(100vw - 24px)!important;
  max-height:calc(100dvh - 24px)!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  margin:0 auto!important;
  box-sizing:border-box!important;
}
body > .modal .modalbody,
body > .modal .orderslist,
body > .modal .orderdetail{
  overflow:auto!important;
  -webkit-overflow-scrolling:touch!important;
  min-height:0!important;
}
body > #ordersModal .modalbox.ordersbox{
  width:85vw!important;
  max-width:85vw!important;
  height:85dvh!important;
  max-height:85dvh!important;
  display:grid!important;
  grid-template-rows:auto auto minmax(0,1fr)!important;
}
body > #inventoryModal .inventorybox{
  width:85vw!important;
  max-width:85vw!important;
  height:85dvh!important;
  max-height:85dvh!important;
}
body > .order-edit-modal{z-index:2147483001!important;}
@media (min-width:768px) and (max-width:1024px){
  body > .modal{padding-top:calc(54px + env(safe-area-inset-top))!important;padding-left:14px!important;padding-right:14px!important;padding-bottom:14px!important;align-items:flex-start!important;}
  body > #ordersModal .modalbox.ordersbox,
  body > #inventoryModal .inventorybox{width:85vw!important;max-width:85vw!important;height:calc(100dvh - 76px)!important;max-height:calc(100dvh - 76px)!important;}
  body > #ordersModal .orderfilters{grid-template-columns:1.4fr 1fr 1fr auto!important;}
}
@media (max-width:767px){
  body > .modal{padding:10px!important;align-items:flex-start!important;}
  body > #ordersModal .modalbox.ordersbox,
  body > #inventoryModal .inventorybox{width:94vw!important;max-width:94vw!important;height:calc(100dvh - 20px)!important;max-height:calc(100dvh - 20px)!important;}
}


/* v0.5.1 landscape tablet modal containment patch */
@media (orientation: landscape) and (min-width:768px) and (max-width:1366px){
  body > .modal{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    padding:8px!important;
    align-items:flex-start!important;
    justify-content:center!important;
    overflow:hidden!important;
  }
  body > .modal.active{display:flex!important;}
  body > #ordersModal .modalbox.ordersbox,
  body > #inventoryModal .inventorybox,
  body > #payModal .modalbox,
  body > #shiftModal .modalbox{
    width:92vw!important;
    max-width:92vw!important;
    height:calc(100dvh - 16px)!important;
    max-height:calc(100dvh - 16px)!important;
    margin:0 auto!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  body > #inventoryModal .modalbody,
  body > #ordersModal .orderslist,
  body > #ordersModal .orderdetail{
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body > #ordersModal .modalbox.ordersbox{
    display:grid!important;
    grid-template-rows:auto auto minmax(0,1fr)!important;
  }
  body > #inventoryModal .inventory-form{
    grid-template-columns:1fr 120px 1.2fr auto!important;
  }
}

/* v0.5.2 Chrome tablet modal/top-layer and order editor fixes */
body > #ordersModal,
body > #inventoryModal,
body > #payModal,
body > #shiftModal{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  z-index:2147483000!important;
  transform:none!important;
  contain:none!important;
  isolation:isolate!important;
}
body > #ordersModal.active,
body > #inventoryModal.active,
body > #payModal.active,
body > #shiftModal.active{display:flex!important;}
body > .order-edit-modal{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  display:none;
  align-items:flex-start!important;
  justify-content:center!important;
  padding:10px!important;
  background:rgba(0,0,0,.48)!important;
  z-index:2147483100!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
body > .order-edit-modal.active{display:flex!important;}
body > .order-edit-modal .order-edit-box{
  width:80vw!important;
  max-width:80vw!important;
  height:calc(100dvh - 20px)!important;
  max-height:calc(100dvh - 20px)!important;
  background:#fff!important;
  border-radius:18px!important;
  box-shadow:0 20px 70px rgba(0,0,0,.32)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  padding:12px!important;
  box-sizing:border-box!important;
}
.order-edit-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eee;padding-bottom:8px;margin-bottom:8px;gap:10px;flex:0 0 auto;}
.order-edit-body{overflow:auto!important;-webkit-overflow-scrolling:touch!important;min-height:0!important;}
.order-edit-actions{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:8px;align-items:end;}
.order-edit-actions label{font-size:12px;color:#555;display:flex;flex-direction:column;gap:4px;}
.order-edit-actions .full{grid-column:1/-1;}
.order-add-product{border:1px solid #eee;border-radius:14px;padding:10px;margin:10px 0;background:#fafafa;}
.order-add-product .results{max-height:170px;overflow:auto;background:#fff;}
@media (orientation: landscape) and (min-width:768px) and (max-width:1366px){
  body > .modal{z-index:2147483000!important;}
  body > #ordersModal .modalbox.ordersbox,
  body > #inventoryModal .inventorybox{width:92vw!important;max-width:92vw!important;height:calc(100dvh - 16px)!important;max-height:calc(100dvh - 16px)!important;}
  body > .order-edit-modal .order-edit-box{width:80vw!important;max-width:80vw!important;height:calc(100dvh - 16px)!important;max-height:calc(100dvh - 16px)!important;}
  .order-edit-actions{grid-template-columns:repeat(2,minmax(160px,1fr));}
}

/* v0.5.3 focused patch: top-layer modals for tablet Chrome/Safari + PIN keypad above order editor */
body > #payModal,
body > #ordersModal,
body > #inventoryModal,
body > #shiftModal{
  position:fixed!important;
  inset:0!important;
  left:0!important;top:0!important;right:0!important;bottom:0!important;
  width:100vw!important;height:100dvh!important;
  z-index:2147483300!important;
  background:rgba(0,0,0,.55)!important;
  align-items:flex-start!important;
  justify-content:center!important;
  padding:calc(56px + env(safe-area-inset-top)) 10px 10px!important;
  overflow:hidden!important;
  transform:none!important;
  contain:none!important;
  box-sizing:border-box!important;
}
body > #payModal.active,
body > #ordersModal.active,
body > #inventoryModal.active,
body > #shiftModal.active{display:flex!important;}
body > #payModal .modalbox,
body > #ordersModal .modalbox,
body > #inventoryModal .modalbox,
body > #shiftModal .modalbox{
  position:relative!important;
  width:min(96vw,1120px)!important;
  max-width:min(96vw,1120px)!important;
  height:calc(100dvh - 76px)!important;
  max-height:calc(100dvh - 76px)!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  margin:0 auto!important;
  box-sizing:border-box!important;
}
body > #payModal .modalbox > :not(.modalhead),
body > #inventoryModal .modalbody,
body > #shiftModal .modalbox > :not(.modalhead){overflow:auto!important;min-height:0!important;-webkit-overflow-scrolling:touch!important;}
body > #ordersModal .modalbox.ordersbox{display:grid!important;grid-template-rows:auto auto minmax(0,1fr)!important;}
body > #ordersModal .orderslist{overflow:auto!important;min-height:0!important;max-height:none!important;-webkit-overflow-scrolling:touch!important;}
body > #ordersModal .orderdetail{display:none!important;}
body > .order-edit-modal{z-index:2147483400!important;position:fixed!important;inset:0!important;}
body > .order-edit-modal.active{display:flex!important;}
body > .order-edit-modal .order-edit-box{width:min(92vw,1040px)!important;max-width:min(92vw,1040px)!important;height:calc(100dvh - 72px)!important;max-height:calc(100dvh - 72px)!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;}
body > .order-edit-modal .order-edit-body{overflow:auto!important;min-height:0!important;-webkit-overflow-scrolling:touch!important;}
body > #numPad,.numpad{z-index:2147483600!important;position:fixed!important;}
@media (orientation:landscape) and (min-width:768px) and (max-width:1180px){
  body > #payModal,body > #ordersModal,body > #inventoryModal,body > #shiftModal{padding:48px 8px 8px!important;}
  body > #payModal .modalbox,body > #ordersModal .modalbox,body > #inventoryModal .modalbox,body > #shiftModal .modalbox{width:96vw!important;max-width:96vw!important;height:calc(100dvh - 56px)!important;max-height:calc(100dvh - 56px)!important;}
  body > .order-edit-modal .order-edit-box{width:94vw!important;max-width:94vw!important;height:calc(100dvh - 54px)!important;max-height:calc(100dvh - 54px)!important;}
}

/* v0.5.5 cleanup: keep MKS POS buttons sleek pink/black without changing layout */
.mkspos button,
.mkspos .button,
body > .modal button,
body > .order-edit-modal button,
body > .numpad button{
  border-radius:12px!important;
  font-weight:700!important;
}
.mkspos button:not(.secondary),
body > .modal button:not(.secondary),
body > .order-edit-modal button:not(.secondary),
body > .numpad button:not(.secondary){
  background:#111!important;
  border-color:#111!important;
  color:#fff!important;
}
.mkspos button.secondary,
body > .modal button.secondary,
body > .order-edit-modal button.secondary,
body > .numpad button.secondary{
  background:#fff!important;
  border-color:#f4a3c4!important;
  color:#111!important;
}
.mkspos .notice.warning,
.mkspos .edit-banner{
  background:#fff5fa!important;
  border-color:#f4a3c4!important;
  color:#111!important;
}


/* v0.5.8 focused fixes: readable order list, no duplicate edit controls, preserve pink/black POS style */
body > #ordersModal .ordercard,
body > #ordersModal .ordercard *{
  background:#fff!important;
  color:#111!important;
}
body > #ordersModal .ordercard{
  border:1px solid #e8e8e8!important;
  box-shadow:0 2px 8px rgba(0,0,0,.04)!important;
}
body > #ordersModal .ordercard small{
  color:#666!important;
}
.mkspos .edit-tools{
  background:#f7fff9!important;
  border-color:#d9f2df!important;
  color:#111!important;
}

/* v0.5.13 rewards/customer search readability only */
.mkspos .results,
.mkspos #custResults{
  background:#fff!important;
  border:1px solid #e7e7e7!important;
  border-radius:14px!important;
  box-shadow:0 8px 24px rgba(0,0,0,.06)!important;
  overflow:hidden!important;
}
.mkspos .results button,
.mkspos #custResults button{
  background:#fff!important;
  color:#111!important;
  border:0!important;
  border-bottom:1px solid #eee!important;
  border-radius:0!important;
  text-align:left!important;
  padding:10px 12px!important;
  letter-spacing:normal!important;
}
.mkspos .results button strong,
.mkspos #custResults button strong{
  color:#111!important;
  font-weight:800!important;
  letter-spacing:normal!important;
}
.mkspos .results button small,
.mkspos #custResults button small{
  color:#666!important;
  letter-spacing:normal!important;
}
.mkspos .results button:hover,
.mkspos #custResults button:hover{
  background:#f8f8f8!important;
}
/* v0.5.15 focused cash/refund UI additions */
.cash-quick{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 10px;}
.refund-summary{margin:12px 0;padding:10px;border:1px solid #e5e5e5;border-radius:12px;background:#fff;}

/* v0.5.17 focused UI polish: shift open/close separation + checkout layout */
.shift-panel{padding:4px 0 0}
.shift-panel[style*="display: none"]{display:none!important}
.shiftbox .modalhead h2{margin:0}
.paybox{max-width:min(1120px,calc(100vw - 24px))!important;width:min(1120px,calc(100vw - 24px))!important}
.pay-layout{display:grid;grid-template-columns:minmax(320px,.95fr) minmax(340px,1.05fr);gap:16px;min-height:0;overflow:hidden;padding:2px 0}
.pay-left,.pay-right{min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;border:1px solid #eee;border-radius:16px;padding:12px;background:#fff}
.pay-left{background:#fafafa}
.pay-left h3,.pay-right h3{margin:0 0 10px;font-size:16px}
.pay-right .payrow{background:#fff;border:1px solid #eee;border-radius:14px;padding:10px;margin-bottom:8px}
.pay-right .cash-quick{margin:-2px 0 8px;display:flex;gap:6px;flex-wrap:wrap}
.pay-right .balance{margin-top:8px}
.checkout-actions{margin-top:10px}
.checkout-actions button{width:100%;min-height:48px}
@media(max-width:900px){.pay-layout{grid-template-columns:1fr;overflow:auto}.pay-left,.pay-right{overflow:visible}.paybox{height:calc(100dvh - 76px)!important;max-height:calc(100dvh - 76px)!important}.paybox .pay-layout{min-height:0;overflow:auto}}


/* v0.5.18 payment tiles: touch-friendly payment selection, no dropdown UI */
.payrow-tiles{display:block!important;background:#fff;border:1px solid #eee;border-radius:16px;padding:10px;margin:8px 0 12px;}
.pay-method-label{font-size:13px;color:#555;margin-bottom:8px;}
.paytiles{display:grid;grid-template-columns:repeat(2,minmax(130px,1fr));gap:8px;margin-bottom:10px;}
.paytile{min-height:76px!important;border-radius:16px!important;border:1px solid #e6e6e6!important;background:#fff!important;color:#111!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;letter-spacing:.08em;font-size:12px;text-transform:uppercase;}
.paytile span{font-weight:900;line-height:1.15;}
.paytile small{font-size:12px;letter-spacing:normal;color:#555;font-weight:800;}
.paytile.active{background:#111!important;color:#fff!important;border-color:#111!important;box-shadow:0 8px 20px rgba(0,0,0,.12);}
.paytile.active small{color:#fff!important;}
.paytile.disabled{opacity:.38!important;cursor:not-allowed!important;background:#f5f5f5!important;color:#777!important;}
.payamountrow{display:grid;grid-template-columns:1fr 44px;gap:8px;align-items:center;}
.payamountrow input{width:100%;min-width:0;}
.pay-note{display:block;margin-top:7px;color:#666;}
@media(max-width:900px){.paytiles{grid-template-columns:repeat(2,minmax(120px,1fr));}.paytile{min-height:72px!important;}}
@media(max-width:560px){.paytiles{grid-template-columns:1fr;}.paytile{min-height:64px!important;}}


/* v0.5.19 checkout payment refinement + POS centering */
.mkspos{
  width:min(100%, calc(100vw - 20px))!important;
  max-width:1480px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}
.mkspos *{box-sizing:border-box;}
.pay-left .pay-summary{margin-top:12px;}
.pay-left .pay-items{max-height:38dvh;overflow:auto;display:table;}
.pay-applied span:first-child{font-weight:700;color:#333;}
.change-due{background:#f0fff4;border:1px solid #cdeed4;border-radius:12px;padding:8px 10px;font-size:18px;color:#166b2c;}
.payment-side-summary{position:sticky;top:0;z-index:4;background:#fff;border:1px solid #eee;border-radius:14px;padding:10px;margin:0 0 12px;box-shadow:0 4px 16px rgba(0,0,0,.04);}
.payamountrow.top-amount{display:grid;grid-template-columns:1fr 44px;gap:8px;align-items:end;margin:0 0 8px;}
.payamountrow.top-amount label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#555;font-weight:800;text-transform:uppercase;letter-spacing:.04em;}
.payamountrow.top-amount input{font-size:22px!important;font-weight:900!important;min-height:54px!important;text-align:right;width:100%;}
.payrow-tiles{margin-top:0!important;}
.paytiles{margin-top:8px;}
.pay-layout{align-items:start;}
.pay-left,.pay-right{max-height:calc(100dvh - 145px);}
@media(min-width:768px) and (max-width:1100px){
  .mkspos{width:calc(100vw - 12px)!important;max-width:1060px!important;margin:4px auto!important;}
  .mkspos .layout{grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)!important;gap:8px!important;}
  .mkspos .panel{padding:9px!important;border-radius:15px!important;}
  .mkspos .tiles{grid-template-columns:repeat(4,minmax(92px,1fr))!important;gap:7px!important;}
  .mkspos .tile{min-height:165px!important;padding:7px!important;}
  .mkspos .tile img{height:78px!important;}
  .paybox{width:calc(100vw - 12px)!important;max-width:calc(100vw - 12px)!important;}
  .pay-layout{grid-template-columns:minmax(300px,.95fr) minmax(330px,1.05fr)!important;gap:10px!important;}
  .pay-left,.pay-right{padding:10px!important;max-height:calc(100dvh - 132px)!important;}
  .paytiles{grid-template-columns:repeat(2,minmax(120px,1fr))!important;gap:7px!important;}
  .paytile{min-height:68px!important;}
}
@media(max-width:767px){
  .mkspos{width:calc(100vw - 10px)!important;margin:4px auto!important;}
}


/* v0.5.20 payment/shift focused fixes */
.single-pay-editor{margin-top:10px!important;}
.payment-side-summary{margin-bottom:12px!important;}
.payment-side-summary .pay-summary-line{width:100%;display:flex!important;align-items:center;justify-content:space-between;text-align:left;background:#fff!important;color:#111!important;border:1px solid #eee!important;border-radius:12px!important;padding:10px 12px!important;margin:6px 0!important;letter-spacing:normal!important;text-transform:none!important;}
.payment-side-summary .pay-summary-line.active{border-color:#111!important;box-shadow:0 0 0 2px rgba(0,0,0,.08)!important;}
.payment-side-summary .pay-summary-line span{font-weight:800;}
.payment-side-summary .pay-summary-line strong{font-weight:900;}
.payrow-tiles.single-pay-editor .paytiles{margin-top:10px;}
.payrow-tiles.single-pay-editor .payamountrow{margin-bottom:6px;}


/* v0.5.22 iPad/tablet POS centering + non-stacked landscape layout */
.mkspos{
  width:min(calc(100vw - 12px),1180px)!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;
}
.mkspos .layout{
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* iPad 9 / iPad Air / 11-inch tablet range: keep the POS in two columns */
@media (min-width:768px) and (max-width:1180px){
  body.mkspos-fullscreen{overflow:hidden!important;}
  .mkspos{
    width:calc(100vw - 8px)!important;
    max-width:1120px!important;
    margin:3px auto!important;
    height:100dvh!important;
    overflow:hidden!important;
    transform:none!important;
  }
  .mkspos .top{
    flex-direction:row!important;
    align-items:center!important;
    gap:6px!important;
    margin:2px 0 5px!important;
  }
  .mkspos .top h1{font-size:20px!important;line-height:1.05!important;}
  .mkspos .top p{font-size:11px!important;margin:0!important;}
  .mkspos .topactions{width:auto!important;overflow:visible!important;gap:5px!important;padding-bottom:0!important;}
  .mkspos .topactions button,.mkspos .pill{font-size:11px!important;min-height:34px!important;padding:6px 8px!important;white-space:nowrap!important;}
  .mkspos .layout{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(292px,330px)!important;
    gap:7px!important;
    height:calc(100dvh - 58px)!important;
    overflow:hidden!important;
    align-items:start!important;
  }
  .mkspos .panel{padding:7px!important;border-radius:14px!important;min-width:0!important;}
  .mkspos .left,.mkspos .right{height:calc(100dvh - 64px)!important;max-height:calc(100dvh - 64px)!important;overflow:auto!important;position:static!important;min-width:0!important;}
  .mkspos .row{gap:5px!important;margin:5px 0!important;}
  .mkspos input,.mkspos select{min-height:35px!important;padding:6px 8px!important;font-size:13px!important;min-width:120px!important;border-radius:10px!important;}
  .mkspos button{min-height:35px!important;padding:6px 8px!important;font-size:12px!important;border-radius:10px!important;}
  .mkspos h2{font-size:16px!important;margin:0 0 4px!important;}
  .mkspos h3{font-size:14px!important;margin:7px 0 4px!important;}
  .mkspos .tiles{grid-template-columns:repeat(4,minmax(82px,1fr))!important;gap:5px!important;}
  .mkspos .tile{min-height:138px!important;padding:5px!important;border-radius:12px!important;}
  .mkspos .tile img{height:58px!important;border-radius:9px!important;}
  .mkspos .tile .name{font-size:11px!important;line-height:1.08!important;margin-top:4px!important;}
  .mkspos .meta,.mkspos .stock,.mkspos small{font-size:10px!important;line-height:1.15!important;}
  .mkspos .selectedbox,.mkspos .notice{padding:7px 8px!important;margin:5px 0!important;border-radius:10px!important;font-size:12px!important;}
  .mkspos .carttable th,.mkspos .carttable td{font-size:11px!important;padding:4px 3px!important;}
  .mkspos .carttable input{width:48px!important;min-width:48px!important;padding:5px!important;}
  .mkspos .totline{font-size:12px!important;margin:3px 0!important;}
  .mkspos .grand{font-size:15px!important;padding-top:5px!important;}
  .mkspos .ship{grid-template-columns:1fr 1fr!important;gap:5px!important;margin:5px 0!important;}
  .mkspos #cart{max-height:28dvh!important;overflow:auto!important;}
}

/* iPad 9 landscape: slightly tighter so it fits without browser zoom */
@media (orientation:landscape) and (min-width:900px) and (max-width:1100px) and (max-height:820px){
  .mkspos{width:calc(100vw - 6px)!important;margin:2px auto!important;}
  .mkspos .layout{grid-template-columns:minmax(0,1fr) 305px!important;gap:6px!important;height:calc(100dvh - 54px)!important;}
  .mkspos .left,.mkspos .right{height:calc(100dvh - 60px)!important;max-height:calc(100dvh - 60px)!important;}
  .mkspos .tiles{grid-template-columns:repeat(4,minmax(76px,1fr))!important;gap:5px!important;}
  .mkspos .tile{min-height:128px!important;padding:5px!important;}
  .mkspos .tile img{height:52px!important;}
  .mkspos .top h1{font-size:18px!important;}
  .mkspos .topactions button,.mkspos .pill{font-size:10px!important;min-height:32px!important;padding:5px 7px!important;}
}

/* True phone widths can still stack */
@media (max-width:767px){
  .mkspos{width:calc(100vw - 10px)!important;margin:4px auto!important;height:auto!important;overflow:auto!important;}
  .mkspos .layout{grid-template-columns:1fr!important;height:auto!important;overflow:auto!important;}
  .mkspos .left,.mkspos .right{height:auto!important;max-height:none!important;}
}


/* v0.5.23 UI-only final centering + cart item scroll fix */
/* Break the POS out of narrow theme containers and center it against the viewport. */
@media (min-width:768px){
  .mkspos{
    width:calc(100vw - 32px)!important;
    max-width:1280px!important;
    margin-left:calc(50% - 50vw + 16px)!important;
    margin-right:calc(50% - 50vw + 16px)!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
  }
  .mkspos .layout{
    width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Keep cart actions/totals visible. Only cart items scroll. */
.mkspos .right{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  overflow:hidden!important;
}
.mkspos .right > h2,
.mkspos .right > .totals,
.mkspos .right > .ship,
.mkspos .right > .row,
.mkspos .right > #msg{
  flex:0 0 auto!important;
}
.mkspos #cart{
  flex:1 1 auto!important;
  min-height:72px!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  padding-right:2px!important;
}

@media (min-width:768px) and (max-width:1180px){
  .mkspos{
    width:calc(100vw - 28px)!important;
    max-width:none!important;
    margin-left:calc(50% - 50vw + 14px)!important;
    margin-right:calc(50% - 50vw + 14px)!important;
  }
  .mkspos .right{
    height:calc(100dvh - 64px)!important;
    max-height:calc(100dvh - 64px)!important;
  }
  .mkspos #cart{
    min-height:70px!important;
  }
}

@media (orientation:landscape) and (min-width:900px) and (max-width:1100px) and (max-height:820px){
  .mkspos{
    width:calc(100vw - 24px)!important;
    margin-left:calc(50% - 50vw + 12px)!important;
    margin-right:calc(50% - 50vw + 12px)!important;
  }
  .mkspos .right{
    height:calc(100dvh - 60px)!important;
    max-height:calc(100dvh - 60px)!important;
  }
}


/* v0.5.24 UI-only cart height fix for iPad Safari
   Keep totals, shipping, and action buttons visible; only line items scroll. */
.mkspos .right{
  overflow:hidden!important;
  min-height:0!important;
}
.mkspos #cart{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  min-height:90px!important;
}
.mkspos .right > .totals,
.mkspos .right > .ship,
.mkspos .right > .row,
.mkspos .right > #msg{
  flex:0 0 auto!important;
}

@media (min-width:768px) and (max-width:1180px){
  .mkspos .right{
    display:flex!important;
    flex-direction:column!important;
    height:auto!important;
    max-height:calc(100svh - 190px)!important;
  }
  .mkspos #cart{
    flex:0 1 auto!important;
    max-height:calc(100svh - 440px)!important;
  }
}

@media (orientation:landscape) and (min-width:900px) and (max-width:1100px) and (max-height:820px){
  .mkspos .right{
    height:auto!important;
    max-height:calc(100svh - 205px)!important;
  }
  .mkspos #cart{
    flex:0 1 auto!important;
    max-height:calc(100svh - 465px)!important;
    min-height:105px!important;
  }
  .mkspos .totline{margin:3px 0!important;}
  .mkspos .ship{margin:4px 0!important;}
  .mkspos .right > .row{margin:4px 0!important;}
}


/* v0.5.25 UI-only cart table row limit
   Keep the cart footer/totals/buttons visible by limiting the line-item table body to ~3 rows. */
.mkspos #cart{
  flex:0 0 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  padding-right:0!important;
}
.mkspos #cart > .notice{
  max-height:none!important;
  overflow:visible!important;
}
.mkspos #cart .carttable{
  width:100%!important;
  table-layout:fixed!important;
  border-collapse:collapse!important;
}
.mkspos #cart .carttable thead,
.mkspos #cart .carttable tbody tr{
  display:table!important;
  width:100%!important;
  table-layout:fixed!important;
}
.mkspos #cart .carttable tbody{
  display:block!important;
  max-height:300px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}
.mkspos #cart .carttable th:nth-child(1),
.mkspos #cart .carttable td:nth-child(1){width:52%!important;}
.mkspos #cart .carttable th:nth-child(2),
.mkspos #cart .carttable td:nth-child(2){width:18%!important;}
.mkspos #cart .carttable th:nth-child(3),
.mkspos #cart .carttable td:nth-child(3){width:20%!important;}
.mkspos #cart .carttable th:nth-child(4),
.mkspos #cart .carttable td:nth-child(4){width:10%!important;}

@media (orientation:landscape) and (min-width:900px) and (max-width:1100px) and (max-height:820px){
  .mkspos #cart .carttable tbody{max-height:270px!important;}
}
@media (max-width:899px){
  .mkspos #cart .carttable tbody{max-height:255px!important;}
}

/* v0.5.29 Manager Mode + Open Order Queue */
.managerbox{max-width:min(1120px,calc(100vw - 24px))!important;width:min(1120px,calc(100vw - 24px))!important;max-height:calc(100dvh - 40px)!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;}
.manager-content{overflow:auto;-webkit-overflow-scrolling:touch;padding:4px 2px 12px;}
.mgr-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;margin:6px 0 16px;}
.mgr-card{background:#fff;border:1px solid #eee;border-radius:18px;padding:14px;box-shadow:0 5px 18px rgba(0,0,0,.04);}
.mgr-card.primary{background:#111;color:#fff;}
.mgr-card small{display:block;color:#666;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:900;}
.mgr-card.primary small,.mgr-card.primary strong{color:#fff;}
.mgr-card strong{display:block;font-size:24px;line-height:1.1;margin-top:8px;color:#111;}
.mgr-card span{display:block;color:#666;font-size:12px;margin-top:4px;}
.mgr-sections{display:grid;grid-template-columns:1.2fr .8fr;gap:14px;}
.mgr-panel{background:#fff;border:1px solid #eee;border-radius:18px;padding:14px;box-shadow:0 5px 18px rgba(0,0,0,.04);}
.mgr-panel h3{margin:0 0 10px;font-size:16px;}
.mgr-request{display:grid;grid-template-columns:1fr auto;gap:12px;border:1px solid #eee;border-radius:14px;padding:12px;margin:10px 0;background:#fff;}
.mgr-request h4{margin:0 0 4px;font-size:15px;}
.mgr-request p{margin:0;color:#333;line-height:1.4;}
.mgr-request small{color:#666;}
.mgr-actions{display:flex;gap:8px;align-items:center;}
.mgr-panel table{width:100%;border-collapse:collapse;}
.mgr-panel th,.mgr-panel td{padding:8px;border-bottom:1px solid #eee;text-align:left;}
.mgr-panel th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#666;}
@media(max-width:1100px){.mgr-grid{grid-template-columns:repeat(2,1fr)}.mgr-sections{grid-template-columns:1fr}.managerbox{max-height:calc(100dvh - 24px)!important;}}
@media(max-width:620px){.mgr-grid{grid-template-columns:1fr}.mgr-request{grid-template-columns:1fr}.mgr-actions{justify-content:stretch}.mgr-actions button{flex:1}}

/* v0.5.30 manager additions: cashier sales + z report tables */
.mgr-wide{margin-top:14px;}
.mgr-table-wrap{width:100%;overflow:auto;-webkit-overflow-scrolling:touch;}
.mgr-table-wrap table{min-width:860px;}
.mgr-table-wrap td strong{font-weight:900;}
@media(max-width:900px){.mgr-table-wrap table{min-width:780px}.managerbox{width:calc(100vw - 18px)!important;}}

/* v0.5.31 manager Z report filters/downloads */
.mgr-filterbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0 12px;}
.mgr-filterbar input,.mgr-filterbar select{min-height:38px;border:1px solid #ddd;border-radius:10px;padding:6px 10px;background:#fff;color:#111;}
.mgr-filterbar input:first-child{min-width:260px;flex:1;}
.mgr-table-wrap a.button.small{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 9px;border-radius:9px;background:#111;color:#fff;text-decoration:none;font-size:12px;margin:2px;}
.mgr-table-wrap a.button.small.secondary{background:#fff;color:#111;border:1px solid #ddd;}

/* v0.5.40 Store login security gateway */
.mkspos-store-gate{
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:linear-gradient(135deg,#fff 0%,#fff5fa 100%);
  box-sizing:border-box;
}
.mkspos-store-login{
  width:min(420px,100%);
  background:#fff;
  border:1px solid #eee;
  border-radius:24px;
  box-shadow:0 18px 55px rgba(0,0,0,.10);
  padding:28px;
  color:#111;
  font-family:Inter,Arial,sans-serif;
}
.mkspos-store-login h1{margin:0 0 6px;font-size:30px;letter-spacing:-.03em;color:#111;}
.mkspos-store-login p{margin:0 0 18px;color:#666;line-height:1.35;}
.mkspos-store-login label{display:block;margin:12px 0 0;font-weight:800;color:#111;font-size:13px;}
.mkspos-store-login input{display:block;width:100%;box-sizing:border-box;margin-top:6px;min-height:48px;border:1px solid #ddd;border-radius:14px;padding:10px 12px;background:#fff;color:#111;font-size:16px;}
.mkspos-store-login button{width:100%;min-height:50px;margin-top:18px;border:0;border-radius:16px;background:#111;color:#fff;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.mkspos-store-login a{display:block;margin-top:14px;text-align:center;color:#111;font-weight:800;text-decoration:none;}
.mkspos-store-logo{display:block;max-width:130px;max-height:80px;object-fit:contain;margin:0 auto 16px;}
.mkspos-login-error{background:#fff0f4;border:1px solid #f5b6ca;color:#8a1238;border-radius:14px;padding:10px 12px;margin:12px 0;font-weight:800;}
.mkspos .mkspos-logout{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-height:38px;padding:8px 12px;border:1px solid #ddd;border-radius:12px;background:#fff;color:#111;font-weight:900;font-size:12px;}

/* v0.5.41 PWA app shell helpers */
@media all and (display-mode: standalone){
  html, body{overscroll-behavior:none;}
  .mkspos-wrap{padding-top:calc(8px + env(safe-area-inset-top,0px));padding-left:calc(8px + env(safe-area-inset-left,0px));padding-right:calc(8px + env(safe-area-inset-right,0px));}
}


/* v0.5.42 PWA/iPad app viewport polish only
   Removes theme top spacing in installed app mode and keeps POS at the top of the usable screen. */
@media all and (display-mode: standalone){
  html,body{margin:0!important;padding:0!important;width:100vw!important;height:100svh!important;overflow:hidden!important;background:#fff!important;}
  body.mkspos-fullscreen,
  body.mkspos-fullscreen .site,
  body.mkspos-fullscreen #page,
  body.mkspos-fullscreen #content,
  body.mkspos-fullscreen .site-content,
  body.mkspos-fullscreen .content-area,
  body.mkspos-fullscreen main,
  body.mkspos-fullscreen article,
  body.mkspos-fullscreen .entry-content,
  body.mkspos-fullscreen .wp-site-blocks{
    margin-top:0!important;
    padding-top:0!important;
  }
  body.mkspos-fullscreen header,
  body.mkspos-fullscreen footer,
  body.mkspos-fullscreen .site-header,
  body.mkspos-fullscreen .site-footer,
  body.mkspos-fullscreen .entry-title,
  body.mkspos-fullscreen .page-title{
    display:none!important;
  }
  body.mkspos-fullscreen .mkspos{
    position:fixed!important;
    top:max(4px,env(safe-area-inset-top))!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:calc(100vw - 16px)!important;
    max-width:1280px!important;
    height:calc(100svh - max(8px,env(safe-area-inset-top)))!important;
    max-height:calc(100svh - max(8px,env(safe-area-inset-top)))!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }
  body.mkspos-fullscreen .mkspos .layout{
    height:calc(100svh - 58px)!important;
  }
}

@media all and (display-mode: standalone) and (orientation:landscape) and (min-width:900px) and (max-width:1100px) and (max-height:820px){
  body.mkspos-fullscreen .mkspos{
    width:calc(100vw - 10px)!important;
    height:calc(100svh - max(6px,env(safe-area-inset-top)))!important;
  }
  body.mkspos-fullscreen .mkspos .top{margin:0 0 4px!important;}
  body.mkspos-fullscreen .mkspos .layout{height:calc(100svh - 54px)!important;}
  body.mkspos-fullscreen .mkspos .left,
  body.mkspos-fullscreen .mkspos .right{height:calc(100svh - 58px)!important;max-height:calc(100svh - 58px)!important;}
}