From 1b4f0261d91b48a56b5a9978b003f61868b2a814 Mon Sep 17 00:00:00 2001
From: Mathew Kamkar <578302+matkam@users.noreply.github.com>
Date: Tue, 29 Jul 2025 18:49:18 +0100
Subject: [PATCH] css to support separate control bar from chat and video

---
 styles/globals.css | 51 ++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 49 insertions(+), 2 deletions(-)

diff --git a/styles/globals.css b/styles/globals.css
index ff0c088..d07f8bd 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -25,13 +25,13 @@ body {
   padding-inline: 2rem;
 }
 
-.header > img {
+.header>img {
   display: block;
   margin: auto;
   max-width: 100%;
 }
 
-.header > h2 {
+.header>h2 {
   font-family: 'TWK Everett', sans-serif;
   font-style: normal;
   font-weight: 400;
@@ -65,3 +65,50 @@ h2 a {
 h2 a {
   text-decoration: none;
 }
+
+/* Override LiveKit video conference layout to fix control bar positioning */
+.lk-video-conference {
+  position: relative;
+  display: flex !important;
+  flex-direction: column !important;
+  align-items: stretch;
+  height: 100%;
+}
+
+.lk-video-conference-content {
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  width: 100%;
+  flex: 1;
+  min-height: 0;
+}
+
+.lk-video-conference-inner {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  width: 100%;
+  flex: 1;
+  min-height: 0;
+}
+
+.lk-grid-layout-wrapper,
+.lk-focus-layout-wrapper {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  width: 100%;
+  height: 100% !important;
+  flex: 1;
+  min-height: 0;
+}
+
+.lk-grid-layout-wrapper {
+  flex-direction: column;
+  align-items: center;
+}
+
+.lk-focus-layout-wrapper {
+  align-items: stretch;
+}
\ No newline at end of file