.scroll-progress-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px; /* Adjust height as needed */
    background-color: #f0f0f0; /* Background for the empty part of the progress bar */
    z-index: 1030; /* Above main navigation bar */
}

.scroll-progress-bar {
    height: 100%;
    width: 0%;
    background: linear-gradient(to right, #00c1a4, #007bff); /* 渐变色：从绿色到蓝色 */
    transition: width 0.1s linear; /* Smooth transition for width changes */
}

/* 进度条末端图片装饰 */
.scroll-progress-icon {
    position: absolute;
    top: -8px; /* 向上偏移，使图片在进度条上方 */
    right: 0;
    transform: translateX(50%); /* 让图片的中心对齐进度条末端 */
    transition: right 0.1s linear; /* 跟随进度条移动 */
}

.progress-decoration {
    width: 20px;
    height: 20px;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2)); /* 添加阴影效果 */
    border-radius: 50%; /* 圆形图标 */
    background-color: white; /* 白色背景 */
    padding: 2px; /* 内边距 */
}