/* V6.4.5 — Small Screen Interaction Fix. Loaded after V6.4.4. */
@media (max-width:760px){
  :root{--v645-nav-space:calc(70px + env(safe-area-inset-bottom));--v645-topbar:68px}

  /* Messaging: an opened conversation owns a guaranteed viewport between topbar and bottom nav. */
  #messages.mobile-chat-open .messages{
    position:fixed!important;
    z-index:74!important;
    top:var(--v645-topbar)!important;
    right:0!important;
    bottom:var(--v645-nav-space)!important;
    left:0!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    border-radius:0!important;
    overflow:hidden!important;
  }
  #messages.mobile-chat-open .chat{
    display:grid!important;
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    overflow:hidden!important;
  }
  #messages.mobile-chat-open .chat-body{min-height:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important}
  #messages.mobile-chat-open .composer{
    display:flex!important;
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    padding:9px 10px max(9px,env(safe-area-inset-bottom))!important;
    background:#fff!important;
    z-index:2!important;
  }
  #messages.mobile-chat-open .composer input{flex:1 1 auto!important;min-width:0!important}
  #messages.mobile-chat-open .composer .primary{flex:0 0 auto!important;max-width:38%!important;white-space:nowrap!important}

  /* Publication modal: reserve the bottom navigation outside the modal instead of padding inside it. */
  .modal.show{
    position:fixed!important;
    inset:0 0 var(--v645-nav-space) 0!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }
  .modal.show .modal-box{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    min-width:0!important;
    min-height:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  .modal.show .modal-box .form{
    flex:1 1 auto!important;
    min-width:0!important;
    min-height:0!important;
    width:100%!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    padding:14px 14px 18px!important;
    scroll-padding-bottom:78px!important;
  }
  .modal.show .modal-box .form-actions{
    position:sticky!important;
    right:auto!important;
    bottom:0!important;
    left:auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)!important;
    gap:8px!important;
    width:auto!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    margin:14px -14px -18px!important;
    padding:10px 14px 12px!important;
    background:#fff!important;
    border-top:1px solid var(--line)!important;
    z-index:5!important;
  }
  .modal.show .modal-box .form-actions button{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:44px!important;
    padding-inline:8px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .modal.show .sell-steps{min-width:0!important;overflow:hidden!important}
  .modal.show .sell-steps span{min-width:0!important;font-size:clamp(7px,2.15vw,9px)!important;white-space:nowrap!important}
}

@media (max-width:380px){
  .modal.show .modal-box .form-actions{grid-template-columns:minmax(0,.9fr) minmax(0,1.45fr)!important}
  #messages.mobile-chat-open .composer .primary{padding-inline:10px!important}
}
