/* MEGURO RC GARAGE — 予約導線デザインテーマ
   フロントサイト(RCPIT)の配色・フォントに合わせるための上書き。
   meguro-theme.css が定義する --ms-* / --bs-* トークンを [data-theme="rc"] 配下で
   RCPIT のダーク×黄色に差し替える方式。予約フォーム/確認画面のHTML構造・JSは
   シューティングと共通のものをそのまま使う（価格計算・カレンダー等のロジックを
   複製しない）。
   ------------------------------------------------------------------ */

[data-theme="rc"] {
  --ms-accent:      #f2d94e;
  --ms-accent-dark: #c9ad2e;
  --ms-accent-soft: rgba(242, 217, 78, 0.08);
  --ms-ink:         #f4f4f2;
  --ms-ink-2:       rgba(244, 244, 242, 0.78);
  --ms-ink-3:       rgba(244, 244, 242, 0.55);
  --ms-line:        rgba(255, 255, 255, 0.12);
  --ms-paper:       #0b0c0e;
  --ms-paper-2:     #14161a;
  --ms-white:       #14161a;

  --ms-f-display: 'Barlow Condensed', sans-serif;
  --ms-f-jp:      'Noto Sans JP', sans-serif;
  --ms-f-body:    'Noto Sans JP', sans-serif;

  --bs-primary:          #f2d94e;
  --bs-primary-rgb:      242, 217, 78;
  --bs-body-bg:          #0b0c0e;
  --bs-body-color:       #f4f4f2;
  --bs-body-font-family: 'Noto Sans JP', sans-serif;
  --bs-border-color:     rgba(255, 255, 255, 0.12);
  --bs-light:            #14161a;
  --bs-light-rgb:        20, 22, 26;
  --bs-secondary-color:  rgba(244, 244, 242, 0.55);
  --bs-link-color:       #f2d94e;
  --bs-link-hover-color: #ffffff;

  /* reservation.css / buttons.css / cards.css が参照する汎用トークン（style.cssの
     :root定義は常に明色系のため、RCではここで上書きしないとカレンダー等が
     ダークテーマから浮いてしまう）。selected（予約枠の選択）はRCアクセント（黄）と
     衝突しないよう、ここでは「情報系」の青のみを割り当てる。 */
  --primary-color: #60a5fa;   /* 土曜の日付・オープン営業表示など */
  --success-color: #4ade80;   /* 空き（○） */
  --danger-color:  #f87171;   /* 日曜の日付 */
  --light-color:   #14161a;   /* テーブルヘッダー等の明色面 */
  --border-color:  rgba(255, 255, 255, 0.12);
}

/* ── ナビ／ドロワー／フッターは背景色を意図的に固定しているため個別上書き ── */
[data-theme="rc"] .rs-nav {
  background: rgba(11, 12, 14, 0.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

[data-theme="rc"] .rs-nav__logo--rc {
  font-family: 'Barlow Condensed', sans-serif;
  font-style: italic;
  font-weight: 600;
  font-size: clamp(16px, 2.1vw, 20px);
  letter-spacing: 0.14em;
  color: #f4f4f2;
  text-decoration: none;
  white-space: nowrap;
}
[data-theme="rc"] .rs-nav__logo-accent { color: #f2d94e; }

[data-theme="rc"] .rs-footer--rc {
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
[data-theme="rc"] .rs-footer__brand-rc {
  font-family: 'Barlow Condensed', sans-serif;
  font-style: italic;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: 0.14em;
  color: #f4f4f2;
}

/* ── ボタン：黄アクセント地には濃色テキストでコントラストを確保 ── */
[data-theme="rc"] .btn-primary,
[data-theme="rc"] .btn-primary:focus,
[data-theme="rc"] .btn-primary:active {
  color: #0b0c0e !important;
}
[data-theme="rc"] .btn-outline-primary:hover {
  color: #0b0c0e !important;
}
[data-theme="rc"] .badge.bg-primary,
[data-theme="rc"] .member-badge {
  color: #0b0c0e !important;
}

/* ── 予約カレンダーの選択枠（calendar.html） ── */
[data-theme="rc"] .time-slot.available {
  border-color: rgba(242, 217, 78, 0.35) !important;
}
[data-theme="rc"] .time-slot.selected {
  color: #0b0c0e !important;
}

/* ── 予約グリッド（reservation.css・日時選択カレンダー） ──
   選択中スロットはRCアクセント（黄）で強調し、土曜/オープン営業の「情報」系の
   青とは別の意味を持たせる。空き（緑）・不可（灰）はダーク地でも判別しやすい
   明度に調整。 */
[data-theme="rc"] .time-grid td.selected {
  background-color: var(--ms-accent);
  color: #0b0c0e;
}
[data-theme="rc"] .time-grid td.available:hover {
  color: #0b0c0e;
}
[data-theme="rc"] .time-grid td.unavailable,
[data-theme="rc"] .time-grid td.break-time {
  background-color: rgba(255, 255, 255, 0.03);
  color: rgba(244, 244, 242, 0.32);
}
[data-theme="rc"] .time-grid td.open-business {
  background-color: rgba(96, 165, 250, 0.12);
}
[data-theme="rc"] .sticky-header {
  background: #14161a;
}
[data-theme="rc"] .infomartion-link {
  color: rgba(244, 244, 242, 0.85);
}

/* ── フォームのフォーカスリング ── */
[data-theme="rc"] .form-control:focus,
[data-theme="rc"] .form-select:focus {
  box-shadow: 0 0 0 0.2rem rgba(242, 217, 78, 0.25);
}