/* Daily HW / Mission タブ: 拠点必須・未完了/完了児童リスト（cea-daily-hm- プレフィックス） */

/* Date / Campus の入力枠は Lesson 画面の Date と同じ横幅(パネル幅の約 50%)に統一。
   Lesson 側の cqw 計算と揃える: コンテナ幅基準で 50cqw - 7px。 */
#page-entry .cea-daily-hm-panel {
  --cea-daily-hm-field-width: calc(50% - 7px);
}

@supports (width: 1cqw) {
  #page-entry .cea-daily-hm-panel {
    container-type: inline-size;
    --cea-daily-hm-field-width: calc(50cqw - 7px);
  }
}

#page-entry .cea-daily-hm-panel .cea-daily-ledger-date-field,
#page-entry .cea-daily-hm-panel .cea-daily-hm-campus-field {
  width: 100%;
  max-width: var(--cea-daily-hm-field-width);
  box-sizing: border-box;
}

#page-entry .cea-daily-hm-panel .cea-daily-ledger-date-field {
  margin-bottom: 10px;
}

/* Campus と「児童コード」入力欄の間にゆとりを持たせる
   （クイックスキャンモードで目線が Campus → 入力欄に移るのを助ける） */
#page-entry .cea-daily-hm-panel .cea-daily-hm-campus-field {
  margin-bottom: 22px;
}

#page-entry .cea-daily-hm-panel .cea-daily-ledger-date-composite {
  width: 100%;
  max-width: 100%;
}

#page-entry .cea-daily-hm-campus-select {
  width: 100%;
  max-width: 100%;
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  box-sizing: border-box;
  padding: 10px 28px 10px 12px;
  font-size: 16px;
  line-height: 1.25;
}

/* Recent Entries エリア（取引履歴の場所）に配置されたときの余白調整 */
#page-entry .cea-daily-hm-lists {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 6px 0 6px;
}

#page-entry .cea-daily-hm-lists[hidden] {
  display: none;
}

/* HW / Mission タブでは取引履歴用のフィルタ行(All/Staff/Date 等)と取引リストは
   不要。`.hist-filter { display: flex }` 等の宣言が `[hidden]` を上書きして
   しまうので、!important 付きで強制非表示にする。 */
#page-entry #cea-daily-recent-filter-row[hidden],
#page-entry #recent-entries[hidden] {
  display: none !important;
}

#page-entry .cea-daily-hm-block {
  background: transparent;
  padding: 0;
}

/* Incomplete / Done のラベルはリストの外側に独立した小見出しとして配置。
   リスト内のヘッダー行(Date/Time | Name | Staff)と混ざらないよう、
   フォントを少し大きめ・行間を確保し、リストカードと縦方向の間隔を取る。 */
#page-entry .cea-daily-hm-block-title {
  font-size: 12px;
  font-weight: 700;
  color: #2e7d52;
  margin: 0 0 8px 2px;
  letter-spacing: 0.04em;
  line-height: 1.2;
}

/* Bank「Recent Transactions」相当の白カード装飾。
   max-height + overflow-y は付けない: 内部スクロールで Date/Time などのヘッダー行が
   隠れたり、スクロールバーが select 風に見えたりするのを避け、ページ全体で
   スクロールできるようにする(Bank Recent と同じ挙動)。 */
#page-entry .cea-daily-hm-student-list {
  list-style: none;
  margin: 0;
  padding: 0;
  background: #fff;
  border: 0.5px solid var(--c-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

/* 3 列レイアウト: Date/Time | Name | Staff
   フォントサイズ・配色は Bank「Recent Transactions」(=Daily Recent Entries) と統一。
   ヘッダー: 9px / 太字 / 薄青背景 / hint 色
   データ行: 10px / 通常 / muted 色 */
#page-entry .cea-daily-hm-student-list .cea-daily-hm-student-li {
  display: grid;
  grid-template-columns: minmax(110px, 130px) minmax(0, 1fr) minmax(80px, 110px);
  align-items: center;
  column-gap: 6px;
  padding: 2px 5px;
  border-bottom: 0.5px solid #e4eff8;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.15;
  box-sizing: border-box;
}

#page-entry .cea-daily-hm-student-list .cea-daily-hm-student-li:last-child {
  border-bottom: none;
}

