diff --git a/package.json b/package.json
index fe70473..0596ffb 100644
--- a/package.json
+++ b/package.json
@@ -19,7 +19,6 @@
     "@radix-ui/react-tooltip": "^1.1.3",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
-    "framer-motion": "^11.11.11",
     "lucide-react": "^0.454.0",
     "next": "15.0.2",
     "next-themes": "^0.4.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1968569..295f9db 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -38,9 +38,6 @@ importers:
       clsx:
         specifier: ^2.1.1
         version: 2.1.1
-      framer-motion:
-        specifier: ^11.11.11
-        version: 11.11.11(react-dom@19.0.0-rc-02c0e824-20241028(react@19.0.0-rc-02c0e824-20241028))(react@19.0.0-rc-02c0e824-20241028)
       lucide-react:
         specifier: ^0.454.0
         version: 0.454.0(react@19.0.0-rc-02c0e824-20241028)
@@ -1263,20 +1260,6 @@ packages:
     resolution: {integrity: sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==}
     engines: {node: '>=14'}
 
-  framer-motion@11.11.11:
-    resolution: {integrity: sha512-tuDH23ptJAKUHGydJQII9PhABNJBpB+z0P1bmgKK9QFIssHGlfPd6kxMq00LSKwE27WFsb2z0ovY0bpUyMvfRw==}
-    peerDependencies:
-      '@emotion/is-prop-valid': '*'
-      react: ^18.0.0
-      react-dom: ^18.0.0
-    peerDependenciesMeta:
-      '@emotion/is-prop-valid':
-        optional: true
-      react:
-        optional: true
-      react-dom:
-        optional: true
-
   fs.realpath@1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
 
@@ -3508,13 +3491,6 @@ snapshots:
       cross-spawn: 7.0.3
       signal-exit: 4.1.0
 
-  framer-motion@11.11.11(react-dom@19.0.0-rc-02c0e824-20241028(react@19.0.0-rc-02c0e824-20241028))(react@19.0.0-rc-02c0e824-20241028):
-    dependencies:
-      tslib: 2.8.1
-    optionalDependencies:
-      react: 19.0.0-rc-02c0e824-20241028
-      react-dom: 19.0.0-rc-02c0e824-20241028(react@19.0.0-rc-02c0e824-20241028)
-
   fs.realpath@1.0.0: {}
 
   fsevents@2.3.3:
diff --git a/src/app/globals.css b/src/app/globals.css
index 48d2c1f..dd2355d 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -41,7 +41,9 @@ body {
     --sidebar-accent-foreground: 240 5.9% 10%;
     --sidebar-border: 220 13% 91%;
     --sidebar-ring: 217.2 91.2% 59.8%;
+    --row-highlight: #FDF1E6;
   }
+
   .dark {
     --background: 222.2 84% 4.9%;
     --foreground: 210 40% 98%;
@@ -75,6 +77,7 @@ body {
     --sidebar-accent-foreground: 240 4.8% 95.9%;
     --sidebar-border: 240 3.7% 15.9%;
     --sidebar-ring: 217.2 91.2% 59.8%;
+    --row-highlight: #2C2218;
   }
 }
 
@@ -82,6 +85,7 @@ body {
   * {
     @apply border-border;
   }
+
   body {
     @apply bg-background text-foreground;
   }
diff --git a/src/components/alerts/alert-groups.tsx b/src/components/alerts/alert-groups.tsx
index 860dbdf..cd8381a 100644
--- a/src/components/alerts/alert-groups.tsx
+++ b/src/components/alerts/alert-groups.tsx
@@ -1,4 +1,3 @@
-import { motion, AnimatePresence } from "framer-motion"
 import { useState } from "react"
 import { ChevronDown } from "lucide-react"
 
@@ -57,20 +56,17 @@ function AlertGroup(props: AlertGroupProps) {
         maxHeight: open ? `${alerts.length * 50}px` : '0',
       }}>
         <ul>
-          <AnimatePresence>
-            {alerts.map((alert: Alert) => (
-              <motion.li
-                key={alert.fingerprint}
-                onClick={() => setSelectedAlert(alert)}
-                initial={{ backgroundColor: 'yellow' }}
-                animate={{ backgroundColor: 'transparent' }}
-                exit={{ backgroundColor: 'yellow' }}
-                transition={{ duration: 1 }}
-              >
-                <AlertRow alert={alert} />
-              </motion.li>
-            ))}
-          </AnimatePresence>
+          {alerts.map((alert: Alert) => (
+            <li
+              key={alert.fingerprint}
+              onClick={() => setSelectedAlert(alert)}
+              className={cn({
+                'animate-highlight': new Date(alert.startsAt) > new Date(Date.now() - 30 * 60 * 1000)
+              })}
+            >
+              <AlertRow alert={alert} />
+            </li>
+          ))}
         </ul>
       </div>
     </Collapsible>
diff --git a/src/components/alerts/alert-severity.tsx b/src/components/alerts/alert-severity.tsx
index a1068f6..67025f9 100644
--- a/src/components/alerts/alert-severity.tsx
+++ b/src/components/alerts/alert-severity.tsx
@@ -17,7 +17,7 @@ export function AlertSeverity({ alert }: { alert: Alert }) {
       text = 'ERR'
       break
     case 'warning':
-      color = 'bg-orange-300'
+      color = 'bg-orange-300 dark:text-black'
       text = 'WARN'
       break
     case 'info':
diff --git a/tailwind.config.ts b/tailwind.config.ts
index b6a0bec..d094106 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -92,12 +92,21 @@ const config: Config = {
           from: {
             transform: 'rotate(360deg)'
           },
-        }
+        },
+        'highlight': {
+          '0%': {
+            background: 'var(--row-highlight)',
+          },
+          '100%': {
+            background: 'none',
+          },
+        },
       },
       animation: {
         'accordion-down': 'accordion-down 0.2s ease-out',
         'accordion-up': 'accordion-up 0.2s ease-out',
-        'reverse-spin': 'reverse-spin 1s linear infinite'
+        'reverse-spin': 'reverse-spin 1s linear infinite',
+        highlight: 'highlight 3s',
       }
     }
   },