/* =========================================================
   Komatsu9 予約フォーム スタイル
   ========================================================= */

/* --- 2カラムレイアウト（PC: フォーム＋料金サイドバー） ----- */

.booking-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  /* align-items: stretch（デフォルト）でサイドバーをフォームと同じ高さに保ち sticky を有効にする */
}

.booking-sidebar {
  position: relative; /* JS スクロール追従の absolute 基準点 */
}

.booking-sidebar-sticky {
  /* PC でのスクロール追従は booking-calculator.js の initStickyPriceBox() が制御 */
}

/* --- 料金表示ボックス ------------------------------------ */
#booking-price-box {
  padding: 16px 20px;
  background: #f8f9fa;
  border: 2px solid #1a6b3a;
  border-radius: 6px;
  font-size: 0.9rem;
}

#booking-price-box h3,
#booking-price-box .bpb-heading {
  margin: 0 0 16px;
  font-size: 1rem;
  font-weight: bold;
  color: #1a6b3a;
  border-bottom: 1px solid #1a6b3a;
  padding-bottom: 6px;
}

.bpb-empty {
  color: #888;
  margin: 0;
}

/* テーブル */
.bpb-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 12px;
  font-size: 0.85rem;
}

.bpb-table td {
  padding: 4px 8px;
  border-bottom: 1px solid #eee;
  vertical-align: top;
  text-align: left;
}

/* セクションヘッダー行 */
.bpb-table .bpb-section-header td {
  background: #1a6b3a;
  color: #fff;
  font-weight: bold;
  font-size: 0.82rem;
  padding: 5px 8px;
  border-bottom: none;
}

/* 明細行 */
.bpb-table tbody tr:not(.bpb-section-header):not(.bpb-section-subtotal) td:first-child {
  padding-left: 12px;
  color: #444;
}

/* セクション小計行 */
.bpb-table .bpb-section-subtotal td {
  background: #e8f5ee;
  font-weight: bold;
  font-size: 0.82rem;
  border-top: 1px dotted #1a6b3a;
  border-bottom: 2px solid #1a6b3a;
}

.bpb-table .bpb-price {
  text-align: right;
  white-space: nowrap;
  font-family: monospace;
  width: 1%;
}

/* 小計・合計 */
.bpb-totals {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 16px;
  margin: 0;
  border-top: 1px solid #ccc;
  padding-top: 12px;
}

.bpb-totals dt {
  font-size: 0.9rem;
}

.bpb-totals dd {
  text-align: right;
  font-family: monospace;
  font-size: 0.9rem;
  margin: 0;
}

.bpb-totals dt.bpb-note,
.bpb-totals dd.bpb-note {
  color: #c05000;
  font-size: 0.85rem;
}

.bpb-totals dt.bpb-grand,
.bpb-totals dd.bpb-grand {
  font-size: 1.15rem;
  font-weight: bold;
  color: #1a6b3a;
  border-top: 2px solid #1a6b3a;
  padding-top: 6px;
  margin-top: 4px;
}

/* --- 見積書ボタン --------------------------------------- */

.bpb-estimate-btn-wrap {
  margin-top: 12px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.bpb-estimate-btn {
  display: inline-block;
  width: 100%;
  padding: 10px 16px;
  background: #1a5276;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 0.95rem;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.2s;
}

.bpb-estimate-btn:hover,
.bpb-estimate-btn:focus {
  background: #154360;
}

/* --- フォーム補助スタイル -------------------------------- */

/* 必須マーク */
.booking-form-wrap .required {
  color: #c00;
}

/* バリデーションエラーメッセージ */
.booking-form-wrap .wpcf7-not-valid-tip {
  font-size: 0.78rem;
}

/* radio・checkbox のラベルをクリッカブルに（テキスト部分含む） */
.booking-form-wrap .wpcf7-radio .wpcf7-list-item,
.booking-form-wrap .wpcf7-checkbox .wpcf7-list-item {
  cursor: pointer;
}

.booking-form-wrap .wpcf7-radio .wpcf7-list-item label,
.booking-form-wrap .wpcf7-checkbox .wpcf7-list-item label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
}

