From dae25e9112a3498591e5cf3426f7a0b6576b2178 Mon Sep 17 00:00:00 2001
From: josedario87 <jodarioel87@gmail.com>
Date: Fri, 26 Sep 2025 17:20:34 -0600
Subject: [PATCH] style(ui): update gradients, borders, and scrollbars

---
 frontend/src/styles.css | 40 ++++++++++++++++------------------------
 1 file changed, 16 insertions(+), 24 deletions(-)

diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 59f64c8..42e5cf0 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -41,7 +41,14 @@ a { color: inherit; }
   border: 1px solid transparent;
   background:
     linear-gradient(rgba(var(--card)), rgba(var(--card))) padding-box,
-    linear-gradient(135deg, #ff9fcb, #ff7fbb) border-box;
+    linear-gradient(135deg,
+      rgba(255, 159, 203, 0.95) 0%,
+      rgba(255, 159, 203, 0.60) 10%,
+      rgba(255, 127, 187, 0.45) 18%,
+      rgba(0, 0, 0, 0.20) 28%,
+      rgba(0, 0, 0, 0.06) 50%,
+      rgba(0, 0, 0, 0.00) 70%
+    ) border-box;
 }
 :root:not(.light) .topbar {
   background:
@@ -54,7 +61,7 @@ a { color: inherit; }
       rgba(0, 0, 0, 0.10) 50%,
       rgba(0, 0, 0, 0.00) 70%
     ) border-box;
-  box-shadow: 0 0 18px rgba(255, 46, 134, 0.25), 0 0 6px rgba(255, 107, 176, 0.2);
+  border-width: 0.5px; /* borde más delgado en dark */
 }
 .title { font-size: 16px; font-weight: 700; letter-spacing: .2px; flex: 1 1 auto; }
 .actions { display: inline-flex; flex-wrap: wrap; gap: 8px; align-items: center; }
@@ -65,29 +72,14 @@ a { color: inherit; }
 
 /* Layout */
 .shell { height: calc(100vh - 54px); display: grid; grid-template-columns: 360px 1fr; gap: 12px; padding: 12px; }
-.panel { border: 1px solid transparent; background: rgba(var(--card)); border-radius: var(--radius); backdrop-filter: blur(var(--glass-blur)); overflow: hidden; display: flex; flex-direction: column; min-height: 0;
-  background:
-    linear-gradient(rgba(var(--card)), rgba(var(--card))) padding-box,
-    radial-gradient(140% 140% at 50% 100%,
-      rgba(255, 159, 203, 0.95) 0%,
-      rgba(255, 127, 187, 0.70) 12%,
-      rgba(255, 127, 187, 0.28) 24%,
-      rgba(255, 127, 187, 0.00) 50%
-    ) border-box;
-}
-:root:not(.light) .panel {
-  background:
-    linear-gradient(rgba(var(--card)), rgba(var(--card))) padding-box,
-    radial-gradient(140% 140% at 50% 100%,
-      rgba(255, 46, 134, 0.95) 0%,
-      rgba(255, 46, 134, 0.60) 10%,
-      rgba(255, 107, 176, 0.45) 18%,
-      rgba(0, 0, 0, 0.28) 28%,
-      rgba(0, 0, 0, 0.10) 50%,
-      rgba(0, 0, 0, 0.00) 70%
-    ) border-box;
-  box-shadow: 0 0 22px rgba(255, 46, 134, 0.18), 0 0 8px rgba(255, 107, 176, 0.15);
+.panel { 
+  border: 1px solid #ffcfe4; /* light más claro */
+  background: linear-gradient(rgba(var(--card)), rgba(var(--card))) padding-box;
+  border-radius: var(--radius);
+  backdrop-filter: blur(var(--glass-blur));
+  overflow: hidden; display: flex; flex-direction: column; min-height: 0;
 }
+:root:not(.light) .panel { border-color: #ff2e86; border-width: 0.5px; /* borde más delgado en dark */ }
 .panel-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid rgba(var(--border)); }
 .panel-title { font-weight: 600; }
 .panel-actions { display: inline-flex; flex-wrap: wrap; gap: 6px; }