/* /app/static/significantstories_com/css/reading-progress.css */
/* Reusable reading progress indicator styles */

.reading-progress-indicator {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    width: 44px;
    height: 44px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 100;
    pointer-events: none;
}

.reading-progress-indicator.visible {
    opacity: 0.6 !important;
    visibility: visible !important;
}

.reading-progress-indicator.complete {
    opacity: 0 !important;
    visibility: hidden !important;
}

.reading-progress-indicator svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.reading-progress-indicator .progress-bg {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 3;
}

.reading-progress-indicator .progress-ring {
    fill: none;
    stroke: #8b7355;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-dasharray: 100.53;
    stroke-dashoffset: 100.53;
    transition: stroke-dashoffset 0.1s ease;
}

/* Desktop: position just outside the right edge of content area */
@media (min-width: 900px) {
    .reading-progress-indicator {
        right: calc(50% - 350px - 120px); /* Based on 700px content width */
    }
}