/* CF7 v6 以降で label 外に出ることがある span.wpcf7-list-item-label も clickable に */
.booking-form-wrap .wpcf7-list-item-label {
  cursor: pointer;
  pointer-events: auto;
}

/* radio を横並びに（.booking-radio-inline ラッパー内のみ） */
.booking-radio-inline {
  margin-bottom: 12px;
}
.booking-radio-inline .wpcf7-radio {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  margin: 4px 0;
}

.booking-radio-inline .wpcf7-list-item {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

/* インライン入力（数値 + 単位） */
.booking-inline-field {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 4px 0;
}

/* CF7 が input を <span> で包むため inline-flex に */
.booking-inline-field .wpcf7-form-control-wrap {
  display: inline-flex;
  align-items: center;
}

.booking-inline-field input[type="number"] {
  width: 80px;
  padding: 4px 6px;
  border: 1px solid #ccc;
  border-radius: 4px;
  text-align: right;
  vertical-align: middle;
}

.booking-unit {
  font-size: 0.95rem;
  white-space: nowrap;
  vertical-align: middle;
  line-height: 1;
}

/* 日付範囲（開始〜終了） */
.booking-date-range {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 4px 0;
}

.booking-date-range .wpcf7-form-control-wrap {
  display: inline-flex;
  align-items: center;
}

.booking-date-range input[type="date"] {
  padding: 4px 6px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.booking-date-sep {
  font-size: 0.95rem;
  white-space: nowrap;
}

.booking-date-note {
  width: 100%;
  margin-top: 2px;
}

/* 時刻セレクト */
.booking-time-selects {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  margin: 6px 0 8px;
}

/* CF7 が select を <span> で包むため、その span もインライン扱いにする */
.booking-time-selects .wpcf7-form-control-wrap {
  display: inline-flex !important;
  align-items: center;
}

.booking-time-selects select {
  display: inline-block !important;
  width: auto !important;
  padding: 4px 6px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

/* 附属設備の条件付きフィールド（JSで表示制御、CSSでデフォルト非表示） */
.booking-form-wrap .booking-panel-count-row,
.booking-form-wrap .booking-fixture-count-row {
  display: none;
}

.booking-form-wrap .booking-panel-count-row p,
.booking-form-wrap .booking-fixture-count-row p {
  margin: 8px 0 4px;
}

/* 附属設備オプショングループ（有料設備選択時にまとめて表示） */
.booking-form-wrap .booking-equip-options-group {
  display: none;
  background: #f0f8f3;
  border-left: 3px solid #1a6b3a;
  padding: 12px 14px;
  margin-top: 8px;
  border-radius: 0 4px 4px 0;
}

.booking-form-wrap .booking-equip-options-group .booking-panel-count-row,
.booking-form-wrap .booking-equip-options-group .booking-fixture-count-row {
  display: none;
  margin-bottom: 8px;
}

.booking-form-wrap .booking-equip-options-group .booking-panel-count-row p,
.booking-form-wrap .booking-equip-options-group .booking-fixture-count-row p {
  margin: 0 0 4px;
}

/* 設備別利用日数（グループ内サブセクション） */
.booking-equip-days-section {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dotted #1a6b3a;
}

.booking-equip-days-label {
  font-size: 0.88rem;
  font-weight: bold;
  color: #1a6b3a;
  margin: 0 0 8px;
}

.booking-equip-days-label .booking-note {
  font-weight: normal;
  margin-left: 4px;
}

.booking-equip-day-rows {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
}

.booking-equip-day-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.88rem;
  white-space: nowrap;
}

/* 準備・片付けトグル */
.booking-prep-toggle,
.booking-clean-toggle {
  margin: 8px 0 4px;
}

.booking-toggle-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-size: 0.9rem;
  color: #1a6b3a;
}

.booking-prep-section,
.booking-clean-section {
  margin: 4px 0 8px 20px;
}

/* 施設ごとの日数 */
.booking-diff-days-section {
  display: none; /* JS が venue_days > 1 のときのみ表示 */
  background: #f0f8f3;
  border-left: 3px solid #1a6b3a;
  padding: 12px 16px;
  margin: 8px 0 16px;
  border-radius: 0 4px 4px 0;
}

.booking-diff-days-toggle-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-size: 0.9rem;
  color: #1a6b3a;
}

