From 4a130c22cf59b0efa4b9b8e2b08383cf8d568f65 Mon Sep 17 00:00:00 2001
From: Lizandro Guarnizo <77708265+lizandrogd@users.noreply.github.com>
Date: Wed, 24 Jun 2026 08:04:34 -0500
Subject: [PATCH] =?UTF-8?q?style(sidebar):=20centrar=20labels=20de=20categ?=
 =?UTF-8?q?or=C3=ADa=20y=20resaltar=20categor=C3=ADa=20activa=20con=20bord?=
 =?UTF-8?q?e+fondo?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 shared/components/sidebar.php | 29 +++++++++++++++++++++--------
 1 file changed, 21 insertions(+), 8 deletions(-)

diff --git a/shared/components/sidebar.php b/shared/components/sidebar.php
index 20c27fb..9352822 100644
--- a/shared/components/sidebar.php
+++ b/shared/components/sidebar.php
@@ -316,23 +316,36 @@ if (class_exists('ModuleRegistry', false)) {
 
 /* ── Acordeón de categorías ─────────────────────────── */
 .sidebar-section {
+    position: relative;
     display: flex;
     align-items: center;
-    justify-content: space-between;
+    justify-content: center;
     cursor: pointer;
     user-select: none;
-    padding: 8px 16px 6px;
+    padding: 8px 28px 6px;
     margin-top: 6px;
     border-radius: 8px 8px 0 0;
-    transition: background .15s;
+    transition: background .15s, border-color .15s;
+    border-left: 3px solid transparent;
+    font-size: .72rem;
+    font-weight: 700;
+    letter-spacing: .05em;
+    text-transform: uppercase;
+    color: rgba(255,255,255,.65);
 }
-.sidebar-section:hover { background: rgba(255,255,255,.08); }
-.sidebar-section .sb-cat-label { display:flex; align-items:center; gap:4px; }
+.sidebar-section:hover { background: rgba(255,255,255,.08); color: rgba(255,255,255,.9); }
+.sidebar-section.has-active {
+    border-left-color: rgba(255,255,255,.7);
+    background: rgba(255,255,255,.1);
+    color: #fff;
+}
+.sidebar-section .sb-cat-label { display:flex; align-items:center; gap:5px; }
 .sb-chevron {
-    font-size: .65rem;
-    opacity: .7;
+    position: absolute;
+    right: 12px;
+    font-size: .6rem;
+    opacity: .6;
     transition: transform .25s ease;
-    flex-shrink: 0;
 }
 .sidebar-section.collapsed .sb-chevron { transform: rotate(-90deg); }