/* ==========================================================================
   誓约打卡插件 — 样式
   ⚠️ 只用既有 --mn-* 变量（核心不存在 --mn-danger-* / --mn-spectrum-* 等自造变量）
   ⚠️ 零内联：全部样式在此文件，不用内联 style / on* 属性
   ⚠️ 核心原子类（.mn-input/.mn-btn/.admin-table）与插件类同权重 (0,1,0) → 会被静默压掉，
      需要控宽/控序的一律用提权选择器（元素+类，如 input.pc-input）
   ⚠️ 改本文件后必须让 ?v= 变化（钩子用 filemtime 生成，自动生效）
   ========================================================================== */

/* ---------- 卡片（帖子内嵌 / 详情页共用） ---------- */
.pc-card {
    margin: 14px 0;
    border: 1px solid var(--mn-border);
    border-radius: 10px;
    background: var(--mn-bg-card);
    overflow: hidden;
}

.pc-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--mn-border-light);
    background: var(--mn-bg);
}

.pc-card-body {
    padding: 14px;
}

.pc-badge {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 18px;
    color: var(--mn-primary);
    background: var(--mn-primary-subtle);
}

.pc-status {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 18px;
}

.pc-status-signup {
    color: var(--mn-primary);
    background: var(--mn-primary-subtle);
}

.pc-status-active {
    color: var(--mn-alert-success-text);
    background: var(--mn-alert-success-bg);
}

.pc-status-completed {
    color: var(--mn-alert-success-text);
    background: var(--mn-alert-success-bg);
}

.pc-status-failed {
    color: var(--mn-alert-error-text);
    background: var(--mn-alert-error-bg);
}

.pc-status-cancelled {
    color: var(--mn-comp-hint-text);
    background: var(--mn-bg-tag);
}

.pc-status-in {
    color: var(--mn-primary);
    background: var(--mn-primary-subtle);
}

.pc-status-done {
    color: var(--mn-alert-success-text);
    background: var(--mn-alert-success-bg);
}

.pc-status-failed {
    color: var(--mn-alert-error-text);
    background: var(--mn-alert-error-bg);
}

/* ---------- 指标格 ---------- */
.pc-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin-bottom: 12px;
}

.pc-metric {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.pc-metric-k {
    font-size: 12px;
    color: var(--mn-comp-hint-text);
}

.pc-metric-v {
    font-size: 15px;
    font-weight: 600;
    color: var(--mn-content-text);
}

/* ---------- 进度 ---------- */
.pc-progress-wrap {
    margin-bottom: 12px;
}

.pc-progress-head {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: var(--mn-comp-hint-text);
    margin-bottom: 5px;
}

.pc-progress-num {
    font-weight: 600;
    color: var(--mn-content-text);
}

progress.pc-progress {
    display: block;
    width: 100%;
    height: 8px;
    border: 0;
    border-radius: 999px;
    background: var(--mn-bg-strength-track);
    appearance: none;
    -webkit-appearance: none;
}

progress.pc-progress::-webkit-progress-bar {
    background: var(--mn-bg-strength-track);
    border-radius: 999px;
}

progress.pc-progress::-webkit-progress-value {
    background: var(--mn-primary);
    border-radius: 999px;
}

progress.pc-progress::-moz-progress-bar {
    background: var(--mn-primary);
    border-radius: 999px;
}

/* ---------- 参与人 ---------- */
.pc-people {
    margin-bottom: 12px;
    font-size: 13px;
}

.pc-people-row {
    display: flex;
    gap: 8px;
    padding: 3px 0;
}

.pc-people-k {
    flex: 0 0 72px;
    color: var(--mn-comp-hint-text);
}

.pc-people-v {
    flex: 1;
    color: var(--mn-content-text);
    word-break: break-word;
}

/* ---------- 结果 ---------- */
.pc-result {
    display: flex;
    gap: 8px;
    padding: 8px 10px;
    margin-bottom: 12px;
    border-radius: 8px;
    font-size: 13px;
    background: var(--mn-bg);
    border: 1px solid var(--mn-border-light);
}

.pc-result-k {
    color: var(--mn-comp-hint-text);
}

.pc-result-v {
    color: var(--mn-content-text);
    font-weight: 600;
}

/* ---------- 操作区 ---------- */
.pc-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid var(--mn-border-light);
}