.booking-per-facility-days,
.booking-diff-days-content {
  background: #f0f8f3;
  border-left: 3px solid #1a6b3a;
  padding: 10px 14px;
  margin-top: 8px;
  border-radius: 0 4px 4px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
}

.booking-facility-days-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.88rem;
  white-space: nowrap;
}

/* 準備・片付け 適用日チェックボックスラッパー */
.booking-prep-days-wrap,
.booking-clean-days-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 16px;
  margin: 6px 0 4px;
}

.booking-day-cb-heading {
  font-size: 0.85rem;
  color: #666;
  white-space: nowrap;
}

.booking-day-cb-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  font-size: 0.9rem;
}

/* 複数日オプションブロック */
.booking-multiday-options {
  background: #f0f8f3;
  border-left: 3px solid #1a6b3a;
  padding: 12px 16px;
  margin: 8px 0 16px;
  border-radius: 0 4px 4px 0;
}

.booking-multiday-options p {
  margin: 8px 0;
}

/* 注意書き */
.booking-note {
  font-size: 0.85rem;
  color: #666;
  margin-top: 4px;
}

/* --- 施設画像カード ---------------------------------------- */

.facility-image-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 8px 0 16px;
}

.facility-card {
  border: 3px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s, opacity 0.15s;
  user-select: none;
  position: relative;
}

.facility-card:hover {
  border-color: #1a6b3a;
  box-shadow: 0 2px 8px rgba(26, 107, 58, 0.2);
}

.facility-card:hover .facility-card-img::after {
  opacity: 1;
}

.facility-card.selected {
  border-color: #1a6b3a;
  box-shadow: 0 0 0 1px #1a6b3a;
}

/* 画像エリア */
.facility-card-img {
  width: 100%;
  aspect-ratio: 4 / 3;
  background: #e8e8e8;
  overflow: hidden;
  position: relative;
}

.facility-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.15s;
}

/* ホバー時の薄いオーバーレイ */
.facility-card-img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(26, 107, 58, 0.12);
  opacity: 0;
  transition: opacity 0.15s;
  pointer-events: none;
}

/* 選択中チェックマーク（画像右上） */
.facility-card-badge {
  display: none;
  position: absolute;
  top: 8px;
  right: 8px;
  background: #1a6b3a;
  color: #fff;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  font-size: 0.85rem;
  line-height: 26px;
  text-align: center;
  z-index: 1;
  pointer-events: none;
}

.facility-card.selected .facility-card-badge {
  display: block;
}

/* カード下部テキスト */
.facility-card-body {
  padding: 8px 10px;
  background: #fff;
}

.facility-card-name {
  font-size: 0.88rem;
  font-weight: bold;
  margin-bottom: 2px;
}

.facility-card-label {
  font-weight: normal;
  color: #888;
  font-size: 0.85em;
}

.facility-card-info {
  font-size: 0.75rem;
  color: #666;
}

/* 選択中インジケーター（カード下部） */
.facility-card-check {
  display: none;
  font-size: 0.75rem;
  font-weight: bold;
  color: #1a6b3a;
  margin-top: 4px;
}

.facility-card.selected .facility-card-check {
  display: block;
}

/* 選択中カードの背景 */
.facility-card.selected .facility-card-body {
  background: #f0f8f3;
}

/* CF7の実チェックボックスは非表示 */
.facility-checkbox-hidden {
  display: none;
}

