/* 推荐位编辑抽屉（O-03：O-01 首页推荐位 / O-02 书架页推荐位共用）
 * 为什么单独一个文件：frontend/styles.css 已超 800 行上限（行数棘轮只许持平或缩小），
 * 新样式不能写进去；Vue 岛自身的 scoped CSS 不会被装进镜像（frontend/ops-vue/dist/*.css 不在 COPY 清单），
 * 所以抽屉样式必须落在被 index.html 引用、且被 Dockerfile COPY 的独立样式表里。 */
.rec-editor-box { width: min(560px, 96vw); }
.rec-editor-target { font-size: 11.5px; color: #8b93a1; line-height: 1.7; margin-bottom: 12px; }
.rec-editor-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
.rec-editor-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.rec-editor-field.wide { grid-column: 1 / -1; }
.rec-editor-field > label { font-size: 12px; color: #606266; display: flex; align-items: baseline; gap: 6px; }
.rec-editor-field > label .tag { font-size: 10px; color: #9ca3af; font-weight: 400; }
.rec-editor-field input, .rec-editor-field select, .rec-editor-field textarea {
  height: 32px; padding: 0 9px; font-size: 12.5px; font-family: inherit; color: #1f2937;
  background: #fff; border: 1px solid #dcdfe6; border-radius: 6px; min-width: 0;
}
.rec-editor-field textarea { height: auto; padding: 7px 9px; resize: vertical; line-height: 1.6; }
.rec-editor-field input:focus, .rec-editor-field select:focus, .rec-editor-field textarea:focus { outline: none; border-color: #8b1a1a; }
.rec-editor-field input:disabled, .rec-editor-field select:disabled { background: #f7f8fa; color: #9ca3af; }
.rec-editor-note { font-size: 11px; color: #9ca3af; line-height: 1.7; }
.rec-editor-err { margin-top: 10px; font-size: 12px; color: #b91c1c; background: #fef2f2; border: 1px solid #fee2e2; border-radius: 8px; padding: 9px 11px; }
.rec-editor-cap { display: flex; align-items: baseline; gap: 6px; font-size: 11px; color: #9ca3af; }
/* 抽屉内的按钮：旧脚本的 .oc .btn-sm 只在 .oc 作用域内生效，抽屉挂在 body 下拿不到，这里自带一份 */
.rec-editor-box .btn-sm { padding: 5px 12px; font-size: 12px; font-family: inherit; color: #4b5563; background: #fff; border: 1px solid #e5e7eb; border-radius: 6px; cursor: pointer; }
.rec-editor-box .btn-sm:hover { border-color: #8b1a1a; color: #8b1a1a; }
.rec-editor-box .btn-sm.primary { background: #8b1a1a; border-color: #8b1a1a; color: #fff; }
.rec-editor-box .btn-sm.primary:hover { background: #a01d1d; color: #fff; }
.rec-editor-box .btn-sm:disabled { opacity: .5; cursor: not-allowed; }
/* 位内小卡可点开编辑（真实动作仍是抽屉里的显式保存，点击只负责打开） */
.oc .rec-book { cursor: pointer; }
.oc .rec-book:hover .rec-book-name { color: #8b1a1a; }