/* Sayfa Yükleme Progress Bar */

.page-progress {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 999999 !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    background: transparent !important;
}

.page-progress-bar {
    height: 4px !important;
    width: 100% !important;
    background: rgba(0,0,0,0.1) !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    overflow: hidden !important;
}

.page-progress-bar::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    height: 100% !important;
    width: var(--progress-width, 0%) !important;
    background: #000000 !important;
    transition: width 0.2s linear !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.5) !important;
}

.progress-percent {
    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    font-family: 'Inter', Arial, sans-serif !important;
    margin-top: 25px !important;
    z-index: 999999 !important;
    white-space: nowrap !important;
    letter-spacing: 0.5px !important;
    line-height: 1.2 !important;
    padding: 0 !important;
    text-align: center !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    background: transparent !important;
    border-radius: 0 !important;
    width: auto !important;
    height: auto !important;
    box-shadow: none !important;
    border: none !important;
}

.page-progress-bar.loading {
    animation: progressPulse 1.5s ease-in-out infinite;
}

@keyframes progressPulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

.page-progress-bar.complete {
    width: 100% !important;
    opacity: 0;
    transition: opacity 0.5s ease 0.3s;
}

/* Farklı renk seçenekleri */
.page-progress-bar.gradient {
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
}

.page-progress-bar.accent {
    background: #000;
}