#page-entry .cea-daily-hm-student-list .cea-daily-hm-student-li--head {
  font-size: 9px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--c-hint);
  background: #f0f6fc;
  border-bottom: 0.5px solid var(--c-border);
  /* リスト先頭に常時表示（万が一リストが内部スクロールしても見えるように保険） */
  position: sticky;
  top: 0;
  z-index: 1;
}

#page-entry .cea-daily-hm-student-cell {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#page-entry .cea-daily-hm-student-cell--dt {
  color: var(--c-muted);
  padding-left: 6px;
}

#page-entry .cea-daily-hm-student-cell--name {
  color: var(--c-muted);
}

#page-entry .cea-daily-hm-student-cell--staff {
  color: var(--c-muted);
}

#page-entry .cea-daily-hm-student-li--head .cea-daily-hm-student-cell--dt,
#page-entry .cea-daily-hm-student-li--head .cea-daily-hm-student-cell--name,
#page-entry .cea-daily-hm-student-li--head .cea-daily-hm-student-cell--staff {
  color: var(--c-hint);
  font-weight: 700;
}

/* 旧クラス(後方互換: 名前のみ表記用) */
#page-entry .cea-daily-hm-student-name {
  font-weight: 600;
  color: #1a2233;
}

#page-entry .cea-daily-hm-student-id {
  font-size: 10px;
  color: var(--c-hint);
}

#page-entry .cea-daily-hm-student-list .cea-daily-hm-student-li--hint {
  display: block;
  text-align: center;
  color: var(--c-hint);
  font-size: 11px;
  font-weight: 400;
  padding: 8px 12px;
  border-bottom: none;
}

#page-entry .cea-daily-hm-student-list .cea-daily-hm-student-li--err {
  display: block;
  text-align: center;
  color: var(--c-warn);
  font-size: 11px;
  padding: 8px 12px;
  border-bottom: none;
}

#page-entry .cea-daily-hm-fixed-note {
  font-size: 11px;
  color: var(--c-hint);
  margin: 0 0 10px;
  line-height: 1.25;
}

/* 4 タブ時のタブボタン密度 */
#cea-daily-entry-tab-shell .cea-daily-entry-tab-btn {
  font-size: 13px;
  padding: 10px 4px 12px;
}

/* HW / Mission タブ: クイックスキャンモード。
   - 紙飛行機(scan-enter-btn)は不要（HID/カメラ/手入力 Enter で即送信→自動保存）
   - マスタ照会カード(scan-resolve-wrap)と Entry ボタンも省略
   - フィードバックは入力欄下のメッセージ(.cea-daily-scan-msg)で行う */
#page-entry .cea-daily-hm-panel .cea-daily-scan-enter-btn,
#page-entry .cea-daily-hm-panel .cea-daily-scan-resolve-wrap {
  display: none !important;
}

/* HW / Mission タブの QR カメラボタンは常時黒(disabled でもグレーアウトしない)。
   `cea-qr-scan.css` のデフォルト disabled 色 (#b0b8c0) より優先させる。 */
#page-entry .cea-daily-hm-panel .cea-daily-scan-code-row .cea-qr-cam-btn {
  color: #000;
}

#page-entry .cea-daily-hm-panel .cea-daily-scan-code-row .cea-qr-cam-btn:disabled {
  color: #000;
}

/* HW / Mission / Others パネルの下部余白を詰める。
   - 児童コード行と最下端(白カード境界)の間に大きな余白が出ないよう、
     コードグループの margin-bottom を 0 に、メッセージ枠は空のとき高さ 0 に。
   - エラーメッセージ表示時(:not(:empty))は通常の高さに戻す。
   - Lesson は独自レイアウトのため対象外。 */
#page-entry .cea-daily-hm-panel .cea-daily-scan-code-group.form-group,
#page-entry #cea-daily-panel-others .cea-daily-scan-code-group.form-group {
  margin-bottom: 0;
}

#page-entry .cea-daily-hm-panel .cea-daily-scan-msg,
#page-entry #cea-daily-panel-others .cea-daily-scan-msg {
  margin-top: 0;
  min-height: 0;
}

#page-entry .cea-daily-hm-panel .cea-daily-scan-msg:not(:empty),
#page-entry #cea-daily-panel-others .cea-daily-scan-msg:not(:empty) {
  margin-top: 6px;
  min-height: 1.2em;
}