/* ========================================
   STATUS BADGE COMPONENT
   ======================================== */

.status-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    line-height: 1;
}

.status-badge i {
    font-size: 0.85em;
}

/* Size Variants */
.status-badge-small {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

/* Status Colors - SchoolGids */
.status-badge-published {
    background: var(--color-success-border);
    color: var(--color-success);
}

.status-badge-generating {
    background: var(--color-warning-light);
    color: #b45309;
}

.status-badge-draft {
    background: var(--color-bg-tertiary);
    color: var(--color-text-muted);
}

/* Status Colors - Chapter */
.status-badge-completed {
    background: var(--color-success-border);
    color: var(--color-success);
}

.status-badge-waiting {
    background: var(--color-bg-tertiary);
    color: var(--color-text-muted);
}

.status-badge-review_required {
    background: var(--color-brand-primary-light);
    color: var(--color-brand-primary);
}

/* Status Colors - Approval Workflow */
.status-badge-goedgekeurd {
    background: var(--color-success-border);
    color: var(--color-success);
}

.status-badge-ter_goedkeuring {
    background: var(--color-warning-light);
    color: #b45309;
}

.status-badge-wijziging_nodig {
    background: var(--color-error-light);
    color: var(--color-error);
}

.status-badge-concept {
    background: var(--color-bg-tertiary);
    color: var(--color-text-muted);
}

/* Minimal variant (when used in compact contexts like section headers) */
.sidebar-section-header .status-badge {
    background: transparent;
    padding: 0;
    gap: 4px;
    font-size: var(--font-size-xs);
}

.sidebar-section-header .status-badge i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    font-size: 0;
    flex-shrink: 0;
}

.sidebar-section-header .status-badge-published i {
    background-color: var(--color-success);
}

.sidebar-section-header .status-badge-generating i {
    background-color: var(--color-warning);
}

.sidebar-section-header .status-badge-draft i {
    background-color: var(--color-text-muted);
}

.sidebar-section-header .status-badge-published {
    color: var(--color-success);
}

.sidebar-section-header .status-badge-generating {
    color: var(--color-warning);
}

.sidebar-section-header .status-badge-draft {
    color: var(--color-text-muted);
}