body { background: #f5f6f8; }
.navbar-brand small { font-size: .65rem; opacity: .7; }
code { color: #c7254e; }
.breadcrumb { margin-bottom: .5rem; }

/* ページカードの状態色: 現在の背景に半透明色を重ねる（テーマ両対応・ほんのり）
   制作対応中=ブルー / 顧客確認中=イエロー / 校了済み=グリーン */
.card.page-maker {
  background-image: linear-gradient(rgba(0, 123, 255, .08), rgba(0, 123, 255, .08));
}
.card.page-customer {
  background-image: linear-gradient(rgba(255, 193, 7, .14), rgba(255, 193, 7, .14));
}
.card.page-approved {
  background-image: linear-gradient(rgba(40, 167, 69, .10), rgba(40, 167, 69, .10));
}
html[data-theme="dark"] .card.page-maker {
  background-image: linear-gradient(rgba(0, 123, 255, .18), rgba(0, 123, 255, .18));
}
html[data-theme="dark"] .card.page-customer {
  background-image: linear-gradient(rgba(255, 193, 7, .16), rgba(255, 193, 7, .16));
}
html[data-theme="dark"] .card.page-approved {
  background-image: linear-gradient(rgba(40, 167, 69, .16), rgba(40, 167, 69, .16));
}

/* アクセスログ: 明細をスクロールし、ヘッダー行を固定 */
.log-scroll { max-height: calc(100vh - 200px); overflow: auto; }
.log-scroll thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #e9ecef;   /* thead-light 相当（スクロール内容を隠す） */
}

/* 案件ページ: breadcrumb・案件名・タブを固定ナビ直下にスティッキー固定 */
.proj-sticky {
  position: sticky;
  top: 56px;            /* 固定ナビ(navbar)の高さぶん下げる */
  z-index: 1000;        /* navbar(1020)より背面、本文より前面 */
  background: #f5f6f8;  /* body と同色でスクロール内容を隠す */
  padding-top: .5rem;
}

/* 制作データ ドロップゾーン */
.hp-dropzone {
  border: 2px dashed #adb5bd; border-radius: .35rem; padding: 1.5rem;
  text-align: center; color: #6c757d; background: #fafbfc; transition: all .15s;
}
.hp-dropzone.dragover { border-color: #007bff; background: #e7f1ff; color: #007bff; }
.hp-dropzone-text { font-weight: 600; }
/* 保存済みファイルのツリー表示 */
.hp-tree-wrap { max-height: 320px; overflow: auto; }
.hp-tree ul { padding-left: 1.2rem; }
.hp-tree summary.hp-tree-dir { cursor: pointer; font-weight: 600; padding: 2px 4px; border-radius: 3px; }
.hp-tree summary.hp-tree-dir:hover { background-color: #eef1f4; }
.hp-tree-file { padding: 2px 6px; border-radius: 3px; transition: background-color .1s; }
.hp-tree-file:hover { background-color: #e7f1ff; }

/* 案件一覧: セルを上下中央に揃える（進捗バーと経過バッジのズレ防止） */
.proj-table td, .proj-table th { vertical-align: middle; }

/* 案件一覧: クローズ案件は行全体（案件名リンク・コードも）をグレーアウト */
.proj-row-closed,
.proj-row-closed a,
.proj-row-closed code,
.proj-row-closed .text-muted { color: #adb5bd !important; }

/* =========================================================
   ダークテーマ（html[data-theme="dark"]）
   ========================================================= */
html[data-theme="dark"] body { background: #1b1f24; color: #dde3ea; }
html[data-theme="dark"] a { color: #6cb2eb; }
html[data-theme="dark"] code { color: #e685a4; }
html[data-theme="dark"] hr { border-color: #39414b; }
html[data-theme="dark"] .text-muted { color: #9aa6b2 !important; }
html[data-theme="dark"] .bg-light { background-color: #2b323a !important; }
html[data-theme="dark"] .bg-white { background-color: #242a31 !important; }

/* カード */
html[data-theme="dark"] .card { background-color: #242a31; border-color: #39414b; color: #dde3ea; }
html[data-theme="dark"] .card-header { background-color: #2b323a; border-color: #39414b; color: #eef2f6; }

/* テーブル */
html[data-theme="dark"] .table { color: #dde3ea; }
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th { border-color: #39414b; }
html[data-theme="dark"] .table thead th { border-color: #39414b; }
html[data-theme="dark"] .thead-light th,
html[data-theme="dark"] .table .thead-light th { background-color: #2b323a; color: #cfd6de; border-color: #39414b; }
html[data-theme="dark"] .table-hover tbody tr:hover { background-color: #2b323a; color: #eef2f6; }
html[data-theme="dark"] .proj-row-closed,
html[data-theme="dark"] .proj-row-closed a,
html[data-theme="dark"] .proj-row-closed code,
html[data-theme="dark"] .proj-row-closed .text-muted { color: #6b7682 !important; }

/* フォーム */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] textarea.form-control,
html[data-theme="dark"] select.form-control {
  background-color: #1f252b; color: #e6ebf1; border-color: #3a434e;
}
html[data-theme="dark"] .form-control:focus { background-color: #1f252b; color: #fff; border-color: #5a87b8; box-shadow: none; }
html[data-theme="dark"] .form-control::placeholder { color: #8a96a3; }

/* リストグループ */
html[data-theme="dark"] .list-group-item { background-color: #242a31; border-color: #39414b; color: #dde3ea; }
html[data-theme="dark"] .list-group-item-action:hover { background-color: #2b323a; color: #fff; }

/* タブ */
html[data-theme="dark"] .nav-tabs { border-color: #39414b; }
html[data-theme="dark"] .nav-tabs .nav-link { color: #aeb8c2; }
html[data-theme="dark"] .nav-tabs .nav-link:hover { border-color: #39414b; }
html[data-theme="dark"] .nav-tabs .nav-link.active {
  background-color: #242a31; color: #fff; border-color: #39414b #39414b #242a31;
}

/* モーダル */
html[data-theme="dark"] .modal-content { background-color: #242a31; color: #dde3ea; }
html[data-theme="dark"] .modal-header, html[data-theme="dark"] .modal-footer { border-color: #39414b; }
html[data-theme="dark"] .close { color: #dde3ea; text-shadow: none; }

/* ドロップダウン */
html[data-theme="dark"] .dropdown-menu { background-color: #242a31; border-color: #39414b; color: #dde3ea; }
html[data-theme="dark"] .dropdown-item { color: #dde3ea; }
html[data-theme="dark"] .dropdown-item:hover, html[data-theme="dark"] .dropdown-item:focus { background-color: #2b323a; color: #fff; }
html[data-theme="dark"] .dropdown-header { color: #8a96a3; }
html[data-theme="dark"] .dropdown-divider { border-color: #39414b; }

/* アラート（light） */
html[data-theme="dark"] .alert-light { background-color: #2b323a; border-color: #39414b; color: #dde3ea; }

/* バッジ */
html[data-theme="dark"] .badge-light { background-color: #39414b; color: #e6ebf1; }

/* 固定要素の背景を本文色に合わせる */
html[data-theme="dark"] .proj-sticky { background: #1b1f24; }
html[data-theme="dark"] .log-scroll thead th { background: #2b323a; color: #cfd6de; }

/* アノテーション画面 */
html[data-theme="dark"] .annotator { background: #242a31; border-color: #39414b; }
html[data-theme="dark"] .anno-stage { background: #1b1f24; }
html[data-theme="dark"] .anno-sidebar { border-color: #39414b; }
html[data-theme="dark"] .anno-pin-item { border-color: #39414b; }
html[data-theme="dark"] .anno-pin-row:hover { background: #2b323a; }
html[data-theme="dark"] .anno-pin-row.active { background: #243447; }
html[data-theme="dark"] .anno-pin-body { background: #20262d; border-color: #333b44; }
html[data-theme="dark"] .anno-pin-body .anno-form { background: #242a31; }
html[data-theme="dark"] .anno-comment { border-color: #333b44; }
html[data-theme="dark"] .anno-form { border-color: #39414b; }
html[data-theme="dark"] .anno-toolbar { background: #2b323a !important; border-color: #39414b; }

/* 制作データ ツリー/ドロップゾーン */
html[data-theme="dark"] .hp-dropzone { background: #1f252b; border-color: #4a5560; color: #aeb8c2; }
html[data-theme="dark"] .hp-dropzone.dragover { background: #243447; border-color: #5a87b8; color: #cfe2f5; }
html[data-theme="dark"] .hp-tree summary.hp-tree-dir:hover { background-color: #2b323a; }
html[data-theme="dark"] .hp-tree-file:hover { background-color: #243447; }

/* テーマ切替ボタン */
#themeToggle { white-space: nowrap; }