/* 班组履职评价系统 V1.6.16
 * 概览及评价查询筛选沿用“新增班组”的单滚动容器和粘性操作栏。
 * 仅覆盖概览、查询、修改和删除共用的筛选弹层；系统日志筛选保持原布局。
 */

/* 桌面端继续使用原五列/三列筛选网格，不显示移动端取消按钮。 */
.modal-filter-sheet .mobile-filter-body,
.modal-filter-sheet .mobile-filter-actions {
  display: contents;
}

.modal-filter-sheet .mobile-filter-cancel {
  display: none;
}

@media (max-width: 760px) {
  /* 与 .modal 相同：弹层本身是唯一纵向滚动容器。
   * iOS 的原生弹性滚动会同时带动内部 sticky 操作栏，松手后自然归位。 */
  .modal-filter-sheet {
    display: block;
    inline-size: 100%;
    width: 100%;
    max-inline-size: 100%;
    max-width: 100%;
    height: auto;
    max-height: 90vh;
    max-height: 90dvh;
    min-height: 0;
    padding: 21px max(17px, env(safe-area-inset-right)) calc(21px + env(safe-area-inset-bottom)) max(17px, env(safe-area-inset-left));
    overflow-x: hidden;
    overflow-y: auto;
    scroll-padding: 0;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: none;
    overscroll-behavior-y: auto;
    touch-action: pan-y;
    contain: inline-size;
    border-radius: 20px 20px 0 0;
    background: #fff;
    box-shadow: 0 -18px 55px rgba(7, 34, 58, .25);
  }

  /* 覆盖 V1.6.14 的打开态 overflow-y:hidden，避免再次退回中区独立滚动。 */
  .filter-panel.modal-filter-sheet.mobile-filter-open {
    overflow-x: hidden;
    overflow-y: auto;
  }

  .modal-filter-sheet:focus {
    outline: none;
  }

  .modal-filter-sheet > *,
  .modal-filter-sheet .mobile-filter-body,
  .modal-filter-sheet .mobile-filter-body > *,
  .modal-filter-sheet .mobile-filter-body label,
  .modal-filter-sheet .mobile-filter-body label > *,
  .modal-filter-sheet .mobile-filter-actions,
  .modal-filter-sheet .mobile-filter-actions > * {
    min-inline-size: 0;
    max-inline-size: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* 标题与说明不再单独吸顶，排版和“新增班组”的 h3 + .sub 一致。 */
  .modal-filter-sheet .mobile-filter-head {
    position: static;
    z-index: auto;
    top: auto;
    display: block;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }

  .modal-filter-sheet .mobile-filter-head > div {
    overflow: visible;
  }

  .modal-filter-sheet .mobile-filter-head strong {
    display: block;
    margin: 0 0 16px;
    color: var(--v12-ink);
    font-size: 20px;
    line-height: 1.35;
  }

  .modal-filter-sheet .mobile-filter-head small {
    display: block;
    margin: 0 0 26px;
    color: var(--v12-muted);
    font-size: 13px;
    line-height: 1.7;
  }

  .modal-filter-sheet .mobile-filter-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: max-content;
    align-content: start;
    gap: 13px;
    min-height: auto;
    padding: 0;
    overflow: visible;
    scroll-padding: 0;
    touch-action: auto;
  }

  .modal-filter-sheet .mobile-filter-body label {
    display: grid;
    align-content: start;
    gap: 6px;
    margin: 0;
  }

  .modal-filter-sheet .mobile-filter-body label > span {
    color: #526276;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
    overflow-wrap: anywhere;
  }

  .modal-filter-sheet .mobile-filter-body input,
  .modal-filter-sheet .mobile-filter-body select,
  .modal-filter-sheet .mobile-filter-body textarea {
    display: block;
    inline-size: 100% !important;
    width: 100% !important;
    min-inline-size: 0 !important;
    min-width: 0 !important;
    max-inline-size: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* V1.6.13 的零垂直内边距会让 iPhone 日期文字贴近上沿。
   * 保留防撑宽约束，并恢复与普通表单控件相同的上下留白。 */
  .modal-filter-sheet input[type="month"],
  .modal-filter-sheet input[type="date"] {
    display: block;
    inline-size: 100% !important;
    width: 100% !important;
    min-inline-size: 0 !important;
    min-width: 0 !important;
    max-inline-size: 100% !important;
    max-width: 100% !important;
    -webkit-min-logical-width: 0 !important;
    height: 44px;
    min-height: 44px;
    padding: 10px 12px;
    overflow: hidden;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
    font-size: 16px;
    line-height: 22px;
  }

  .modal-filter-sheet input[type="month"]::-webkit-date-and-time-value,
  .modal-filter-sheet input[type="date"]::-webkit-date-and-time-value {
    display: flex;
    align-items: center;
    inline-size: 100%;
    width: 100%;
    min-inline-size: 0;
    min-width: 0;
    height: 22px;
    min-height: 22px;
    margin: 0;
    padding: 0;
    line-height: 22px;
    text-align: left;
  }

  .modal-filter-sheet input[type="month"]::-webkit-datetime-edit,
  .modal-filter-sheet input[type="date"]::-webkit-datetime-edit {
    display: flex;
    align-items: center;
    inline-size: 100%;
    width: 100%;
    min-inline-size: 0;
    min-width: 0;
    height: 22px;
    min-height: 22px;
    margin: 0;
    padding: 0;
    line-height: 22px;
    text-align: left;
  }

  /* 操作栏处于同一个滚动容器内，复制“新增班组”粘性底栏的回弹模型。 */
  .modal-filter-sheet .mobile-filter-actions {
    position: sticky;
    z-index: 3;
    bottom: calc(-21px - env(safe-area-inset-bottom));
    display: flex;
    inline-size: auto;
    width: auto;
    max-inline-size: none;
    max-width: none;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 18px;
    margin-right: calc(0px - max(17px, env(safe-area-inset-right)));
    margin-bottom: calc(-21px - env(safe-area-inset-bottom));
    margin-left: calc(0px - max(17px, env(safe-area-inset-left)));
    padding: 12px max(17px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(17px, env(safe-area-inset-left));
    border-top: 1px solid #e6edf3;
    background: rgba(255, 255, 255, .97);
    box-shadow: none;
    backdrop-filter: blur(10px);
  }

  .modal-filter-sheet .mobile-filter-cancel {
    display: inline-flex;
  }

  .modal-filter-sheet .mobile-filter-actions .btn {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: auto;
    width: auto;
    min-width: 0;
    max-width: 100%;
    min-height: 45px;
    flex: 1;
    margin: 0;
    box-shadow: none;
    touch-action: manipulation;
  }
}