/* ══════════════════════════════════════════════════════════════════
   Zentrale Farbpalette & gemeinsame UI-Bausteine (Filter-Chips, etc.)
   Einzige Stelle zum Ändern von Farben — bitte keine Duplikate in
   Component-CSS-Dateien anlegen, stattdessen diese Variablen/Klassen
   referenzieren.
   ══════════════════════════════════════════════════════════════════ */

:root {
    /* ── CRM-Entitätsklassen (Pastell) ── */
    --crm-email-bg: #dbeafe;      --crm-email-fg: #1d4ed8;
    --crm-case-bg: #ede9fe;       --crm-case-fg: #6d28d9;
    --crm-call-bg: #dcfce7;       --crm-call-fg: #15803d;
    --crm-calendar-bg: #fce7f3;   --crm-calendar-fg: #be185d;
    --crm-attachment-bg: #f1f5f9; --crm-attachment-fg: #475569;
    --crm-jira-bg: #e0f2fe;       --crm-jira-fg: #0369a1;
    --crm-note-bg: #fef3c7;       --crm-note-fg: #b45309;
    --crm-task-bg: #ffe4e6;       --crm-task-fg: #be123c;
    --crm-adresse-bg: #e0e7ff;    --crm-adresse-fg: #4338ca;
    --crm-ansprechpartner-bg: #ccfbf1; --crm-ansprechpartner-fg: #0f766e;

    /* ── CaseType (kräftig) ── */
    --casetype-support: #3b82f6;
    --casetype-sales: #16a34a;
    --casetype-technical: #8b5cf6;
    --casetype-accounting: #f59e0b;
    --casetype-internal: #64748b;
    --casetype-other: #ec4899;

    /* ── CaseStatus (bestehende st-* Farben, zentralisiert) ── */
    --casestatus-new: #3b82f6;
    --casestatus-progress: #f59e0b;
    --casestatus-waiting: #a855f7;
    --casestatus-hold: #94a3b8;
    --casestatus-closed: #16a34a;
    --casestatus-rejected: #dc2626;
}

/* ── Gemeinsame Filterzeilen-Bausteine (Email, Cases, ...) ── */
.filter-bar {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    padding: 0 0 0.6rem 0;
    flex-shrink: 0;
}

.filter-label {
    font-size: 0.78rem;
    font-weight: 700;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-right: 4px;
}

.btn-filter {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1.5px solid #dee2e6;
    background: #fff;
    border-radius: 20px;
    padding: 4px 14px;
    font-size: 0.82rem;
    cursor: pointer;
    color: #6c757d;
    transition: border-color .15s, background .15s, color .15s;
}
.btn-filter:hover  { border-color: #adb5bd; color: #212529; }
.btn-filter.active { background: #212529; border-color: #212529; color: #fff; font-weight: 600; }

/* ── Gemeinsame Suchleisten-Bausteine (Email, Cases, Calls, Adressen, ...) ── */
.search-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1.5px solid #dee2e6;
    border-radius: 8px;
    padding: 7px 13px;
    min-width: 400px;
    transition: border-color .2s, box-shadow .2s;
}
.search-bar.focused {
    border-color: #4c8dff;
    box-shadow: 0 0 0 3px rgba(76,141,255,.15);
}
.search-icon { color: #adb5bd; flex-shrink: 0; }
.search-input {
    border: none;
    outline: none;
    background: transparent;
    flex: 1;
    font-size: 0.88rem;
    color: #212529;
    min-width: 0;
}
.btn-search-clear {
    background: none;
    border: none;
    cursor: pointer;
    color: #adb5bd;
    padding: 0;
    display: flex;
    align-items: center;
    transition: color .15s;
}
.btn-search-clear:hover { color: #6c757d; }