/* --- /css/timetable_base.css --- */

:root {
  /* ▼▼▼ 修正点：新しいカラーパレット ▼▼▼ */
  --kix-bg: #e3f2fd;    /* 水色 */
  --itm-bg: #f8f9fa;    /* 薄いグレー */
  --hs-color: #000000;  /* 黒 */
  --kate-color: #007bff;/* 青 */
  --hk-color: #dc3545;  /* 赤 */
}

/* --- timetable_base.css に追記 --- */

/* ヘッダー下の更新日 */
.timetable-update-date {
  font-size: 13px;
  color: #6c757d; /* 少し控えめなグレー */
  text-align: left;
  padding-left: 4px;
  margin-top: -25px; /* このマイナス値でタイトルとの間隔を詰める */
  margin-bottom: 16px;
}


/* ▼▼▼ 修正点：スマホ用に幅を固定し、中央寄せ ▼▼▼ */
.timetable-wrap {
  max-width: 400px;
  margin: 16px auto;
  border: 1px solid #ccc;
  border-radius: 8px;
  overflow: hidden;
}

.timetable {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

/* --- timetable_base.css の該当部分を差し替え --- */

.timetable th, .timetable td {
  border-bottom: 1px solid #ddd; /* ← 色を少し濃くした */
  padding: 4px;
}

/* シマシマ背景 */
.timetable tr:nth-child(even) {
  background-color: #e9ecef;
}

/* 時の列 */
.timetable .col-hour {
  width: 45px;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
  border-left: 3px double #ccc;
  border-right: 1px solid #ddd;
}

/* 分の列 */
.timetable .col-minutes {
  text-align: left;
}

/* --- /css/timetable_base.css の minute-item 部分を差し替え --- */

.minute-item {
  display: inline-block;
  padding: 8px 6px;
  margin: 2px;
  border-radius: 4px;
  font-weight: 500;
  /* border: 1px solid #dee2e6;  ← この行を削除、またはコメントアウト */

  /* ▼▼▼ ここから下を追加 ▼▼▼ */
  width: 40px; /* ボックスの幅を固定 */
  text-align: center; /* 中の文字を中央揃え */
}

/* 行き先ごとの背景色 */
.minute-item.is-kix { background-color: var(--kix-bg); }
.minute-item.is-itm { background-color: var(--itm-bg); }

/* ▼▼▼ 修正点：運行会社ごとの文字色 ▼▼▼ */
.minute-item.is-hs { color: var(--hs-color); }
.minute-item.is-kate { color: var(--kate-color); }
.minute-item.is-hk { color: var(--hk-color); }

.note-symbol {
  font-weight: bold;
  margin-right: 2px;
}

/* --- 凡例 --- */
.legend-wrap {
  margin: 24px auto;
  width: fit-content;
}
.timetable-legend {
  font-size: 12px;
  border-spacing: 0 4px;
  border-collapse: separate;
}
.timetable-legend td {
  padding: 0 4px;
}
.legend-color {
  font-weight: bold;
}
/* ▼▼▼ 修正点：凡例の■の色も連動させる ▼▼▼ */
.legend-color.hs { color: var(--hs-color); }
.legend-color.kate { color: var(--kate-color); }
.legend-color.hk { color: var(--hk-color); }

.legend-dest.kix {
  display: inline-block;
  width: 24px;
  height: 16px;
  background-color: var(--kix-bg);
  border: 1px solid #ddd;
}
.legend-dest.itm {
  display: inline-block;
  width: 24px;
  height: 16px;
  background-color: var(--itm-bg);
  border: 1px solid #ddd;
}