/* Modern sidebar styles. Pairs with includes/side-modern.html.
   Loaded by any page that uses the modern shell. */

.modern-sidebar .logo-light,
.modern-sidebar .logo-dark { display: inline-block; }
html.dark .modern-sidebar .logo-light { display: none; }
html:not(.dark) .modern-sidebar .logo-dark { display: none; }

.sidebar-nav { padding-left: 0.75rem; }
.sidebar-nav .nav-item { list-style: none; }

.sidebar-nav .nav-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    color: #475569;
    text-decoration: none;
    cursor: pointer;
    background: transparent;
    border: 0;
    width: 100%;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
.sidebar-nav .nav-link:hover { background-color: #f8fafc; color: #0f172a; }
.sidebar-nav .nav-icon { flex-shrink: 0; }
.sidebar-nav .nav-item.active > .nav-link {
    background-color: rgba(99, 102, 241, 0.12);
    color: #4338ca;
    font-weight: 600;
}

.sidebar-nav .nav-sub {
    padding-left: 1.75rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}
.sidebar-nav .nav-sub-link {
    display: block;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    line-height: 1.15rem;
    color: #475569;
    text-decoration: none;
}
.sidebar-nav .nav-sub-link:hover { background-color: #f8fafc; color: #0f172a; }
.sidebar-nav .nav-sub-link.active { background-color: rgba(99, 102, 241, 0.10); color: #4338ca; font-weight: 600; }

.sidebar-nav .nav-chevron { transition: transform 0.15s ease; }
.sidebar-nav .nav-collapse-toggle.is-open .nav-chevron { transform: rotate(180deg); }

/* Dark mode */
html.dark .modern-sidebar { background-color: #111827 !important; border-color: #1f2937 !important; }
html.dark .modern-sidebar .border-slate-100 { border-color: #1f2937 !important; }
html.dark .modern-sidebar .border-slate-200 { border-color: #1f2937 !important; }
html.dark .sidebar-nav .nav-link { color: #94a3b8; }
html.dark .sidebar-nav .nav-link:hover { background-color: #1e293b; color: #f1f5f9; }
html.dark .sidebar-nav .nav-item.active > .nav-link {
    background-color: rgba(99, 102, 241, 0.20);
    color: #c7d2fe;
}
html.dark .sidebar-nav .nav-sub-link { color: #94a3b8; }
html.dark .sidebar-nav .nav-sub-link:hover { background-color: #1e293b; color: #f1f5f9; }
html.dark .sidebar-user .text-slate-700 { color: #e2e8f0 !important; }
html.dark .sidebar-user .text-slate-400 { color: #64748b !important; }