/* 开启排序模式时，统一卡片样式 */
#chapter-list.reorder-mode .chapter-item,
#chapter-list.reorder-mode .lesson-item {
  border: 2px solid #ddd;
  border-radius: 10px;
  background: #fff;
  cursor: grab;
  transition: box-shadow .2s, border-color .2s;
}

/* 间距与内边距 */
.chapter-item { padding: 8px 10px; margin: 8px 0; }
.lesson-item  { padding: 6px 10px; margin: 6px 0; }

/* hover/active 反馈 */
#chapter-list.reorder-mode .chapter-item:hover,
#chapter-list.reorder-mode .lesson-item:hover {
  border-color: #4CAF50;
  box-shadow: 0 2px 6px rgba(0,0,0,.1);
}
#chapter-list.reorder-mode .chapter-item:active,
#chapter-list.reorder-mode .lesson-item:active {
  cursor: grabbing;
}

/* 改名模式下两类元素的高亮与交互 */
#chapter-list.chapter-rename-mode .chapter-item,
#chapter-list.chapter-rename-mode .lesson-item {
  border: 1px solid #dc2626;
  border-radius: 6px;
  padding: 4px 6px;
  cursor: pointer;
  transition: background-color .15s ease, box-shadow .15s ease;
}
#chapter-list.chapter-rename-mode .chapter-item:hover,
#chapter-list.chapter-rename-mode .lesson-item:hover {
  background: rgba(220,38,38,.06);
  box-shadow: 0 0 0 2px rgba(220,38,38,.15) inset;
}

.dragging { opacity: .6; }

/* 放置位置提示线（在元素顶部/底部） */
.drop-indicator-top    { box-shadow: inset 0 3px 0 0 #4CAF50; }
.drop-indicator-bottom { box-shadow: inset 0 -3px 0 0 #4CAF50; }

/* 把 lesson 拖到 chapter 标题上时，高亮标题，表示会追加到该章节末尾 */
.chapter-header.drop-target {
  outline: 2px dashed #4CAF50;
  border-radius: 6px;
}
.chapter-header {
    display: block; /* 使元素成为块级元素，占满整行 */
    /* 文字默认左对齐，无需额外设置text-align: left */
  }

/* 改名按钮的激活态 */
.rename-btn[aria-pressed="true"] {
  background: rgba(220,38,38,.12);
  outline: 2px solid #dc2626;
}
.reorder-btn[aria-pressed="true"] {
  background: rgba(220,38,38,.12);
  outline: 2px solid #dc2626;
}