refactor(MikrotikBackupsManager): update diff panel styles for improved readability and visual clarity

frontend/src/MikrotikBackupsManager.jsx

@@ -53,18 +53,25 @@ const diffPanelStyle = {
   margin: 0,
   padding: '0.5rem 0.75rem',
   borderRadius: 4,
-  backgroundColor: 'var(--tblr-bg-surface-secondary, #1e293b)',
+  backgroundColor: 'var(--tblr-bg-surface, #ffffff)',
+  border: '1px solid var(--tblr-border-color, #e2e8f0)',
 };
 const diffLineStyle = {
   display: 'block',
   minHeight: '1.25em',
   whiteSpace: 'pre-wrap',
-  wordBreak: 'break-all',
+  wordBreak: 'break-word',
-  padding: '0 2px',
+  padding: '0 4px',
   margin: 0,
 };
-const diffRemovedBg = { background: 'rgba(248, 81, 73, 0.25)' };
+const diffRemovedBg = {
-const diffAddedBg = { background: 'rgba(63, 185, 80, 0.25)' };
+  background: 'rgba(248, 81, 73, 0.08)',
+  borderLeft: '3px solid rgba(248, 81, 73, 0.9)',
+};
+const diffAddedBg = {
+  background: 'rgba(63, 185, 80, 0.08)',
+  borderLeft: '3px solid rgba(63, 185, 80, 0.9)',
+};
 
 function DiffPanel({ lines, side }) {
   return (