:root {
    --pico-font-size: 100%;
    --pico-nav-breadcrumb-divider: "/";
}

/* Screen vertical center */
.vertical-center {
    place-items: center;
    height: 100vh;
}

/* Status badges */
.badge {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    border-radius: var(--pico-border-radius);
    font-size: 0.875rem;
    font-weight: bold;
}

.badge-pending {
    color: var(--pico-muted-color);
}

.badge-processing {
    background-color: var(--pico-primary);
    color: var(--pico-primary-inverse);
}

.badge-completed {
    background-color: var(--pico-ins-color);
    color: white;
}

.badge-failed {
    background-color: var(--pico-del-color);
    color: white;
}

/* Progress bar */
.progress {
    display: flex;
    height: 1.5rem;
    overflow: hidden;
    background-color: var(--pico-secondary-background);
    border-radius: var(--pico-border-radius);
}

.progress-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 0.875rem;
    font-weight: bold;
    transition: width 0.3s ease;
}

.progress-bar-success {
    background-color: var(--pico-ins-color);
}

.progress-bar-danger {
    background-color: var(--pico-del-color);
}

/* Muted text */
.muted {
    color: var(--pico-muted-color);
    font-style: italic;
}