/**
 * 心愿评论面板样式（网站前台 wishes 页与分享落地页 share.php 共用同一份）
 *
 * 与「许愿墙 APP」的评论界面保持一致：
 *   心愿摘要 → 字数有限的输入框 → 评论列表（含作者回复）
 *
 * v1.7.9：由「评价」改为「评论」，移除五星评分相关样式。
 * 变量均带兜底值：主题页（style.css 提供 --wb-* 变量）与独立的 share.php 都能直接用。
 */
.cm-panel{position:fixed;inset:0;z-index:10001;display:none;}
.cm-panel.is-open{display:block;}
.cm-panel__mask{position:absolute;inset:0;background:rgba(15,23,42,.45);animation:wbCmFade .18s ease;}
.cm-panel__box{position:absolute;left:50%;bottom:0;width:min(460px,100%);
  transform:translateX(-50%);background:#fff;border-radius:18px 18px 0 0;
  padding:16px 18px calc(18px + env(safe-area-inset-bottom));
  max-height:92vh;overflow-y:auto;animation:wbCmUp .22s ease;
  box-sizing:border-box;color:var(--wb-text,#0f172a);
  font-family:inherit;-webkit-overflow-scrolling:touch;}
.cm-panel__head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px;}
.cm-panel__title{font-size:15px;font-weight:700;color:var(--wb-text,#0f172a);}
.cm-panel__sub{display:block;font-size:12px;font-weight:400;color:var(--wb-muted,#64748b);margin-top:3px;}
.cm-panel__close{border:0;background:#f1f5f9;color:#64748b;width:28px;height:28px;border-radius:50%;
  font-size:14px;line-height:1;cursor:pointer;padding:0;flex:none;}
.cm-panel__close:hover{background:#e2e8f0;}

/* ---------- 心愿摘要 ---------- */
.cm-wish{background:#FFF7F9;border:1px solid #FCE7EF;border-radius:12px;padding:10px 12px;margin-bottom:12px;}
.cm-wish__text{font-size:14px;line-height:1.7;color:#4C0519;word-break:break-word;white-space:pre-wrap;}
.cm-wish__meta{margin-top:6px;font-size:11px;color:#9CA3AF;display:flex;gap:8px;flex-wrap:wrap;}
.cm-wish__count{color:#BE123C;}

/* ---------- 我的评论输入区 ---------- */
.cm-form{background:#fff;border:1px solid var(--wb-line,#f1f5f9);border-radius:12px;padding:12px;margin-bottom:12px;}
.cm-form input,.cm-form textarea{width:100%;box-sizing:border-box;border:1px solid #FECDD3;border-radius:10px;
  padding:9px 11px;font-size:14px;background:#FFF7F9;color:var(--wb-text,#0f172a);font-family:inherit;}
.cm-form input:focus,.cm-form textarea:focus{outline:none;border-color:#E11D48;background:#fff;}
.cm-form textarea{height:64px;resize:none;margin-top:8px;}
.cm-form__row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;}
.cm-form__tip{font-size:11px;color:var(--wb-muted,#94a3b8);}
.cm-form__btn{border:0;border-radius:20px;background:#E11D48;color:#fff;font-size:14px;font-weight:600;
  padding:8px 22px;cursor:pointer;flex:none;font-family:inherit;}
.cm-form__btn[disabled]{background:#F9A8D4;cursor:not-allowed;}
.cm-limit{background:#FFF7ED;border:1px solid #FED7AA;color:#9A3412;border-radius:10px;
  padding:10px 12px;margin-bottom:12px;font-size:12px;line-height:1.6;}
.cm-limit a{color:#BE123C;}

/* ---------- 评论列表 ---------- */
.cm-list{margin:0 0 4px;}
.cm-item{padding:10px 0;border-bottom:1px dashed var(--wb-line,#F1F5F9);}
.cm-item:last-child{border-bottom:0;}
.cm-item__top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.cm-item__name{font-size:13px;font-weight:600;color:#BE123C;}
.cm-item__tag{font-size:10px;color:#92400E;background:#FEF3C7;border-radius:8px;padding:1px 6px;}
.cm-item__time{font-size:11px;color:#9CA3AF;margin-left:auto;}
.cm-item__text{font-size:13px;line-height:1.75;color:var(--wb-text,#334155);margin-top:4px;
  word-break:break-word;white-space:pre-wrap;}
.cm-item__acts{display:flex;gap:14px;margin-top:6px;}
.cm-item__act{border:0;background:none;padding:0;font-size:12px;color:var(--wb-muted,#64748b);
  cursor:pointer;font-family:inherit;}
.cm-item__act:hover{color:#BE123C;}
.cm-item__act.danger:hover{color:#DC2626;}
.cm-replybox{margin-top:6px;padding:8px;background:#FFF7F9;border-radius:10px;}
.cm-replybox textarea{width:100%;box-sizing:border-box;height:52px;resize:none;border:1px solid #FECDD3;
  border-radius:8px;padding:8px 10px;font-size:13px;background:#fff;font-family:inherit;}
.cm-replybox__row{display:flex;gap:8px;align-items:center;margin-top:6px;}
.cm-replybox__row button{border:0;border-radius:16px;padding:5px 16px;font-size:12px;font-family:inherit;cursor:pointer;}
.cm-replybox__row .ok{background:#E11D48;color:#fff;}
.cm-replybox__row .cancel{background:#F1F5F9;color:#64748b;}
.cm-replies{margin-top:8px;padding-left:12px;border-left:2px solid #FCE7EF;}
.cm-reply{padding:6px 0;}
.cm-reply__text{font-size:12px;line-height:1.7;color:var(--wb-text,#334155);word-break:break-word;}
.cm-empty{text-align:center;color:#9CA3AF;font-size:13px;padding:22px 0;}
.cm-loading{text-align:center;color:#9CA3AF;font-size:12px;padding:16px 0;}
.cm-toast{position:fixed;left:50%;bottom:88px;transform:translateX(-50%);z-index:10002;
  background:rgba(15,23,42,.92);color:#fff;font-size:13px;padding:10px 16px;border-radius:20px;
  max-width:80vw;text-align:center;opacity:0;transition:opacity .25s ease;pointer-events:none;}
.cm-toast.is-show{opacity:1;}

@keyframes wbCmFade{from{opacity:0}to{opacity:1}}
@keyframes wbCmUp{from{transform:translate(-50%,26px);opacity:.4}to{transform:translate(-50%,0);opacity:1}}

/* 宽屏改为居中弹窗 */
@media (min-width:720px){
  .cm-panel__box{top:50%;bottom:auto;border-radius:18px;transform:translate(-50%,-50%);animation:wbCmPop .2s ease;}
  @keyframes wbCmPop{from{transform:translate(-50%,-46%);opacity:.4}to{transform:translate(-50%,-50%);opacity:1}}
}