/* =====================================================
   Calendar（FullCalendar 本体）
   ・カレンダー全体の見た目
===================================================== */

/* カレンダー表示エリア */
#calendar {
  max-width: 800px;
  margin: 0 auto 40px;
  font-size: 120%;
}

/* =====================================================
   Calendar Event（イベント表示）
===================================================== */

/* 月表示：イベントタイトルを折り返し表示 */
.fc-daygrid-event .fc-event-title {
  white-space: normal;
  overflow: visible;
}

/* 月表示：時間表示を非表示（終日・稽古向け） */
.fc-daygrid-event-time {
  display: none;
}

/* イベント背景・枠線 */
.fc-h-event {
  background-color: #ebf6f7 !important;
  border: 1px solid #007c8a !important;
  border-radius: 4px !important;
}

/* イベントタイトル文字 */
.fc-event-title {
  color: #333 !important;
  font-weight: bold !important;
}

/* =====================================================
   Modal（予定詳細ダイアログ）
===================================================== */

/* モーダル本体 */
.event-modal {
  width: min(92vw, 420px);
  max-height: 85vh;
  border: none;
  border-radius: 12px;
  padding: 0;
}

/* モーダル内ラッパー */
.event-modal__inner {
  position: relative;
  padding: 1rem;
}

/* タイトル */
.event-modal__title {
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
}

/* 本文エリア（スクロール対応） */
.modal-body {
  max-height: calc(85vh - 120px);
  overflow-y: auto;
}

/* テキスト折り返し対策（場所・説明） */
.modal-text {
  white-space: pre-wrap;
  word-break: break-word;
}

/* 閉じるボタン */
.event-modal__close {
  position: absolute;
  top: 8px;
  right: 12px;
  font-size: 1.8rem;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.5rem;
}

/* =====================================================
   Note（注意書き）
===================================================== */

.schedule-note {
  margin-top: 20px;
  padding-left: 20px;
}

/* =====================================================
   Responsive（モバイル最適化）
===================================================== */

@media (max-width: 600px) {

  /* モーダル横幅を画面いっぱいに */
  .event-modal {
    width: 95vw;
  }

}
