/* ETRIXTECH E-TEKNISI V82 — chat viewport/composer fix only.
   Menjaga kolom ketik selalu terlihat dan isi percakapan dapat di-scroll. */

/* Isolasi tinggi chat dari patch CSS versi lama. */
#chat.view.active{
  min-height:0!important;
  overflow:hidden!important;
}

.chat-app-v81{
  min-height:0!important;
  overflow:hidden!important;
  contain:layout paint;
}
.chat-app-v81 > *{
  min-height:0!important;
}

/* Flex column lebih stabil daripada grid pada WebView Android dan browser HP. */
.chat-conversation-v81{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  min-height:0!important;
  height:100%!important;
  overflow:hidden!important;
  position:relative!important;
}
.chat-thread-head-v81{
  flex:0 0 auto!important;
}

/* Hanya area pesan yang bergerak/scroll. */
#chatCards.chat-thread-v81{
  flex:1 1 auto!important;
  min-height:0!important;
  height:0!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-y!important;
  scrollbar-gutter:stable!important;
  overflow-anchor:none!important;
}

/* Composer tidak boleh ikut terdorong oleh banyaknya pesan. */
#chatForm.chat-form-v81{
  display:flex!important;
  flex:0 0 auto!important;
  flex-direction:column!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  z-index:30!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  box-sizing:border-box!important;
  overflow:visible!important;
  transform:none!important;
}
#chatForm .chat-targets-v81,
#chatForm .chat-compose-v81{
  flex:0 0 auto!important;
  min-width:0!important;
}
#chatForm .chat-attach-preview{
  flex:0 0 auto!important;
  max-height:54px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  flex-wrap:nowrap!important;
  -webkit-overflow-scrolling:touch!important;
}

/* Desktop: tetap berada di dalam tinggi panel, bukan menambah tinggi halaman. */
@media(min-width:901px){
  .chat-app-v81{
    height:min(760px,calc(100dvh - 115px))!important;
    min-height:480px!important;
    max-height:none!important;
  }
}

/* Browser HP dan APK: sisakan ruang untuk menu bawah serta safe area. */
@media(max-width:900px){
  .chat-app-v81{
    min-height:0!important;
    max-height:none!important;
  }
  .chat-contact-panel-v81{
    flex:0 0 auto!important;
    min-height:0!important;
  }
  .chat-conversation-v81{
    min-height:0!important;
  }
}

@media(max-width:600px){
  body.apk-mode.logged-in #chat.view.active{
    height:calc(100dvh - 94px - env(safe-area-inset-bottom))!important;
    min-height:0!important;
  }
  body.apk-mode.logged-in #chat .chat-app-v81{
    height:100%!important;
    min-height:0!important;
  }
  body.mobile-web-mode.logged-in #chat.view.active{
    height:calc(100dvh - 152px - env(safe-area-inset-bottom))!important;
    min-height:0!important;
  }
  body.mobile-web-mode.logged-in #chat .chat-app-v81{
    height:100%!important;
    min-height:0!important;
  }
  #chatForm.chat-form-v81{
    padding:7px 7px calc(7px + env(safe-area-inset-bottom))!important;
  }
  #chatForm .chat-compose-v81{
    align-items:center!important;
  }
}

/* Scrollbar tetap mudah terlihat di desktop. */
@media(pointer:fine){
  #chatCards.chat-thread-v81::-webkit-scrollbar{width:9px}
  #chatCards.chat-thread-v81::-webkit-scrollbar-track{background:rgba(185,205,220,.35)}
  #chatCards.chat-thread-v81::-webkit-scrollbar-thumb{background:#8faabd;border:2px solid transparent;border-radius:999px;background-clip:padding-box}
}