.pc-inline-form {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

/* ---------- 按钮 / 输入（提权覆盖核心原子类） ----------
   ⚠️⚠️ 主按钮**一律直接复用核心 `.mn-btn-primary`**（markup 写 `mn-btn mn-btn-primary`，
      本文件**不再自造** `.pc-btn-primary` 的配色）。原因（2026-10-13 实测踩坑）：
        · 核心 `.mn-btn:hover`(0,2,0) 的 `color: var(--mn-primary)` 会压过自造
          `button.pc-btn-primary`(0,1,1) 的 `color:#fff`；而自造 `:hover` 只改背景不改 color
          → hover 时变成「主色字压 primary-hover 底」，实测对比度 **1.35:1**（看不清字）。
        · 核心 `.mn-btn-primary:hover`(0,2,0 且在同表更靠后) 自带 `color: var(--mn-text-inverse)`，
          天然正确，无需插件再插一脚。参照核心自带插件 `post_poll` 的写法。
   ⚠️⚠️ 危险按钮必须用主题自带、**成对出现**的 `--mn-alert-error-{bg,text}`（9 个主题全有，
      且互为可读配色）。**绝不能用 `--mn-danger`** —— 全站**从未定义**该变量
      → `background: var(--mn-danger)` 属 invalid at computed-value time → 整条声明作废、
        背景退回 transparent，而 `color:#fff` 与 `border-color`（= currentColor 白）照旧生效
      → 浅色主题下「白字 + 白边框 + 透明底」= **按钮隐形，hover 才显形**（用户报的第 3 个问题）。 */
button.pc-btn,
a.pc-btn {
    border-radius: 8px;
}

button.pc-btn-danger {
    color: var(--mn-alert-error-text);
    background: var(--mn-alert-error-bg);
    border-color: var(--mn-alert-error-text);
}

button.pc-btn-danger:hover {
    color: var(--mn-alert-error-text);
    background: var(--mn-alert-error-bg);
    border-color: var(--mn-alert-error-text);
    filter: brightness(0.96);
}

input.pc-input {
    border-radius: 8px;
    background: var(--mn-bg-input);
    border: 1px solid var(--mn-border);
    color: var(--mn-content-text);
}

input.pc-input-sm {
    width: 96px;
}

input.pc-input-time {
    width: 120px;
}

/* ---------- 通用 ---------- */
.pc-link {
    color: var(--mn-primary);
    font-size: 13px;
    text-decoration: none;
}

.pc-link:hover {
    color: var(--mn-primary-hover);
    text-decoration: underline;
}

.pc-muted {
    color: var(--mn-comp-hint-text);
    font-size: 13px;
}

.pc-empty {
    color: var(--mn-comp-hint-text);
    font-size: 13px;
    padding: 10px 0;
}

.pc-hint {
    margin-left: 6px;
}

/* ---------- 积分提示（押注前先让用户看清自己的余额，避免「点了没反应」） ---------- */
.pc-balance {
    font-size: 12px;
    line-height: 1.4;
    color: var(--mn-comp-hint-text);
    white-space: nowrap;
}

/* 余额低于任务要求额度时高亮成警示色（用主题成对变量，保证 9 个主题都可读） */
.pc-balance-low {
    color: var(--mn-alert-error-text);
}

.pc-note-warn {
    font-size: 13px;
    color: var(--mn-alert-error-text);
}

.pc-thread-tip {
    margin: 10px 0;
}

/* ---------- 独立页（列表 / 详情）----------
   ⚠️ 根容器写作 `<div class="mn-section pc-page">`：卡片底/描边/圆角由核心 `.mn-section` 提供
      （规范 §6.4-2「前台插件页统一 .mn-section 容器」），本插件只负责内边距与页内布局。
      不要再设 max-width / margin:0 auto —— 那会与核心中栏宽度打架，出现「比其他插件页宽/窄」。 */
.pc-page {
    padding: 20px;
}

.pc-page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 16px;
}