/* Gallery 1+2 連結オプション */
.gallery-combined-wrap {
  margin: 8px 0 12px;
  padding: 10px 14px;
  background: #f0faf4;
  border: 1px solid #a8d8bb;
  border-radius: 6px;
}
.gallery-combined-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.95em;
  cursor: pointer;
  font-weight: bold;
  color: #1a7040;
}
.gallery-combined-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #1a9b5a;
  cursor: pointer;
}

/* 振込宛名フィールド（公開フォーム・管理画面共用） */
#invoice-name-row {
  display: none;
}

@media (max-width: 768px) {
  .facility-image-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* --- モバイル: 1カラム＋固定ボトムバー ------------------- */
@media (max-width: 900px) {
  .booking-layout {
    grid-template-columns: 1fr;
    gap: 0;
  }

  /* フォーム本体の下にバー分の余白 */
  .booking-main {
    padding-bottom: 72px;
  }

  /* サイドバーを画面下端に固定 */
  .booking-sidebar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 300;
  }

  .booking-sidebar-sticky {
    position: static;
  }

  /* トグルバー（JS で挿入） */
  .bpb-toggle-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #1a6b3a;
    color: #fff;
    font-weight: bold;
    font-size: 0.95rem;
    cursor: pointer;
    user-select: none;
  }

  .bpb-toggle-bar .bpb-toggle-total {
    font-size: 1.05rem;
  }

  .bpb-toggle-bar .bpb-toggle-icon {
    font-size: 1.1rem;
    transition: transform 0.2s;
  }

  .booking-sidebar.is-open .bpb-toggle-icon {
    transform: rotate(180deg);
  }

  /* 料金詳細パネル */
  .bpb-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    background: #fff;
    border-top: 1px solid #1a6b3a;
    box-shadow: 0 -4px 16px rgba(0,0,0,0.15);
  }

  .booking-sidebar.is-open .bpb-panel {
    max-height: 55vh;
    overflow-y: auto;
  }

  #booking-price-box {
    border: none;
    border-radius: 0;
    margin: 0;
  }
}

/* レスポンシブ */
@media (max-width: 600px) {
  .bpb-totals {
    grid-template-columns: 1fr auto;
    font-size: 0.85rem;
  }

  .bpb-table {
    font-size: 0.8rem;
  }
}

/* --- 設備持ち込みセクション --------------------------------- */

.booking-bring-in-wrap {
  margin-top: 28px;
}

/* --- Hall専用設備 無効状態 ---------------------------------- */

.booking-equip-item.equip-disabled {
  opacity: 0.45;
  pointer-events: none;
}

.booking-equip-item.equip-disabled .booking-equip-item-header::after {
  content: '（Hall選択時のみ利用可）';
  font-size: 0.75rem;
  color: #999;
  margin-left: 6px;
}

/* --- 附属設備 チェックボックスグリッド -------------------- */

.booking-equip-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 4px 16px;
  margin: 4px 0 16px;
  padding: 12px 14px;
  background: #f8fafb;
  border: 1px solid #dde5ea;
  border-radius: 6px;
}

.booking-equip-item {
  /* チェックボックス1行分 */
}

.equip-stock-badge {
  font-size: 0.72rem;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 10px;
  margin-left: 6px;
  white-space: nowrap;
}

.equip-stock-none {
  background: #fde8e8;
  color: #c0392b;
  border: 1px solid #f5c6c6;
}

.equip-stock-low {
  background: #fff3cd;
  color: #856404;
  border: 1px solid #ffe082;
}

.booking-equip-item-header {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
}

.booking-equip-item-options {
  margin: 4px 0 6px 22px;
  background: #f0f8f3;
  border-left: 3px solid #1a6b3a;
  padding: 8px 12px;
  border-radius: 0 4px 4px 0;
}

.booking-equip-meta {
  font-size: 0.78rem;
  color: #999;
  white-space: nowrap;
}

/* --- 附属設備 詳細エリア（チェック後に表示） --------------- */

#booking-equip-detail-area {
  display: none; /* JS で show() */
  margin-top: 4px;
}

