/* 印刷／PDF出力時の配色プリセット（v2）
 *
 * 設計指針：
 * 1. クラス色と自由項目色は **色相 or 明度を分離** して被らないようにする
 *    （例：クラス D=鮮やかな緑、自由項目 green=淡い緑。同色相でも明度差で区別）
 * 2. プリセット全体で「クラスブロック」「自由項目」「休憩・お昼」「占有外」
 *    「バッジ」「ヘッダ／時刻軸」「進行リスト行色」までトーンを揃える
 * 3. 既存スタイル（@media print 内含む）に確実に勝つよう `!important` を使う
 *
 * 仕組み：
 * - `body.print-palette-{key}` が付いているときに当該プリセットの色が当たる
 * - 印刷／PDF出力直前に body へ付与し、afterprint / cleanup で外す
 * - プレビュー要素 `.palette-preview` 自身にも `.print-palette-{key}` を付ける
 *   ことで、画面上でも選択中の配色が確認できる
 *
 * 既定（pastel）はクラスを当てても上書きしない（既存色そのまま）。
 * クラス記号 A〜L まで定義。M〜Z はパステルにフォールバック。
 */

/* ===================================================================
 * ビビッド：赤・橙・黄・緑・水色・青・紫（A〜G、H〜L はループ）
 * 視認性最優先。クラス色を強く、自由項目を淡く分離。
 * =================================================================== */
