/* サイト案内AIチャット。
   本番テーマとの衝突を避けるため、すべて mkc- 名前空間 & .mkc-root 配下に限定。 */

.mkc-root {
  --mkc-ink: #203b32;
  --mkc-muted: #65766f;
  --mkc-green: #187e59;
  --mkc-green-dark: #0c583d;
  --mkc-green-soft: #e8f5ee;
  --mkc-banner: #187e59;      /* JSがバナー色で上書き（無指定時はメインカラー連動） */
  --mkc-banner-dark: #0c583d;
  --mkc-text: #30473f;        /* ボットの吹き出しの文字色 */
  --mkc-white: #fff;
  --mkc-gold: #d9a632;
  --mkc-shadow: 0 24px 70px rgba(19, 57, 43, .2);
}

.mkc-root,
.mkc-root *,
.mkc-root *::before,
.mkc-root *::after { box-sizing: border-box; }

.mkc-root button,
.mkc-root input {
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  font-size: 100%;
}
.mkc-root button { cursor: pointer; }

.mkc-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 右下ランチャー */
.mkc-launcher {
  position: fixed; right: 24px; bottom: 24px; z-index: 99998;
  display: flex; align-items: center; gap: 10px;
  min-height: 58px; padding: 8px 18px 8px 9px;
  border: 0; border-radius: 999px;
  color: var(--mkc-white); background: var(--mkc-green-dark);
  box-shadow: 0 12px 36px rgba(12, 88, 61, .28);
  font-weight: 800; line-height: 1.2;
  transition: transform .2s ease, box-shadow .2s ease;
}
.mkc-launcher[hidden] { display: none; }
.mkc-launcher:hover { transform: translateY(-2px); box-shadow: 0 16px 42px rgba(12, 88, 61, .34); }
.mkc-launcher__icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; overflow: hidden; color: var(--mkc-green-dark); background: var(--mkc-white); font-size: 21px; }
.mkc-launcher__icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mkc-launcher__label { white-space: nowrap; }
.mkc-launcher__badge { position: absolute; right: -2px; top: -5px; display: grid; place-items: center; width: 22px; height: 22px; border: 2px solid var(--mkc-white); border-radius: 50%; background: #e6534e; font-size: 11px; }

/* 形状：円形／角丸四角（アイコンのみ） */
.mkc-root[data-launcher-shape="round"] .mkc-launcher,
.mkc-root[data-launcher-shape="square"] .mkc-launcher {
  gap: 0; width: 62px; height: 62px; min-height: 0; padding: 0; justify-content: center;
}
.mkc-root[data-launcher-shape="square"] .mkc-launcher { border-radius: 18px; }
.mkc-root[data-launcher-shape="round"] .mkc-launcher__icon,
.mkc-root[data-launcher-shape="square"] .mkc-launcher__icon { width: 46px; height: 46px; background: transparent; color: var(--mkc-white); }
.mkc-root[data-launcher-shape="square"] .mkc-launcher__icon { border-radius: 12px; }

/* チャットパネル */
.mkc-chat {
  position: fixed; right: 24px; bottom: 94px; z-index: 99999;
  width: min(408px, calc(100vw - 32px)); height: min(680px, calc(100vh - 126px));
  overflow: hidden; border: 1px solid rgba(32, 59, 50, .12); border-radius: 26px;
  color: var(--mkc-ink); background: var(--mkc-white); box-shadow: var(--mkc-shadow);
  animation: mkc-chat-in .25s ease both;
}
.mkc-chat[hidden] { display: none; }
@keyframes mkc-chat-in { from { opacity: 0; transform: translateY(12px) scale(.98); } }

.mkc-chat__header { display: grid; grid-template-columns: 46px 1fr 34px 34px; align-items: center; gap: 10px; min-height: 78px; padding: 13px 14px 13px 16px; color: var(--mkc-white); background: linear-gradient(135deg, var(--mkc-banner-dark), var(--mkc-banner)); }
.mkc-chat__avatar { display: grid; place-items: center; width: 46px; height: 46px; overflow: hidden; border: 2px solid rgba(255, 255, 255, .5); border-radius: 15px; background: rgba(255, 255, 255, .14); font-family: "Yu Mincho", serif; font-size: 22px; font-weight: 800; color: var(--mkc-white); }
.mkc-chat__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mkc-chat__header h2 { margin: 0; font-size: 15px; color: var(--mkc-white); }
.mkc-chat__header p { margin: 5px 0 0; color: rgba(255, 255, 255, .78); font-size: 11px; }
.mkc-status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: #8ef0b5; }
.mkc-icon-button { width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; color: var(--mkc-white); background: rgba(255, 255, 255, .1); font-size: 21px; line-height: 1; }
.mkc-icon-button:hover { background: rgba(255, 255, 255, .2); }

.mkc-chat__body { height: calc(100% - 150px); overflow-y: auto; padding: 18px 16px 28px; background: #f7faf8; scroll-behavior: smooth; }
.mkc-message { display: flex; margin: 0 0 13px; }
.mkc-message--user { justify-content: flex-end; }
.mkc-message__bubble { max-width: 87%; padding: 12px 14px; border-radius: 6px 18px 18px; color: var(--mkc-text); background: var(--mkc-white); box-shadow: 0 4px 16px rgba(30, 67, 52, .07); font-size: 13px; line-height: 1.7; white-space: pre-line; }
.mkc-message--user .mkc-message__bubble { border-radius: 18px 6px 18px 18px; color: var(--mkc-white); background: var(--mkc-green); }
.mkc-message__actions { display: grid; gap: 7px; margin: 5px 0 17px; }
.mkc-choice, .mkc-action-link { width: 100%; min-height: 43px; padding: 10px 13px; border: 1px solid #cfe2d9; border-radius: 12px; color: var(--mkc-green-dark); background: var(--mkc-white); font-size: 12px; font-weight: 700; text-align: left; text-decoration: none; line-height: 1.5; transition: border-color .15s, background .15s; }
.mkc-choice:hover { border-color: var(--mkc-green); background: var(--mkc-green-soft); }
.mkc-action-link { display: flex; align-items: center; justify-content: space-between; color: var(--mkc-white); background: var(--mkc-green-dark); border-color: var(--mkc-green-dark); }
.mkc-action-link::after { content: "→"; }
.mkc-action-link--line { background: #06a848; border-color: #06a848; }
.mkc-message__note { margin: 8px 0 0; padding: 10px 11px; border-radius: 10px; color: #705d2d; background: #fff7df; font-size: 11px; line-height: 1.6; }

.mkc-typing { display: flex; gap: 4px; width: fit-content; padding: 13px 15px; border-radius: 6px 18px 18px; background: var(--mkc-white); }
.mkc-typing span { width: 6px; height: 6px; border-radius: 50%; background: #91a199; animation: mkc-blink 1s infinite alternate; }
.mkc-typing span:nth-child(2) { animation-delay: .2s; }
.mkc-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes mkc-blink { to { opacity: .25; transform: translateY(-2px); } }

.mkc-chat__composer { height: 72px; padding: 9px 12px 7px; border-top: 1px solid #e2ebe6; background: var(--mkc-white); }
.mkc-chat__composer form { display: flex; gap: 6px; }
.mkc-chat__composer input { width: 100%; min-width: 0; height: 38px; padding: 0 12px; border: 1px solid #d7e3dd; border-radius: 12px; outline: none; color: var(--mkc-ink); background: #fbfcfb; font-size: 12px; }
.mkc-chat__composer input:focus { border-color: var(--mkc-green); box-shadow: 0 0 0 3px rgba(24, 126, 89, .1); }
.mkc-chat__composer form button { flex: 0 0 38px; height: 38px; padding: 0; border: 0; border-radius: 12px; color: var(--mkc-white); background: var(--mkc-green); font-size: 16px; }
.mkc-chat__composer > p { margin: 5px 0 0; color: #91a099; font-size: 9px; text-align: center; }

@media (max-width: 700px) {
  .mkc-launcher { right: 14px; bottom: 14px; }
  .mkc-chat { inset: 10px 10px 84px; width: auto; height: auto; border-radius: 22px; }
  .mkc-chat__body { height: calc(100% - 150px); }
}

@media (prefers-reduced-motion: reduce) {
  .mkc-root *, .mkc-root *::before, .mkc-root *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}