/* 物料管理系统 — 光年模板之上的少量自定义 */

.hidden { display: none !important; }

/* 概览统计卡 */
.stat-icon { width: 52px; height: 52px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.stat-icon .mdi { font-size: 26px; }
.bg-primary-light { background: rgba(0,123,255,.1); }
.bg-success-light { background: rgba(21,195,119,.1); }
.bg-info-light { background: rgba(51,202,187,.12); }
.bg-warning-light { background: rgba(250,166,75,.12); }
.stat-num { font-size: 22px; font-weight: 700; color: #212529; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat-label { color: #8b95a3; font-size: 13px; margin-top: 2px; }

/* 表格里的缩略图 */
.thumb { width: 42px; height: 42px; object-fit: cover; border-radius: 8px; cursor: pointer; border: 1px solid #eef0f2; transition: .15s; }
.thumb:hover { transform: scale(1.07); box-shadow: 0 2px 10px rgba(33,37,41,.14); }
.no-img { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; background: #f2f3f3; border-radius: 8px; color: #c6ccd4; font-size: 19px; }

/* 库存预警 */
.low-stock { color: #f44236; font-weight: 700; }

/* 流水类型徽章 */
.badge-in { background: rgba(21,195,119,.12); color: #15c377; }
.badge-out { background: rgba(244,66,54,.1); color: #f44236; }
.badge-adjust { background: rgba(250,166,75,.14); color: #d9860b; }

/* 顶栏标题 */
.navbar-page-title { font-size: 15px; font-weight: 600; color: #212529; margin-left: 6px; }
.navbar-left { display: flex; align-items: center; }

/* 登录页 */
.login-wrap { position: fixed; inset: 0; z-index: 2000; background: #fff; overflow-y: auto; }
.login-msg { min-height: 18px; }

/* 图片查看器 */
.img-viewer { position: fixed; inset: 0; background: rgba(33,37,41,.55); z-index: 3000; display: flex; align-items: center; justify-content: center; cursor: zoom-out; backdrop-filter: blur(2px); }
.img-viewer img { max-width: 90vw; max-height: 90vh; border-radius: 10px; box-shadow: 0 16px 56px rgba(0,0,0,.3); }

/* 扫码 */
#qr-reader { width: 100%; border-radius: 10px; overflow: hidden; background: #f2f3f3; min-height: 240px; display: flex; align-items: center; justify-content: center; color: #8b95a3; font-size: 13px; border: 1px dashed #dde1e6; }
#qr-reader video { width: 100% !important; border-radius: 10px; }
#qr-reader__scan_region { padding: 0 !important; }
.scan-modes .btn.active-mode { }
/* 扫码结果 */
.scan-found { display: grid; grid-template-columns: 92px 1fr; gap: 8px 16px; margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid #eef0f2; align-items: center; }
.scan-found img { width: 92px; height: 92px; object-fit: cover; border-radius: 10px; grid-row: span 3; cursor: pointer; border: 1px solid #eef0f2; }
.scan-found .f-name { font-size: 17px; font-weight: 700; color: #212529; }
.scan-found .f-code { color: #8b95a3; font-size: 13px; }

/* 分页 */
.pager { display: flex; gap: 6px; margin-top: 16px; align-items: center; flex-wrap: wrap; }
.pager button { padding: 5px 12px; border: 1px solid #dde1e6; background: #fff; border-radius: 7px; cursor: pointer; font-size: 13px; color: #495057; transition: .12s; font-family: inherit; }
.pager button:hover:not(:disabled) { border-color: #007bff; color: #007bff; }
.pager button.cur { background: #007bff; color: #fff; border-color: #007bff; font-weight: 600; }
.pager button:disabled { opacity: .4; cursor: default; }
.pager span { color: #8b95a3; font-size: 13px; margin-left: 8px; }

/* 图片预览(弹窗内) */
.image-preview img { max-width: 170px; max-height: 170px; border-radius: 10px; border: 1px solid #eef0f2; }

/* 侧边栏底部用户栏 */
.sidebar-footer { padding: 12px 20px; border-top: 1px solid #eef0f2; font-size: 13px; color: #8b95a3; }
.sidebar-footer a { color: #8b95a3; }
.sidebar-footer a:hover { color: #f44236; }

/* ===== 内容区：自建滚动容器（光年原版靠 body 滚动，我们固定高 + 内部滚动） ===== */
.content-scroll { height: 100%; overflow-y: auto; overflow-x: hidden; padding: 20px 20px 0; display: flex; flex-direction: column; }
.content-scroll > #app-view { flex: 1 0 auto; }

/* 侧边栏品牌区（图标 + 标题） */
.sidebar-brand { display: flex !important; align-items: center; gap: 10px; padding: 0 18px; text-decoration: none; }
.sidebar-brand img { width: 30px; height: 30px; object-fit: contain; flex-shrink: 0; border-radius: 6px; }
.sidebar-brand .site-name-text { font-size: 15px; font-weight: 700; color: #212529; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 收起状态：只留图标、居中 */
.lyear-layout-sidebar-close .sidebar-brand { padding: 0; justify-content: center; }
.lyear-layout-sidebar-close .sidebar-brand .site-name-text { display: none; }

/* 图标预览 */
.icon-preview { width: 56px; height: 56px; object-fit: contain; border: 1px solid #eef0f2; border-radius: 10px; background: #fff; padding: 4px; }

/* 页面页脚（备案号） */
.site-footer { flex-shrink: 0; text-align: center; color: #97a0ab; font-size: 12px; line-height: 1.9; padding: 20px 0 22px; }
.site-footer span { display: inline-block; margin: 0 8px; }
.site-footer a { color: #97a0ab; }
.site-footer a:hover { color: #007bff; text-decoration: underline; }
.site-footer .footer-copy { margin-top: 2px; opacity: .8; }

/* 扫码容器（扫码页 + 扫码弹窗共用） */
.scan-reader { width: 100%; border-radius: 10px; overflow: hidden; background: #f2f3f3; min-height: 200px; border: 1px dashed #dde1e6; display: flex; align-items: center; justify-content: center; }
.scan-reader video { width: 100% !important; border-radius: 10px; display: block; }
#cs-reader__scan_region, #qr-reader__scan_region { padding: 0 !important; }
.scan-picker .btn { padding: .55rem .5rem; }

/* ===== 弹窗：内容再多也不能被裁（滚动在 body，头/脚固定可见） ===== */
:root { --modal-gap: 1rem; }
@media (max-width: 768px) { :root { --modal-gap: .6rem; } }

/* 根因：Bootstrap 的 .modal-dialog-scrollable .modal-content{max-height:100%}
   在父高度 auto 时算不出来，内容就一路长到 1000px+，上下两头被裁。
   关键是给 .modal-dialog 一个确定的 height（长度值），百分比才有参照。 */
.modal-dialog {
  height: calc(100dvh - var(--modal-gap) * 2) !important;
  height: calc(100vh - var(--modal-gap) * 2) !important;
  max-height: none !important;
  margin: var(--modal-gap) auto !important;
}
.modal-dialog-centered, .modal-dialog-scrollable { height: calc(100dvh - var(--modal-gap) * 2) !important; height: calc(100vh - var(--modal-gap) * 2) !important; }

.modal .modal-content {
  display: flex !important;
  flex-direction: column !important;
  max-height: 100% !important;       /* 父级已有确定高度，这里才能封住 */
  overflow: hidden !important;
}
.modal .modal-header, .modal .modal-footer { flex: 0 0 auto !important; }
.modal .modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;          /* 不加这句 flex 子项不会收缩，还是会被裁 */
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-padding-bottom: 1.5rem;     /* 软键盘弹出时聚焦的字段不会被顶到看不见 */
}

/* 抽屉层次：遮罩压内容、侧边栏压遮罩；弹窗(z1055)仍在最上 */
@media (max-width: 1024px) {
  .lyear-mask-modal { z-index: 1000; }
  .lyear-layout-sidebar { z-index: 1001; }
  .lyear-layout-sidebar .nav-drawer > li > a { padding-top: 13px; padding-bottom: 13px; }
  .lyear-layout-sidebar .sidebar-footer { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
  .content-scroll { -webkit-overflow-scrolling: touch; }
}

@media (max-width: 768px) {
  /* 顶栏 */
  .navbar-page-title { font-size: 14px; max-width: 44vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #http-warn { font-size: 0; padding: 5px 7px; }          /* 只留告警图标，文字会挤爆顶栏 */
  #http-warn .mdi { font-size: 15px; }

  /* 内容区留白收紧 */
  .content-scroll { padding: 12px 10px 0; }
  .card-body { padding: 12px; }
  .card-header { padding: 12px 12px; }
  .site-footer { font-size: 11px; padding: 14px 0 calc(16px + env(safe-area-inset-bottom)); }
  .site-footer span { margin: 0 5px; }

  /* 卡片头部的筛选行竖排铺满 */
  .card-header.d-flex { flex-direction: column; align-items: stretch !important; }
  .card-header .ms-auto { margin-left: 0 !important; width: 100%; flex-wrap: wrap; gap: 8px !important; }
  .card-header .ms-auto input.form-control,
  .card-header .ms-auto select.form-select { flex: 1 1 130px; width: auto !important; min-width: 0; }
  /* 搜索框独占一行，其余按钮两两一行，别把输入框挤成缝 */
  .card-header .ms-auto > input.form-control { flex: 1 1 100%; }
  .card-header .ms-auto > select.form-select { flex: 1 1 45%; }
  .card-header .ms-auto > .btn { flex: 1 1 40%; }

  /* Bootstrap 栅格负边距在窄屏会顶出 4px，收一下 */
  .content-scroll .row { margin-left: -6px; margin-right: -6px; }
  .content-scroll .row > [class*="col"] { padding-left: 6px; padding-right: 6px; }
  .card-header .ms-auto .btn { flex: 1 1 40%; }

  /* 表格：横向可滑，字号收紧 */
  .table-responsive { -webkit-overflow-scrolling: touch; }
  .table { font-size: 13px; }
  .table > :not(caption) > * > * { padding: .55rem .5rem; vertical-align: middle; }
  .table .btn-sm { padding: .25rem .45rem; font-size: 12px; }

  /* 物料表：手机上只留 图/编号/名称/库存/单位/操作 */
  #mat-table th:nth-child(4), #mat-table td:nth-child(4),
  #mat-table th:nth-child(5), #mat-table td:nth-child(5),
  #mat-table th:nth-child(8), #mat-table td:nth-child(8),
  #mat-table th:nth-child(9), #mat-table td:nth-child(9) { display: none; }
  .thumb, .no-img { width: 36px; height: 36px; }
  .no-img { font-size: 16px; }

  /* 统计卡 */
  .stat-num { font-size: 19px; }
  .stat-label { font-size: 12px; }
  .stat-icon { width: 42px; height: 42px; border-radius: 10px; }
  .stat-icon .mdi { font-size: 21px; }
  .stat-icon + div { min-width: 0; overflow: hidden; }

  /* 表单：≥16px 才不会被 iOS 聚焦放大；按钮加大点击区 */
  .form-control, .form-select, .form-control:focus { font-size: 16px; }
  .btn { padding: .5rem .85rem; }
  .input-group > .btn { padding-left: .75rem; padding-right: .75rem; }

  /* 弹窗：贴边铺开 + 底部按钮等分 */
  .modal-dialog { margin: .6rem; }
  .modal-header, .modal-footer { padding: 12px 14px; }
  .modal-body { padding: 14px; }
  .modal-footer { flex-wrap: nowrap; gap: 8px; }
  .modal-footer .btn { flex: 1 1 0; }
  .modal-footer .btn + .btn { margin-left: 0; }

  /* 扫码结果卡 */
  .scan-found { grid-template-columns: 72px 1fr; }
  .scan-found img { width: 72px; height: 72px; }
  .scan-found .f-name { font-size: 15px; }

  /* 登录页 */
  .login-wrap .px-4 { padding-left: 18px !important; padding-right: 18px !important; }
  .login-wrap .py-4 { padding-top: 18px !important; padding-bottom: calc(18px + env(safe-area-inset-bottom)) !important; }

  /* 多列表格：宁可横滑也别把字挤成一条线 */
  #view-logs table, #view-audit table { min-width: 620px; }

  /* 扫码页：三个按钮换行排，摄像头框别太高 */
  .scan-modes { display: flex; flex-wrap: wrap; gap: 8px; }
  .scan-modes .btn { flex: 1 1 0; }
  #view-scan .d-flex.gap-2 { flex-wrap: wrap; }
  #view-scan .d-flex.gap-2 > .btn { flex: 1 1 44% !important; }
  #qr-reader { min-height: 200px; }

  /* 分页 */
  .pager { gap: 5px; }
  .pager button { padding: 5px 9px; font-size: 12px; }
}

@media (max-width: 430px) {
  #mat-table th:nth-child(7), #mat-table td:nth-child(7) { display: none; }  /* 极窄再省掉「单位」 */
  .content-scroll { padding: 10px 8px 0; }
  .card-body, .card-header { padding: 10px; }
  .stat-num { font-size: 17px; }
}

/* 移动端地址栏收放时用 dvh，避免底部被裁 */
@supports (height: 100dvh) {
  @media (max-width: 1024px) {
    .lyear-layout-web { min-height: 100dvh; }
  }
}