/* =========================
   MOBILE POS LAYOUT FIX
   ========================= */
@media (max-width: 768px) {

  /* Root POS container */
  main.pos {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  /* Scan bar stays on top */
  .scan-bar {
    flex-shrink: 0;
  }

  /* Middle section takes remaining space */
  .pos .content {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  /* Cart scrolls */
  .pos .cart {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .cart table {
    width: 100%;
    border-collapse: collapse;
  }

  /* Summary stacks UNDER cart, scrollable */
  .pos .summary {
    flex-shrink: 0;
    width: 100%;
    max-height: 40vh; /* prevents footer collision */
    overflow-y: auto;
    border-top: 1px solid #ddd;
  }

  /* Footer keys DO NOT overlap */
  footer.keys {
    position: sticky;
    bottom: 0;
    flex-shrink: 0;
    background: #fff;
    z-index: 20;
    border-top: 1px solid #ccc;
  }
  
  
  
/* =========================
   MOBILE LOOKUP FLOAT FIX
    ========================= */
    #lookupResults {
      position: fixed;
      left: 8px;
      right: 8px;
      top: 140px; /* below topbar + scan bar */
      max-height: 40vh;
    
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    
      background: #fff;
      border: 1px solid #ddd;
      z-index: 999;
    }
    
    
    html, body {
      height: auto;
      overflow-y: auto;
    }
    #lookupResults {
      z-index: 9999;
    }
    #lookupResults {
      background: #f7e9c3 !important;
    }
    .modal-box {
        border: 1px solid red;
    }

}
