/* public/assets/feedback.css —— 量表评价（踩 / 赞）组件样式（深色 / 浅色主题自适应） */
.mzh-fb {
  margin: 26px auto 8px;
  max-width: 640px;
  padding: 18px 20px;
  border-radius: 16px;
  background: var(--bg2, rgba(255, 255, 255, .05));
  border: 1px solid var(--line, rgba(255, 255, 255, .14));
  text-align: center;
}
.mzh-fb-q {
  font-size: 14px;
  font-weight: 600;
  color: var(--txt, #e8edff);
  margin-bottom: 12px;
}
/* 「剩余评价 N 次」角标：与问题标题同行，右浮动不换行 */
.mzh-fb-left {
  margin-left: 10px; padding: 2px 10px; border-radius: 999px;
  font-size: 11.5px; font-weight: 500; white-space: nowrap;
  background: rgba(124, 155, 255, .14); color: var(--indigo, #7c9bff);
  border: 1px solid rgba(124, 155, 255, .32);
}
.mzh-fb-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.mzh-fb-btn {
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 9px 22px; border-radius: 999px; font-size: 14px; line-height: 1;
  background: var(--bg, #0b1020);
  color: var(--txt, #e8edff);
  border: 1px solid var(--line, rgba(255, 255, 255, .18));
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.mzh-fb-btn .ic { font-size: 16px; }
.mzh-fb-btn:hover { transform: translateY(-1px); border-color: var(--indigo, #7c9bff); }
.mzh-fb-btn.like.on {
  background: linear-gradient(120deg, var(--indigo, #7c9bff), var(--violet, #a78bfa));
  color: #fff; border-color: transparent;
  box-shadow: 0 8px 22px rgba(124, 155, 255, .38);
}
.mzh-fb-btn.dislike.on {
  background: rgba(239, 68, 68, .16);
  color: #f87171;
  border-color: rgba(239, 68, 68, .5);
  box-shadow: 0 8px 22px rgba(239, 68, 68, .22);
}
.mzh-fb-msg { margin-top: 10px; min-height: 16px; font-size: 12.5px; color: var(--txt3, #8ea2ff); }

/* 浅色主题：避免深色半透明底在浅背景上不可见 */
[data-theme="light"] .mzh-fb { background: #fff; border-color: #e6e9f2; box-shadow: 0 6px 20px rgba(30, 45, 90, .06); }
[data-theme="light"] .mzh-fb-q { color: #1b2340; }
[data-theme="light"] .mzh-fb-btn { background: #f4f6fc; color: #1b2340; border-color: #dfe4f2; }
[data-theme="light"] .mzh-fb-msg { color: #6b7699; }
[data-theme="light"] .mzh-fb-left { background: #eef2ff; color: #3b53b8; border-color: #d5ddf7; }

@media (max-width: 480px) {
  .mzh-fb { padding: 14px 12px; }
  .mzh-fb-btn { padding: 9px 16px; font-size: 13px; }
}
