/* UniPayWeb chat — stabilité horizontale sur petits écrans. */
html, body.unipay-page-chat { max-width: 100%; }

@media (max-width: 880px) {
  html, body.unipay-page-chat { width: 100%; overflow-x: clip !important; }
  body.unipay-page-chat .page-scope,
  body.unipay-page-chat .page-scope > main.content {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: max(8px, env(safe-area-inset-left, 0px)) max(8px, env(safe-area-inset-right, 0px)) !important;
    overflow-x: clip !important;
  }

  body.unipay-page-chat main.content > *,
  body.unipay-page-chat main.content section,
  body.unipay-page-chat main.content article,
  body.unipay-page-chat main.content form,
  body.unipay-page-chat main.content fieldset,
  body.unipay-page-chat main.content .grid,
  body.unipay-page-chat main.content [class*="grid"],
  body.unipay-page-chat main.content [class*="list"] {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
  }

  body.unipay-page-chat main.content img,
  body.unipay-page-chat main.content video,
  body.unipay-page-chat main.content canvas,
  body.unipay-page-chat main.content iframe {
    max-width: 100%;
  }

  body.unipay-page-chat main.content :is(h1,h2,h3,h4,p,li,a,button,strong,span,small) {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  body.unipay-page-chat #fut-bottombar {
    left: max(12px, env(safe-area-inset-left, 0px)) !important;
    right: max(12px, env(safe-area-inset-right, 0px)) !important;
    width: auto !important;
    max-width: none !important;
  }

  body.unipay-page-chat #fut-bottombar .fut-bottom-list {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }
  body.unipay-page-chat #fut-bottombar .fut-bottom-list::-webkit-scrollbar { display: none; }
}

@media (max-width: 420px) {
  body.unipay-page-chat .page-scope > main.content { padding-inline: max(5px, env(safe-area-inset-left, 0px)) max(5px, env(safe-area-inset-right, 0px)) !important; }
  body.unipay-page-chat main.content > .login-section,
  body.unipay-page-chat main.content > .messaging-section { padding: 12px !important; border-radius: 14px; }
}