﻿/* Container */
.loader-container {
    width: 100%;
    height: 10px;
    background-color: rgba(255, 33, 89, 0.4);
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    margin-top: 40px;
}

/* Moving bar */
.loader-bar {
    width: 40%; /* bar width */
    height: 100%;
    background-color: #FF2159 !important;
    position: absolute;
    animation: slide 2s linear infinite; /* linear + infinite */
}

/* Left-to-right infinite loop */
@keyframes slide {
    0% {
        left: -40%; /* start outside the left */
    }

    100% {
        left: 100%; /* move fully to the right */
    }
}

.page-center {
    display: flex;
    justify-content: center; /* horizontal center */
    align-items: center; /* vertical center */
    height: 100vh; /* use viewport height */
    background-image: url('../images/background-blur-overlay.png'); /* your image path */
    background-size: cover; /* make it fill the page */
    background-position: center; /* center the image */
    background-repeat: no-repeat;
    overflow: hidden;
}