chat fixes

odoo/support.html

@@ -20,7 +20,7 @@
     *{box-sizing:border-box}
     body{margin:0;background:linear-gradient(180deg,var(--bg),#eef2f8);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px}
 
-    .app{width:960px;max-width:96vw;background:transparent;display:grid;grid-template-columns:320px 1fr;gap:20px}
+    .app{width:1146px;max-width:96vw;background:transparent;display:grid;grid-template-columns:320px 1fr;gap:20px;align-items:stretch}
 
     /* Left column - user list / details */
     .sidebar{background:linear-gradient(180deg,rgba(255,255,255,0.9),var(--card));border-radius:var(--radius);padding:20px;box-shadow:0 6px 20px rgba(24,39,75,0.06);overflow:hidden}
@@ -55,17 +55,16 @@
     .sidebar .hint{margin-top:14px;padding:10px;border-radius:10px;background:#fbf8ff;color:#5b4160;font-size:13px}
 
     /* Chat area */
-    .chat-card{background:var(--card);border-radius:var(--radius);display:flex;flex-direction:column;height:70vh;box-shadow:0 10px 30px rgba(24,39,75,0.06);overflow:hidden}
+    .chat-card{background:var(--card);border-radius:var(--radius);display:flex;flex-direction:column;height:100%;min-height:0;box-shadow:0 10px 30px rgba(24,39,75,0.06);overflow:hidden}
     .chat-header{display:flex;align-items:center;gap:12px;padding:18px;border-bottom:1px solid #eef1f6}
     .chat-header .title{font-weight:600;color:var(--odoo-dark)}
     .chat-header .sub{font-size:13px;color:var(--muted)}
 
-    .messages{flex:1;padding:22px;overflow:auto;background:linear-gradient(180deg,#fbfcff, #f7f9fc)}
+    .messages{flex:1;min-height:0;padding:22px;overflow:auto;background:linear-gradient(180deg,#fbfcff, #f7f9fc)}
     .messages-inner{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
 
-    .msg{display:flex;gap:10px;align-items:flex-end}
+    .msg{display:flex;gap:10px;align-items:flex-end;width:100%}
-    .msg.me{justify-content:flex-end}
+    .bubble{width:100%;max-width:100%;padding:12px 14px;border-radius:12px;background:white;border:1px solid #eef1f6;font-size:14px;color:#222}
-    .bubble{max-width:68%;padding:12px 14px;border-radius:12px;background:white;border:1px solid #eef1f6;font-size:14px;color:#222}
     .bubble.me{background:linear-gradient(90deg,var(--odoo-purple),#9b6fa0);color:white;border:none}
     .meta-time{font-size:11px;color:var(--muted);margin-top:6px}
 
@@ -204,16 +203,13 @@ Please note: it does not cover general Odoo usage or functional questions.
       const col = document.createElement('div');
       col.style.display = 'flex';
       col.style.flexDirection = 'column';
+      col.style.flex = '1';
+      col.style.minWidth = '0';
       col.appendChild(bubble);
       col.appendChild(meta);
 
-      if(who==='me'){
+      wrap.appendChild(avatar);
-        wrap.appendChild(col);
+      wrap.appendChild(col);
-        wrap.appendChild(avatar);
-      } else {
-        wrap.appendChild(avatar);
-        wrap.appendChild(col);
-      }
 
       messagesEl.appendChild(wrap);
       messagesEl.parentElement.scrollTop = messagesEl.parentElement.scrollHeight;