/* 
   style.css 
   Custom styles untuk hal-hal yang kurang praktis di-handle murni via Tailwind utility classes,
   misalnya keyframes yang spesifik atau pattern background.
*/

/* Custom utility for progress bar stripes animation */
.progress-stripe {
    background-image: linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.15) 50%,
        rgba(255, 255, 255, 0.15) 75%,
        transparent 75%,
        transparent
    );
    background-size: 1rem 1rem;
    animation: progress-stripes 1s linear infinite;
}

@keyframes progress-stripes {
    from {
        background-position: 1rem 0;
    }
    to {
        background-position: 0 0;
    }
}

/* Memperbaiki posisi scroll saat klik anchor links (smooth scroll)
   Agar bagian atas seksi tidak tertutup oleh navbar yang fixed */
html {
    scroll-padding-top: 5rem; /* Menyesuaikan tinggi header/navbar */
}

/* Optional: styling scrollbar agar terlihat lebih modern di browser webkit */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f5f9; /* bg-slate-100 */
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1; /* bg-slate-300 */
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8; /* bg-slate-400 */
}