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); }