/* ============================================================
   仓掌柜 PWA / iOS Safari 适配（v4.6.6 起，仅做移动端增强，不影响桌面端）
   ============================================================ */

/* 安全区变量（刘海屏顶部、Home 指示条底部） */
:root{
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}

/* iOS 输入框字号≥16px，避免聚焦时页面自动放大；去掉系统阴影/圆角差异 */
input, select, textarea{
  font-size: 16px;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 8px;
}
/* 搜索类小框在手机上仍保持可读，不强制缩小 */
.search, .search-box input{ font-size: 16px; }

/* 去掉 iOS 长按弹出系统菜单、点按灰色高亮 */
* {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}
/* 允许输入框/文本域正常选择复制 */
input, textarea { -webkit-user-select: text; user-select: text; }

html, body{
  /* standalone 全屏时背景与顶栏一致，避免下拉露白 */
  background: #F4F6FB;
  overscroll-behavior-y: none;
}

/* 摄像头扫码弹层：手机全屏铺满，视频完整可见 */
.cam-mask{
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.92);
  display: flex; align-items: center; justify-content: center;
  padding: calc(10px + var(--safe-top)) calc(8px + var(--safe-right)) calc(10px + var(--safe-bottom)) calc(8px + var(--safe-left));
}
.cam-box{
  width: 100%; max-width: 560px;
  display: flex; flex-direction: column; gap: 10px;
  padding: 12px; border-radius: 16px;
}
.cam-box video{
  width: 100%; height: auto; max-height: 70vh;
  border-radius: 12px; background: #000; object-fit: contain;
}
.cam-head{ display: flex; align-items: center; justify-content: space-between; gap: 8px; color:#fff; font-weight:600; }
.cam-tip{ color: rgba(255,255,255,.75); font-size: 12px; text-align: center; }

/* 窄屏（手机竖屏）适配 */
@media (max-width: 768px){
  /* 顶栏留出刘海安全区 */
  .topbar{
    padding-top: var(--safe-top);
    min-height: calc(52px + var(--safe-top));
  }
  /* 侧边抽屉从安全区下方开始 */
  .sidebar{ padding-top: var(--safe-top); }
  /* 主内容底部留出 Home 指示条，避免最后一行被遮挡 */
  #content, .main, main{
    padding-bottom: calc(12px + var(--safe-bottom));
  }
  /* 工具栏允许换行，按钮不挤成一团；触控高度≥40px */
  .toolbar{ flex-wrap: wrap; gap: 8px; }
  .toolbar .btn, .toolbar select, .toolbar input{ min-height: 40px; }
  .btn, button{ min-height: 36px; }
  .icon-btn{ min-width: 38px; min-height: 38px; }
  /* 表格卡片化时单元格内边距更舒适 */
  .table-wrap{ border-radius: 12px; }
  /* 弹窗在手机上几乎满宽，底部留安全区 */
  .modal-mask{ padding: calc(10px + var(--safe-top)) 10px calc(10px + var(--safe-bottom)); }
  .modal, .dlg{ width: 100% !important; max-width: 100% !important; max-height: calc(100vh - var(--safe-top) - var(--safe-bottom) - 20px); overflow-y: auto; }
  /* 表单两列改单列 */
  .form-grid, .form-row{ grid-template-columns: 1fr !important; }
  /* 分页器换行 */
  .pager{ flex-wrap: wrap; gap: 6px; }
  /* 大标题略收 */
  h1{ font-size: 20px; }
}

/* 加到主屏幕（standalone）时：不再显示浏览器地址栏，顶栏贴边并补安全区 */
@media (display-mode: standalone){
  .topbar{ padding-top: var(--safe-top); }
  body{ user-select: none; }
  input, textarea, [contenteditable]{ user-select: text; }
}
/* iOS Safari 旧版 standalone 判定（配合 apple-mobile-web-app-capable） */
@media (display-mode: standalone), (-webkit-min-device-pixel-ratio: 0){
  body.ios-standalone .topbar{ padding-top: var(--safe-top); }
}