.progress-container{width:100%;overflow-x:auto;scrollbar-width:thin}.progress-container::-webkit-scrollbar{height:6px}.progress-container::-webkit-scrollbar-track{background:transparent}.progress-container::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.dark .progress-container::-webkit-scrollbar-thumb{background:#475569}.progress-wrapper{display:flex;align-items:stretch;overflow:hidden;height:50px;width:-moz-fit-content;width:fit-content;border-radius:5px}.step{min-width:180px;max-width:300px;display:flex;align-items:center;position:relative;padding:0 20px 0 30px;transition:all .3s ease;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 50%,calc(100% - 20px) 100%,0 100%,20px 50%);margin-left:-20px}.step:first-child{clip-path:polygon(0 0,calc(100% - 20px) 0,100% 50%,calc(100% - 20px) 100%,0 100%);padding-left:20px;margin-left:0}.step:last-child{padding-right:20px}.step.completed{background:linear-gradient(135deg,#009ba4,#007f87);color:#fff}.step.current{background:#d9f2f4;color:#009ba4}.dark .step.current{background:#004d4f;color:#e6f9fa}.step.locked{background:#e6eaef;color:#b0b0b0}.dark .step.locked{background:#1e293b;color:#64748b}.step:nth-child(1).completed{background:linear-gradient(135deg,#009ba4,#007f87)}.step-icon{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;margin-right:10px;font-weight:600}.step.completed .step-icon{background:#ffffff4d;color:#fff}.step.current .step-icon{background:#fff;border:2px solid #009BA4;color:#009ba4}.dark .step.current .step-icon{background:#004d4f;border-color:#009ba4;color:#e6f9fa}.step.locked .step-icon{background:transparent;color:silver;font-size:14px}.dark .step.locked .step-icon{color:#64748b}.step-title{font-size:15px;font-weight:500;white-space:nowrap}.step.completed .step-title{color:#fff}.step.current .step-title{color:#00aab4;font-weight:600}.dark .step.current .step-title{color:#e6f9fa}.step.locked .step-title{color:#b0b0b0}.dark .step.locked .step-title{color:#64748b}@media(max-width:1024px){.step-title{font-size:13px}.step{padding:0 15px 0 25px;min-width:150px;max-width:170px}}@media(max-width:768px){.progress-wrapper{flex-direction:column;height:auto;width:100%;max-width:400px}.step{clip-path:none;padding:15px 20px;border-bottom:1px solid #d0e8e4;min-width:auto;max-width:none}.step:first-child,.step:last-child{clip-path:none}.step:last-child{border-bottom:none}}