:root{
    /* アイコン差し替え先（必要に応じて変更） */
    --dify-icon-open:  url('https://kanja-ai.jp/img/chatbot-icons/4.png');  /* 未展開時 */
    --dify-icon-close: url('https://kanja-ai.jp/img/chatbot-icons/close1.png'); /* 展開時 */
  }
  /* ボタンを「先頭アイコン + 後ろテキスト」のピル型に */
  #dify-chatbot-bubble-button{
    position: fixed !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    height: 55px !important;
    padding: 0 16px !important;
    border-radius: 999px !important;
    width: auto !important;
    background-color:  #7DC056 !important;
    color: #fff !important;
    font-weight: 700 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.25) !important;
    z-index: 2147483647 !important;
  }
  /* 既定のSVG/IMGは非表示（自前で作る） */
  #dify-chatbot-bubble-button svg,
  #dify-chatbot-bubble-button img{ display:none !important; }
  /* 先頭アイコン（状態は .is-open クラスで切替） */
  #dify-chatbot-bubble-button::before{
    content:"";
    width:40px; height:40px; flex:0 0 auto;
    background: no-repeat center/contain var(--dify-icon-open);
  }
  #dify-chatbot-bubble-button.is-open::before{
    background-image: var(--dify-icon-close);
  }
  /* 後ろテキスト（状態は .is-open クラスで切替） */
  #dify-chatbot-bubble-button::after{
    content:"AIに相談する";
    white-space: nowrap;
  }
  #dify-chatbot-bubble-button.is-open::after{
    content:"閉じる";
  }
  /* ウィンドウサイズ（任意） */
  #dify-chatbot-bubble-window{
    width: min(40rem,92vw) !important;
    min-height: 35rem !important;
    position: fixed !important;
  }