From 1480866fa2b85d338dfd0691a7dfa4cc7928fb85 Mon Sep 17 00:00:00 2001
From: ACX <8075870+acx10@users.noreply.github.com>
Date: Fri, 6 Mar 2026 11:32:13 -0700
Subject: [PATCH] align device settings access denied card styling with OPDS
 (#3199)

---
 .../app/shared/styles/_settings-shared.scss   | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/booklore-ui/src/app/shared/styles/_settings-shared.scss b/booklore-ui/src/app/shared/styles/_settings-shared.scss
index 08bd99d00..1c19d61fb 100644
--- a/booklore-ui/src/app/shared/styles/_settings-shared.scss
+++ b/booklore-ui/src/app/shared/styles/_settings-shared.scss
@@ -452,22 +452,17 @@ $settings-item-border-left-width: 3px;
   display: flex;
   align-items: center;
   gap: 1rem;
-  padding: 1rem;
+  padding: 1.5rem;
   border-radius: $settings-card-border-radius;
-  background: rgba(220, 38, 38, 0.1);
-  border: 1px solid rgba(220, 38, 38, 0.3);
-  color: var(--p-red-400);
+  background: color-mix(in srgb, var(--ground-background) 85%, var(--p-red-600) 15%);
+  border: 1px solid var(--p-content-border-color);
+  border-left: 3px solid var(--p-red-500);
   max-width: 500px;
-  margin: 0 1rem;
-
-  @media (max-width: 768px) {
-    margin: 0;
-  }
 
   .pi {
-    font-size: 1.25rem;
+    font-size: 1.5rem;
     flex-shrink: 0;
-    color: var(--p-red-300);
+    color: var(--p-red-400);
   }
 }
 
@@ -483,7 +478,7 @@ $settings-item-border-left-width: 3px;
     margin: 0;
     font-size: $settings-section-description-size;
     line-height: 1.5;
-    color: var(--p-red-400);
+    color: var(--p-text-muted-color);
   }
 }