html, body {
  height: 100%;
  margin: 0;
}

/* 讓 body 變成全螢幕的 flex 容器 */
.page-body {
  display: flex;
  align-items: center;    /* 垂直置中 */
  justify-content: center;/* 水平置中 */
  background: #f5f5f5;    /* 可選：淡灰背景讓卡片浮起來 */
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* 中央這塊卡片 */
.page-center {
  background: #fff;
  padding: 2rem 2.5rem;
  border-radius: 1rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  max-width: 640px;
  width: 90%;             /* 小螢幕時不要太寬 */
}

/* 讓每一行之間有一點間距 */
.field-row,
.toolbar,
p {
  margin-top: 1rem;
  margin-bottom: 0;
}
.autocomplete {
    position: relative;         /* 讓裡面的 absolute 以這個為基準 */
    display: inline-block;      /* 不要撐滿整行，可視需要調整 */
}



/* 用來顯示使用者名稱無法修改 */
#custInput[readonly] {
    background-color: #eee;
    cursor: not-allowed;
}