/* CT Booking Frontend v2 */

.ct-booking {
  min-height: 70vh;
  padding: 4rem 1.5rem;
  background: var(--ct-neutral-50, #F9FAFB);
}
.ct-booking-panel.is-animating { animation: stepIn .3s ease both; }
@keyframes stepIn { from { opacity:0; transform:translateX(12px); } to { opacity:1; transform:translateX(0); } }

/* ローディング / エラー / 通知 */
.ctb-loading { padding:2rem; text-align:center; color:#6B7280; }
.ctb-error   { padding:.75rem 1rem; background:#FEE2E2; color:#991B1B; border-radius:6px; font-size:.875rem; margin-bottom:1rem; }
.ctb-notice  { padding:.75rem 1rem; background:#FEF3C7; color:#92400E; border-radius:6px; font-size:.875rem; }

/* ボタン行 */
.ct-nav-row {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

/* スロットボタン */
.ct-timeslot {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.15rem; padding:.6rem .4rem;
  border:1.5px solid var(--ct-neutral-200,#E5E7EB);
  border-radius:6px; background:#fff;
  cursor:pointer; font-family:inherit;
  transition:border-color .2s, background .2s, color .2s;
}
.ct-timeslot__time { font-size:.875rem; font-weight:600; color:#374151; }
.ct-timeslot__rem  { font-size:.65rem; color:#6B7280; }
.ct-timeslot:hover:not([disabled]) { border-color:#1A6B8A; background:#E8F4F8; }
.ct-timeslot:hover:not([disabled]) .ct-timeslot__time { color:#1A6B8A; }
.ct-timeslot.is-selected { border-color:#1A6B8A; background:#1A6B8A; }
.ct-timeslot.is-selected .ct-timeslot__time,
.ct-timeslot.is-selected .ct-timeslot__rem { color:#fff; }
.ct-timeslot[disabled] { background:#F9FAFB; opacity:.5; cursor:not-allowed; }

/* タイムスロットラベル */
.ct-timeslot-label { font-size:.875rem; font-weight:600; color:#374151; margin-bottom:.75rem; }

/* 日曜日色 */
.ct-calendar__day.is-sun { color:#E8734A; }

/* 診療科カード — テキストのみシンプル版 */
.ct-dept-option {
  border:2px solid var(--ct-neutral-200,#E5E7EB);
  border-radius:10px; padding:1rem 1.25rem;
  cursor:pointer; text-align:center;
  transition:border-color .2s, background .2s, transform .2s;
  background:#fff;
}
.ct-dept-option:hover { border-color:#1A6B8A; background:#E8F4F8; transform:translateY(-2px); }
.ct-dept-option.is-selected { border-color:#1A6B8A; background:#E8F4F8; }
.ct-dept-option__name { font-size:.95rem; font-weight:600; color:#111827; }

/* ページ内エラー */
#ct-field-error:empty, #ct-submit-error:empty { display:none; }

/* ===========================================================
   WordPress テーマ/ブロックCSSの上書きリセット
   theme.json の elements.button が button タグ全般に
   color:white を付与するため、予約UIのボタンを個別に上書き
   =========================================================== */

/* ナビボタン: 戻る */
#ct-booking-app .ct-btn-step-prev, #ct-check-app .ct-btn-step-prev {
  display: inline-flex !important;
  align-items: center !important;
  background: #fff !important;
  color: #374151 !important;
  border: 1.5px solid #E5E7EB !important;
  padding: .75rem 1.5rem !important;
  border-radius: 6px !important;
  font-size: .9rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-decoration: none !important;
  transition: border-color .2s, background .2s, color .2s !important;
}
#ct-booking-app .ct-btn-step-prev:hover, #ct-check-app .ct-btn-step-prev:hover {
  border-color: #1A6B8A !important;
  background: #E8F4F8 !important;
  color: #1A6B8A !important;
}

/* ナビボタン: 次へ / 確定 */
#ct-booking-app .ct-btn-step-next, #ct-check-app .ct-btn-step-next {
  display: inline-flex !important;
  align-items: center !important;
  background: #1A6B8A !important;
  color: #ffffff !important;
  border: none !important;
  padding: .75rem 1.75rem !important;
  border-radius: 6px !important;
  font-size: .9rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  box-shadow: 0 2px 8px rgba(26,107,138,.3) !important;
  text-decoration: none !important;
  transition: background .2s, box-shadow .2s, transform .2s !important;
}
#ct-booking-app .ct-btn-step-next:hover, #ct-check-app .ct-btn-step-next:hover {
  background: #0D4A63 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 16px rgba(26,107,138,.4) !important;
  color: #ffffff !important;
}
#ct-booking-app .ct-btn-step-next:disabled, #ct-check-app .ct-btn-step-next:disabled,
#ct-booking-app .ct-btn-step-next[disabled], #ct-check-app .ct-btn-step-next[disabled] {
  background: #E5E7EB !important;
  color: #6B7280 !important;
  box-shadow: none !important;
  transform: none !important;
  pointer-events: none !important;
  cursor: not-allowed !important;
}

/* 診療科カードのテキスト色を確実に固定 */
#ct-booking-app .ct-dept-option, #ct-check-app .ct-dept-option { color: #111827 !important; }
#ct-booking-app .ct-dept-option__name, #ct-check-app .ct-dept-option__name { color: #111827 !important; }
#ct-booking-app .ct-dept-option.is-selected, #ct-check-app .ct-dept-option.is-selected .ct-dept-option__name { color: #1A6B8A !important; }

/* タイムスロットボタンのリセット */
#ct-booking-app .ct-timeslot, #ct-check-app .ct-timeslot {
  background: #fff !important;
  color: #374151 !important;
  border: 1.5px solid #E5E7EB !important;
  border-radius: 6px !important;
  padding: .6rem .4rem !important;
  cursor: pointer !important;
  font-family: inherit !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
#ct-booking-app .ct-timeslot .ct-timeslot__time, #ct-check-app .ct-timeslot .ct-timeslot__time { color: #374151 !important; }
#ct-booking-app .ct-timeslot .ct-timeslot__rem,  #ct-check-app .ct-timeslot .ct-timeslot__rem  { color: #6B7280 !important; }
#ct-booking-app .ct-timeslot:hover:not([disabled]), #ct-check-app .ct-timeslot:hover:not([disabled]) {
  border-color: #1A6B8A !important;
  background: #E8F4F8 !important;
}
#ct-booking-app .ct-timeslot:hover:not([disabled]), #ct-check-app .ct-timeslot:hover:not([disabled]) .ct-timeslot__time { color: #1A6B8A !important; }
#ct-booking-app .ct-timeslot.is-selected, #ct-check-app .ct-timeslot.is-selected {
  border-color: #1A6B8A !important;
  background: #1A6B8A !important;
}
#ct-booking-app .ct-timeslot.is-selected .ct-timeslot__time, #ct-check-app .ct-timeslot.is-selected .ct-timeslot__time,
#ct-booking-app .ct-timeslot.is-selected .ct-timeslot__rem,  #ct-check-app .ct-timeslot.is-selected .ct-timeslot__rem { color: #ffffff !important; }
#ct-booking-app .ct-timeslot[disabled], #ct-check-app .ct-timeslot[disabled] {
  background: #F9FAFB !important;
  color: #9CA3AF !important;
  opacity: .6 !important;
  cursor: not-allowed !important;
}

/* ラジオボタン */
#ct-booking-app .ct-radio-btn, #ct-check-app .ct-radio-btn {
  color: #374151 !important;
  background: #fff !important;
  border: 1.5px solid #E5E7EB !important;
  border-radius: 9999px !important;
  padding: .5rem 1rem !important;
  cursor: pointer !important;
  font-size: .875rem !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: .4rem !important;
  box-shadow: none !important;
}
#ct-booking-app .ct-radio-btn.is-selected, #ct-check-app .ct-radio-btn.is-selected {
  border-color: #1A6B8A !important;
  background: #E8F4F8 !important;
  color: #1A6B8A !important;
  font-weight: 600 !important;
}

/* カレンダーナビ */
#ct-booking-app .ct-calendar__nav, #ct-check-app .ct-calendar__nav {
  background: #fff !important;
  color: #374151 !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 50% !important;
  width: 36px !important; height: 36px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
}
#ct-booking-app .ct-calendar__nav:hover:not([disabled]), #ct-check-app .ct-calendar__nav:hover:not([disabled]) {
  background: #1A6B8A !important;
  color: #fff !important;
  border-color: #1A6B8A !important;
}
#ct-booking-app .ct-calendar__nav[disabled], #ct-check-app .ct-calendar__nav[disabled] {
  opacity: .35 !important; pointer-events: none !important;
}

/* カレンダー日付 */
#ct-booking-app .ct-calendar__day, #ct-check-app .ct-calendar__day { color: #374151 !important; }
#ct-booking-app .ct-calendar__day.is-today, #ct-check-app .ct-calendar__day.is-today { color: #1A6B8A !important; font-weight: 700 !important; }
#ct-booking-app .ct-calendar__day.is-selected, #ct-check-app .ct-calendar__day.is-selected {
  background: #1A6B8A !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
}
#ct-booking-app .ct-calendar__day.is-past, #ct-check-app .ct-calendar__day.is-past  { color: #D1D5DB !important; pointer-events: none !important; }
#ct-booking-app .ct-calendar__day.is-sun, #ct-check-app .ct-calendar__day.is-sun   { color: #E8734A !important; }
#ct-booking-app .ct-calendar__day.is-empty, #ct-check-app .ct-calendar__day.is-empty { pointer-events: none !important; }

/* フォーム入力 */
#ct-booking-app .ct-input, #ct-check-app .ct-input,
#ct-booking-app .ct-select, #ct-check-app .ct-select,
#ct-booking-app .ct-textarea, #ct-check-app .ct-textarea {
  color: #111827 !important;
  background: #fff !important;
  border: 1.5px solid #E5E7EB !important;
  border-radius: 6px !important;
  padding: .75rem 1rem !important;
  font-family: inherit !important;
  font-size: .9rem !important;
  width: 100% !important;
  box-shadow: none !important;
}
#ct-booking-app .ct-input:focus, #ct-check-app .ct-input:focus,
#ct-booking-app .ct-textarea:focus, #ct-check-app .ct-textarea:focus {
  outline: none !important;
  border-color: #1A6B8A !important;
  box-shadow: 0 0 0 3px rgba(26,107,138,.12) !important;
}

/* ラベル */
#ct-booking-app .ct-label, #ct-check-app .ct-label { color: #374151 !important; font-size: .8rem !important; font-weight: 600 !important; }
#ct-booking-app .ct-label .required, #ct-check-app .ct-label .required { background: #FEE2E2 !important; color: #DC2626 !important; font-size: .65rem !important; border-radius: 9999px !important; padding: .1rem .35rem !important; }
#ct-booking-app .ct-label .optional, #ct-check-app .ct-label .optional  { background: #F3F4F6 !important; color: #6B7280 !important; font-size: .65rem !important; border-radius: 9999px !important; padding: .1rem .35rem !important; }
#ct-booking-app .ct-field-note, #ct-check-app .ct-field-note { font-size: .78rem !important; color: #6B7280 !important; margin: .3rem 0 0 !important; }

/* ステータスバッジ */
.ctb-status {
  display: inline-block;
  padding: .2rem .75rem;
  border-radius: 9999px;
  font-size: .78rem;
  font-weight: 700;
}
.ctb-status--pending   { background: #FEF3C7; color: #92400E; }
.ctb-status--confirmed { background: #D1FAE5; color: #065F46; }
.ctb-status--cancelled { background: #F3F4F6; color: #6B7280; }
.ctb-status--done      { background: #DBEAFE; color: #1E40AF; }

/* 完了画面 */
.ct-done { text-align: center; padding: 2rem 0; }
.ct-done__icon { color: #2ABFBF; margin-bottom: 1rem; }
.ct-done__title { font-size: 1.4rem; font-weight: 700; color: #1A6B8A; margin: 0 0 .75rem; }
.ct-done__lead  { color: #4B5563; margin: 0 0 .5rem; }

/* ============================================================
   予約確認ページ固有スタイル
   ============================================================ */
.chk-booking-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 1.5rem;
}
.chk-booking-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: #fff;
  border: 1.5px solid #E5E7EB;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  transition: box-shadow .2s;
}
.chk-booking-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.07); }
.chk-booking-card__date {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1A6B8A;
  margin-bottom: .4rem;
}
.chk-booking-card__meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .35rem;
}
.chk-dept {
  font-size: .75rem;
  background: #E8F4F8;
  color: #1A6B8A;
  padding: .15rem .6rem;
  border-radius: 9999px;
  font-weight: 600;
}
.chk-booking-card__name { font-size: .9rem; color: #374151; }
.chk-booking-card__code { font-size: .78rem; color: #6B7280; margin-top: .2rem; }
.chk-booking-card__action { flex-shrink: 0; }
.chk-no-cancel-note {
  font-size: .75rem;
  color: #9CA3AF;
  text-align: center;
  line-height: 1.5;
}

#ct-check-app .ct-btn-danger,
#ct-booking-app .ct-btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .65rem 1.4rem;
  background: #DC2626 !important;
  color: #fff !important;
  border: none;
  border-radius: 9999px;
  font-size: .875rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s, transform .15s;
  text-decoration: none;
}
#ct-check-app .ct-btn-danger:hover,
#ct-booking-app .ct-btn-danger:hover { background: #B91C1C !important; transform: translateY(-1px); }

.ctb-confirm-box {
  background: #FEF2F2;
  border: 1px solid #FCA5A5;
  border-radius: .75rem;
  padding: 1.25rem 1.5rem;
  margin-top: 1rem;
}
.ctb-confirm-box p { margin: 0 0 .5rem; font-size: .9rem; }

@media (max-width: 600px) {
  .chk-booking-card { flex-direction: column; align-items: flex-start; }
  .chk-booking-card__action { width: 100%; }
  #ct-check-app .ct-btn-danger { width: 100%; justify-content: center; }
}
