Rework conversation panel layout and sub-header styles

stylesheets/components/ConversationView.scss

@@ -11,15 +11,10 @@
 
   &__pane {
     display: flex;
+    position: relative;
+    flex: 1;
     flex-direction: column;
-    height: calc(
-      100% - #{variables.$header-height} - var(--title-bar-drag-area-height)
-    );
-    inset-inline-start: 0;
     overflow-y: auto;
-    position: absolute;
-    top: calc(#{variables.$header-height} + var(--title-bar-drag-area-height));
-    width: 100%;
     z-index: variables.$z-index-base;
 
     @include mixins.light-theme() {
@@ -33,23 +28,21 @@
 
   &__timeline {
     &--container {
+      display: flex;
       flex-grow: 1;
       margin: 0;
-      max-width: 100%;
-      position: relative;
       z-index: 0;
+      min-height: 0;
     }
 
     & {
-      -webkit-padding-start: 0px;
-      height: 100%;
+      position: relative;
+      flex-grow: 1;
+      min-height: 0;
       margin: 0;
       overflow-x: hidden;
       overflow-y: auto;
       padding: 0;
-      position: absolute;
-      top: 0;
-      width: 100%;
     }
   }
 
@@ -68,5 +61,6 @@
   }
 
   &__header {
+    z-index: variables.$z-index-above-base;
   }
 }