/* .bbs-facility-section を流用するため + セレクタで間隔を上書き */
.equip-detail-section + .equip-detail-section {
  margin-top: 8px;
}

/* --- 終了日 readonly スタイル ----------------------------- */

.booking-form-wrap input.booking-date-readonly {
  background: #f5f5f5;
  cursor: not-allowed;
  color: #666;
}

/* --- 初日・最終日 トグル/セクション ----------------------- */

.booking-firstday-toggle,
.booking-lastday-toggle {
  margin: 8px 0 4px;
}

.booking-firstday-section,
.booking-lastday-section {
  margin: 4px 0 8px 22px;
  padding: 8px 12px;
  background: #f8f9fa;
  border-left: 3px solid #6c9;
  border-radius: 0 4px 4px 0;
}

/* --- 準備・片付け 自動表示タイムレイアウト ---------------- */

.booking-time-with-auto {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-bottom: 6px;
}

.booking-auto-time-block,
.booking-time-input-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.booking-auto-time-label {
  font-size: 0.82rem;
  color: #666;
}

.booking-auto-time {
  display: inline-block;
  font-weight: bold;
  color: #1a6b3a;
  background: #e4f4eb;
  border: 1px solid #a8d8b9;
  border-radius: 4px;
  padding: 3px 10px;
  font-size: 0.95rem;
  min-width: 72px;
}

.booking-time-range-sep {
  font-size: 1.1rem;
  color: #aaa;
  padding-bottom: 6px;
}

@media (max-width: 600px) {
  .booking-time-with-auto {
    flex-direction: column;
    align-items: flex-start;
  }
  .booking-time-range-sep {
    padding-bottom: 0;
  }
}

/* --- 時間帯ブロック選択UI ---------------------------------- */

#booking-block-selector-wrap {
  margin-top: 8px;
}

.bbs-hint {
  color: #888;
  font-size: 0.9rem;
  padding: 12px 0;
}
.bbs-hint--no-facility a {
  color: #2c6fad;
  font-weight: bold;
  text-decoration: underline;
}

