/* ==========================================================================
   RiskWeb · 学习计划管理 页面样式（前缀 lp-）
   ========================================================================== */

.lp-main { max-width: 880px; }

/* hero lead 不换行（窄面板/手机也保持一行） */
.page-hero .lead {
  white-space: nowrap;
  font-size: clamp(0.7rem, 1.9vw, 1.05rem);
  max-width: none;
}

/* ---- 段落卡片 ---- */
.lp-sec { margin-bottom: 1.4rem; padding: 1.6rem 1.7rem; }

.lp-sub { font-size: 1.05rem; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.55rem; }
.lp-no {
  display: inline-block; min-width: 1.7em; text-align: center;
  background: var(--life, #2f7d5d); color: #fff;
  border-radius: 6px; font-size: 0.8rem; padding: 0.12em 0.35em;
}
.lp-sec-lead { font-size: 0.92rem; color: var(--muted, #667); margin: -0.4rem 0 0.9rem; line-height: 1.7; }

/* ---- 考期设定 ---- */
.lp-form { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.lp-form input[type="text"] {
  flex: 2 1 220px; min-width: 0;
  border: 1px solid var(--line, #dde3e0); border-radius: 8px;
  padding: 0.55rem 0.75rem; font-size: 0.95rem; background: #fff;
}
.lp-form input#planDate {
  flex: 1 1 150px; min-width: 0;
  border: 1px solid var(--line, #dde3e0); border-radius: 8px;
  padding: 0.5rem 0.6rem; font-size: 0.95rem; background: #fff; color: inherit;
  font-family: inherit;
}
.lp-form input:focus { outline: 2px solid rgba(47, 125, 93, 0.25); border-color: var(--life, #2f7d5d); }
.lp-addbtn { padding: 0.55rem 1.2rem; font-size: 0.92rem; white-space: nowrap; }
.lp-hint { font-size: 0.86rem; color: #b0654f; margin-top: 0.6rem; min-height: 1em; }

.lp-countdown {
  display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem 0.9rem;
  margin-top: 1.1rem; padding: 0.9rem 1.1rem;
  background: var(--soft, #f2f6f4); border-radius: 10px;
}
.lp-cd-num { font-size: 1.35rem; font-weight: 700; color: var(--life, #2f7d5d); white-space: nowrap; }
.lp-cd-label { font-size: 0.9rem; color: var(--muted, #667); flex: 1 1 200px; }
.lp-cd-actions { display: flex; gap: 0.5rem; }
.lp-minibtn {
  border: 1px solid var(--line, #dde3e0); background: #fff; color: var(--ink, #223);
  border-radius: 999px; padding: 0.25rem 0.85rem; font-size: 0.82rem; cursor: pointer; white-space: nowrap;
}
.lp-minibtn-danger { color: #b0654f; border-color: #e3c4b8; }
.lp-minibtn:hover { border-color: var(--life, #2f7d5d); }

/* ---- 周计划 ---- */
.lp-mode { display: flex; gap: 0.5rem; margin-bottom: 0.7rem; }
.lp-modebtn {
  border: 1px solid var(--line, #dde3e0); background: #fff; color: var(--ink, #223);
  border-radius: 999px; padding: 0.32rem 1.1rem; font-size: 0.88rem; cursor: pointer;
}
.lp-modebtn.on { background: var(--life, #2f7d5d); border-color: var(--life, #2f7d5d); color: #fff; }

.lp-count { font-size: 0.85rem; color: var(--muted, #667); margin-bottom: 0.7rem; }

.lp-week {
  border: 1px solid var(--line, #e4e9e6); border-radius: 10px;
  padding: 0.75rem 0.9rem; margin-bottom: 0.6rem; background: #fff;
}
.lp-week.now { border-color: var(--life, #2f7d5d); box-shadow: 0 0 0 1px rgba(47, 125, 93, 0.25); }
.lp-week.past { opacity: 0.82; }
.lp-week.done { background: var(--soft, #f2f6f4); }

.lp-week-head { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem 0.6rem; margin-bottom: 0.5rem; }
.lp-wno { font-size: 0.92rem; font-weight: 700; white-space: nowrap; }
.lp-wrange { font-size: 0.82rem; color: var(--muted, #667); white-space: nowrap; }
.lp-badge {
  background: var(--life, #2f7d5d); color: #fff; border-radius: 999px;
  font-size: 0.72rem; padding: 0.14rem 0.6rem; white-space: nowrap;
}
.lp-donemark { font-size: 0.78rem; color: var(--life, #2f7d5d); white-space: nowrap; }
.lp-donebtn {
  margin-left: auto;
  border: 1px solid var(--life, #2f7d5d); background: #fff; color: var(--life, #2f7d5d);
  border-radius: 999px; padding: 0.22rem 0.85rem; font-size: 0.8rem; cursor: pointer; white-space: nowrap;
}
.lp-donebtn.on { background: var(--life, #2f7d5d); color: #fff; }

.lp-focus, .lp-note {
  width: 100%; box-sizing: border-box;
  border: 1px solid var(--line, #e4e9e6); border-radius: 8px;
  padding: 0.45rem 0.65rem; font-size: 0.9rem; background: #fff; margin-top: 0.45rem;
}
.lp-note { border-style: dashed; color: var(--ink-mid, #445); }
.lp-focus:focus, .lp-note:focus { outline: 2px solid rgba(47, 125, 93, 0.25); border-color: var(--life, #2f7d5d); }

/* ---- 日计划 ---- */
.lp-day {
  border: 1px solid var(--line, #e4e9e6); border-radius: 10px;
  padding: 0.55rem 0.9rem; margin-bottom: 0.45rem; background: #fff;
}
.lp-day.now { border-color: var(--life, #2f7d5d); box-shadow: 0 0 0 1px rgba(47, 125, 93, 0.25); }
.lp-day.past { opacity: 0.8; }
.lp-day.done { background: var(--soft, #f2f6f4); }
.lp-day-head { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem 0.6rem; }
.lp-day-date { font-size: 0.92rem; font-weight: 700; white-space: nowrap; min-width: 5.2em; }
.lp-day .lp-donebtn { margin-left: auto; }
.lp-day .lp-focus { margin-top: 0.45rem; }

/* ---- 节奏复盘 ---- */
.lp-pace-row { display: flex; align-items: center; gap: 0.9rem; margin-bottom: 0.7rem; }
.lp-bar {
  flex: 1 1 auto; height: 10px; border-radius: 999px;
  background: var(--soft, #eef1ef); overflow: hidden;
}
.lp-bar i { display: block; height: 100%; background: var(--life, #2f7d5d); border-radius: 999px; transition: width 0.4s ease; }
.lp-pace-num { font-size: 0.85rem; color: var(--muted, #667); white-space: nowrap; }
.lp-pace-note { font-size: 0.92rem; color: var(--ink-mid, #445); line-height: 1.7; }

/* ---- 空态 / 操作区 ---- */
.lp-empty { font-size: 0.9rem; color: var(--muted, #667); padding: 0.4rem 0; }

.lp-actions { display: flex; gap: 0.8rem; flex-wrap: wrap; margin: 1.6rem 0 0.8rem; }
.lp-privacy { font-size: 0.82rem; color: var(--muted, #667); }

/* ---- 使用建议区微调 ---- */
.lp-usage .card h3 { font-size: 1.02rem; }

/* ---- 窄屏 ---- */
@media (max-width: 640px) {
  .lp-sec { padding: 1.2rem 1rem; }
  .lp-form input[type="text"], .lp-form input#planDate { flex: 1 1 100%; }
  .lp-donebtn { margin-left: 0; }
  .lp-cd-actions { flex: 1 1 100%; }
}

/* 窄屏允许 lead 换行：单行 nowrap 在移动端会横向溢出（2026-09-22 全站视觉打磨） */
@media (max-width: 680px) {
  .page-hero .lead,
  .lead { white-space: normal; }
}

/* 周计划 → 复习排程（2026-11-05） */
.lp-week-foot { margin-top: 0.5rem; display: flex; justify-content: flex-end; }
.lp-week.past .lp-week-foot { display: none; }
@media (max-width: 620px) {
  .lp-week-foot { justify-content: flex-start; }
}