/* たびのすけバス 問い合わせボット（試作）。全クラス・IDは sc- 接頭辞（既存の #chat-toggle-btn 等と衝突させない） */
#sc-root, #sc-root * { box-sizing: border-box; }
#sc-root {
  --sc-main: #d61518;
  --sc-main-dark: #b31214;
  --sc-bg: #f4f6f5;
  --sc-text: #222;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: var(--sc-text);
}

#sc-toggle-btn {
  position: fixed; right: 20px; bottom: 20px; z-index: 2147483000;
  width: 60px; height: 60px; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--sc-main); color: #fff; box-shadow: 0 4px 14px rgba(0,0,0,.3);
  display: flex; align-items: center; justify-content: center; padding: 0;
}
#sc-toggle-btn:hover { background: var(--sc-main-dark); }
#sc-toggle-btn svg { width: 30px; height: 30px; fill: #fff; }
#sc-toggle-btn:focus-visible, #sc-root button:focus-visible, #sc-root a:focus-visible { outline: 3px solid #ffb703; outline-offset: 2px; }

#sc-window {
  position: fixed; right: 20px; bottom: 90px; z-index: 2147483000;
  width: 380px; height: 600px; max-height: calc(100vh - 110px);
  background: #fff; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,.3);
  display: none; flex-direction: column; overflow: hidden;
}
#sc-window.sc-open { display: flex; }

.sc-header { background: var(--sc-main); color: #fff; padding: 12px 14px; display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.sc-header-title { flex: 1 1 auto; min-width: 0; }
.sc-title { font-size: 16px; font-weight: bold; margin: 0; }
.sc-status { font-size: 12px; margin: 2px 0 0; display: flex; align-items: center; gap: 6px; }
.sc-status-dot { width: 9px; height: 9px; border-radius: 50%; background: #aaa; display: inline-block; }
.sc-status[data-open="1"] .sc-status-dot { background: #5eea8d; }
.sc-close-btn { background: transparent; border: 0; color: #fff; font-size: 26px; line-height: 1; cursor: pointer; padding: 4px 8px; }

.sc-log { flex: 1 1 auto; overflow-y: auto; padding: 14px; background: var(--sc-bg); }
.sc-msg { max-width: 88%; margin: 0 0 10px; padding: 9px 12px; border-radius: 12px; word-break: break-word; }
.sc-msg-bot { background: #fff; border: 1px solid #dde3e0; border-top-left-radius: 2px; margin-right: auto; }
.sc-msg-user { background: var(--sc-main); color: #fff; border-top-right-radius: 2px; margin-left: auto; }
.sc-msg p { margin: 0 0 .6em; }
.sc-msg p:last-child { margin-bottom: 0; }
.sc-msg ul { margin: .3em 0 .6em 1.2em; padding: 0; }
.sc-msg a { color: #0b5cad; text-decoration: underline; }
.sc-msg-user a { color: #fff; }

.sc-choices { display: flex; flex-direction: column; gap: 8px; margin: 0 0 12px; }
.sc-choice {
  text-align: left; background: #fff; color: var(--sc-main-dark); border: 1px solid var(--sc-main); border-radius: 18px;
  padding: 9px 14px; font: inherit; cursor: pointer; text-decoration: none; display: block;
}
.sc-choice:hover { background: #fdecec; }
.sc-choice-link::after { content: " \2197"; }
.sc-choices-row { flex-direction: row; }
.sc-choices-row .sc-choice { flex: 1 1 0; text-align: center; }

.sc-footer { flex: 0 0 auto; border-top: 1px solid #dde3e0; background: #fff; padding: 8px 10px; display: flex; justify-content: center; }
.sc-home-btn { background: transparent; border: 1px solid #8a9a93; color: #333; border-radius: 16px; padding: 6px 16px; font: inherit; cursor: pointer; }
.sc-home-btn:hover { background: #eef2f0; }

/* --- 既存の共有ボタン(#chat-toggle-btn / .circle-btn)に統合して使うとき（launcher=false） --- */
#sc-root.sc-nolauncher #sc-window {
  right: 24px; bottom: 130px; z-index: 10001;
  max-width: calc(100vw - 48px); max-height: calc(100vh - 150px);
}
/* support の窓が開いている間は共有ボタンを「閉じる」アイコンにし、円形の文字を隠す（lost-chat 開時と同じ見た目） */
body.sc-open .chat-toggle-btn .chat-icon-open { display: none; }
body.sc-open .chat-toggle-btn .chat-icon-close { display: block; transform: rotate(0); }
body.sc-open .circle-btn__svg { display: none !important; }

/* スマホ幅は全画面 */
@media (max-width: 480px) {
  #sc-window { right: 0; bottom: 0; left: 0; top: 0; width: 100%; height: 100%; max-height: none; border-radius: 0; }
  #sc-toggle-btn { right: 14px; bottom: 14px; }
  #sc-window.sc-open ~ #sc-toggle-btn { display: none; } /* 全画面表示中は丸ボタンを隠す（×で閉じる） */
  #sc-root.sc-nolauncher #sc-window { right: 0; bottom: 0; left: 0; top: 0; width: 100%; height: 100%; max-width: none; max-height: none; border-radius: 0; }
  body.sc-open .chat-toggle-btn { display: none; } /* lost-chat と同じく全画面中は共有ボタンを隠す（×で閉じる） */
}