Improve xterm scrollbar styling and container height

Author: kovsu

src/components/terminal/terminal.css

@@ -3,7 +3,6 @@
   position: relative;
   overflow: hidden;
   padding-left: 16px; /* Only add left padding */
-  padding-right: 8px;
 }
 
 /* Ensure xterm doesn't overflow its container */
@@ -31,9 +30,7 @@
 }
 
 .xterm-container .xterm-viewport::-webkit-scrollbar-track {
-  background-color: var(--color-hover);
-  border-radius: 6px;
-  margin: 4px;
+  border-left: 1px solid var(--color-border);
 }
 
 .xterm-container .xterm-viewport::-webkit-scrollbar-thumb {
@@ -74,4 +71,4 @@
 /* Override xterm cursor when hovering links */
 .xterm.xterm-cursor-pointer {
   cursor: pointer !important;
-}
+}

src/components/terminal/terminal.tsx

@@ -699,7 +699,7 @@ export const XtermTerminal: React.FC<XtermTerminalProps> = ({
         id={`terminal-${sessionId}`}
         className={cn("xterm-container", "w-full", "text-text", !isActive && "opacity-60")}
         style={{
-          height: "calc(100% - 40px)", // Subtract footer height to prevent content going below
+          height: "calc(100% - 1px)", // Subtract footer height to prevent content going below
         }}
       />
     </div>