body { background-color: var(--bg-color); } .navbar { background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%) !important; position: sticky; top: 0; z-index: 1030; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .sidebar { background-color: var(--white); min-height: calc(100vh - 56px); box-shadow: 2px 0 5px var(--shadow-color); position: sticky; top: 56px; /* Height of the navbar */ height: calc(100vh - 56px); overflow-y: auto; } .sidebar .nav-link { color: var(--text-dark); padding: 0.8rem 1rem; border-radius: 0.25rem; margin: 0.2rem 0; } .sidebar .nav-link:hover { background-color: var(--bg-color); } .sidebar .nav-link.active { background-color: var(--primary-color); color: var(--white); } .sidebar .nav-link i { margin-right: 0.5rem; } .main-content { padding: 2rem; } .card { border: none; border-radius: 10px; box-shadow: 0 2px 4px var(--shadow-color); } .btn-primary { background-color: var(--primary-color); border-color: var(--primary-color); } .btn-primary:hover { background-color: var(--primary-light); border-color: var(--primary-light); } .document-card { transition: transform 0.2s; } .document-card:hover { transform: translateY(-5px); }