/* ============================================================
   开发 Tab · 「技能开发」静态页（还原截图）
   ------------------------------------------------------------
   由 script25.js 注入：当路由为 #/develop/skill 时，在
   .develop-page（position:relative）内叠加一张不透明的静态
   「技能开发」页面，覆盖原「该模块开发中，敬请期待」占位：
     标题 + 上传/新建按钮、筛选分段 tab、刷新 + 搜索、
     空状态「暂无内容」。
   复用开发相关设计 token（主色 #2970ff）。仅静态展示。
   ============================================================ */

.bdev-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: #fff;
  display: flex;
  flex-direction: column;
  padding: 28px 36px;
  overflow-y: auto;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* ---- 头部：标题 + 右上操作 ---- */
.bdev-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-shrink: 0;
}

.bdev-title {
  font-size: 20px;
  font-weight: 600;
  color: #000000e0;
  margin: 0;
  letter-spacing: -0.01em;
}

.bdev-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.bdev-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
  white-space: nowrap;
}

.bdev-btn svg { width: 15px; height: 15px; flex-shrink: 0; }

.bdev-btn-outline {
  background: #fff;
  border: 1px solid #b8ccff;
  color: #2970ff;
}
.bdev-btn-outline:hover {
  border-color: #2970ff;
  background: #f5f8ff;
}

.bdev-btn-primary {
  background: #2970ff;
  border: 1px solid #2970ff;
  color: #fff;
}
.bdev-btn-primary:hover {
  background: #1557d8;
  border-color: #1557d8;
}

/* ---- 工具栏：分段 tab + 刷新 + 搜索 ---- */
.bdev-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 20px;
  flex-shrink: 0;
}

.bdev-seg {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  background: #0000000a;
  border-radius: 10px;
  padding: 4px;
}

.bdev-seg-item {
  border: none;
  background: transparent;
  color: #00000073;
  font-size: 14px;
  font-family: inherit;
  padding: 6px 16px;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
  white-space: nowrap;
}

.bdev-seg-item:hover { color: #000000a6; }

.bdev-seg-item.active {
  background: #fff;
  color: #1a1a1a;
  font-weight: 600;
  box-shadow: 0 1px 3px #0000001a;
}

.bdev-tools {
  display: flex;
  align-items: center;
  gap: 12px;
}

.bdev-refresh {
  border: none;
  background: transparent;
  color: #00000059;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.bdev-refresh:hover { background: #0000000a; color: #00000080; }
.bdev-refresh svg { width: 17px; height: 17px; }
.bdev-refresh.spinning svg { animation: bdev-spin 0.6s ease; }

@keyframes bdev-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

.bdev-search {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 220px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.bdev-search:focus-within {
  border-color: #2970ff;
  box-shadow: 0 0 0 3px #2970ff1f;
}

.bdev-search input {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font-size: 14px;
  color: #1a1a1a;
  font-family: inherit;
}
.bdev-search input::placeholder { color: #00000047; }

.bdev-search svg { width: 16px; height: 16px; color: #00000047; flex-shrink: 0; }

/* ---- 内容区 + 空状态 ---- */
.bdev-body {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bdev-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.bdev-empty-icon {
  width: 58px;
  height: 58px;
  color: #d3d7dd;
}
.bdev-empty-icon svg { width: 100%; height: 100%; display: block; }

.bdev-empty-text {
  font-size: 14px;
  color: #00000059;
}