.print-palette-vivid .gantt-block.A,
.print-palette-vivid .gantt-block.H { background: #d54a3a !important; border-color: #a02818 !important; color: #fff !important; }
.print-palette-vivid .gantt-block.B,
.print-palette-vivid .gantt-block.I { background: #ed8b30 !important; border-color: #b86510 !important; color: #fff !important; }
.print-palette-vivid .gantt-block.C,
.print-palette-vivid .gantt-block.J { background: #e8c024 !important; border-color: #ad8a10 !important; color: #2a2210 !important; }
.print-palette-vivid .gantt-block.D,
.print-palette-vivid .gantt-block.K { background: #43a85f !important; border-color: #2a7038 !important; color: #fff !important; }
.print-palette-vivid .gantt-block.E,
.print-palette-vivid .gantt-block.L { background: #2da4c8 !important; border-color: #1a708c !important; color: #fff !important; }
.print-palette-vivid .gantt-block.F { background: #3b6cd4 !important; border-color: #20458a !important; color: #fff !important; }
.print-palette-vivid .gantt-block.G { background: #8e44ad !important; border-color: #5e2880 !important; color: #fff !important; }
/* C は背景が黄なので時刻ラベルは暗色 */
.print-palette-vivid .gantt-block.A .gantt-block-time,
.print-palette-vivid .gantt-block.B .gantt-block-time,
.print-palette-vivid .gantt-block.D .gantt-block-time,
.print-palette-vivid .gantt-block.E .gantt-block-time,
.print-palette-vivid .gantt-block.F .gantt-block-time,
.print-palette-vivid .gantt-block.G .gantt-block-time,
.print-palette-vivid .gantt-block.H .gantt-block-time,
.print-palette-vivid .gantt-block.I .gantt-block-time,
.print-palette-vivid .gantt-block.K .gantt-block-time,
.print-palette-vivid .gantt-block.L .gantt-block-time { color: rgba(255, 255, 255, 0.85) !important; }
.print-palette-vivid .gantt-block.C .gantt-block-time,
.print-palette-vivid .gantt-block.J .gantt-block-time { color: rgba(0, 0, 0, 0.55) !important; }

/* 自由項目：クラスとかぶらないように、彩度を落とした淡いトーンへ */
.print-palette-vivid .gantt-free.color-green  { background: #d8e8d0 !important; border-color: #95b888 !important; color: #355028 !important; }
.print-palette-vivid .gantt-free.color-yellow { background: #f0e8c0 !important; border-color: #c4ad77 !important; color: #5a4818 !important; }
.print-palette-vivid .gantt-free.color-orange { background: #f0d8b8 !important; border-color: #c89860 !important; color: #5a3818 !important; }
.print-palette-vivid .gantt-free.color-pink   { background: #f0d0d8 !important; border-color: #c08090 !important; color: #6a1f3a !important; }
.print-palette-vivid .gantt-free.color-purple { background: #d8c8e0 !important; border-color: #9878b0 !important; color: #3d206a !important; }
.print-palette-vivid .gantt-free.color-blue   { background: #c8d8ea !important; border-color: #7090b8 !important; color: #1f3a6a !important; }
.print-palette-vivid .gantt-free.color-gray   { background: #d8d8d2 !important; border-color: #909088 !important; color: #303030 !important; }

/* 休憩・お昼：暖色系の落ち着いた色 */
.print-palette-vivid .gantt-break { background: #f7e8c8 !important; border-color: #c89868 !important; color: #5a4018 !important; }
/* 占有外（ゲートオープン前後）：中性ベージュ */
.print-palette-vivid .gantt-non-occupy { background: #f5efde !important; border-color: #b8a890 !important; color: #5a4030 !important; }

/* バッジ：濃い色で強調 */
.print-palette-vivid .gantt-block-badge.qualify  { background: #d4a548 !important; border-color: #a07820 !important; color: #fff !important; }
.print-palette-vivid .gantt-block-badge.parallel { background: #3b6cd4 !important; border-color: #20458a !important; color: #fff !important; }
.print-palette-vivid .gantt-block-badge.multi    { background: #8e44ad !important; border-color: #5e2880 !important; color: #fff !important; }

/* チャート ヘッダ／時刻軸：少し濃いベージュで枠を引き締める */
.print-palette-vivid .gantt-headers { background: #e8d8b8 !important; border-bottom-color: #a0855a !important; }
.print-palette-vivid .gantt-class-header { background: #f0e0c0 !important; border-right-color: #b89868 !important; color: #4a3818 !important; }
.print-palette-vivid .gantt-class-col { border-left-color: #c8b890 !important; }

/* 進行リスト：トーンを揃える */
.print-palette-vivid tr.row-interval { background: #f5f0e2 !important; color: #6a5530 !important; }
.print-palette-vivid tr.row-break    { background: #fdf3d8 !important; }
.print-palette-vivid tr.row-free     { background: #fbf6e8 !important; }
.print-palette-vivid .panel-list table thead th { background: #e8d8b8 !important; border-bottom-color: #a0855a !important; color: #4a3818 !important; }


/* ===================================================================
 * ベーシック：赤・青・黄・緑の4色をループ（A→D→A→D…）
 * 自由項目はくすんだ中性色寄りに振って、クラスと完全分離。
 * =================================================================== */
.print-palette-basic .gantt-block.A,
.print-palette-basic .gantt-block.E,
.print-palette-basic .gantt-block.I { background: #c94235 !important; border-color: #8a2a20 !important; color: #fff !important; }
.print-palette-basic .gantt-block.B,
.print-palette-basic .gantt-block.F,
.print-palette-basic .gantt-block.J { background: #3a78d4 !important; border-color: #20508a !important; color: #fff !important; }
.print-palette-basic .gantt-block.C,
.print-palette-basic .gantt-block.G,
.print-palette-basic .gantt-block.K { background: #d8b020 !important; border-color: #a07810 !important; color: #2a2210 !important; }
.print-palette-basic .gantt-block.D,
.print-palette-basic .gantt-block.H,
.print-palette-basic .gantt-block.L { background: #4ca85f !important; border-color: #2a7038 !important; color: #fff !important; }
.print-palette-basic .gantt-block.A .gantt-block-time,
.print-palette-basic .gantt-block.B .gantt-block-time,
.print-palette-basic .gantt-block.D .gantt-block-time,
.print-palette-basic .gantt-block.E .gantt-block-time,
.print-palette-basic .gantt-block.F .gantt-block-time,
.print-palette-basic .gantt-block.H .gantt-block-time,
.print-palette-basic .gantt-block.I .gantt-block-time,
.print-palette-basic .gantt-block.J .gantt-block-time,
.print-palette-basic .gantt-block.L .gantt-block-time { color: rgba(255, 255, 255, 0.85) !important; }
.print-palette-basic .gantt-block.C .gantt-block-time,
.print-palette-basic .gantt-block.G .gantt-block-time,
.print-palette-basic .gantt-block.K .gantt-block-time { color: rgba(0, 0, 0, 0.55) !important; }

/* 自由項目：くすんだ中性色（クラスの原色4色とは完全に色相違い） */
.print-palette-basic .gantt-free.color-green  { background: #c8d4ba !important; border-color: #889878 !important; color: #3a4a30 !important; }
.print-palette-basic .gantt-free.color-yellow { background: #ddccaa !important; border-color: #a8946a !important; color: #4a3a18 !important; }
.print-palette-basic .gantt-free.color-orange { background: #d8b899 !important; border-color: #a87a55 !important; color: #4a2a18 !important; }
.print-palette-basic .gantt-free.color-pink   { background: #e0c8c8 !important; border-color: #b08888 !important; color: #4a2030 !important; }
.print-palette-basic .gantt-free.color-purple { background: #d0c4d8 !important; border-color: #9078a0 !important; color: #382048 !important; }
.print-palette-basic .gantt-free.color-blue   { background: #b8c8d4 !important; border-color: #7088a0 !important; color: #1f3a5a !important; }
.print-palette-basic .gantt-free.color-gray   { background: #d0d0c8 !important; border-color: #888880 !important; color: #303028 !important; }

.print-palette-basic .gantt-break { background: #ecd8b0 !important; border-color: #b89048 !important; color: #5a3818 !important; }
.print-palette-basic .gantt-non-occupy { background: #ede5d4 !important; border-color: #b09870 !important; color: #4a3820 !important; }

.print-palette-basic .gantt-block-badge.qualify  { background: #d8b020 !important; border-color: #a07810 !important; color: #2a2210 !important; }
.print-palette-basic .gantt-block-badge.parallel { background: #3a78d4 !important; border-color: #20508a !important; color: #fff !important; }
.print-palette-basic .gantt-block-badge.multi    { background: #8e44ad !important; border-color: #5e2880 !important; color: #fff !important; }

.print-palette-basic .gantt-headers { background: #e8e0c8 !important; border-bottom-color: #a09060 !important; }
.print-palette-basic .gantt-class-header { background: #f0e8d0 !important; border-right-color: #b8a878 !important; color: #4a3818 !important; }
.print-palette-basic .gantt-class-col { border-left-color: #c8b890 !important; }

.print-palette-basic tr.row-interval { background: #f5f0e2 !important; color: #6a5530 !important; }
.print-palette-basic tr.row-break    { background: #fdf3d8 !important; }
.print-palette-basic tr.row-free     { background: #fbf6e8 !important; }
.print-palette-basic .panel-list table thead th { background: #e8e0c8 !important; border-bottom-color: #a09060 !important; color: #4a3818 !important; }


/* ===================================================================
 * グレースケール：5段階の濃淡をループ（A→E→F→J→K→L）
 * すべての要素を黒〜白の濃淡だけで構成。コピー機・FAX 向き。
 * =================================================================== */
.print-palette-grayscale .gantt-block.A,
.print-palette-grayscale .gantt-block.F,
.print-palette-grayscale .gantt-block.K { background: #2c2c2c !important; border-color: #000 !important; color: #fff !important; }
.print-palette-grayscale .gantt-block.B,
.print-palette-grayscale .gantt-block.G,
.print-palette-grayscale .gantt-block.L { background: #585858 !important; border-color: #1a1a1a !important; color: #fff !important; }
.print-palette-grayscale .gantt-block.C,
.print-palette-grayscale .gantt-block.H { background: #909090 !important; border-color: #555 !important; color: #fff !important; }
.print-palette-grayscale .gantt-block.D,
.print-palette-grayscale .gantt-block.I { background: #c0c0c0 !important; border-color: #707070 !important; color: #1a1a1a !important; }
.print-palette-grayscale .gantt-block.E,
.print-palette-grayscale .gantt-block.J { background: #e0e0e0 !important; border-color: #909090 !important; color: #1a1a1a !important; }
.print-palette-grayscale .gantt-block.A .gantt-block-time,
.print-palette-grayscale .gantt-block.B .gantt-block-time,
.print-palette-grayscale .gantt-block.C .gantt-block-time,
.print-palette-grayscale .gantt-block.F .gantt-block-time,
.print-palette-grayscale .gantt-block.G .gantt-block-time,
.print-palette-grayscale .gantt-block.H .gantt-block-time,
.print-palette-grayscale .gantt-block.K .gantt-block-time,
.print-palette-grayscale .gantt-block.L .gantt-block-time { color: rgba(255, 255, 255, 0.85) !important; }

/* 自由項目：クラスより薄いトーンに振り分け（被らないよう中濃度〜薄を中心に） */
.print-palette-grayscale .gantt-free.color-green,
.print-palette-grayscale .gantt-free.color-yellow,
.print-palette-grayscale .gantt-free.color-orange,
.print-palette-grayscale .gantt-free.color-pink,
.print-palette-grayscale .gantt-free.color-purple,
.print-palette-grayscale .gantt-free.color-blue,
.print-palette-grayscale .gantt-free.color-gray { background: #f0f0f0 !important; border-color: #888 !important; color: #1a1a1a !important; }

.print-palette-grayscale .gantt-break { background: #ececec !important; border-color: #999 !important; color: #444 !important; }
.print-palette-grayscale .gantt-non-occupy { background: #f6f6f6 !important; border-color: #bbb !important; color: #555 !important; }

.print-palette-grayscale .gantt-block-badge.qualify  { background: #555 !important; color: #fff !important; border-color: #1a1a1a !important; }
.print-palette-grayscale .gantt-block-badge.parallel { background: #888 !important; color: #fff !important; border-color: #444 !important; }
.print-palette-grayscale .gantt-block-badge.multi    { background: #aaa !important; color: #1a1a1a !important; border-color: #666 !important; }

.print-palette-grayscale .gantt-headers { background: #d8d8d8 !important; border-bottom-color: #707070 !important; }
.print-palette-grayscale .gantt-class-header { background: #ebebeb !important; border-right-color: #888 !important; color: #1a1a1a !important; }
.print-palette-grayscale .gantt-class-col { border-left-color: #c0c0c0 !important; }

.print-palette-grayscale tr.row-interval { background: #f0f0f0 !important; color: #666 !important; }
.print-palette-grayscale tr.row-break    { background: #ececec !important; }
.print-palette-grayscale tr.row-free     { background: #f5f5f5 !important; }
.print-palette-grayscale .panel-list table thead th { background: #d8d8d8 !important; border-bottom-color: #707070 !important; color: #1a1a1a !important; }


/* ===================================================================
 * 白黒（線画）：すべて白塗り＋黒枠線。区別はクラス記号・テキストのみ。
 * =================================================================== */
.print-palette-bw .gantt-block,
.print-palette-bw .gantt-block.A,
.print-palette-bw .gantt-block.B,
.print-palette-bw .gantt-block.C,
.print-palette-bw .gantt-block.D,
.print-palette-bw .gantt-block.E,
.print-palette-bw .gantt-block.F,
.print-palette-bw .gantt-block.G,
.print-palette-bw .gantt-block.H,
.print-palette-bw .gantt-block.I,
.print-palette-bw .gantt-block.J,
.print-palette-bw .gantt-block.K,
.print-palette-bw .gantt-block.L { background: #fff !important; border: 1px solid #000 !important; color: #000 !important; }
.print-palette-bw .gantt-block-time { color: #000 !important; }

.print-palette-bw .gantt-free.color-green,
.print-palette-bw .gantt-free.color-yellow,
.print-palette-bw .gantt-free.color-orange,
.print-palette-bw .gantt-free.color-pink,
.print-palette-bw .gantt-free.color-purple,
.print-palette-bw .gantt-free.color-blue,
.print-palette-bw .gantt-free.color-gray { background: #fff !important; border: 1px solid #000 !important; color: #000 !important; }

.print-palette-bw .gantt-break { background: #fff !important; border: 1px solid #000 !important; color: #000 !important; }
.print-palette-bw .gantt-non-occupy { background: #fff !important; border: 1px dashed #000 !important; color: #000 !important; }

.print-palette-bw .gantt-block-badge.qualify,
.print-palette-bw .gantt-block-badge.parallel,
.print-palette-bw .gantt-block-badge.multi { background: #fff !important; color: #000 !important; border: 1px solid #000 !important; }

.print-palette-bw .gantt-headers { background: #fff !important; border-bottom: 1px solid #000 !important; }
.print-palette-bw .gantt-class-header { background: #fff !important; border-right: 1px solid #000 !important; color: #000 !important; }
.print-palette-bw .gantt-class-col { border-left-color: #000 !important; }

.print-palette-bw tr.row-interval { background: #fff !important; color: #555 !important; }
.print-palette-bw tr.row-break    { background: #fff !important; }
.print-palette-bw tr.row-free     { background: #fff !important; }
.print-palette-bw .panel-list table thead th { background: #fff !important; border-bottom: 1px solid #000 !important; color: #000 !important; }


/* ===================================================================
 * プリセット選択 UI（① 全体の枠の中に配置）
 * =================================================================== */
.palette-section {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px dashed #c8b890;
  border-radius: 6px;
  background: #faf6e8;
}
.palette-section-label {
  font-size: 11px;
  font-weight: 600;
  color: #6a5a30;
  margin-bottom: 6px;
  letter-spacing: 0.04em;
}
.palette-buttons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 6px;
  margin-bottom: 10px;
}
.palette-btn {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  padding: 6px;
  background: #fff;
  border: 1px solid #c8b890;
  border-radius: 4px;
  cursor: pointer;
  font: inherit;
  text-align: center;
  transition: all 0.1s;
}
.palette-btn:hover { border-color: #8a7a40; background: #fdf9ec; }
.palette-btn.selected {
  border-color: #6a5a30;
  border-width: 2px;
  background: #fff8d8;
  padding: 5px;  /* border 1px → 2px の差分を相殺 */
}
.palette-btn-chips {
  display: flex;
  height: 14px;
  border-radius: 3px;
  overflow: hidden;
  border: 1px solid #ccc;
}
.palette-btn-chips > span { flex: 1; }
.palette-btn-chips.chips-pastel > span:nth-child(1) { background: #d5e7f4; }
.palette-btn-chips.chips-pastel > span:nth-child(2) { background: #d8ecd3; }
.palette-btn-chips.chips-pastel > span:nth-child(3) { background: #f7e0c5; }
.palette-btn-chips.chips-pastel > span:nth-child(4) { background: #e2d2ea; }
.palette-btn-chips.chips-pastel > span:nth-child(5) { background: #f5d5e0; }
.palette-btn-chips.chips-vivid > span:nth-child(1) { background: #d54a3a; }
.palette-btn-chips.chips-vivid > span:nth-child(2) { background: #ed8b30; }
.palette-btn-chips.chips-vivid > span:nth-child(3) { background: #e8c024; }
.palette-btn-chips.chips-vivid > span:nth-child(4) { background: #43a85f; }
.palette-btn-chips.chips-vivid > span:nth-child(5) { background: #3b6cd4; }
.palette-btn-chips.chips-basic > span:nth-child(1) { background: #c94235; }
.palette-btn-chips.chips-basic > span:nth-child(2) { background: #3a78d4; }
.palette-btn-chips.chips-basic > span:nth-child(3) { background: #d8b020; }
.palette-btn-chips.chips-basic > span:nth-child(4) { background: #4ca85f; }
.palette-btn-chips.chips-basic > span:nth-child(5) { background: #c94235; }
.palette-btn-chips.chips-grayscale > span:nth-child(1) { background: #2c2c2c; }
.palette-btn-chips.chips-grayscale > span:nth-child(2) { background: #585858; }
.palette-btn-chips.chips-grayscale > span:nth-child(3) { background: #909090; }
.palette-btn-chips.chips-grayscale > span:nth-child(4) { background: #c0c0c0; }
.palette-btn-chips.chips-grayscale > span:nth-child(5) { background: #e0e0e0; }
.palette-btn-chips.chips-bw > span { background: #fff; border-right: 1px solid #000; }
.palette-btn-chips.chips-bw > span:last-child { border-right: none; }
.palette-btn-label {
  font-size: 11px;
  color: #444;
  font-weight: 500;
}
.palette-btn.selected .palette-btn-label { color: #1a1a1a; font-weight: 700; }

/* プレビューサンプル：選んだプリセットで実際のブロック風に色付き表示。
   配色プレビューにも自由項目・お昼を含め、色かぶりが起きていないかその場で確認できる。 */
.palette-preview-label {
  font-size: 10px;
  color: #888;
  margin: 4px 0 4px;
  letter-spacing: 0.03em;
}
.palette-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.palette-preview .gantt-block,
.palette-preview .gantt-free,
.palette-preview .gantt-break {
  display: block;
  position: static;
  flex: 1 1 0;
  min-width: 0;
  padding: 6px 4px;
  text-align: center;
  font-size: 11px;
  border-radius: 4px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  height: auto;
  width: auto;
  left: auto;
  top: auto;
  margin: 0;
  box-shadow: none;
}