/* wire-message-row-footer-stability-303f1h9159c */

/*
 * The message thread is a vertical flex scroller. h9159b correctly put the
 * action controls beneath each bubble, but each .direct-message remained a
 * shrinkable flex child. With enough messages in the viewport the browser
 * compressed the article boxes while their bubble content kept its natural
 * height, producing the overlapping rows visible in production.
 *
 * h9159c makes every message row non-shrinking and lets the thread scroll.
 */

.message-thread[data-message-thread],
.message-thread{
  align-items:stretch!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}

.message-thread .direct-message[data-message-id]{
  position:relative!important;
  flex:0 0 auto!important;
  flex-shrink:0!important;
  flex-grow:0!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:auto!important;
  min-height:max-content!important;
  margin:9px 0 13px!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  isolation:isolate!important;
}

/*
 * Keep h9159b's bubble + footer stack in normal document flow and make its
 * height contribute fully to the parent article.
 */
.message-thread
.direct-message[data-message-id]
> .wire-message-stack-303f1h9159b{
  position:relative!important;
  inset:auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-auto-rows:max-content!important;
  align-content:start!important;
  width:fit-content!important;
  min-width:0!important;
  height:auto!important;
  min-height:max-content!important;
  max-width:min(76%,560px)!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}

/* Own messages remain on the right; incoming messages remain on the left. */
.message-thread
.direct-message.own[data-message-id]
> .wire-message-stack-303f1h9159b{
  margin-left:auto!important;
}

.message-thread
.direct-message:not(.own)[data-message-id]
> .wire-message-stack-303f1h9159b{
  margin-right:auto!important;
}

/*
 * Bubble always owns its natural height. We intentionally do not alter the
 * existing colors, media behavior, reactions, reply context, or receipts.
 */
.message-thread
.wire-message-stack-303f1h9159b
> .message-bubble{
  position:relative!important;
  inset:auto!important;
  float:none!important;
  display:block!important;
  width:fit-content!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  box-sizing:border-box!important;
}

/* Stable compact action footer directly under the bubble. */
.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a{
  position:static!important;
  inset:auto!important;
  display:flex!important;
  flex:0 0 auto!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  width:auto!important;
  min-width:0!important;
  min-height:20px!important;
  height:20px!important;
  margin:3px 0 0!important;
  padding:0!important;
  gap:3px!important;
  overflow:visible!important;
  opacity:.78!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
  box-sizing:border-box!important;
}

.message-thread
.direct-message:not(.own)
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a{
  justify-self:start!important;
  justify-content:flex-start!important;
}

.message-thread
.direct-message.own
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a{
  justify-self:end!important;
  justify-content:flex-end!important;
}

.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
> button,
.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
form > button,
.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
[data-wire-message-delete]{
  appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  min-height:20px!important;
  height:20px!important;
  margin:0!important;
  padding:0 5px!important;
  border:0!important;
  border-radius:5px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#7f96a8!important;
  font-size:9px!important;
  font-weight:750!important;
  line-height:20px!important;
  white-space:nowrap!important;
  text-decoration:none!important;
}

.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
> button:hover,
.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
form > button:hover,
.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
> button:focus-visible,
.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
form > button:focus-visible{
  background:#0d1d2a!important;
  color:#e1ebf3!important;
  outline:none!important;
}

/* Sender delete stays quiet but visibly destructive. */
.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
[data-wire-message-delete]{
  color:#aa777d!important;
}

.message-thread
.wire-message-stack-303f1h9159b
> .wire-message-actions-303f1h680a
[data-wire-message-delete]:hover{
  color:#ef9299!important;
}

/* Incoming avatar sits with the full row, never forcing row collapse. */
.message-thread
.direct-message:not(.own)[data-message-id]
> .wire-message-peer-avatar-303f1h683,
.message-thread
.direct-message:not(.own)[data-message-id]
> .avatar,
.message-thread
.direct-message:not(.own)[data-message-id]
> .avatar-xs,
.message-thread
.direct-message:not(.own)[data-message-id]
> .wire-avatar{
  flex:0 0 auto!important;
  align-self:flex-end!important;
}

/* Own messages never reserve avatar space. */
.message-thread
.direct-message.own[data-message-id]
> .wire-message-peer-avatar-303f1h683,
.message-thread
.direct-message.own[data-message-id]
> .avatar,
.message-thread
.direct-message.own[data-message-id]
> .avatar-xs,
.message-thread
.direct-message.own[data-message-id]
> .wire-avatar{
  display:none!important;
}

@media(max-width:980px){
  .message-thread
  .direct-message[data-message-id]
  > .wire-message-stack-303f1h9159b{
    max-width:84%!important;
  }

  .message-thread
  .wire-message-stack-303f1h9159b
  > .wire-message-actions-303f1h680a{
    opacity:.86!important;
  }
}

@media(max-width:680px){
  .message-thread .direct-message[data-message-id]{
    margin:7px 0 11px!important;
  }

  .message-thread
  .direct-message[data-message-id]
  > .wire-message-stack-303f1h9159b{
    max-width:86%!important;
  }

  .message-thread
  .wire-message-stack-303f1h9159b
  > .wire-message-actions-303f1h680a{
    min-height:22px!important;
    height:22px!important;
  }

  .message-thread
  .wire-message-stack-303f1h9159b
  > .wire-message-actions-303f1h680a
  > button,
  .message-thread
  .wire-message-stack-303f1h9159b
  > .wire-message-actions-303f1h680a
  form > button,
  .message-thread
  .wire-message-stack-303f1h9159b
  > .wire-message-actions-303f1h680a
  [data-wire-message-delete]{
    min-height:22px!important;
    height:22px!important;
    line-height:22px!important;
    font-size:9px!important;
  }
}