diff --git a/backend/static/css/components/chat-detail.css b/backend/static/css/components/chat-detail.css
index 878432c3..72605852 100644
--- a/backend/static/css/components/chat-detail.css
+++ b/backend/static/css/components/chat-detail.css
@@ -244,13 +244,14 @@ main.main {
 
 .message-attachments a {
   background: rgba(0, 0, 0, 0.05);
-  border: 1px solid rgba(0, 0, 0, 0.08);
+  border: none;
   transition: all 0.2s ease;
+  color: inherit;
 }
 
 .bubble-me .message-attachments a {
   background: rgba(255, 255, 255, 0.15);
-  border-color: rgba(255, 255, 255, 0.2);
+  color: inherit;
 }
 
 .message-attachments a:hover {
@@ -268,6 +269,14 @@ main.main {
   border-radius: 8px;
 }
 
+.message-attachments .text-secondary {
+  opacity: 0.7;
+}
+
+.bubble-me .message-attachments .text-primary {
+  color: rgba(255, 255, 255, 0.9) !important;
+}
+
 /* Выпадающее меню вложений */
 .dropdown-menu {
   min-width: 200px;
diff --git a/backend/static/js/components/chatMessageTemplates.js b/backend/static/js/components/chatMessageTemplates.js
index 3417e77b..78a14f0c 100644
--- a/backend/static/js/components/chatMessageTemplates.js
+++ b/backend/static/js/components/chatMessageTemplates.js
@@ -155,7 +155,6 @@ export function createMessageElement(msg, options = {}) {
   
   // Формирование вложений
   let attachmentsHTML = '';
-  let videoIds = [];
   if (msg.has_attachments && msg.attachments && msg.attachments.length > 0) {
     attachmentsHTML = '<div class="message-attachments mt-2">';
     msg.attachments.forEach((att, index) => {
@@ -176,11 +175,9 @@ export function createMessageElement(msg, options = {}) {
           </audio>
           <div class="small text-secondary">${esc(att.file_name)}</div>`;
       } else if (att.file_type === 'video') {
-        const videoId = `video_${Date.now()}_${index}`;
-        videoIds.push({ id: videoId, url: att.file_url, mime: att.mime_type });
         attachmentsHTML += `
-          <video id="${videoId}" controls preload="auto" class="w-100" style="max-width: 400px;">
-            <source type="${att.mime_type}">
+          <video controls preload="metadata" class="w-100" style="max-width: 400px;">
+            <source src="${att.file_url}" type="${att.mime_type}">
             Ваш браузер не поддерживает видео.
           </video>
           <div class="small text-secondary">${esc(att.file_name)}</div>`;
@@ -188,9 +185,9 @@ export function createMessageElement(msg, options = {}) {
         const fileSize = att.file_size ? formatFileSize(att.file_size) : '';
         attachmentsHTML += `
           <a href="${att.file_url}" 
-             class="d-flex align-items-center text-decoration-none p-2 border rounded"
+             class="d-flex align-items-center text-decoration-none p-2 rounded"
              download="${esc(att.file_name)}">
-            <i class="bi-file-earmark fs-3 text-primary me-2"></i>
+            <i class="bi-file-earmark fs-3 me-2"></i>
             <div>
               <div class="fw-semibold">${esc(att.file_name)}</div>
               <div class="small text-secondary">${fileSize}</div>
@@ -226,22 +223,5 @@ export function createMessageElement(msg, options = {}) {
     wrap.innerHTML = `${bubble}<a class="ms-2 text-decoration-none" href="${profileUrl}">${ava}</a>`;
   }
 
-  // Устанавливаем src для видео после добавления в DOM
-  if (videoIds.length > 0) {
-    // Используем requestAnimationFrame чтобы убедиться что элементы в DOM
-    requestAnimationFrame(() => {
-      videoIds.forEach(videoData => {
-        const video = wrap.querySelector(`#${videoData.id}`);
-        if (video) {
-          const source = video.querySelector('source');
-          if (source) {
-            source.src = videoData.url;
-            video.load();
-          }
-        }
-      });
-    });
-  }
-
   return wrap;
 }