/* Circular Progress Bar Component Styles */

.circular-progress-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
}

.circular-progress {
    position: absolute;
    top: 0;
    left: 0;
    transform: rotate(-90deg);
}

.circular-progress-track {
    stroke: rgba(0, 0, 0, 0.1);
    fill: none;
}

.circular-progress-fill {
    fill: none;
    stroke-linecap: round;
    transition: stroke-dashoffset 0.3s ease;
}

/* Category colors for circular progress fill */
.circular-progress-fill[data-category="excellent"] {
    stroke: #4caf50;
}

.circular-progress-fill[data-category="good"] {
    stroke: #8bc34a;
}

.circular-progress-fill[data-category="forgettable"] {
    stroke: #ffc107;
}

.circular-progress-fill[data-category="marginal"] {
    stroke: #ff9800;
}

.circular-progress-fill[data-category="poor"] {
    stroke: #f44336;
}

.circular-progress-fill[data-category="none"] {
    stroke: #9e9e9e;
}

.circular-progress-content {
    position: relative;
    z-index: 1;
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Category colors for content text */
.circular-progress-content[data-category="excellent"] {
    color: #4caf50;
}

.circular-progress-content[data-category="good"] {
    color: #8bc34a;
}

.circular-progress-content[data-category="forgettable"] {
    color: #ffc107;
}

.circular-progress-content[data-category="marginal"] {
    color: #ff9800;
}

.circular-progress-content[data-category="poor"] {
    color: #f44336;
}

.circular-progress-content[data-category="none"] {
    color: #9e9e9e;
}