.pc-page-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 20px;
    color: var(--mn-content-text);
}

.pc-section {
    margin-bottom: 22px;
}

.pc-section-title {
    margin: 0 0 10px;
    font-size: 15px;
    color: var(--mn-content-text);
}

.pc-detail-title {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 600;
    color: var(--mn-content-text);
}

/* ---------- 列表 ---------- */
.pc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--mn-border);
    border-radius: 10px;
    overflow: hidden;
    background: var(--mn-bg-card);
}

.pc-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--mn-border-light);
}

.pc-list-item:last-child {
    border-bottom: 0;
}

.pc-list-item:hover {
    background: var(--mn-bg-row-hover);
}

.pc-list-main {
    min-width: 0;
    flex: 1;
}

.pc-list-title {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: var(--mn-content-text);
    text-decoration: none;
    word-break: break-word;
}

a.pc-list-title:hover {
    color: var(--mn-primary);
}

.pc-list-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 5px;
}

.pc-list-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
}

.pc-checkin-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pc-checkin-item {
    display: flex;
    justify-content: space-between;
    padding: 6px 2px;
    border-bottom: 1px solid var(--mn-border-light);
    font-size: 13px;
}

.pc-checkin-item:last-child {
    border-bottom: 0;
}

.pc-checkin-user {
    color: var(--mn-content-text);
}

/* ---------- 发帖页表单 ---------- */
.pc-form {
    margin: 14px 0;
    border: 1px solid var(--mn-border);
    border-radius: 10px;
    background: var(--mn-bg-card);
    overflow: hidden;
}

.pc-form-details > summary {
    cursor: pointer;
    padding: 11px 14px;
    font-size: 14px;
    font-weight: 600;
    color: var(--mn-content-text);
    list-style: none;
}

.pc-form-details > summary::-webkit-details-marker {
    display: none;
}

.pc-form-details > summary::before {
    content: "▸ ";
    color: var(--mn-primary);
}

.pc-form-details[open] > summary::before {
    content: "▾ ";
}

.pc-form-hint {
    margin-left: 8px;
    font-weight: 400;
    font-size: 12px;
    color: var(--mn-comp-hint-text);
}

.pc-form-body {
    padding: 4px 14px 14px;
    border-top: 1px solid var(--mn-border-light);
}

.pc-form-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    margin-bottom: 12px;
}

.pc-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 150px;
}

.pc-field[hidden] {
    display: none;
}

.pc-form-window {
    padding: 10px 0;
    border-top: 1px dashed var(--mn-border-light);
}

.pc-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--mn-content-text);
    cursor: pointer;
}

.pc-window-fields {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    flex-wrap: wrap;
}

.pc-window-fields[hidden] {
    display: none;
}

.pc-form-foot {
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--mn-comp-hint-text);
}

/* ---------- 后台 ---------- */
.pc-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}

.pc-stat {
    flex: 0 1 150px;
    padding: 10px 14px;
    border: 1px solid var(--mn-border);
    border-radius: 10px;
    background: var(--mn-bg-card);
}

.pc-stat-k {
    display: block;
    font-size: 12px;
    color: var(--mn-comp-hint-text);
}

.pc-stat-v {
    display: block;
    margin-top: 4px;
    font-size: 20px;
    font-weight: 700;
    color: var(--mn-content-text);
}

.pc-admin-table td {
    vertical-align: middle;
}

.pc-admin-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
