/* learning.css — 受講履歴まわりの追加専用スタイル（learning.js 用・S9-11 §2-A〜§2-C）
   凍結スタイル（portal.css）は一切変更しない。portal.css の色トークン（--caption 等）を読むだけ。 */

/* 「準備中」バッジ（動画が未登録のテーマ）。凍結の .pill の形をそのまま使い、色だけ灰色にする */
.pill.lp-prep { background: #eef0f2; color: var(--caption, #555); border: 1px solid #cfd4d9; }

/* 店長メニュー・管理画面の受講率カード */
.card.lp-rate { padding-top: 12px; padding-bottom: 12px; }
.lp-rate-head { font-size: 13.5px; font-weight: 900; margin-bottom: 8px; }
.lp-rate-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.lp-rate-row > div { background: var(--bg, #F7F5F3); border-radius: 10px; padding: 8px 10px; min-width: 0; }
.lp-rate-v { font-size: 24px; font-weight: 900; line-height: 1.2; color: var(--ink, #000); }
.lp-rate-period { margin-top: 10px; font-size: 13px; }
.lp-rate-period summary { cursor: pointer; color: var(--caption, #555); font-weight: 700; padding: 4px 0; }
.lp-rate-period label { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 6px 0; }
.lp-rate-period input[type="month"] { font-family: inherit; font-size: 14px; padding: 6px 8px; border: 1.5px solid var(--line, #EAD9D5); border-radius: 8px; background: #fff; min-width: 0; }
.lp-rate-period .btn { margin-top: 6px; }

/* 個人別の受講状況（管理画面・代表判断 2026-10-24） */
.lp-rate-period select { font-family: inherit; font-size: 14px; padding: 6px 8px; border: 1.5px solid var(--line, #EAD9D5); border-radius: 8px; background: #fff; min-width: 0; max-width: 60%; }
table.lp-people { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 13px; }
table.lp-people th, table.lp-people td { border-bottom: 1px solid var(--line, #EAD9D5); padding: 6px 6px; text-align: left; vertical-align: top; }
table.lp-people th { font-size: 12px; color: var(--caption, #555); white-space: nowrap; }
table.lp-people .cap2 { font-size: 11.5px; color: var(--caption, #555); }