.bbs-inner {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* --- 時間入力モード（#29） --------------------------------- */
.bbs-day-header {
  font-weight: bold;
  font-size: 0.95rem;
  color: #444;
  padding: 6px 0 2px;
  border-bottom: 2px solid #dde2ea;
  margin-bottom: 4px;
}
.bbs-time-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 8px;
}
.bbs-time-fac-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 8px 10px;
  background: #f8fafb;
  border: 1px solid #e0e4eb;
  border-radius: 6px;
}
.bbs-time-fac-row .bbs-fac-label {
  min-width: 130px;
  max-width: 160px;
  font-weight: bold;
  font-size: 0.88rem;
  padding-left: 8px;
  padding-top: 2px;
  flex-shrink: 0;
}
.bbs-time-fac-row .bbs-fac-label small {
  display: block;
  font-weight: normal;
  color: #888;
  font-size: 0.78em;
}
.bbs-time-fields {
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: 1;
}
.bbs-time-group {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.bbs-time-label {
  min-width: 70px;
  font-size: 0.85rem;
  color: #555;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
}
.bbs-main-label {
  font-weight: bold;
  color: #1a4a7a;
  min-width: 70px;
}
.bbs-time-range {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.bbs-time-range.bbs-hidden {
  display: none;
}
.bbs-time-sel {
  padding: 3px 6px;
  border: 1px solid #c0c8d4;
  border-radius: 4px;
  font-size: 0.88rem;
  background: #fff;
  cursor: pointer;
}
.bbs-main-group .bbs-time-sel {
  border-color: #2c6fad;
}
.bbs-time-sep {
  font-size: 0.82rem;
  color: #666;
  white-space: nowrap;
}
.bbs-block-summary {
  margin-top: 12px;
}
.bbs-block-summary-title {
  font-size: 0.82rem;
  color: #888;
  margin: 0 0 4px;
}
.bbs-corridor-status {
  font-size: 0.88rem;
  color: #999;
  padding: 2px 6px;
}
.bbs-corridor-status.active {
  color: #1a6b3a;
  font-weight: bold;
}
@media (max-width: 640px) {
  .bbs-time-fac-row {
    flex-direction: column;
    gap: 6px;
  }
  .bbs-time-fac-row .bbs-fac-label {
    min-width: unset;
    max-width: unset;
  }
}

/* 施設セクション（縦並び） */
.bbs-facility-section {
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  padding: 10px;
  background: #fafafa;
}
.bbs-facility-section + .bbs-facility-section {
  margin-top: 8px;
}
.bbs-facility-label {
  font-weight: bold;
  font-size: 0.9em;
  color: #1a5c38;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid #c8e6c9;
}

/* タブ共通 */
.bbs-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  border-bottom: 2px solid #ddd;
  padding-bottom: 4px;
}

.bbs-tab {
  padding: 5px 14px;
  border: 1px solid #ccc;
  border-radius: 4px 4px 0 0;
  background: #f5f5f5;
  color: #555;
  font-size: 0.85rem;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  border-bottom: none;
}

.bbs-tab:hover {
  background: #eaeaea;
}

.bbs-tab.active {
  background: #fff;
  color: #1a5276;
  border-color: #1a5276 #1a5276 #fff;
  border-bottom: 2px solid #fff;
  font-weight: bold;
  margin-bottom: -2px;
}

/* 日タブは小さめ */
.bbs-day-tabs .bbs-tab {
  padding: 3px 10px;
  font-size: 0.8rem;
}

/* ブロックグリッド */
.bbs-block-grid {
  display: flex;
  gap: 6px;
  margin-top: 4px;
}

.bbs-block {
  flex: 1;
  border: 2px solid #ddd;
  border-radius: 8px;
  padding: 10px 6px 8px;
  text-align: center;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, transform 0.1s;
  user-select: none;
}

.bbs-block:hover:not([data-bridge]) {
  transform: translateY(-2px);
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}

.bbs-block[data-bridge] {
  cursor: default;
}

/* 状態別の色 */
.bbs-block[data-state="unused"] {
  background: #f5f5f5;
  border-color: #ddd;
  color: #bbb;
}

.bbs-block[data-state="prep"] {
  background: #fffde7;
  border-color: #f9a825;
  color: #7b5e00;
}

.bbs-block[data-state="main"] {
  background: #e3f2fd;
  border-color: #1976d2;
  color: #0d47a1;
}


.bbs-block[data-state="bridge"] {
  background: #e8f5e9;
  border-color: #388e3c;
  color: #1b5e20;
}

.bbs-block-name {
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 2px;
}

.bbs-block-time {
  font-size: 0.72rem;
  color: inherit;
  opacity: 0.75;
  margin-bottom: 6px;
}

.bbs-block-state-lbl {
  font-size: 0.78rem;
  font-weight: bold;
  margin-bottom: 4px;
  min-height: 1.2em;
}

.bbs-block-price {
  font-size: 0.82rem;
}

.bbs-block-price small {
  display: block;
  font-size: 0.7rem;
  opacity: 0.8;
}

/* 凡例 */
.bbs-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 0.78rem;
  margin-top: 4px;
}

.bbs-legend span {
  padding: 2px 8px;
  border-radius: 10px;
  border: 1px solid #ddd;
}

