/* 操作ログページ 共通 CSS（v6.355.0）
 *
 *   週間予定表 操作ログ（/kansei-operation-log.html・v6.70.0）と
 *   現場シフト表 操作ログ（/kansei-shift-operation-log.html・v6.355.0）の 2 ページが読む。
 *   **v6.355.0 で 2 ページ目を作るにあたり、kansei-operation-log.html の inline <style> を
 *   そのままここへ移した**（86 行を複製しないため・#92）。中身は 1 行も変えていない。
 *
 *   DESIGN.md 準拠（白パネル・ドット + テキスト種別・ピル型フィルタ）。
 *   色・影は style.css の変数を使う（リテラルカラー直書きを避ける・§1）。ダークモードは変数側で成立。
 */
.oplog-page { padding: 24px 28px 48px; }
.oplog-panel {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 20px;
  box-shadow: var(--shadow-1);
  padding: 24px;
  max-width: 1400px;
  margin: 0 auto;
}
.oplog-desc { font-size: 13px; color: var(--color-text-muted); margin-bottom: 20px; line-height: 1.6; }
/* フィルタ行（ピル型） */
.oplog-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.oplog-filters select,
.oplog-filters input {
  height: 40px; padding: 0 14px;
  border: 1px solid var(--color-border);
  border-radius: 9999px;
  background: var(--color-surface);
  font-size: 14px; color: var(--color-text); font-family: inherit;
}
.oplog-filters input[type="text"] { min-width: 220px; }
.oplog-sep { color: var(--color-text-faint); }
.oplog-search {
  height: 40px; padding: 0 22px;
  border: none; border-radius: 9999px;
  background: var(--color-primary); color: #fff;
  font-size: 14px; font-weight: 500; cursor: pointer;
  box-shadow: var(--shadow-1); font-family: inherit;
}
.oplog-meta { margin-left: auto; font-size: 13px; color: var(--color-text-muted); }
/* テーブル */
.oplog-table { width: 100%; border-collapse: collapse; }
.oplog-table thead th {
  background: var(--color-surface-2);
  font-size: 12px; font-weight: 500; color: var(--color-text-muted);
  text-align: left; padding: 12px 14px; white-space: nowrap;
}
.oplog-table thead th:first-child { border-radius: 10px 0 0 10px; }
.oplog-table thead th:last-child { border-radius: 0 10px 10px 0; }
.oplog-table tbody td { padding: 14px; font-size: 14px; border-bottom: 1px solid var(--color-divider); vertical-align: middle; }
.oplog-table tbody tr:hover { background: var(--color-surface-2); }
.oplog-col-time { color: var(--color-text-muted); font-size: 13px; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* v6.88.2: 拠点列（日時の隣）。短い拠点名なので狭幅でも nowrap。 */
.oplog-col-dept { white-space: nowrap; font-size: 13px; color: var(--color-text); }
.oplog-col-dept.oplog-dept-none { color: var(--color-text-faint); }
/* v6.89.0: 対象日列（種別と操作内容の間）。"M/D" or "M/D〜M/D"・等幅数字・nowrap。 */
.oplog-col-tdate { white-space: nowrap; font-size: 13px; color: var(--color-text); font-variant-numeric: tabular-nums; }
.oplog-col-tdate.oplog-tdate-none { color: var(--color-text-faint); }
.oplog-datemode-hint { font-size: 12px; color: var(--color-text-muted); }
.oplog-col-operator { white-space: nowrap; }
.oplog-col-ip { color: var(--color-text-faint); font-size: 12px; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* 種別ドット + テキスト（DESIGN.md §4-4 / §10-2） */
.oplog-kind { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--color-text-muted); white-space: nowrap; }
.oplog-kind .dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.oplog-kind .dot-assign { background: var(--color-green); }
.oplog-kind .dot-job { background: var(--color-primary); }
.oplog-kind .dot-support { background: var(--color-amber); }
.oplog-kind .dot-delete { background: var(--color-red); }
.oplog-kind .dot-off { background: var(--color-text-faint); }
/* v6.265.0: 確定通知（青系 primary）・催促送信（amber）の種別ドット色（信介さん指定）。 */
.oplog-kind .dot-notify_confirm { background: var(--color-primary); }
.oplog-kind .dot-notify_reminder { background: var(--color-amber); }
/* v6.265.4 hotfix: 設定変更（system_settings_updated）= muted グレー #5f6368。既存 dot-off（faint #80868b）より
   濃く、案件青・応援 amber・削除赤・配置緑と識別可能。DESIGN.md §5 準拠。 */
.oplog-kind .dot-settings { background: var(--color-text-muted); }
/* v6.269.0 案 D: 報告後変更（time_change_after_report）= amber（注意喚起系）。
   業務担当者への「電話連絡が必要」を色でも示す。dot-support と同色の意味論違いだが、
   将来の色調整の自由度を残すため専用クラス。 */
.oplog-kind .dot-time_change_after_report { background: var(--color-amber); }
/* 操作内容 */
.oplog-content { color: var(--color-text); line-height: 1.5; }
.oplog-content .em { font-weight: 500; }
.oplog-content .arrow { color: var(--color-text-faint); margin: 0 2px; }
/* ページネーション（ピル型） */
.oplog-pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 20px; }
.oplog-pager button {
  height: 36px; padding: 0 18px;
  border: 1px solid var(--color-border); border-radius: 9999px;
  background: var(--color-surface); font-size: 13px; cursor: pointer;
  font-family: inherit; color: var(--color-text);
}
.oplog-pager button:disabled { opacity: .45; cursor: default; }
.oplog-pager .page-num { font-size: 13px; color: var(--color-text-muted); }
.oplog-empty { text-align: center; padding: 40px; color: var(--color-text-faint); }
@media (max-width: 640px) { .oplog-page { padding: 16px 12px 40px; } .oplog-panel { padding: 16px; border-radius: 16px; } }

/* ===== v6.355.0: 現場シフト表 操作ログ だけで使う列 ===== */
/* 現場名。長い現場名があるので折り返しを許す（拠点名と違い 20 文字級が実在する）。 */
.oplog-col-site { font-size: 13px; color: var(--color-text); min-width: 8em; }
.oplog-col-site.oplog-site-none { color: var(--color-text-faint); }
/* 横スクロールの逃がし。テーブルを圧縮せず、収まらない幅では横に流す（アクセス履歴と同じ流儀）。 */
.oplog-table-wrap { overflow-x: auto; }
