/* ShortVideo metadata and JSON editor styles. Extracted from index.html during frontend split stage 1. */

/* ── 新增: 编辑模式 UI ── */
.edit-panel { display: none; flex-direction: column; gap: 8px; pointer-events: auto; background: rgba(0,0,0,.6); padding: 12px; border-radius: 8px; margin-bottom: 12px; border: 1px solid rgba(255,255,255,.1); width: 100%; max-width: 420px; max-height: min(76dvh, 680px); overflow-y: auto; overscroll-behavior: contain; }
.video-item.is-editing .edit-panel { display: flex; }
.edit-input { background: rgba(255,255,255,.1); border: 1px solid transparent; color: #fff; padding: 8px; border-radius: 6px; font-size: 13px; outline: none; width: 100%; }
.edit-input:focus { border-color: rgba(255,255,255,.3); }
select.edit-input { cursor:pointer; appearance:none; -webkit-appearance:none; background-image: linear-gradient(45deg, transparent 50%, rgba(255,255,255,.55) 50%), linear-gradient(135deg, rgba(255,255,255,.55) 50%, transparent 50%); background-position: calc(100% - 14px) center, calc(100% - 9px) center; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 24px; }
select.edit-input option { color:#111; background:#fff; }
textarea.edit-input { resize: vertical; min-height: 60px; }
.edit-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.edit-tag { display: flex; align-items: center; gap: 4px; background: rgba(88, 215, 199, 0.15); color: #58d7c7; padding: 4px 8px; border-radius: 4px; font-size: 12px; }
.edit-tag i { cursor: pointer; opacity: .7; }
.edit-tag i:hover { opacity: 1; color: #ff4757; }
.add-tag-btn { background: rgba(255,255,255,.1); border: none; color: rgba(255,255,255,.8); border-radius: 4px; padding: 4px 8px; cursor: pointer; font-size: 12px; }
.edit-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 4px; position: sticky; bottom: -12px; padding: 8px 0 0; background: linear-gradient(transparent, rgba(0,0,0,.72) 35%); }
.edit-btn-save { background: #58d7c7; color: #000; border: none; padding: 6px 16px; border-radius: 16px; font-weight: 600; cursor: pointer; font-size: 12px;}
.edit-btn-cancel { background: transparent; color: rgba(255,255,255,.6); border: none; cursor: pointer; font-size: 12px;}

/* ── JSON 编辑器 ── */
.json-editor-wrap { display: none; }
.json-editor-wrap textarea {
  font-family: 'Courier New', monospace; font-size: 12px;
  min-height: 320px; line-height: 1.45; white-space: pre; overflow: auto;
}
.edit-row { display:flex; gap:6px; align-items:center; }
.edit-row .edit-input { flex:1; }
.edit-mini-label { font-size:11px; color:rgba(255,255,255,.45); margin:6px 0 3px; }
.edit-help { font-size:11px; color:rgba(255,255,255,.38); line-height:1.45; }
.editor-tool-btn { background: rgba(88,215,199,.16); border:1px solid rgba(88,215,199,.28); color:#9bf4ea; padding:5px 8px; border-radius:6px; font-size:11px; cursor:pointer; }
.editor-tool-btn:hover { background: rgba(88,215,199,.25); }
.json-toolbar { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.json-path-label { font-size:10px; color:rgba(255,255,255,.35); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-bottom:5px; }
.auto-collection-badge { display:inline-block; background:rgba(0,200,100,.2); color:#0c8; border:1px solid rgba(0,200,100,.3); font-size:11px; padding:1px 8px; border-radius:10px; margin-left:6px; vertical-align:middle; }
.auto-collection-info { font-size:11px; color:rgba(255,255,255,.3); margin-top:4px; line-height:1.4; }
@media (max-width: 767px) {
  .edit-panel { max-height: 82dvh; }
  .json-editor-wrap textarea { min-height: 220px; height: 38dvh; }
}