/* 全体リセット */
.fc {
  font-family: inherit;
  color: #333;
}

/* ツールバー（年月＋矢印）の中央寄せ＆シンプル化 */
.fc .fc-toolbar {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0.5rem;
  border: none;
  box-shadow: none;
}
.fc .fc-toolbar-chunk {
  display: flex;
  align-items: center;
}
.fc .fc-toolbar-title {
  font-size: 1rem;
  font-weight: 500;
  margin: 0 1rem;
}
.fc .fc-button {
  background: transparent;
  border: none;
  font-size: 1.2rem;
  color: #555;
  padding: 0 0.5rem;
}
.fc .fc-button:hover {
  color: #000;
}

/* 曜日ヘッダー */
.fc .fc-col-header {
  border: none;
  box-shadow: none;
}
.fc .fc-col-header-cell-cushion {
  color: #666;
  font-weight: 500;
  font-size: 0.85rem;
}

/* カレンダーボディ */
.fc .fc-daygrid-body {
  border: none;
}
.fc .fc-daygrid-day-frame {
  position: relative;
  background: transparent; /* 背景色を消す */
  border-radius: 0;         /* 角丸不要 */
  min-height: 2.5rem;
  padding-top: 0.25rem;
  transition: background 0.2s;
}
.fc .fc-daygrid-day-frame:hover {
  background: rgba(0, 180, 216, 0.05);
}

/* 他月の日付を薄く */
.fc .fc-daygrid-day-other .fc-daygrid-day-number {
  opacity: 0.3;
}

/* 日付数字 */
.fc .fc-daygrid-day-number {
  font-size: 0.9rem;
  line-height: 1;
}

/* 空きありマーク（●） */
.fc-day-dot {
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.7rem;
  color: #00b4d8;
}

/* 満枠マーク（×） */
.fc-day-x {
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.7rem;
  color: #888;
}

/* Todayボタンを非表示 */
.fc .fc-button.fc-today-button {
  display: none !important;
}

/* 日付セルを相対位置基準に */
.fc .fc-daygrid-day-frame {
  position: relative;
}

/* 数字（.fc-daygrid-day-number）を上部中央に */
.fc .fc-daygrid-day-number {
  position: absolute;
  top: 4px;               /* お好みで微調整 */
  left: 50%;
  transform: translateX(-50%);
  margin: 0;              /* デフォルト余白をリセット */
}

/* 空き●と満枠×はすでに bottom:4px, left:50% で中央に出るはず */


/* フレーム内で flex レイアウト */
.fc .fc-daygrid-day-frame {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
}

/* 日付数字だけを表示 */
.fc .fc-daygrid-day-number {
  display: block;
  position: static !important;
  transform: none !important;
  margin: 0;
  padding: 0;
  font-size: 0.9rem;
}

/* ●マーク／×マークだけ表示 */
.fc-day-dot,
.fc-day-x {
  display: block;
  position: static !important;
  transform: none !important;
  margin: 0;
  font-size: 0.7rem;
  line-height: 1;
}

/* 以下の要素をすべて非表示に */
.fc .fc-daygrid-day-frame > .fc-daygrid-day-events,
.fc .fc-daygrid-day-frame > .fc-daygrid-day-events,
.fc .fc-daygrid-day-frame > p,
.fc .fc-daygrid-day-frame > div:not(.fc-daygrid-day-top):not(.fc-daygrid-day-number):not(.fc-day-dot):not(.fc-day-x):not(.rm-day-mark) {
  display: none !important;
}



/* -----管理グリッドUI-------- */
.rmav-wrap { max-width: 100%; }
.rmav-header {
  display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin: .5rem 0 1rem;
}
.rmav-label { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; }
.rmav-area { min-width: 10rem; padding: .25rem .5rem; }
.rmav-monthwrap { display: inline-flex; align-items: center; gap: .5rem; }
.rmav-monthwrap button { padding: .25rem .5rem; }
.rmav-monthlabel { font-weight: 700; min-width: 8rem; text-align: center; }

.rmav-legend { margin-left: auto; display: inline-flex; gap: .75rem; align-items: center; }
.rmav-legend .st { display: inline-block; width: .9em; height: .9em; border-radius: .2em; margin-right: .25rem; }

.rmav-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.rmav-table th, .rmav-table td { border: 1px solid #e5e7eb; padding: .5rem; text-align: center; }
.rmav-table thead th { background: #f8fafc; font-weight: 700; }
.rmav-table tbody th { background: #f9fafb; font-weight: 600; }
.rmav-table td { cursor: pointer; user-select: none; }

.st-available  { background: #ecfdf5; }  /* 緑系薄 */
.st-unavailable{ background: #fff7ed; }  /* オレンジ系薄 */
.st-booked     { background: #eef2ff; }  /* 青系薄 */
.st-completed  { background: #f3f4f6; color:#6b7280; } /* グレー */

.rmav-legend .st-available  { background: #10b981; }
.rmav-legend .st-unavailable{ background: #fb923c; }
.rmav-legend .st-booked     { background: #6366f1; }
.rmav-legend .st-completed  { background: #9ca3af; }

/* ステータス選択のポップアップ */
.rmav-picker {
  background: #fff; border: 1px solid #e5e7eb; box-shadow: 0 10px 24px rgba(0,0,0,.1);
  padding: .5rem; border-radius: .5rem;
}
.rmav-pick { display:block; width:100%; text-align:left; padding:.4rem .5rem; border:none; background:transparent; }
.rmav-pick:hover { background:#f3f4f6; }

/* スマホ最適化 */
@media (max-width: 640px) {
  .rmav-table th, .rmav-table td { padding: .45rem .25rem; font-size: .9rem; }
  .rmav-header { gap: .5rem; }
  .rmav-area { min-width: 8rem; }
}

/* ○/×マークと ×日の無効化（JSの .rm-day / .rm-day-mark に対応） */
.fc .rm-day { position: relative; }
.fc .rm-day .rm-day-mark {
  font-size: 12px;
  line-height: 1;
  margin-top: 4px;
  text-align: center;
  opacity: .9;
}
.fc .rm-day .rm-day-mark.ok { color: #2e7d32; }  /* ○ */
.fc .rm-day .rm-day-mark.ng { color: #c62828; }  /* × */

.fc .rm-day.is-disabled {
  cursor: not-allowed;
  opacity: .45;
  pointer-events: none;   /* クリック不可 */
}
