.ffleet-alerts {
    --fa-ink: #0f172a;
    --fa-muted: #64748b;
    --fa-panel: #ffffff;
    --fa-border: #e2e8f0;
    --fa-accent: #b45309;
    --fa-accent-soft: #fff7ed;
    --fa-row-border: #f1f5f9;
    border: 1px solid var(--fa-border);
    border-radius: 0.9rem;
    background: var(--fa-panel);
    color: var(--fa-ink);
    overflow: hidden;
}

.dark .ffleet-alerts,
.fi-body.fi-panel-admin.fi-dark .ffleet-alerts,
html.dark .ffleet-alerts {
    --fa-ink: #f8fafc;
    --fa-muted: #94a3b8;
    --fa-panel: #1e293b;
    --fa-border: rgb(148 163 184 / 0.25);
    --fa-accent: #fbbf24;
    --fa-accent-soft: rgb(245 158 11 / 0.12);
    --fa-row-border: rgb(148 163 184 / 0.15);
}

.fa-header {
    padding: 1rem 1.25rem 0.85rem;
    border-bottom: 1px solid var(--fa-border);
}

.fa-header h2 {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--fa-ink);
}

.fa-header p {
    margin: 0.3rem 0 0;
    font-size: 0.875rem;
    color: var(--fa-muted);
}

.fa-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    padding: 1rem 1.25rem 1.25rem;
}

@media (min-width: 768px) {
    .fa-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.fa-col h3 {
    margin: 0 0 0.65rem;
    padding: 0.35rem 0.55rem;
    border-radius: 0.45rem;
    background: var(--fa-accent-soft);
    color: var(--fa-accent);
    font-size: 0.8rem;
    font-weight: 700;
}

.fa-item {
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--fa-row-border);
    font-size: 0.875rem;
}

.fa-item:last-child {
    border-bottom: 0;
}

.fa-item-title {
    font-weight: 600;
    color: var(--fa-ink);
}

.fa-item-meta {
    margin-top: 0.15rem;
    color: var(--fa-muted);
    font-size: 0.8125rem;
}

.fa-empty {
    margin: 0;
    font-size: 0.875rem;
    color: var(--fa-muted);
}