.bbs-legend span[data-state="main"]   { background: #e3f2fd; border-color: #1976d2; color: #0d47a1; }
.bbs-legend span[data-state="prep"]   { background: #fffde7; border-color: #f9a825; color: #7b5e00; }
.bbs-legend span[data-state="bridge"] { background: #e8f5e9; border-color: #388e3c; color: #1b5e20; }

.bbs-click-hint {
  font-size: 0.75rem;
  color: #999;
  margin: 0;
}

/* 未選択日の右パネル警告 */
.bbs-day-warning {
  background: #fff3e0;
  border: 1px solid #ff9800;
  border-radius: 6px;
  padding: 8px 12px;
  margin-bottom: 10px;
}
.bbs-day-warning p {
  margin: 0;
  font-size: 0.85rem;
  font-weight: bold;
  color: #e65100;
}
.bbs-day-warning p + p {
  margin-top: 4px;
}

/* 送信バリデーションエラー */
.bbs-submit-error {
  background: #ffebee;
  border: 1px solid #f44336;
  border-radius: 6px;
  padding: 10px 14px;
  margin-bottom: 12px;
  font-size: 0.9rem;
  color: #b71c1c;
  font-weight: bold;
}

/* 準備/片付け注記 */
.bbs-prep-note {
  margin: 6px 0 0;
  font-size: 0.8rem;
  color: #7b5e00;
  background: #fffde7;
  border-left: 3px solid #f9a825;
  padding: 5px 8px;
  border-radius: 0 4px 4px 0;
}

/* 全日料金バッジ */
.bbs-fullday-badge {
  background: #fff8e1;
  border: 1px solid #f9a825;
  border-radius: 4px;
  padding: 6px 10px;
  font-size: 0.85rem;
  font-weight: bold;
  color: #7b5e00;
  margin-bottom: 6px;
}
/* 全日適用中はブロックを薄く表示 */
.bbs-block-grid.bbs-fullday-active .bbs-block {
  opacity: 0.5;
}
.bbs-block-grid.bbs-fullday-active .bbs-block[data-state="main"],
.bbs-block-grid.bbs-fullday-active .bbs-block[data-state="prep"] {
  opacity: 1;
  outline: 2px solid #f9a825;
  outline-offset: -2px;
}

.bbs-corridor-note {
  padding: 12px;
  background: #f0f4f8;
  border-radius: 6px;
  font-size: 0.9rem;
  color: #444;
}

/* スマホ: 2行表示 */
@media (max-width: 640px) {
  .bbs-block-grid {
    flex-wrap: wrap;
  }
  .bbs-block {
    flex: 0 0 calc(33.33% - 4px);
    min-width: 80px;
  }
  .bbs-block-name  { font-size: 0.9rem; }
  .bbs-block-time  { font-size: 0.65rem; }
  .bbs-block-price { font-size: 0.75rem; }
}

/* --- 利用時間帯テーブル：ブロックセル状態 ----------------- */

/* ブリッジセル（昼・夕方の自動無料） */
.bbs-block-bridge {
  background: #e8f5e9 !important;
  color: #388e3c !important;
  cursor: default !important;
  font-size: 0.78em;
}

/* 附属設備の昼・夕方（無料ブロック）選択中 */
.bbs-equip-free-sel {
  background: #e8f5e9 !important;
  color: #2e7d32 !important;
  font-weight: bold;
}

/* 利用時間帯・設備テーブルセル：状態ラベル＋料金の2行レイアウト */
.bbs-cell-state {
  display: block;
  font-size: 0.78em;
  font-weight: bold;
  line-height: 1.2;
}

.bbs-cell-price {
  display: block;
  font-size: 0.72em;
  opacity: 0.88;
  line-height: 1.2;
}

/* 未選択時の料金（薄く表示） */
.bbs-cell-price-dim {
  display: block;
  font-size: 0.72em;
  color: #aaa;
  line-height: 1.4;
}

/* 全日料金タグ（施設名セル内） */
.bbs-fullday-tag {
  display: inline-block;
  font-size: 0.75em;
  background: #fff8e1;
  color: #7b5e00;
  border: 1px solid #f9a825;
  border-radius: 3px;
  padding: 1px 4px;
  margin-top: 2px;
  white-space: nowrap;
}

/* --- 外構通路 区画数セレクト ----------------------------- */
.bbs-corridor-count-sel {
  padding: 4px 8px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 0.95em;
  background: #fff;
  cursor: pointer;
  margin-right: 8px;
}

/* --- 「1日目と同じ」コピーボタン（時間帯・設備共通） ----- */
.bbs-copy-day1-btn,
.bbs-copy-all-from-day1,
.bbs-copy-equip-day1 {
  font-size: 0.78em;
  padding: 3px 10px;
  border: 1px solid #2c5f8a;
  border-radius: 12px;
  background: #fff;
  color: #2c5f8a;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.1s, color 0.1s;
}
.bbs-copy-day1-btn:hover,
.bbs-copy-all-from-day1:hover,
.bbs-copy-equip-day1:hover {
  background: #2c5f8a;
  color: #fff;
}
.bbs-day-header .bbs-copy-day1-btn,
.bbs-day-header .bbs-copy-all-from-day1 {
  margin-left: 10px;
  vertical-align: middle;
}

/* --- 設備コピー行 ---------------------------------------- */
.bbs-equip-copy-cell {
  padding: 4px 8px !important;
  text-align: left !important;
  background: #f8fafd;
}

/* --- 附属設備 台数入力 ----------------------------------- */
.equip-det-count-row {
  margin-top: 6px;
}
.equip-det-count-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.9em;
  color: #fff;
}
.bbs-equip-count-input {
  width: 56px;
  padding: 3px 6px;
  border: 1px solid rgba(255,255,255,0.5);
  border-radius: 4px;
  background: rgba(255,255,255,0.15);
  color: #fff;
  font-size: 1em;
  text-align: right;
}
/* 未選択時（青背景がない状態）はテキスト色を標準に */
.k9cal-det-cell:not(.k9cal-cell-main) .equip-det-count-label { color: #333; }
.k9cal-det-cell:not(.k9cal-cell-main) .bbs-equip-count-input {
  border-color: #ccc;
  background: #fff;
  color: #333;
}

/* --- 外構通路 日別トグルボタン --------------------------- */
.bbs-corridor-toggle {
  display: block;
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #ccc;
  border-radius: 6px;
  background: #f5f5f5;
  color: #999;
  cursor: pointer;
  font-size: 0.95rem;
  text-align: center;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.bbs-corridor-toggle.active {
  background: #e8f5e9;
  border-color: #1a6b3a;
  color: #1a6b3a;
  font-weight: bold;
}

/* --- 附属設備 ブロック選択UI ----------------------------- */
.booking-equip-block-ui {
  margin-top: 8px;
  padding: 10px 12px;
  background: #f8fafb;
  border: 1px solid #dde;
  border-radius: 6px;
}
.bbs-equip-inner {
  /* reuses bbs-inner styles */
}
.bbs-equip-block-grid {
  /* reuses bbs-block-grid */
}
.bbs-equip-count-wrap {
  margin-top: 10px;
  font-size: 0.9rem;
}

.bbs-equip-count-label {
  display: block;
  font-size: 0.82rem;
  color: #555;
  margin-bottom: 6px;
}

.bbs-equip-count-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.bbs-equip-count-btn {
  padding: 5px 10px;
  font-size: 0.85rem;
  border: 1px solid #b0c4cc;
  border-radius: 4px;
  background: #fff;
  color: #333;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  min-width: 44px;
  text-align: center;
}

.bbs-equip-count-btn:hover {
  background: #e8f4fb;
  border-color: #1a5276;
  color: #1a5276;
}

.bbs-equip-count-btn.active {
  background: #1a5276;
  border-color: #1a5276;
  color: #fff;
  font-weight: bold;
}

/* --- 設備詳細テーブル内コントロール ----------------------- */

/* テーブルセル内のトグルボタン（装飾を外してテキスト風に） */
.equip-det-toggle {
  display: block;
  width: 100%;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  font-size: 0.85em;
  cursor: pointer;
  color: inherit;
  text-align: left;
}

/* テーブルセル内の数量ボタンバー */
.equip-det-count-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin-top: 5px;
}

/* --- 送信ボタン ------------------------------------------ */
.booking-main .wpcf7-submit {
  letter-spacing: normal;
  white-space: nowrap;
  width: auto;
  min-width: 280px;
}