/* 班组履职评价系统 V1.7.2
 * 修复移动端权限详情与权限筛选底栏覆盖内容。
 * 标题继续随抽屉内容滚动，权限页签及所有业务规则保持不变。
 */

/* 桌面端保持原有网格与抽屉布局，新容器只承担移动端滚动分层。 */
.permission-detail-scroll,
.permission-filter-scroll {
  display: contents;
}

.permission-detail-actions[hidden] {
  display: none !important;
}

@media (max-width: 760px) {
  .permission-detail-backdrop {
    block-size: 100dvh;
    height: 100dvh;
    overflow: hidden;
  }

  /* 外层只负责可视高度和底栏，标题、页签与正文共用一个滚动层。 */
  .permission-detail-drawer {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    padding-bottom: 0;
    overflow: hidden;
  }

  .permission-detail-scroll {
    display: block;
    min-inline-size: 0;
    min-width: 0;
    min-block-size: 0;
    min-height: 0;
    margin-right: calc(0px - max(16px, env(safe-area-inset-right)));
    margin-left: calc(0px - max(16px, env(safe-area-inset-left)));
    padding-right: max(16px, env(safe-area-inset-right));
    padding-bottom: 16px;
    padding-left: max(16px, env(safe-area-inset-left));
    overflow-x: hidden;
    overflow-y: auto;
    scroll-padding-block: 16px;
    scroll-padding-bottom: 16px;
    overscroll-behavior-x: none;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }

  /* 用户资料标题不是吸顶栏，行为与系统其他抽屉标题一致。 */
  .permission-detail-head {
    position: relative;
    top: auto;
  }

  .permission-change-box {
    scroll-margin-block: 16px;
  }

  .permission-change-box textarea {
    font-size: 16px;
    scroll-margin-block-end: 16px;
  }

  .permission-detail-actions {
    position: static;
    z-index: 6;
    bottom: auto;
    min-inline-size: 0;
    min-width: 0;
    max-inline-size: none;
    max-width: none;
    margin-top: 0;
    margin-right: calc(0px - max(16px, env(safe-area-inset-right)));
    margin-bottom: 0;
    margin-left: calc(0px - max(16px, env(safe-area-inset-left)));
    padding: 12px max(16px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    border-top: 1px solid #e4ebf1;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 -8px 20px rgba(18, 52, 82, .06);
    backdrop-filter: blur(10px);
  }

  /* 权限筛选使用确定高度的两行布局，避免 WebKit 把滚动交给错误层。 */
  .permission-filter-panel {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    height: min(90vh, 760px);
    height: min(90dvh, 760px);
    max-height: min(90vh, 760px);
    max-height: min(90dvh, 760px);
    padding-bottom: 0;
    overflow: hidden;
  }

  .permission-filter-scroll {
    display: block;
    min-inline-size: 0;
    min-width: 0;
    min-block-size: 0;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scroll-padding-block: 16px;
    scroll-padding-bottom: 16px;
    overscroll-behavior-x: none;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }

  /* 筛选标题随上方内容一起滚走，不新增固定标题。 */
  .permission-filter-panel .mobile-filter-head {
    position: static;
    top: auto;
  }

  .permission-filter-checks {
    scroll-margin-block: 16px;
  }

  #permission-filter-keyword {
    font-size: 16px;
    scroll-margin-block-end: 16px;
  }

  .permission-filter-actions,
  .permission-filter-panel .mobile-filter-actions {
    position: static;
    z-index: 3;
    bottom: auto;
    min-inline-size: 0;
    min-width: 0;
    max-inline-size: none;
    max-width: none;
    margin: 0;
    padding: 12px max(16px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    border-top: 1px solid #e4ebf1;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 -8px 20px rgba(18, 52, 82, .06);
    backdrop-filter: blur(10px);
  }
}

@media (max-width: 430px) {
  .permission-detail-actions,
  .permission-filter-panel .mobile-filter-actions {
    gap: 9px;
  }
}

@media (max-width: 390px) {
  .permission-detail-actions .btn,
  .permission-filter-panel .mobile-filter-actions .btn {
    min-width: 0;
  }
}