/* リスト全体のスタイル */
.program-list {
  /* 元のCSSの余白を強制リセット */
  list-style: none !important;
  padding: 5px 0 !important; 
  margin: 0 !important;
  
  display: flex !important;
  overflow-x: auto !important;
  white-space: nowrap !important;
  gap: 8px !important; /* タグ同士の横の隙間 */
  
  -webkit-overflow-scrolling: touch;
}

/* スクロールバーを非表示 */
.program-list::-webkit-scrollbar {
  display: none;
}

/* 予定を包む li タグの余白リセット */
.program-list li {
  /* 元のCSSが持っている縦の広がりや余白をすべてクリアします */
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  text-indent: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

/* イモムシタグ（楕円形）のスタイル */
.imomushi-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px; 
  
  /* スクショの綺麗な緑色に少し合わせました */
  background-color: #e6f4ea; 
  color: #2b362f;
  border: 1px solid #ceead6;
  
  /* タグの内側の余白（上下を少し狭く、左右を広めに） */
  padding: 6px 16px !important; 
  line-height: 1.2 !important; /* 文字の上下の無駄な隙間をなくす */
  flex-shrink: 0; 
}

/* プログラム名の文字 */
.program-name {
  font-size: 0.95rem;
  font-weight: bold;
}

/* 場所の文字 */
.program-place {
  font-size: 0.85rem;
  margin-left: 2px;
}
/* 今日・明日の各行のボックス */
.schedule-row {
  display: flex !important;
  align-items: center !important; /* 上下中央揃え */
  margin-bottom: 12px !important; /* 行と行の間の隙間 */
  width: 100% !important;
}

/* 「今日(7/5)」などのラベル部分 */
.date-label {
  font-size: 1rem !important;
  font-weight: bold !important;
  color: #555 !important;
  width: 40px !important;       /* ラベルの横幅を固定して、右のタグの位置を揃えます */
  flex-shrink: 0 !important;    /* 画面が狭くなっても潰れないようにする */
  white-space: nowrap !important;
}

/* タグが並ぶ右側のコンテナ */
.tag-list-container {
  flex-grow: 1 !important;      /* 残りの横幅をいっぱいに使う */
  overflow: hidden !important;
  
}

/* リスト全体のスタイル（横スクロールの設定はそのまま維持） */
.program-list {
  list-style: none !important;
  padding: 0 !important; 
  margin: 0 !important;
  display: flex !important;
  overflow-x: auto !important;   /* はみ出したら横スクロール */
  white-space: nowrap !important;
  gap: 8px !important;
  -webkit-overflow-scrolling: touch;
}

/* スクロールバーを非表示 */
.program-list::-webkit-scrollbar {
  display: none;
}

/* 予定がない時の「なし」という文字のスタイル */
.no-program {
  font-size: 0.85rem !important;
  color: #999 !important;
  margin: 0 !important;
  padding-left: 4px !important;
}

/* --- イモムシタグや文字、liタグのCSSは前回のままでOKです！ --- */
/* 会場（タグの内側に一緒に収まります） */
.program-place {
  color: #555;         /* 注意を引く赤色 */
  font-size: 0.75rem;
  font-weight: bold;
  border:1px solid #929292;
  background-color: #fff;
  border-radius: 5px;
  padding:2px 4px;
  margin-left: 6px !important;  /* 前の文字（場所や名前）との間に少しだけ隙間を作る */
}
