Add files via upload

web/static/css/style.css

@@ -1217,13 +1217,6 @@ header {
     user-select: none;
 }
 
-.hitl-sidebar-header-actions {
-    display: flex;
-    align-items: center;
-    gap: 6px;
-    flex-shrink: 0;
-}
-
 .hitl-sidebar-body {
     overflow: hidden;
     max-height: 500px;
@@ -1238,10 +1231,6 @@ header {
     margin-top: 0;
 }
 
-.hitl-sidebar-collapsed .hitl-apply-btn {
-    display: none;
-}
-
 .hitl-sidebar-heading {
     display: flex;
     align-items: center;
@@ -1359,6 +1348,14 @@ header {
     margin-bottom: 0;
 }
 
+.hitl-config-actions {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 14px;
+    padding-top: 12px;
+    border-top: 1px solid rgba(15, 23, 42, 0.06);
+}
+
 .hitl-config-label {
     display: block;
     font-size: 12px;
@@ -2532,8 +2529,8 @@ header {
 .conversation-reasoning-card-header {
     display: flex;
     align-items: center;
-    justify-content: flex-start;
-    gap: 0;
+    justify-content: space-between;
+    gap: 8px;
     width: 100%;
     padding: 0;
     margin: 0;
@@ -2548,10 +2545,34 @@ header {
     border-radius: 0;
 }
 
-.conversation-reasoning-card-header:hover .conversation-reasoning-title {
+.conversation-reasoning-card-header:hover .conversation-reasoning-title,
+.hitl-sidebar-card-header:hover .hitl-sidebar-title {
     color: var(--accent-color);
 }
 
+.sidebar-card-chevron {
+    flex-shrink: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--text-secondary);
+    transition: transform 0.2s ease, color 0.2s ease;
+}
+
+.sidebar-card-chevron svg {
+    display: block;
+}
+
+.conversation-reasoning-card-header:hover .sidebar-card-chevron,
+.hitl-sidebar-card-header:hover .sidebar-card-chevron {
+    color: var(--accent-color);
+}
+
+.conversation-reasoning-card:not(.conversation-reasoning-collapsed) .conversation-reasoning-chevron,
+.hitl-sidebar-card:not(.hitl-sidebar-collapsed) .hitl-sidebar-chevron {
+    transform: rotate(90deg);
+}
+
 .conversation-reasoning-heading {
     display: flex;
     align-items: center;

web/static/js/chat.js

@@ -423,10 +423,18 @@ if (typeof window !== 'undefined') {
     window.updateHitlStatusUI = updateHitlStatusUI;
 }
 
+function syncHitlSidebarAriaExpanded() {
+    var card = document.getElementById('hitl-sidebar-card');
+    var toggle = document.getElementById('hitl-sidebar-toggle');
+    if (!card || !toggle) return;
+    toggle.setAttribute('aria-expanded', card.classList.contains('hitl-sidebar-collapsed') ? 'false' : 'true');
+}
+
 function toggleHitlSidebarCard() {
     var card = document.getElementById('hitl-sidebar-card');
     if (!card) return;
     card.classList.toggle('hitl-sidebar-collapsed');
+    syncHitlSidebarAriaExpanded();
     try {
         localStorage.setItem('hitl-sidebar-collapsed', card.classList.contains('hitl-sidebar-collapsed') ? '1' : '0');
     } catch (e) {}
@@ -438,6 +446,7 @@ document.addEventListener('DOMContentLoaded', function () {
     if (card && localStorage.getItem('hitl-sidebar-collapsed') === '0') {
         card.classList.remove('hitl-sidebar-collapsed');
     }
+    syncHitlSidebarAriaExpanded();
 });
 
 function getAgentModeLabelForValue(mode) {