/* WAHAI v9.2 R7 — layout-only fix. Toggle R6 tetap utuh. */
/* CLOSED: panel detail selalu benar-benar keluar dari grid, tanpa bergantung conversation-mode. */
#view-conversations #contactDetailPane{display:none!important}
/* OPEN: hanya kombinasi state JS R6 + class .open yang boleh menampilkan panel. */
body.detail-pane-open #view-conversations #contactDetailPane.open{display:block!important}

/* Desktop/tablet default: hanya daftar + chat, satu baris penuh. */
#view-conversations .inbox-shell{
  grid-template-columns:minmax(300px,340px) minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
  align-items:stretch!important;
}
#view-conversations .inbox-list-pane,
#view-conversations .conversation-main{min-height:0!important;height:100%!important}

@media(min-width:901px){
 #view-conversations .inbox-list-pane{grid-column:1!important;grid-row:1!important}
 #view-conversations .conversation-main{grid-column:2!important;grid-row:1!important}
}

/* Desktop lebar: saat Detail dibuka, baru menjadi kolom ketiga pada BARIS YANG SAMA. */
@media(min-width:1281px){
 body.detail-pane-open #view-conversations .inbox-shell{
   grid-template-columns:minmax(300px,340px) minmax(0,1fr) minmax(280px,320px)!important;
   grid-template-rows:minmax(0,1fr)!important;
 }
 body.detail-pane-open #view-conversations #contactDetailPane.open{
   grid-column:3!important;grid-row:1!important;
   position:relative!important;inset:auto!important;
   width:auto!important;height:100%!important;min-height:0!important;max-height:100%!important;
   overflow:auto!important;transform:none!important;
 }
}

/* Tablet: Detail menjadi drawer, grid utama tetap dua kolom dan satu baris. */
@media(min-width:901px) and (max-width:1280px){
 body.detail-pane-open #view-conversations #contactDetailPane.open{
   position:fixed!important;z-index:190!important;top:0!important;right:0!important;bottom:0!important;
   width:min(88vw,360px)!important;height:100dvh!important;max-height:100dvh!important;
   overflow:auto!important;background:var(--panel,#fff)!important;
   box-shadow:-18px 0 48px rgba(0,0,0,.22)!important;transform:none!important;
 }
}

/* Mobile: satu kolom, Detail tetap drawer. */
@media(max-width:900px){
 #view-conversations .inbox-shell{grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr)!important}
 body.detail-pane-open #view-conversations #contactDetailPane.open{
   position:fixed!important;z-index:190!important;top:0!important;right:0!important;bottom:0!important;
   width:min(92vw,360px)!important;height:100dvh!important;max-height:100dvh!important;
   overflow:auto!important;background:var(--panel,#fff)!important;
   box-shadow:-18px 0 48px rgba(0,0,0,.22)!important;transform:none!important;
 }
}