/* /Components/Customer/EditCustomerDialog.razor.rz.scp.css */
/* =========================================
   Grundlayout und Farben
   ========================================= */

.customer-edit-backdrop[b-hmwnoxfapj] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(15, 23, 42, 0.48);
    backdrop-filter: blur(3px);
    animation: customer-backdrop-in-b-hmwnoxfapj 0.18s ease-out;
}

.customer-edit-panel[b-hmwnoxfapj] {
    --customer-edit-border: #e5e7eb;
    --customer-edit-text: #1f2937;
    --customer-edit-muted: #6b7280;
    --customer-edit-surface: #ffffff;
    --customer-edit-input: #ffffff;
    --customer-edit-primary: #6366f1;
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 1050;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(620px, 100%);
    height: 100vh;
    height: 100dvh;
    max-height: 100dvh;
    color: var(--customer-edit-text);
    background: var(--customer-edit-surface);
    box-shadow: -12px 0 40px rgba(0, 0, 0, 0.14);
    overflow: hidden;
    animation: customer-panel-in-b-hmwnoxfapj 0.22s ease-out;
}

/* =========================================
   Header
   ========================================= */

.customer-edit-header[b-hmwnoxfapj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background: var(--customer-edit-surface);
    border-bottom: 1px solid var(--customer-edit-border);
}

.customer-edit-heading[b-hmwnoxfapj] {
    min-width: 0;
}

.customer-edit-eyebrow[b-hmwnoxfapj] {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--customer-edit-primary);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.09em;
}

.customer-edit-heading h4[b-hmwnoxfapj] {
    margin: 0;
    color: var(--customer-edit-text);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.35;
}

.customer-edit-heading p[b-hmwnoxfapj] {
    margin: 0.35rem 0 0;
    color: var(--customer-edit-muted);
    font-size: 0.85rem;
    line-height: 1.5;
}

.customer-edit-close[b-hmwnoxfapj] {
    display: grid;
    flex-shrink: 0;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    color: var(--customer-edit-muted);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

    .customer-edit-close i[b-hmwnoxfapj] {
        font-size: 1.3rem;
    }

    .customer-edit-close:hover:not(:disabled)[b-hmwnoxfapj] {
        color: var(--customer-edit-text);
        background: rgba(107, 114, 128, 0.1);
    }

    .customer-edit-close:disabled[b-hmwnoxfapj] {
        cursor: not-allowed;
        opacity: 0.5;
    }

/* =========================================
   Formular und Scrollbereich
   ========================================= */

.customer-edit-panel[b-hmwnoxfapj]  .customer-edit-form {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
    overflow: hidden;
}

.customer-edit-body[b-hmwnoxfapj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    padding: 1.25rem 1.5rem;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

/* =========================================
   Fehlermeldung
   ========================================= */

.customer-edit-error[b-hmwnoxfapj] {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.85rem 1rem;
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 10px;
    font-size: 0.85rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

    .customer-edit-error i[b-hmwnoxfapj] {
        flex-shrink: 0;
        margin-top: 0.1rem;
        font-size: 1.1rem;
    }

/* =========================================
   Abschnitte
   ========================================= */

.customer-edit-section[b-hmwnoxfapj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    padding: 1rem;
    background: var(--customer-edit-surface);
    border: 1px solid var(--customer-edit-border);
    border-radius: 12px;
}

.customer-edit-section-heading[b-hmwnoxfapj] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--customer-edit-border);
}

    .customer-edit-section-heading > div:last-child[b-hmwnoxfapj] {
        min-width: 0;
    }

    .customer-edit-section-heading h5[b-hmwnoxfapj] {
        margin: 0;
        color: var(--customer-edit-text);
        font-size: 0.92rem;
        font-weight: 700;
        line-height: 1.4;
    }

    .customer-edit-section-heading p[b-hmwnoxfapj] {
        margin: 0.2rem 0 0;
        color: var(--customer-edit-muted);
        font-size: 0.78rem;
        line-height: 1.4;
    }

/* Abschnittsicons */

.customer-edit-section-icon[b-hmwnoxfapj] {
    display: grid;
    flex-shrink: 0;
    place-items: center;
    width: 38px;
    height: 38px;
    color: #6366f1;
    background: #eef2ff;
    border-radius: 10px;
}

    .customer-edit-section-icon i[b-hmwnoxfapj] {
        font-size: 1.2rem;
    }

    .customer-edit-section-icon.address-icon[b-hmwnoxfapj] {
        color: #0284c7;
        background: #e0f2fe;
    }

    .customer-edit-section-icon.contact-icon[b-hmwnoxfapj] {
        color: #0d9488;
        background: #ccfbf1;
    }

    .customer-edit-section-icon.notes-icon[b-hmwnoxfapj] {
        color: #b45309;
        background: #fef3c7;
    }

/* Karten innerhalb der Abschnitte */

.customer-edit-card[b-hmwnoxfapj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

/* =========================================
   Formularfelder
   ========================================= */

.customer-edit-field[b-hmwnoxfapj] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
}

    .customer-edit-field label[b-hmwnoxfapj] {
        color: var(--customer-edit-text);
        font-size: 0.81rem;
        font-weight: 600;
        line-height: 1.4;
    }

    .customer-edit-field .required[b-hmwnoxfapj],
    .customer-edit-required-note .required[b-hmwnoxfapj] {
        color: #dc2626;
        font-weight: 700;
    }

    .customer-edit-field input[b-hmwnoxfapj],
    .customer-edit-field textarea[b-hmwnoxfapj],
    .customer-edit-field select[b-hmwnoxfapj] {
        display: block;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        padding: 0.65rem 0.75rem;
        color: var(--customer-edit-text);
        background: var(--customer-edit-input);
        border: 1px solid var(--customer-edit-border);
        border-radius: 8px;
        font-family: inherit;
        font-size: 0.85rem;
        line-height: 1.5;
        transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    }

    .customer-edit-field input[b-hmwnoxfapj],
    .customer-edit-field select[b-hmwnoxfapj] {
        min-height: 40px;
    }

    .customer-edit-field textarea[b-hmwnoxfapj] {
        min-height: 110px;
        resize: vertical;
    }

        .customer-edit-field input[b-hmwnoxfapj]::placeholder,
        .customer-edit-field textarea[b-hmwnoxfapj]::placeholder {
            color: #9ca3af;
            opacity: 1;
        }

        .customer-edit-field input:focus[b-hmwnoxfapj],
        .customer-edit-field textarea:focus[b-hmwnoxfapj],
        .customer-edit-field select:focus[b-hmwnoxfapj] {
            outline: none;
            border-color: var(--customer-edit-primary);
            box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.13);
        }

        .customer-edit-field input:disabled[b-hmwnoxfapj],
        .customer-edit-field textarea:disabled[b-hmwnoxfapj],
        .customer-edit-field select:disabled[b-hmwnoxfapj] {
            cursor: not-allowed;
            opacity: 0.6;
        }

    .customer-edit-field .validation-message[b-hmwnoxfapj] {
        color: #dc2626;
        font-size: 0.76rem;
        line-height: 1.4;
    }

    .customer-edit-field .invalid[b-hmwnoxfapj] {
        border-color: #dc2626;
    }

    .customer-edit-field .valid.modified:not([type="checkbox"])[b-hmwnoxfapj] {
        border-color: #16a34a;
    }

/* Adresse: Postleitzahl und Ort */

.customer-edit-address-row[b-hmwnoxfapj] {
    display: grid;
    grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.5fr);
    gap: 0.85rem;
    min-width: 0;
}

/* Pflichtfeldhinweis */

.customer-edit-required-note[b-hmwnoxfapj] {
    margin: 0;
    color: var(--customer-edit-muted);
    font-size: 0.76rem;
}

/* =========================================
   Footer
   ========================================= */

.customer-edit-panel .customer-edit-footer[b-hmwnoxfapj] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: 0;
    padding: 0.75rem 1.5rem;
    background: var(--customer-edit-surface);
    border-top: 1px solid var(--customer-edit-border);
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.025);
}

.customer-edit-footer-actions[b-hmwnoxfapj] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    min-width: 0;
}

/* Hauptfooter: gemeinsame Buttonregeln */

.customer-edit-panel .customer-edit-footer button[b-hmwnoxfapj] {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: 36px;
    box-sizing: border-box;
    padding: 0.5rem 0.85rem;
    border: 1px solid transparent;
    border-radius: 7px;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

    .customer-edit-panel .customer-edit-footer button i[b-hmwnoxfapj] {
        font-size: 1rem;
    }

    .customer-edit-panel .customer-edit-footer button:disabled[b-hmwnoxfapj] {
        cursor: not-allowed;
        opacity: 0.55;
    }

    /* Löschen */

    .customer-edit-panel .customer-edit-footer button.customer-edit-delete[b-hmwnoxfapj] {
        color: #dc2626;
        background: transparent;
        border-color: #fecaca;
    }

        .customer-edit-panel .customer-edit-footer button.customer-edit-delete:hover:not(:disabled)[b-hmwnoxfapj] {
            color: #b91c1c;
            background: #fef2f2;
            border-color: #fca5a5;
        }

    /* Abbrechen */

    .customer-edit-panel .customer-edit-footer button.customer-edit-cancel[b-hmwnoxfapj] {
        color: var(--customer-edit-text);
        background: var(--customer-edit-surface);
        border-color: var(--customer-edit-border);
    }

        .customer-edit-panel .customer-edit-footer button.customer-edit-cancel:hover:not(:disabled)[b-hmwnoxfapj] {
            background: rgba(107, 114, 128, 0.09);
        }

    /* Speichern */

    .customer-edit-panel .customer-edit-footer button.customer-edit-save[b-hmwnoxfapj] {
        color: #ffffff !important;
        background: #dc2626 !important;
        border-color: #dc2626 !important;
        border-radius: 7px !important;
    }

        .customer-edit-panel .customer-edit-footer button.customer-edit-save:hover:not(:disabled)[b-hmwnoxfapj] {
            color: #ffffff !important;
            background: #b91c1c !important;
            border-color: #b91c1c !important;
        }

        .customer-edit-panel .customer-edit-footer button.customer-edit-save:disabled[b-hmwnoxfapj] {
            color: #ffffff !important;
            background: #dc2626 !important;
            border-color: #dc2626 !important;
            opacity: 0.55;
        }

/* =========================================
   Löschdialog
   ========================================= */

.customer-delete-backdrop[b-hmwnoxfapj] {
    position: fixed;
    inset: 0;
    z-index: 1060;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 1rem;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    animation: customer-backdrop-in-b-hmwnoxfapj 0.18s ease-out;
}

.customer-delete-dialog[b-hmwnoxfapj] {
    --customer-delete-border: #e5e7eb;
    --customer-delete-text: #1f2937;
    --customer-delete-muted: #6b7280;
    --customer-delete-surface: #ffffff;
    width: min(100%, 400px);
    max-height: calc(100dvh - 2rem);
    box-sizing: border-box;
    padding: 1.5rem;
    color: var(--customer-delete-text);
    background: var(--customer-delete-surface);
    border: 1px solid var(--customer-delete-border);
    border-radius: 16px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22);
    overflow-y: auto;
    animation: customer-dialog-in-b-hmwnoxfapj 0.18s ease-out;
}

    .customer-delete-dialog .customer-delete-icon[b-hmwnoxfapj] {
        display: grid;
        place-items: center;
        width: 46px;
        height: 46px;
        margin-bottom: 1rem;
        color: #dc2626;
        background: #fef2f2;
        border: 1px solid #fecaca;
        border-radius: 12px;
    }

        .customer-delete-dialog .customer-delete-icon i[b-hmwnoxfapj] {
            font-size: 1.4rem;
        }

    .customer-delete-dialog h3[b-hmwnoxfapj] {
        margin: 0 0 0.65rem;
        color: var(--customer-delete-text);
        font-size: 1.15rem;
        font-weight: 700;
        line-height: 1.4;
    }

    .customer-delete-dialog p[b-hmwnoxfapj] {
        margin: 0;
        color: var(--customer-delete-muted);
        font-size: 0.875rem;
        line-height: 1.65;
        overflow-wrap: anywhere;
    }

        .customer-delete-dialog p strong[b-hmwnoxfapj] {
            color: var(--customer-delete-text);
            font-weight: 700;
        }

    .customer-delete-dialog .customer-delete-actions[b-hmwnoxfapj] {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 0.5rem;
        margin-top: 1.4rem;
        padding-top: 1rem;
        border-top: 1px solid var(--customer-delete-border);
    }

        .customer-delete-dialog .customer-delete-actions button[b-hmwnoxfapj] {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.4rem;
            min-height: 36px;
            box-sizing: border-box;
            padding: 0.5rem 0.85rem;
            border: 1px solid transparent;
            border-radius: 7px;
            font-family: inherit;
            font-size: 0.82rem;
            font-weight: 600;
            line-height: 1.2;
            white-space: nowrap;
            cursor: pointer;
            box-shadow: none;
            transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
        }

            .customer-delete-dialog .customer-delete-actions button i[b-hmwnoxfapj] {
                font-size: 1rem;
            }

            .customer-delete-dialog .customer-delete-actions button:disabled[b-hmwnoxfapj] {
                cursor: not-allowed;
                opacity: 0.55;
            }

            .customer-delete-dialog .customer-delete-actions button.customer-edit-cancel[b-hmwnoxfapj] {
                color: var(--customer-delete-text);
                background: var(--customer-delete-surface);
                border-color: var(--customer-delete-border);
            }

                .customer-delete-dialog .customer-delete-actions button.customer-edit-cancel:hover:not(:disabled)[b-hmwnoxfapj] {
                    background: rgba(107, 114, 128, 0.09);
                }

            .customer-delete-dialog .customer-delete-actions button.customer-delete-confirm[b-hmwnoxfapj] {
                color: #ffffff;
                background: #dc2626;
                border-color: #dc2626;
            }

                .customer-delete-dialog .customer-delete-actions button.customer-delete-confirm:hover:not(:disabled)[b-hmwnoxfapj] {
                    background: #b91c1c;
                    border-color: #b91c1c;
                }

/* =========================================
   Darkmode
   ========================================= */

:is(.dark, .dark-mode, [data-theme="dark"], [data-bs-theme="dark"]) .customer-edit-panel[b-hmwnoxfapj] {
    --customer-edit-border: #383640;
    --customer-edit-text: #f3f4f6;
    --customer-edit-muted: #a1a1aa;
    --customer-edit-surface: #242129;
    --customer-edit-input: #1c191f;
    --customer-edit-primary: #a78bfa;
}

:is(.dark, .dark-mode, [data-theme="dark"], [data-bs-theme="dark"]) .customer-delete-dialog[b-hmwnoxfapj] {
    --customer-delete-border: #383640;
    --customer-delete-text: #f3f4f6;
    --customer-delete-muted: #a1a1aa;
    --customer-delete-surface: #242129;
}

    :is(.dark, .dark-mode, [data-theme="dark"], [data-bs-theme="dark"]) .customer-delete-dialog .customer-delete-icon[b-hmwnoxfapj] {
        color: #f87171;
        background: rgba(127, 29, 29, 0.25);
        border-color: #7f1d1d;
    }

    :is(.dark, .dark-mode, [data-theme="dark"], [data-bs-theme="dark"]) .customer-delete-dialog .customer-delete-actions[b-hmwnoxfapj] {
        border-top-color: #383640;
    }

        :is(.dark, .dark-mode, [data-theme="dark"], [data-bs-theme="dark"]) .customer-delete-dialog .customer-delete-actions button.customer-edit-cancel[b-hmwnoxfapj] {
            color: #f3f4f6;
            background: #242129;
            border-color: #383640;
        }

            :is(.dark, .dark-mode, [data-theme="dark"], [data-bs-theme="dark"]) .customer-delete-dialog .customer-delete-actions button.customer-edit-cancel:hover:not(:disabled)[b-hmwnoxfapj] {
                background: #383640;
            }

:is(.dark, .dark-mode, [data-theme="dark"], [data-bs-theme="dark"]) .customer-edit-error[b-hmwnoxfapj] {
    color: #fecaca;
    background: rgba(127, 29, 29, 0.2);
    border-color: #7f1d1d;
}

/* =========================================
   Animationen
   ========================================= */

@keyframes customer-backdrop-in-b-hmwnoxfapj {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes customer-panel-in-b-hmwnoxfapj {
    from {
        opacity: 0;
        transform: translateX(24px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes customer-dialog-in-b-hmwnoxfapj {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* =========================================
   Responsive Layout
   ========================================= */

@media (max-width: 600px) {
    .customer-edit-panel[b-hmwnoxfapj] {
        width: 100%;
    }

    .customer-edit-header[b-hmwnoxfapj] {
        padding: 1rem;
    }

    .customer-edit-body[b-hmwnoxfapj] {
        gap: 0.85rem;
        padding: 1rem;
    }

    .customer-edit-section[b-hmwnoxfapj] {
        gap: 0.85rem;
        padding: 0.85rem;
    }

    .customer-edit-panel .customer-edit-footer[b-hmwnoxfapj] {
        gap: 0.5rem;
        padding: 0.65rem 0.85rem;
    }

        .customer-edit-panel .customer-edit-footer button[b-hmwnoxfapj] {
            min-height: 34px;
            padding: 0.45rem 0.6rem;
            font-size: 0.78rem;
        }

    .customer-edit-footer-actions[b-hmwnoxfapj] {
        gap: 0.35rem;
    }

    .customer-delete-dialog[b-hmwnoxfapj] {
        padding: 1.25rem;
    }
}

@media (max-width: 400px) {
    .customer-edit-panel .customer-edit-footer[b-hmwnoxfapj] {
        gap: 0.35rem;
        padding: 0.6rem;
    }

        .customer-edit-panel .customer-edit-footer button[b-hmwnoxfapj] {
            padding: 0.45rem;
            font-size: 0.75rem;
        }

    .customer-edit-footer-actions[b-hmwnoxfapj] {
        gap: 0.3rem;
    }

    .customer-edit-address-row[b-hmwnoxfapj] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.85rem;
    }

    .customer-delete-dialog .customer-delete-actions[b-hmwnoxfapj] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

        .customer-delete-dialog .customer-delete-actions button[b-hmwnoxfapj] {
            width: 100%;
        }
}

/* =========================================
   Barrierefreiheit
   ========================================= */

@media (prefers-reduced-motion: reduce) {
    .customer-edit-panel[b-hmwnoxfapj],
    .customer-edit-backdrop[b-hmwnoxfapj],
    .customer-delete-backdrop[b-hmwnoxfapj],
    .customer-delete-dialog[b-hmwnoxfapj] {
        animation: none;
    }

        .customer-edit-panel *[b-hmwnoxfapj],
        .customer-delete-dialog *[b-hmwnoxfapj] {
            transition: none !important;
        }
}

.customer-edit-name-full[b-hmwnoxfapj] {
    grid-column: 1 / -1;
    width: 100%;
}
/* /Components/Process/ConversationNotePanel.razor.rz.scp.css */
/* =========================================
   Theme, Farben und Panels
   ========================================= */
.process-details-panel[b-czyfoy2v9y],
.conversation-note-panel[b-czyfoy2v9y] {
    --process-bg: #1c191f;
    --process-card-bg: #242129;
    --process-hover-bg: #302b35;
    --process-border: #39343d;
    --process-text: #ffffff;
    --process-muted: #b8b2bf;
    --process-primary: #d53528;
    --process-primary-hover: #bd2d22;
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    display: flex !important;
    flex-direction: column !important;
    width: min(540px, 100vw) !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh;
    min-height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    color: var(--process-text) !important;
    background: var(--process-bg) !important;
    border-left: 1px solid var(--process-border);
    box-shadow: -12px 0 40px rgba(0, 0, 0, 0.35);
    transform: none !important;
    animation: none !important;
}

/* =========================================
   Backdrops
   ========================================= */

.process-details-backdrop[b-czyfoy2v9y],
.conversation-note-backdrop[b-czyfoy2v9y] {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.68);
    backdrop-filter: blur(3px);
}

.process-details-backdrop[b-czyfoy2v9y] {
    z-index: 1040 !important;
}

.conversation-note-backdrop[b-czyfoy2v9y] {
    z-index: 1060 !important;
}

/* =========================================
   Panel-Ebenen
   ========================================= */

.process-details-panel[b-czyfoy2v9y] {
    z-index: 1050 !important;
}

.conversation-note-panel[b-czyfoy2v9y] {
    z-index: 1070 !important;
}

/* =========================================
   Header
   ========================================= */

.process-details-header[b-czyfoy2v9y],
.conversation-note-header[b-czyfoy2v9y] {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 28px;
    border-bottom: 1px solid var(--process-border);
    background: var(--process-bg) !important;
    color: var(--process-text) !important;
}

.process-details-heading[b-czyfoy2v9y] {
    min-width: 0;
}

    .process-details-heading h4[b-czyfoy2v9y],
    .conversation-note-header h4[b-czyfoy2v9y] {
        margin: 5px 0 8px;
        color: var(--process-text) !important;
        font-size: 1.35rem;
        font-weight: 700;
        letter-spacing: -0.035em;
    }

    .process-details-heading p[b-czyfoy2v9y],
    .conversation-note-header p[b-czyfoy2v9y] {
        margin: 0;
        color: var(--process-muted) !important;
        font-size: 0.9rem;
    }

.process-details-eyebrow[b-czyfoy2v9y],
.conversation-note-eyebrow[b-czyfoy2v9y] {
    color: var(--process-primary) !important;
    font-size: 0.68rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.process-details-close[b-czyfoy2v9y] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--process-border);
    border-radius: 11px;
    background: var(--process-card-bg) !important;
    color: var(--process-text) !important;
    font-size: 1.35rem;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease;
}

    .process-details-close:hover:not(:disabled)[b-czyfoy2v9y] {
        background: var(--process-hover-bg) !important;
        color: #ffffff !important;
    }

    .process-details-close:disabled[b-czyfoy2v9y] {
        cursor: not-allowed;
        opacity: 0.5;
    }

/* =========================================
   Content
   ========================================= */

.process-details-body[b-czyfoy2v9y],
.conversation-note-body[b-czyfoy2v9y] {
    flex: 1 1 auto !important;
    min-width: 0;
    min-height: 0 !important;
    padding: 26px 28px 32px;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    background: var(--process-bg) !important;
    color: var(--process-text) !important;
}

.process-details-section + .process-details-section[b-czyfoy2v9y] {
    margin-top: 30px;
}

.process-details-section-heading[b-czyfoy2v9y] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

    .process-details-section-heading h5[b-czyfoy2v9y] {
        margin: 0 0 3px;
        color: var(--process-text) !important;
        font-size: 0.98rem;
        font-weight: 700;
    }

    .process-details-section-heading p[b-czyfoy2v9y] {
        margin: 0;
        color: var(--process-muted) !important;
        font-size: 0.79rem;
    }

/* =========================================
   Section icons
   ========================================= */

.process-details-icon[b-czyfoy2v9y] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    font-size: 1.25rem;
}

.customer-icon[b-czyfoy2v9y] {
    background: rgba(83, 111, 237, 0.18);
    color: #8da2ff !important;
}

.processing-icon[b-czyfoy2v9y] {
    background: rgba(13, 148, 136, 0.18);
    color: #5ee0d2 !important;
}

.appointment-icon[b-czyfoy2v9y] {
    background: rgba(217, 119, 6, 0.18);
    color: #ffc46b !important;
}

.note-icon[b-czyfoy2v9y] {
    background: rgba(124, 88, 214, 0.2);
    color: #bba5ff !important;
}

/* =========================================
   Cards und Felder
   ========================================= */

.process-details-card[b-czyfoy2v9y],
.process-details-note-card[b-czyfoy2v9y] {
    overflow: hidden;
    border: 1px solid var(--process-border) !important;
    border-radius: 14px;
    background: var(--process-card-bg) !important;
    color: var(--process-text) !important;
}

.process-details-field[b-czyfoy2v9y] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 58px;
    padding: 15px 17px;
}

    .process-details-field + .process-details-field[b-czyfoy2v9y] {
        border-top: 1px solid var(--process-border);
    }

    .process-details-field > span:first-child[b-czyfoy2v9y] {
        color: var(--process-muted) !important;
        font-size: 0.86rem;
    }

    .process-details-field strong[b-czyfoy2v9y] {
        max-width: 65%;
        overflow-wrap: anywhere;
        text-align: right;
        color: var(--process-text) !important;
        font-size: 0.88rem;
        font-weight: 650;
    }

/* =========================================
   Status
   ========================================= */

.process-details-status[b-czyfoy2v9y] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 7px;
    font-size: 0.78rem;
    font-weight: 650;
}

.status-warning[b-czyfoy2v9y] {
    background: rgba(217, 119, 6, 0.18);
    color: #ffc46b !important;
}

.status-success[b-czyfoy2v9y] {
    background: rgba(22, 163, 74, 0.18);
    color: #75e0a0 !important;
}

/* =========================================
   Appointment
   ========================================= */

.process-details-appointment[b-czyfoy2v9y] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 19px 17px;
    background: var(--process-card-bg) !important;
    color: var(--process-text) !important;
}

    .process-details-appointment > i[b-czyfoy2v9y] {
        display: flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        border-radius: 11px;
        background: var(--process-hover-bg) !important;
        color: var(--process-primary) !important;
        font-size: 1.3rem;
    }

    .process-details-appointment div[b-czyfoy2v9y] {
        display: flex;
        flex-direction: column;
        gap: 5px;
        min-width: 0;
    }

    .process-details-appointment span[b-czyfoy2v9y] {
        color: var(--process-muted) !important;
        font-size: 0.8rem;
    }

    .process-details-appointment strong[b-czyfoy2v9y] {
        overflow-wrap: anywhere;
        color: var(--process-text) !important;
        font-size: 0.92rem;
        font-weight: 650;
    }

/* =========================================
   Gesprächsnotiz-Vorschau
   ========================================= */

.process-details-note-card[b-czyfoy2v9y] {
    padding: 18px;
}

.process-details-note-empty[b-czyfoy2v9y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 15px 8px 22px;
    text-align: center;
}

    .process-details-note-empty > i[b-czyfoy2v9y] {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 46px;
        height: 46px;
        margin-bottom: 3px;
        border-radius: 14px;
        background: var(--process-hover-bg) !important;
        color: var(--process-muted) !important;
        font-size: 1.4rem;
    }

    .process-details-note-empty strong[b-czyfoy2v9y] {
        color: var(--process-text) !important;
        font-size: 0.9rem;
    }

    .process-details-note-empty span[b-czyfoy2v9y] {
        max-width: 290px;
        color: var(--process-muted) !important;
        font-size: 0.82rem;
        line-height: 1.5;
    }

.process-details-note-content[b-czyfoy2v9y] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 18px;
}

    .process-details-note-content > i[b-czyfoy2v9y] {
        margin-top: 1px;
        color: var(--process-primary) !important;
        font-size: 1.25rem;
    }

    .process-details-note-content p[b-czyfoy2v9y] {
        flex: 1;
        min-width: 0;
        margin: 0;
        overflow-wrap: anywhere;
        white-space: pre-wrap;
        color: var(--process-text) !important;
        font-size: 0.88rem;
        line-height: 1.75;
    }

/* =========================================
   Buttons
   ========================================= */

.process-details-note-button[b-czyfoy2v9y],
.conversation-note-save[b-czyfoy2v9y] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 43px;
    padding: 10px 15px;
    border: 1px solid var(--process-primary) !important;
    border-radius: 10px;
    background: var(--process-primary) !important;
    color: #ffffff !important;
    font-size: 0.85rem;
    font-weight: 650;
    cursor: pointer;
    transition: filter 0.18s ease, opacity 0.18s ease;
}

.process-details-note-button[b-czyfoy2v9y] {
    width: 100%;
}

    .process-details-note-button:hover:not(:disabled)[b-czyfoy2v9y],
    .conversation-note-save:hover:not(:disabled)[b-czyfoy2v9y] {
        background: var(--process-primary-hover) !important;
        border-color: var(--process-primary-hover) !important;
        color: #ffffff !important;
    }

    .process-details-note-button:disabled[b-czyfoy2v9y],
    .conversation-note-save:disabled[b-czyfoy2v9y] {
        cursor: not-allowed;
        opacity: 0.55;
    }

/* =========================================
   Footer
   ========================================= */

.process-details-footer[b-czyfoy2v9y],
.conversation-note-footer[b-czyfoy2v9y] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 18px 28px;
    border-top: 1px solid var(--process-border);
    background: var(--process-bg) !important;
    color: var(--process-text) !important;
}

.process-details-panel .btn-secondary[b-czyfoy2v9y],
.conversation-note-panel .btn-secondary[b-czyfoy2v9y] {
    border-color: var(--process-border) !important;
    background: var(--process-card-bg) !important;
    color: var(--process-text) !important;
}

    .process-details-panel .btn-secondary:hover[b-czyfoy2v9y],
    .conversation-note-panel .btn-secondary:hover[b-czyfoy2v9y] {
        background: var(--process-hover-bg) !important;
        color: #ffffff !important;
    }

/* =========================================
   Gesprächsnotiz-Editor
   ========================================= */

.conversation-note-body > label[b-czyfoy2v9y] {
    display: block;
    margin-bottom: 10px;
    color: var(--process-text) !important;
    font-size: 0.9rem;
    font-weight: 650;
}

.conversation-note-textarea[b-czyfoy2v9y] {
    display: block;
    width: 100%;
    min-height: 260px;
    padding: 15px;
    resize: vertical;
    border: 1px solid #49424e !important;
    border-radius: 12px;
    outline: none;
    background: var(--process-card-bg) !important;
    color: #ffffff !important;
    font: inherit;
    font-size: 0.9rem;
    line-height: 1.7;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

    .conversation-note-textarea:focus[b-czyfoy2v9y] {
        border-color: var(--process-primary) !important;
        box-shadow: 0 0 0 3px rgba(213, 53, 40, 0.2);
    }

    .conversation-note-textarea:disabled[b-czyfoy2v9y] {
        opacity: 0.65;
        cursor: wait;
    }

    .conversation-note-textarea[b-czyfoy2v9y]::placeholder {
        color: var(--process-muted) !important;
        opacity: 1;
    }

.conversation-note-meta[b-czyfoy2v9y] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
    color: var(--process-muted) !important;
    font-size: 0.76rem;
}

    .conversation-note-meta > span:first-child[b-czyfoy2v9y] {
        display: flex;
        align-items: flex-start;
        gap: 6px;
    }

        .conversation-note-meta > span:first-child i[b-czyfoy2v9y] {
            margin-top: 2px;
        }

.conversation-note-counter[b-czyfoy2v9y] {
    flex: 0 0 auto;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.conversation-note-hint[b-czyfoy2v9y] {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin-top: 24px;
    padding: 15px;
    border: 1px solid rgba(213, 53, 40, 0.25);
    border-radius: 12px;
    background: rgba(213, 53, 40, 0.08);
}

    .conversation-note-hint > i[b-czyfoy2v9y] {
        margin-top: 2px;
        color: #f0786f !important;
        font-size: 1.1rem;
    }

    .conversation-note-hint p[b-czyfoy2v9y] {
        margin: 0;
        color: #e5e0e9 !important;
        font-size: 0.82rem;
        line-height: 1.6;
    }

.conversation-note-footer .btn[b-czyfoy2v9y] {
    min-height: 43px;
    padding-inline: 15px;
    border-radius: 10px;
}

/* =========================================
   Tabellenzeilen
   ========================================= */

.process-table-row[b-czyfoy2v9y] {
    cursor: pointer;
    transition: background 0.15s ease;
}

    .process-table-row:hover[b-czyfoy2v9y] {
        background: var(--process-hover-bg);
    }

    .process-table-row:focus-visible[b-czyfoy2v9y] {
        outline: 2px solid var(--process-primary);
        outline-offset: -2px;
    }

/* =========================================
   Responsive
   ========================================= */

@media (max-width: 576px) {
    .process-details-panel[b-czyfoy2v9y],
    .conversation-note-panel[b-czyfoy2v9y] {
        width: 100vw !important;
        max-width: 100vw !important;
    }

    .process-details-header[b-czyfoy2v9y],
    .conversation-note-header[b-czyfoy2v9y] {
        padding: 22px 20px;
    }

    .process-details-body[b-czyfoy2v9y],
    .conversation-note-body[b-czyfoy2v9y] {
        padding: 22px 20px;
    }

    .process-details-footer[b-czyfoy2v9y],
    .conversation-note-footer[b-czyfoy2v9y] {
        padding: 16px 20px;
    }

    .process-details-field[b-czyfoy2v9y] {
        align-items: flex-start;
        gap: 10px;
        padding-inline: 13px;
    }

        .process-details-field > span:first-child[b-czyfoy2v9y] {
            max-width: 58%;
        }

        .process-details-field strong[b-czyfoy2v9y] {
            max-width: 55%;
        }

    .conversation-note-meta[b-czyfoy2v9y] {
        flex-wrap: wrap;
    }
}

/* =========================================
   Animationen
   ========================================= */

@keyframes process-panel-enter-b-czyfoy2v9y {
    from {
        opacity: 0;
        transform: translateX(18px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .process-details-panel[b-czyfoy2v9y],
    .conversation-note-panel[b-czyfoy2v9y] {
        animation: none !important;
    }

    .process-details-close[b-czyfoy2v9y],
    .process-details-note-button[b-czyfoy2v9y],
    .conversation-note-save[b-czyfoy2v9y] {
        transition: none;
    }
}
/* /Components/Process/CreateProcessDialog.razor.rz.scp.css */
.customer-search-container[b-asm0zjgwlx] {
    position: relative;
}

.customer-search-panel[b-asm0zjgwlx] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1055;
    margin-top: 4px;
    background-color: #ffffff;
    color: #212529;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    overflow: hidden;
    isolation: isolate;
}

.customer-search-list[b-asm0zjgwlx] {
    max-height: 220px;
    overflow-y: auto;
    overscroll-behavior: contain;
    background-color: #ffffff;
}

.customer-search-item[b-asm0zjgwlx] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    width: 100%;
    padding: 0.65rem 0.875rem;
    text-align: left;
    background-color: #ffffff;
    border: 0;
    border-bottom: 1px solid #dee2e6;
    color: #212529;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

    .customer-search-item:last-child[b-asm0zjgwlx] {
        border-bottom: 0;
    }

    .customer-search-item:hover[b-asm0zjgwlx],
    .customer-search-item:focus-visible[b-asm0zjgwlx] {
        background-color: #d53528;
        color: #ffffff;
        outline: none;
    }

        .customer-search-item:hover .text-muted[b-asm0zjgwlx],
        .customer-search-item:focus-visible .text-muted[b-asm0zjgwlx] {
            color: rgba(255, 255, 255, 0.85) !important;
        }

    .customer-search-item:active[b-asm0zjgwlx] {
        background-color: #a5261c;
        color: #ffffff;
    }

        .customer-search-item:active .text-muted[b-asm0zjgwlx] {
            color: rgba(255, 255, 255, 0.85) !important;
        }

/* Darkmode */
html[data-bs-theme="dark"] .customer-search-panel[b-asm0zjgwlx],
html[data-bs-theme="dark"] .customer-search-list[b-asm0zjgwlx],
html[data-bs-theme="dark"] .customer-search-item[b-asm0zjgwlx] {
    background-color: #242129;
    color: #f8f9fa;
}

html[data-bs-theme="dark"] .customer-search-panel[b-asm0zjgwlx] {
    border-color: #45414b;
}

html[data-bs-theme="dark"] .customer-search-item[b-asm0zjgwlx] {
    border-bottom-color: #45414b;
}

    html[data-bs-theme="dark"] .customer-search-item:hover[b-asm0zjgwlx],
    html[data-bs-theme="dark"] .customer-search-item:focus-visible[b-asm0zjgwlx] {
        background-color: #d53528;
        color: #ffffff;
    }

        html[data-bs-theme="dark"] .customer-search-item:hover .text-muted[b-asm0zjgwlx],
        html[data-bs-theme="dark"] .customer-search-item:focus-visible .text-muted[b-asm0zjgwlx] {
            color: rgba(255, 255, 255, 0.85) !important;
        }

    html[data-bs-theme="dark"] .customer-search-item:active[b-asm0zjgwlx] {
        background-color: #a5261c;
        color: #ffffff;
    }
/* /Layout/Partials/Sidenav.razor.rz.scp.css */
.sidenav-content[b-4gv6ecvw0i] {
    position: relative;
    min-height: calc(100vh - 130px);
    padding-bottom: 70px;
}

.sidenav-bottom[b-4gv6ecvw0i] {
    position: fixed;
    left: 0;
    bottom: 12px;
    width: var(--sidenav-width);
    z-index: 20;
}

    .sidenav-bottom .side-nav[b-4gv6ecvw0i] {
        margin: 0;
        padding: 0;
    }

    .sidenav-bottom .side-nav-item[b-4gv6ecvw0i] {
        margin: 0;
    }


.logo .logo-lg img[b-4gv6ecvw0i] {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: var(--ct-logo-lg-height);
    object-fit: contain;
}

.logo .logo-sm img[b-4gv6ecvw0i] {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: var(--ct-logo-sm-height);
    object-fit: contain;
}
/* /Pages/Admin/Admin.razor.rz.scp.css */
.admin-page[b-mnzaa73vov] {
    width: 100%;
}

.admin-navbar[b-mnzaa73vov] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--bs-border-color, #e8e7eb);
}

.admin-navbar-item[b-mnzaa73vov] {
    position: relative;
    padding: 0.85rem 1rem;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    background: transparent;
    color: var(--bs-secondary-color, #6c757d);
    font: inherit;
    cursor: pointer;
}

    .admin-navbar-item:hover[b-mnzaa73vov] {
        color: var(--bs-body-color);
    }

    .admin-navbar-item.active[b-mnzaa73vov] {
        color: var(--bs-danger, #d53528);
        border-bottom-color: var(--bs-danger, #d53528);
        font-weight: 600;
    }

.admin-content[b-mnzaa73vov] {
    width: 100%;
    min-width: 0;
}
/* /Pages/Admin/LexwareMigrationPanel.razor.rz.scp.css */
.lexware-migration[b-5194bcuojq] {
    padding: 24px;
    border: 1px solid var(--bs-border-color, #e8e7eb);
    border-radius: 12px;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #242129);
}

.lexware-migration-header[b-5194bcuojq],
.lexware-migration-progress-label[b-5194bcuojq],
.lexware-migration-remaining[b-5194bcuojq],
.lexware-migration-actions[b-5194bcuojq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.lexware-migration-header[b-5194bcuojq] {
    margin-bottom: 28px;
}

    .lexware-migration-header h3[b-5194bcuojq] {
        margin: 0 0 6px;
        font-size: 1.15rem;
        font-weight: 600;
    }

    .lexware-migration-header p[b-5194bcuojq] {
        margin: 0;
        color: var(--bs-secondary-color, #777);
        font-size: 0.9rem;
    }

.lexware-migration-status[b-5194bcuojq] {
    padding: 5px 10px;
    border-radius: 6px;
    background: var(--bs-tertiary-bg, #f5f5f7);
    color: var(--bs-body-color, #242129);
    font-size: 0.8rem;
    white-space: nowrap;
}

    .lexware-migration-status.running[b-5194bcuojq] {
        color: #b45309;
        background: #fef3c7;
    }

    .lexware-migration-status.completed[b-5194bcuojq] {
        color: #166534;
        background: #dcfce7;
    }

.lexware-migration-progress[b-5194bcuojq] {
    margin-bottom: 22px;
}

.lexware-migration-progress-label[b-5194bcuojq] {
    margin-bottom: 10px;
}

    .lexware-migration-progress-label strong[b-5194bcuojq] {
        font-size: 1.5rem;
    }

    .lexware-migration-progress-label span[b-5194bcuojq],
    .lexware-migration-remaining span[b-5194bcuojq] {
        color: var(--bs-secondary-color, #777);
        font-size: 0.875rem;
    }

.lexware-migration-track[b-5194bcuojq] {
    height: 8px;
    overflow: hidden;
    border-radius: 99px;
    background: var(--bs-tertiary-bg, #eeeef1);
}

.lexware-migration-bar[b-5194bcuojq] {
    height: 100%;
    border-radius: inherit;
    background: #16a34a;
    transition: width 300ms ease;
}

.lexware-migration-remaining[b-5194bcuojq] {
    padding: 16px 0;
    border-bottom: 1px solid var(--bs-border-color, #e8e7eb);
}

    .lexware-migration-remaining strong[b-5194bcuojq] {
        font-size: 0.95rem;
    }

.lexware-migration-stats[b-5194bcuojq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 12px;
    margin: 20px 0;
}

.lexware-migration-stat[b-5194bcuojq] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px;
    border-radius: 8px;
    background: var(--bs-tertiary-bg, #f7f7f9);
}

    .lexware-migration-stat span[b-5194bcuojq] {
        color: var(--bs-secondary-color, #777);
        font-size: 0.8rem;
    }

    .lexware-migration-stat strong[b-5194bcuojq] {
        font-size: 1.2rem;
    }

    .lexware-migration-stat.has-errors strong[b-5194bcuojq] {
        color: #dc2626;
    }

.lexware-migration-message[b-5194bcuojq] {
    margin: 16px 0;
    color: var(--bs-body-color, #242129);
    font-size: 0.9rem;
}

    .lexware-migration-message.running[b-5194bcuojq] {
        color: #d97706;
    }

    .lexware-migration-message.error[b-5194bcuojq] {
        color: #dc2626;
    }

    .lexware-migration-message.success[b-5194bcuojq] {
        color: #16a34a;
    }

    .lexware-migration-message.warning[b-5194bcuojq] {
        color: #d97706;
    }

.lexware-migration-actions[b-5194bcuojq] {
    justify-content: flex-end;
    margin-top: 20px;
}

.lexware-migration-button[b-5194bcuojq] {
    padding: 10px 16px;
    border: 0;
    border-radius: 8px;
    background: #d53528;
    color: #fff;
    font-weight: 500;
    cursor: pointer;
    transition: background 150ms ease;
}

    .lexware-migration-button:hover:not(:disabled)[b-5194bcuojq] {
        background: #b92b20;
    }

    .lexware-migration-button:disabled[b-5194bcuojq] {
        opacity: 0.55;
        cursor: not-allowed;
    }

/* Darkmode */
[data-bs-theme="dark"] .lexware-migration[b-5194bcuojq] {
    border-color: var(--bs-border-color, #38343f);
    background: var(--bs-body-bg, #1c191f);
    color: var(--bs-body-color, #f1eff4);
}

[data-bs-theme="dark"] .lexware-migration-status[b-5194bcuojq] {
    background: var(--bs-tertiary-bg, #302c35);
    color: var(--bs-body-color, #f1eff4);
}

    [data-bs-theme="dark"] .lexware-migration-status.running[b-5194bcuojq] {
        color: #fbbf24;
        background: #422f12;
    }

    [data-bs-theme="dark"] .lexware-migration-status.completed[b-5194bcuojq] {
        color: #86efac;
        background: #163723;
    }

[data-bs-theme="dark"] .lexware-migration-message.running[b-5194bcuojq] {
    color: #fbbf24;
}

[data-bs-theme="dark"] .lexware-migration-message.error[b-5194bcuojq] {
    color: #f87171;
}

[data-bs-theme="dark"] .lexware-migration-message.success[b-5194bcuojq] {
    color: #86efac;
}

[data-bs-theme="dark"] .lexware-migration-message.warning[b-5194bcuojq] {
    color: #fbbf24;
}

[data-bs-theme="dark"] .lexware-migration-track[b-5194bcuojq] {
    background: var(--bs-tertiary-bg, #302c35);
}

[data-bs-theme="dark"] .lexware-migration-stat[b-5194bcuojq] {
    background: var(--bs-tertiary-bg, #242129);
}

    [data-bs-theme="dark"] .lexware-migration-stat.has-errors strong[b-5194bcuojq] {
        color: #f87171;
    }

[data-bs-theme="dark"] .lexware-migration-remaining[b-5194bcuojq] {
    border-bottom-color: var(--bs-border-color, #38343f);
}

@media (max-width: 600px) {
    .lexware-migration[b-5194bcuojq] {
        padding: 16px;
    }

    .lexware-migration-header[b-5194bcuojq] {
        align-items: flex-start;
    }

    .lexware-migration-progress-label[b-5194bcuojq] {
        align-items: flex-start;
    }
}
/* /Pages/Admin/UserManagementPanel.razor.rz.scp.css */

/* ======================================== */
/* USER MANAGEMENT                          */
/* ======================================== */

.admin-users[b-7elo41wdv2] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
    color: var(--bs-body-color, #242129);
}

/* Header */

.admin-users-header[b-7elo41wdv2],
.admin-users-list-header[b-7elo41wdv2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

    .admin-users-header h3[b-7elo41wdv2] {
        margin: 0 0 6px;
        font-size: 1.15rem;
        font-weight: 600;
        letter-spacing: -0.02em;
    }

    .admin-users-header p[b-7elo41wdv2] {
        margin: 0;
        color: var(--bs-secondary-color, #777);
        font-size: 0.9rem;
    }

/* Karten */

.admin-users-card[b-7elo41wdv2] {
    min-width: 0;
    padding: 24px;
    border: 1px solid var(--bs-border-color, #e8e7eb);
    border-radius: 12px;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #242129);
    box-shadow: 0 2px 8px rgba(25, 20, 35, 0.025);
}

    .admin-users-card h4[b-7elo41wdv2] {
        margin: 0 0 20px;
        font-size: 1rem;
        font-weight: 600;
        letter-spacing: -0.01em;
    }

/* Formular */

.admin-users-form-grid[b-7elo41wdv2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.admin-users-field[b-7elo41wdv2] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

    .admin-users-field > label[b-7elo41wdv2] {
        font-size: 0.875rem;
        font-weight: 500;
    }

    .admin-users-field .form-control[b-7elo41wdv2],
    .admin-users-field .form-select[b-7elo41wdv2] {
        width: 100%;
        min-width: 0;
        min-height: 42px;
        border: 1px solid var(--bs-border-color, #dedbe2);
        border-radius: 8px;
        background-color: var(--bs-body-bg, #fff);
        color: var(--bs-body-color, #242129);
        transition: border-color 150ms ease, box-shadow 150ms ease;
    }

        .admin-users-field .form-control:focus[b-7elo41wdv2],
        .admin-users-field .form-select:focus[b-7elo41wdv2] {
            border-color: #d53528;
            box-shadow: 0 0 0 3px rgba(213, 53, 40, 0.12);
            outline: none;
        }

        .admin-users-field .form-control[b-7elo41wdv2]::placeholder {
            color: var(--bs-secondary-color, #888);
            opacity: 0.8;
        }

.admin-users-active-field[b-7elo41wdv2] {
    justify-content: flex-end;
}

.admin-users-checkbox[b-7elo41wdv2] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    font-size: 0.9rem;
    cursor: pointer;
}

    .admin-users-checkbox input[b-7elo41wdv2] {
        width: 16px;
        height: 16px;
        margin: 0;
        accent-color: #d53528;
        cursor: pointer;
    }

/* Buttons */

.admin-users-actions[b-7elo41wdv2] {
    display: flex;
    justify-content: flex-end;
    margin-top: 24px;
}

.admin-users-submit[b-7elo41wdv2],
.admin-users-refresh[b-7elo41wdv2],
.admin-users-action-button[b-7elo41wdv2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 9px 14px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
    cursor: pointer;
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease, opacity 150ms ease, transform 150ms ease;
}

.admin-users-submit[b-7elo41wdv2] {
    border-color: #d53528;
    background: #d53528;
    color: #fff;
}

    .admin-users-submit:hover:not(:disabled)[b-7elo41wdv2] {
        border-color: #b92b20;
        background: #b92b20;
        box-shadow: 0 3px 8px rgba(213, 53, 40, 0.18);
    }

    .admin-users-submit:active:not(:disabled)[b-7elo41wdv2],
    .admin-users-action-button:active:not(:disabled)[b-7elo41wdv2],
    .admin-users-refresh:active:not(:disabled)[b-7elo41wdv2] {
        transform: translateY(1px);
    }

.admin-users-refresh[b-7elo41wdv2],
.admin-users-action-button[b-7elo41wdv2] {
    border-color: var(--bs-border-color, #e8e7eb);
    background: var(--bs-tertiary-bg, #f5f5f7);
    color: var(--bs-body-color, #242129);
}

    .admin-users-refresh:hover:not(:disabled)[b-7elo41wdv2],
    .admin-users-action-button:hover:not(:disabled)[b-7elo41wdv2] {
        border-color: #c9c5cf;
        background: var(--bs-secondary-bg, #e9e7ed);
    }

    .admin-users-submit:focus-visible[b-7elo41wdv2],
    .admin-users-refresh:focus-visible[b-7elo41wdv2],
    .admin-users-action-button:focus-visible[b-7elo41wdv2] {
        outline: 3px solid rgba(213, 53, 40, 0.25);
        outline-offset: 2px;
    }

    .admin-users-submit:disabled[b-7elo41wdv2],
    .admin-users-refresh:disabled[b-7elo41wdv2],
    .admin-users-action-button:disabled[b-7elo41wdv2] {
        opacity: 0.55;
        cursor: not-allowed;
        box-shadow: none;
    }

/* Meldungen */

.admin-users-message[b-7elo41wdv2] {
    margin: 18px 0 0;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 0.875rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

    .admin-users-message.success[b-7elo41wdv2] {
        border-color: #bbebcb;
        background: #effaf2;
        color: #16713a;
    }

    .admin-users-message.error[b-7elo41wdv2] {
        border-color: #f2cccc;
        background: #fff2f2;
        color: #c62828;
    }

/* Benutzerliste */

.admin-users-list-header[b-7elo41wdv2] {
    margin-bottom: 16px;
}

    .admin-users-list-header h4[b-7elo41wdv2] {
        margin: 0;
    }

    .admin-users-list-header span[b-7elo41wdv2] {
        color: var(--bs-secondary-color, #777);
        font-size: 0.85rem;
        white-space: nowrap;
    }

.admin-users-empty[b-7elo41wdv2] {
    margin: 0;
    padding: 24px 12px;
    border: 1px dashed var(--bs-border-color, #e8e7eb);
    border-radius: 8px;
    color: var(--bs-secondary-color, #777);
    font-size: 0.9rem;
    text-align: center;
}

.admin-users-table-wrapper[b-7elo41wdv2] {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--bs-border-color, #e8e7eb);
    border-radius: 9px;
}

.admin-users-table[b-7elo41wdv2] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.9rem;
}

    .admin-users-table th[b-7elo41wdv2],
    .admin-users-table td[b-7elo41wdv2] {
        padding: 13px 12px;
        border-bottom: 1px solid var(--bs-border-color, #e8e7eb);
        text-align: left;
        vertical-align: middle;
    }

    .admin-users-table th[b-7elo41wdv2] {
        background: var(--bs-tertiary-bg, #f7f6f8);
        color: var(--bs-secondary-color, #777);
        font-size: 0.78rem;
        font-weight: 600;
        letter-spacing: 0.025em;
        white-space: nowrap;
    }

    .admin-users-table tbody tr[b-7elo41wdv2] {
        transition: background-color 120ms ease;
    }

        .admin-users-table tbody tr:hover[b-7elo41wdv2] {
            background: var(--bs-tertiary-bg, #faf9fb);
        }

        .admin-users-table tbody tr:last-child td[b-7elo41wdv2] {
            border-bottom: 0;
        }

    .admin-users-table td[b-7elo41wdv2] {
        overflow-wrap: anywhere;
    }

/* Aktivitätsstatus */

.admin-users-status[b-7elo41wdv2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

    .admin-users-status.active[b-7elo41wdv2] {
        background: #dcfce7;
        color: #166534;
    }

    .admin-users-status.inactive[b-7elo41wdv2] {
        background: #fee2e2;
        color: #991b1b;
    }

/* Aktionen */

.admin-users-row-actions[b-7elo41wdv2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-users-action-button[b-7elo41wdv2] {
    min-height: 32px;
    padding: 7px 10px;
    font-size: 0.8rem;
    white-space: nowrap;
}

    .admin-users-action-button.delete[b-7elo41wdv2] {
        border-color: #f0c4c4;
        background: #fff7f7;
        color: #c62828;
    }

        .admin-users-action-button.delete:hover:not(:disabled)[b-7elo41wdv2] {
            border-color: #dc2626;
            background: #fee2e2;
            color: #991b1b;
        }

/* Passwortdialog – unterstützt beide Klassennamen */

.admin-users-dialog-backdrop[b-7elo41wdv2],
.admin-users-password-dialog[b-7elo41wdv2] {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    overflow-y: auto;
    background: rgba(15, 23, 42, 0.58);
    backdrop-filter: blur(4px);
    animation: adminUsersBackdropIn-b-7elo41wdv2 160ms ease-out;
}

.admin-users-dialog[b-7elo41wdv2],
.admin-users-password-dialog-content[b-7elo41wdv2] {
    width: 100%;
    max-width: 440px;
    max-height: calc(100vh - 40px);
    padding: 24px;
    overflow-y: auto;
    border: 1px solid var(--bs-border-color, #e8e7eb);
    border-radius: 14px;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #242129);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.22);
    animation: adminUsersDialogIn-b-7elo41wdv2 180ms ease-out;
}

    .admin-users-dialog h4[b-7elo41wdv2],
    .admin-users-password-dialog-content h4[b-7elo41wdv2] {
        margin: 0 0 10px;
        font-size: 1.05rem;
        font-weight: 600;
    }

    .admin-users-dialog > p[b-7elo41wdv2],
    .admin-users-password-dialog-content > p[b-7elo41wdv2] {
        margin: 0 0 20px;
        color: var(--bs-secondary-color, #777);
        font-size: 0.9rem;
        line-height: 1.5;
        overflow-wrap: anywhere;
    }

    .admin-users-dialog form[b-7elo41wdv2],
    .admin-users-password-dialog-content form[b-7elo41wdv2] {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .admin-users-dialog-actions[b-7elo41wdv2],
    .admin-users-password-dialog-content .admin-users-row-actions[b-7elo41wdv2] {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 8px;
    }

@keyframes adminUsersBackdropIn-b-7elo41wdv2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes adminUsersDialogIn-b-7elo41wdv2 {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.99);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Dunkles Theme */

[data-bs-theme="dark"] .admin-users-card[b-7elo41wdv2] {
    border-color: var(--bs-border-color, #38343f);
    background: var(--bs-body-bg, #1c191f);
    color: var(--bs-body-color, #f1eff4);
    box-shadow: none;
}

[data-bs-theme="dark"] .admin-users-field .form-control[b-7elo41wdv2],
[data-bs-theme="dark"] .admin-users-field .form-select[b-7elo41wdv2] {
    border-color: var(--bs-border-color, #38343f);
    background-color: var(--bs-body-bg, #1c191f);
    color: var(--bs-body-color, #f1eff4);
}

[data-bs-theme="dark"] .admin-users-refresh[b-7elo41wdv2],
[data-bs-theme="dark"] .admin-users-action-button[b-7elo41wdv2] {
    border-color: var(--bs-border-color, #38343f);
    background: var(--bs-tertiary-bg, #302c35);
    color: var(--bs-body-color, #f1eff4);
}

    [data-bs-theme="dark"] .admin-users-refresh:hover:not(:disabled)[b-7elo41wdv2],
    [data-bs-theme="dark"] .admin-users-action-button:hover:not(:disabled)[b-7elo41wdv2] {
        border-color: #514957;
        background: var(--bs-secondary-bg, #3b3641);
    }

[data-bs-theme="dark"] .admin-users-message.success[b-7elo41wdv2] {
    border-color: #245c39;
    background: #142b1d;
    color: #86efac;
}

[data-bs-theme="dark"] .admin-users-message.error[b-7elo41wdv2] {
    border-color: #6c2929;
    background: #351b1b;
    color: #fca5a5;
}

[data-bs-theme="dark"] .admin-users-empty[b-7elo41wdv2] {
    border-color: var(--bs-border-color, #38343f);
}

[data-bs-theme="dark"] .admin-users-table-wrapper[b-7elo41wdv2] {
    border-color: var(--bs-border-color, #38343f);
}

[data-bs-theme="dark"] .admin-users-table th[b-7elo41wdv2] {
    background: var(--bs-tertiary-bg, #302c35);
    color: var(--bs-secondary-color, #aaa);
}

[data-bs-theme="dark"] .admin-users-table th[b-7elo41wdv2],
[data-bs-theme="dark"] .admin-users-table td[b-7elo41wdv2] {
    border-bottom-color: var(--bs-border-color, #38343f);
}

[data-bs-theme="dark"] .admin-users-table tbody tr:hover[b-7elo41wdv2] {
    background: var(--bs-tertiary-bg, #27232c);
}

[data-bs-theme="dark"] .admin-users-status.active[b-7elo41wdv2] {
    background: #163723;
    color: #86efac;
}

[data-bs-theme="dark"] .admin-users-status.inactive[b-7elo41wdv2] {
    background: #451a1a;
    color: #fca5a5;
}

[data-bs-theme="dark"] .admin-users-action-button.delete[b-7elo41wdv2] {
    border-color: #6c2929;
    background: #351b1b;
    color: #fca5a5;
}

    [data-bs-theme="dark"] .admin-users-action-button.delete:hover:not(:disabled)[b-7elo41wdv2] {
        border-color: #f87171;
        background: #451a1a;
    }

[data-bs-theme="dark"] .admin-users-dialog[b-7elo41wdv2],
[data-bs-theme="dark"] .admin-users-password-dialog-content[b-7elo41wdv2] {
    border-color: var(--bs-border-color, #38343f);
    background: var(--bs-body-bg, #1c191f);
    color: var(--bs-body-color, #f1eff4);
}

/* Responsive */

@media (max-width: 900px) {
    .admin-users-row-actions[b-7elo41wdv2] {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-users-table th[b-7elo41wdv2],
    .admin-users-table td[b-7elo41wdv2] {
        padding: 11px 10px;
    }
}

@media (max-width: 600px) {
    .admin-users[b-7elo41wdv2] {
        gap: 16px;
    }

    .admin-users-card[b-7elo41wdv2] {
        padding: 16px;
        border-radius: 10px;
    }

    .admin-users-header[b-7elo41wdv2] {
        align-items: flex-start;
    }

    .admin-users-form-grid[b-7elo41wdv2] {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .admin-users-actions[b-7elo41wdv2] {
        margin-top: 18px;
    }

    .admin-users-submit[b-7elo41wdv2] {
        width: 100%;
    }

    .admin-users-list-header[b-7elo41wdv2] {
        align-items: flex-start;
    }

    .admin-users-table[b-7elo41wdv2] {
        min-width: 620px;
    }

    .admin-users-row-actions[b-7elo41wdv2] {
        align-items: stretch;
    }

    .admin-users-dialog-backdrop[b-7elo41wdv2],
    .admin-users-password-dialog[b-7elo41wdv2] {
        align-items: flex-start;
        padding: 12px;
    }

    .admin-users-dialog[b-7elo41wdv2],
    .admin-users-password-dialog-content[b-7elo41wdv2] {
        margin: auto 0;
        max-height: calc(100vh - 24px);
        padding: 20px;
        border-radius: 12px;
    }

        .admin-users-dialog-actions[b-7elo41wdv2],
        .admin-users-password-dialog-content .admin-users-row-actions[b-7elo41wdv2] {
            flex-direction: column-reverse;
        }

            .admin-users-dialog-actions .admin-users-submit[b-7elo41wdv2],
            .admin-users-dialog-actions .admin-users-action-button[b-7elo41wdv2],
            .admin-users-password-dialog-content .admin-users-row-actions .admin-users-submit[b-7elo41wdv2],
            .admin-users-password-dialog-content .admin-users-row-actions .admin-users-action-button[b-7elo41wdv2] {
                width: 100%;
            }
}

@media (prefers-reduced-motion: reduce) {
    .admin-users *[b-7elo41wdv2],
    .admin-users-dialog-backdrop[b-7elo41wdv2],
    .admin-users-password-dialog[b-7elo41wdv2],
    .admin-users-dialog[b-7elo41wdv2],
    .admin-users-password-dialog-content[b-7elo41wdv2] {
        animation: none !important;
        transition: none !important;
    }
}
/* /Pages/Customer/CustomerOverview.razor.rz.scp.css */

/* =========================================================
   Kundenübersicht – Grundlayout
   ========================================================= */

.customer-dashboard[b-qsn6fy5e9x] {
    --customer-accent: #d53528;
    --customer-accent-hover: #b92b20;
    --customer-border: var(--bs-border-color, #e8e7eb);
    --customer-surface: var(--bs-body-bg, #ffffff);
    --customer-subtle: var(--bs-tertiary-bg, #f7f7f9);
    --customer-text: var(--bs-body-color, #292832);
    --customer-muted: var(--bs-secondary-color, #777580);
    padding: 28px 24px 36px;
    color: var(--customer-text);
}

/* =========================================================
   Kopfbereich
   ========================================================= */

.customer-dashboard-header[b-qsn6fy5e9x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
}

.customer-dashboard-heading[b-qsn6fy5e9x] {
    min-width: 0;
}

.customer-dashboard-eyebrow[b-qsn6fy5e9x] {
    display: inline-block;
    margin-bottom: 7px;
    color: var(--customer-accent);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 1.4px;
}

.customer-dashboard-heading h4[b-qsn6fy5e9x] {
    margin: 0;
    color: var(--customer-text);
    font-size: 26px;
    font-weight: 750;
    letter-spacing: -0.8px;
    line-height: 1.25;
}

.customer-dashboard-heading p[b-qsn6fy5e9x] {
    margin: 7px 0 0;
    color: var(--customer-muted);
    font-size: 13px;
    line-height: 1.5;
}

/* =========================================================
   Primärer Button
   ========================================================= */

.customer-primary-button[b-qsn6fy5e9x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 10px 16px;
    border: 1px solid var(--customer-accent);
    border-radius: 9px;
    background: var(--customer-accent);
    color: #ffffff;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
    box-shadow: 0 2px 5px rgba(213, 53, 40, 0.12);
    transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

    .customer-primary-button i[b-qsn6fy5e9x] {
        font-size: 17px;
        line-height: 1;
    }

    .customer-primary-button:hover:not(:disabled)[b-qsn6fy5e9x] {
        border-color: var(--customer-accent-hover);
        background: var(--customer-accent-hover);
        color: #ffffff;
        box-shadow: 0 4px 10px rgba(213, 53, 40, 0.18);
        transform: translateY(-1px);
    }

    .customer-primary-button:disabled[b-qsn6fy5e9x] {
        opacity: 0.55;
        cursor: not-allowed;
    }

/* =========================================================
   Kennzahlen
   ========================================================= */

.customer-statistics[b-qsn6fy5e9x] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.customer-stat-card[b-qsn6fy5e9x] {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    min-width: 0;
    min-height: 124px;
    padding: 20px;
    overflow: hidden;
    border: 1px solid var(--customer-border);
    border-radius: 12px;
    background: var(--customer-surface);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

    .customer-stat-card:hover[b-qsn6fy5e9x] {
        border-color: color-mix( in srgb, var(--customer-accent) 24%, var(--customer-border) );
        box-shadow: 0 5px 18px rgba(35, 31, 45, 0.045);
        transform: translateY(-1px);
    }

.customer-stat-icon[b-qsn6fy5e9x] {
    display: flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 11px;
}

    .customer-stat-icon i[b-qsn6fy5e9x] {
        font-size: 20px;
        line-height: 1;
    }

.customer-stat-icon-neutral[b-qsn6fy5e9x] {
    background: var(--customer-subtle);
    color: var(--customer-muted);
}

.customer-stat-icon-info[b-qsn6fy5e9x] {
    background: #eaf2ff;
    color: #3268bd;
}

.customer-stat-icon-success[b-qsn6fy5e9x] {
    background: #eaf7ef;
    color: #328357;
}

.customer-stat-content[b-qsn6fy5e9x] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.customer-stat-label[b-qsn6fy5e9x] {
    color: var(--customer-muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
}

.customer-stat-value[b-qsn6fy5e9x] {
    margin-top: 4px;
    color: var(--customer-text);
    font-size: 27px;
    font-weight: 750;
    letter-spacing: -0.8px;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.customer-stat-description[b-qsn6fy5e9x] {
    margin-top: 5px;
    color: var(--customer-muted);
    font-size: 10px;
    line-height: 1.4;
}

/* =========================================================
   Kundenliste
   ========================================================= */

.customer-list-card[b-qsn6fy5e9x] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--customer-border);
    border-radius: 12px;
    background: var(--customer-surface);
}

.customer-list-header[b-qsn6fy5e9x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 21px 22px;
    border-bottom: 1px solid var(--customer-border);
}

.customer-list-heading[b-qsn6fy5e9x] {
    min-width: 0;
}

    .customer-list-heading h5[b-qsn6fy5e9x] {
        margin: 0;
        color: var(--customer-text);
        font-size: 14px;
        font-weight: 750;
        letter-spacing: -0.15px;
    }

    .customer-list-heading p[b-qsn6fy5e9x] {
        margin: 5px 0 0;
        color: var(--customer-muted);
        font-size: 11px;
        line-height: 1.5;
    }

/* =========================================================
   Suchfeld – direkt im Kopf der Kundenliste
   ========================================================= */

.customer-search[b-qsn6fy5e9x] {
    display: flex;
    flex: 0 1 340px;
    align-items: center;
    gap: 9px;
    width: 340px;
    min-width: 0;
    min-height: 39px;
    padding: 0 11px;
    border: 1px solid var(--customer-border);
    border-radius: 8px;
    background: var(--customer-surface);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .customer-search:focus-within[b-qsn6fy5e9x] {
        border-color: color-mix( in srgb, var(--customer-accent) 65%, var(--customer-border) );
        box-shadow: 0 0 0 3px rgba(213, 53, 40, 0.08);
    }

    .customer-search > i[b-qsn6fy5e9x] {
        flex: 0 0 auto;
        color: var(--customer-muted);
        font-size: 16px;
    }

    .customer-search .form-control[b-qsn6fy5e9x] {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
        padding: 8px 0;
        border: 0;
        outline: none;
        background: transparent;
        box-shadow: none;
        color: var(--customer-text);
        font-size: 11px;
    }

        .customer-search .form-control[b-qsn6fy5e9x]::placeholder {
            color: var(--customer-muted);
            opacity: 0.85;
        }

        .customer-search .form-control[b-qsn6fy5e9x]::-webkit-search-cancel-button {
            display: none;
        }

.customer-search-clear[b-qsn6fy5e9x] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--customer-muted);
    cursor: pointer;
}

    .customer-search-clear:hover:not(:disabled)[b-qsn6fy5e9x] {
        background: var(--customer-subtle);
        color: var(--customer-text);
    }

    .customer-search-clear:disabled[b-qsn6fy5e9x] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .customer-search-clear i[b-qsn6fy5e9x] {
        font-size: 16px;
    }

/*
   Die bisherige Toolbar, der separate Such-Button und der
   Ergebniszähler werden nicht mehr verwendet.
*/

.customer-toolbar[b-qsn6fy5e9x] {
    display: none;
}

.customer-search-button[b-qsn6fy5e9x],
.customer-result-count[b-qsn6fy5e9x] {
    display: none;
}

/* =========================================================
   Tabelle
   ========================================================= */

.customer-table-wrapper[b-qsn6fy5e9x] {
    width: 100%;
}

.customer-table[b-qsn6fy5e9x] {
    width: 100%;
    color: var(--customer-text);
    border-collapse: separate;
    border-spacing: 0;
}

    .customer-table thead th[b-qsn6fy5e9x] {
        padding: 13px 16px;
        border-bottom: 1px solid var(--customer-border);
        background: var(--customer-subtle);
        color: var(--customer-muted);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.25px;
        white-space: nowrap;
    }

        .customer-table thead th:first-child[b-qsn6fy5e9x],
        .customer-table tbody td:first-child[b-qsn6fy5e9x] {
            padding-left: 22px;
        }

        .customer-table thead th:last-child[b-qsn6fy5e9x],
        .customer-table tbody td:last-child[b-qsn6fy5e9x] {
            padding-right: 22px;
        }

    .customer-table tbody td[b-qsn6fy5e9x] {
        padding: 13px 16px;
        border-bottom: 1px solid var(--customer-border);
        background: transparent;
        color: var(--customer-text);
        font-size: 12px;
        vertical-align: middle;
    }

    .customer-table tbody tr:last-child td[b-qsn6fy5e9x] {
        border-bottom: 0;
    }

    .customer-table tbody tr[b-qsn6fy5e9x] {
        transition: background-color 0.14s ease;
    }

        .customer-table tbody tr:hover td[b-qsn6fy5e9x] {
            background: var(--customer-subtle);
        }

.customer-column-number[b-qsn6fy5e9x] {
    width: 125px;
}

.customer-column-name[b-qsn6fy5e9x] {
    min-width: 180px;
}

.customer-column-actions[b-qsn6fy5e9x] {
    width: 130px;
    text-align: right;
}

.customer-number[b-qsn6fy5e9x] {
    color: var(--customer-text);
    font-size: 12px;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* =========================================================
   Kundenidentität und Avatar
   ========================================================= */

.customer-identity[b-qsn6fy5e9x] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.customer-avatar[b-qsn6fy5e9x] {
    display: flex;
    flex: 0 0 35px;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    border: 1px solid rgba(213, 53, 40, 0.12);
    border-radius: 10px;
    background: rgba(213, 53, 40, 0.07);
    color: var(--customer-accent);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.3px;
}

.customer-name[b-qsn6fy5e9x] {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--customer-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}

.customer-contact[b-qsn6fy5e9x] {
    display: inline-block;
    max-width: 180px;
    overflow-wrap: anywhere;
    color: var(--customer-text);
    font-size: 12px;
    line-height: 1.5;
}

.customer-muted[b-qsn6fy5e9x] {
    color: var(--customer-muted);
    font-size: 11px;
    font-weight: 400;
}

.customer-address[b-qsn6fy5e9x] {
    display: -webkit-box;
    max-width: 200px;
    overflow: hidden;
    color: var(--customer-muted);
    font-size: 11px;
    line-height: 1.5;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* =========================================================
   Kontaktlinks
   ========================================================= */

.customer-contact-link[b-qsn6fy5e9x] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: 210px;
    color: var(--customer-muted);
    font-size: 11px;
    line-height: 1.5;
    text-decoration: none;
}

    .customer-contact-link i[b-qsn6fy5e9x] {
        flex: 0 0 auto;
        color: var(--customer-muted);
        font-size: 14px;
    }

    .customer-contact-link span[b-qsn6fy5e9x] {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .customer-contact-link:hover[b-qsn6fy5e9x] {
        color: var(--customer-accent);
        text-decoration: underline;
        text-underline-offset: 3px;
    }

        .customer-contact-link:hover i[b-qsn6fy5e9x] {
            color: var(--customer-accent);
        }

/* =========================================================
   Bearbeiten-Aktion
   ========================================================= */

.customer-action-cell[b-qsn6fy5e9x] {
    text-align: right;
    white-space: nowrap;
}

.customer-edit-button[b-qsn6fy5e9x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 31px;
    padding: 6px 9px;
    border: 1px solid var(--customer-border);
    border-radius: 7px;
    background: var(--customer-surface);
    color: var(--customer-muted);
    font-size: 10px;
    font-weight: 600;
    transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

    .customer-edit-button i[b-qsn6fy5e9x] {
        font-size: 14px;
    }

    .customer-edit-button:hover[b-qsn6fy5e9x] {
        border-color: rgba(213, 53, 40, 0.3);
        background: rgba(213, 53, 40, 0.06);
        color: var(--customer-accent);
    }

/* =========================================================
   Tabellenfuß
   ========================================================= */

.customer-list-footer[b-qsn6fy5e9x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 43px;
    padding: 10px 22px;
    border-top: 1px solid var(--customer-border);
    background: var(--customer-surface);
    color: var(--customer-muted);
    font-size: 10px;
}

.customer-footer-link[b-qsn6fy5e9x] {
    padding: 3px 0;
    border: 0;
    background: transparent;
    color: var(--customer-accent);
    font-size: 10px;
    font-weight: 650;
    cursor: pointer;
}

    .customer-footer-link:hover:not(:disabled)[b-qsn6fy5e9x] {
        color: var(--customer-accent-hover);
        text-decoration: underline;
    }

    .customer-footer-link:disabled[b-qsn6fy5e9x] {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* =========================================================
   Lade- und Leerzustände
   ========================================================= */

.customer-state[b-qsn6fy5e9x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 285px;
    padding: 36px 24px;
    text-align: center;
}

.customer-state-icon[b-qsn6fy5e9x] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 16px;
    border: 1px solid var(--customer-border);
    border-radius: 15px;
    background: var(--customer-subtle);
    color: var(--customer-muted);
}

    .customer-state-icon i[b-qsn6fy5e9x] {
        font-size: 25px;
    }

.customer-loading-spinner[b-qsn6fy5e9x] {
    width: 28px;
    height: 28px;
    margin-bottom: 18px;
    border-width: 2px;
    color: var(--customer-accent);
}

.customer-state h6[b-qsn6fy5e9x] {
    margin: 0;
    color: var(--customer-text);
    font-size: 13px;
    font-weight: 700;
}

.customer-state p[b-qsn6fy5e9x] {
    max-width: 420px;
    margin: 8px 0 0;
    color: var(--customer-muted);
    font-size: 11px;
    line-height: 1.7;
}

.customer-state .customer-primary-button[b-qsn6fy5e9x],
.customer-state .customer-secondary-button[b-qsn6fy5e9x] {
    margin-top: 19px;
}

/* =========================================================
   Fehlerzustand
   ========================================================= */

.customer-error-state[b-qsn6fy5e9x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 18px 22px;
    padding: 13px 15px;
    border: 1px solid #f0d2cf;
    border-radius: 9px;
    background: #fff5f4;
}

.customer-error-message[b-qsn6fy5e9x] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: #a82c24;
    font-size: 11px;
    line-height: 1.6;
}

    .customer-error-message i[b-qsn6fy5e9x] {
        flex: 0 0 auto;
        font-size: 18px;
    }

.customer-secondary-button[b-qsn6fy5e9x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 35px;
    padding: 8px 12px;
    border: 1px solid var(--customer-border);
    border-radius: 8px;
    background: var(--customer-surface);
    color: var(--customer-text);
    font-size: 10px;
    font-weight: 600;
    white-space: nowrap;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

    .customer-secondary-button:hover[b-qsn6fy5e9x] {
        border-color: var(--customer-accent);
        background: var(--customer-subtle);
        color: var(--customer-accent);
    }

    /* =========================================================
   Fokus und Tastaturbedienung
   ========================================================= */

    .customer-primary-button:focus-visible[b-qsn6fy5e9x],
    .customer-search-clear:focus-visible[b-qsn6fy5e9x],
    .customer-edit-button:focus-visible[b-qsn6fy5e9x],
    .customer-secondary-button:focus-visible[b-qsn6fy5e9x],
    .customer-footer-link:focus-visible[b-qsn6fy5e9x] {
        outline: 2px solid var(--customer-accent);
        outline-offset: 3px;
    }

/* =========================================================
   Dark Mode
   Voraussetzung: data-bs-theme="dark"
   ========================================================= */

[data-bs-theme="dark"] .customer-dashboard[b-qsn6fy5e9x] {
    --customer-accent: #ff8177;
    --customer-accent-hover: #ff9a92;
    --customer-border: #35313c;
    --customer-surface: #211e27;
    --customer-subtle: #292530;
    --customer-text: #eeeaf2;
    --customer-muted: #aaa4b3;
}

/* Kopfbereich */

[data-bs-theme="dark"] .customer-dashboard-heading h4[b-qsn6fy5e9x],
[data-bs-theme="dark"] .customer-list-heading h5[b-qsn6fy5e9x] {
    color: var(--customer-text);
}

[data-bs-theme="dark"] .customer-dashboard-heading p[b-qsn6fy5e9x],
[data-bs-theme="dark"] .customer-list-heading p[b-qsn6fy5e9x] {
    color: var(--customer-muted);
}

[data-bs-theme="dark"] .customer-primary-button[b-qsn6fy5e9x] {
    background: #d53528;
    border-color: #d53528;
    color: #ffffff;
    box-shadow: none;
}

    [data-bs-theme="dark"] .customer-primary-button:hover:not(:disabled)[b-qsn6fy5e9x] {
        background: #b92b20;
        border-color: #b92b20;
        color: #ffffff;
    }

/* Kennzahlen */

[data-bs-theme="dark"] .customer-stat-card[b-qsn6fy5e9x] {
    background: var(--customer-surface);
    border-color: var(--customer-border);
    box-shadow: none;
}

    [data-bs-theme="dark"] .customer-stat-card:hover[b-qsn6fy5e9x] {
        border-color: #51414b;
        box-shadow: 0 5px 18px rgba(0, 0, 0, 0.15);
    }

[data-bs-theme="dark"] .customer-stat-icon-neutral[b-qsn6fy5e9x] {
    background: #302b38;
    color: #c1b9ce;
}

[data-bs-theme="dark"] .customer-stat-icon-info[b-qsn6fy5e9x] {
    background: #252f43;
    color: #9bbcff;
}

[data-bs-theme="dark"] .customer-stat-icon-success[b-qsn6fy5e9x] {
    background: #20352b;
    color: #8bd4a7;
}

[data-bs-theme="dark"] .customer-stat-label[b-qsn6fy5e9x],
[data-bs-theme="dark"] .customer-stat-description[b-qsn6fy5e9x] {
    color: var(--customer-muted);
}

[data-bs-theme="dark"] .customer-stat-value[b-qsn6fy5e9x] {
    color: var(--customer-text);
}

/* Kundenliste */

[data-bs-theme="dark"] .customer-list-card[b-qsn6fy5e9x] {
    background: var(--customer-surface);
    border-color: var(--customer-border);
}

[data-bs-theme="dark"] .customer-list-header[b-qsn6fy5e9x],
[data-bs-theme="dark"] .customer-list-footer[b-qsn6fy5e9x] {
    background: var(--customer-surface);
    border-color: var(--customer-border);
}

/* Suchfeld */

[data-bs-theme="dark"] .customer-search[b-qsn6fy5e9x] {
    background: #1c191f;
    border-color: var(--customer-border);
}

    [data-bs-theme="dark"] .customer-search:focus-within[b-qsn6fy5e9x] {
        border-color: #a84a43;
        box-shadow: 0 0 0 3px rgba(255, 129, 119, 0.08);
    }

    [data-bs-theme="dark"] .customer-search .form-control[b-qsn6fy5e9x] {
        background: transparent;
        color: var(--customer-text);
    }

        [data-bs-theme="dark"] .customer-search .form-control[b-qsn6fy5e9x]::placeholder {
            color: #8f8999;
        }

    [data-bs-theme="dark"] .customer-search > i[b-qsn6fy5e9x] {
        color: var(--customer-muted);
    }

[data-bs-theme="dark"] .customer-search-clear[b-qsn6fy5e9x] {
    color: var(--customer-muted);
}

    [data-bs-theme="dark"] .customer-search-clear:hover:not(:disabled)[b-qsn6fy5e9x] {
        background: #35313c;
        color: var(--customer-text);
    }

/* Tabelle */

[data-bs-theme="dark"] .customer-table[b-qsn6fy5e9x] {
    --bs-table-color: var(--customer-text);
    --bs-table-bg: transparent;
    --bs-table-hover-color: var(--customer-text);
    --bs-table-hover-bg: var(--customer-subtle);
    --bs-table-border-color: var(--customer-border);
    color: var(--customer-text);
}

    [data-bs-theme="dark"] .customer-table thead th[b-qsn6fy5e9x] {
        background: var(--customer-subtle);
        color: var(--customer-muted);
        border-color: var(--customer-border);
    }

    [data-bs-theme="dark"] .customer-table tbody td[b-qsn6fy5e9x] {
        background: transparent;
        color: var(--customer-text);
        border-color: var(--customer-border);
    }

    [data-bs-theme="dark"] .customer-table tbody tr:hover td[b-qsn6fy5e9x] {
        background: var(--customer-subtle);
    }

[data-bs-theme="dark"] .customer-number[b-qsn6fy5e9x],
[data-bs-theme="dark"] .customer-name[b-qsn6fy5e9x],
[data-bs-theme="dark"] .customer-contact[b-qsn6fy5e9x] {
    color: var(--customer-text);
}

[data-bs-theme="dark"] .customer-muted[b-qsn6fy5e9x],
[data-bs-theme="dark"] .customer-address[b-qsn6fy5e9x] {
    color: var(--customer-muted);
}

/* Avatare und Kontaktlinks */

[data-bs-theme="dark"] .customer-avatar[b-qsn6fy5e9x] {
    background: rgba(255, 129, 119, 0.10);
    border-color: rgba(255, 129, 119, 0.2);
    color: #ff9188;
}

[data-bs-theme="dark"] .customer-contact-link[b-qsn6fy5e9x] {
    color: #c0bac8;
}

    [data-bs-theme="dark"] .customer-contact-link i[b-qsn6fy5e9x] {
        color: #aaa4b3;
    }

    [data-bs-theme="dark"] .customer-contact-link:hover[b-qsn6fy5e9x],
    [data-bs-theme="dark"] .customer-contact-link:hover i[b-qsn6fy5e9x] {
        color: #ff8177;
    }

/* Bearbeiten */

[data-bs-theme="dark"] .customer-edit-button[b-qsn6fy5e9x] {
    background: var(--customer-surface);
    border-color: #494351;
    color: #c1b9ce;
}

    [data-bs-theme="dark"] .customer-edit-button:hover[b-qsn6fy5e9x] {
        background: rgba(213, 53, 40, 0.14);
        border-color: rgba(255, 129, 119, 0.35);
        color: #ff9188;
    }

/* Fußbereich */

[data-bs-theme="dark"] .customer-footer-link[b-qsn6fy5e9x] {
    color: #ff8177;
}

    [data-bs-theme="dark"] .customer-footer-link:hover:not(:disabled)[b-qsn6fy5e9x] {
        color: #ffaaa3;
    }

/* Leerzustand */

[data-bs-theme="dark"] .customer-state h6[b-qsn6fy5e9x] {
    color: var(--customer-text);
}

[data-bs-theme="dark"] .customer-state p[b-qsn6fy5e9x] {
    color: var(--customer-muted);
}

[data-bs-theme="dark"] .customer-state-icon[b-qsn6fy5e9x] {
    background: #302b38;
    border-color: #413b49;
    color: #c1b9ce;
}

[data-bs-theme="dark"] .customer-loading-spinner[b-qsn6fy5e9x] {
    color: #ff8177;
}

/* Fehlerzustand */

[data-bs-theme="dark"] .customer-error-state[b-qsn6fy5e9x] {
    background: #302124;
    border-color: #593438;
}

[data-bs-theme="dark"] .customer-error-message[b-qsn6fy5e9x] {
    color: #ffaaa3;
}

[data-bs-theme="dark"] .customer-secondary-button[b-qsn6fy5e9x] {
    background: var(--customer-surface);
    border-color: #494351;
    color: var(--customer-text);
}

    [data-bs-theme="dark"] .customer-secondary-button:hover[b-qsn6fy5e9x] {
        background: var(--customer-subtle);
        border-color: #a84a43;
        color: #ff8177;
    }

/* Formular-Autofill */

[data-bs-theme="dark"] .customer-search input[b-qsn6fy5e9x] {
    color-scheme: dark;
}

    [data-bs-theme="dark"] .customer-search input:-webkit-autofill[b-qsn6fy5e9x],
    [data-bs-theme="dark"] .customer-search input:-webkit-autofill:hover[b-qsn6fy5e9x],
    [data-bs-theme="dark"] .customer-search input:-webkit-autofill:focus[b-qsn6fy5e9x] {
        -webkit-text-fill-color: var(--customer-text);
        transition: background-color 9999s ease-out;
    }

/* =========================================================
   Responsive Layout
   ========================================================= */

@media (max-width: 1100px) {
    .customer-statistics[b-qsn6fy5e9x] {
        gap: 12px;
    }

    .customer-stat-card[b-qsn6fy5e9x] {
        gap: 11px;
        padding: 16px;
    }

    .customer-stat-icon[b-qsn6fy5e9x] {
        flex-basis: 36px;
        width: 36px;
        height: 36px;
    }

        .customer-stat-icon i[b-qsn6fy5e9x] {
            font-size: 18px;
        }

    .customer-stat-label[b-qsn6fy5e9x] {
        font-size: 10px;
    }

    .customer-stat-description[b-qsn6fy5e9x] {
        font-size: 9px;
    }
}

@media (max-width: 800px) {
    .customer-dashboard[b-qsn6fy5e9x] {
        padding: 22px 16px 28px;
    }

    .customer-dashboard-header[b-qsn6fy5e9x] {
        margin-bottom: 22px;
    }

    .customer-statistics[b-qsn6fy5e9x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .customer-stat-card:last-child[b-qsn6fy5e9x] {
        grid-column: 1 / -1;
    }

    .customer-list-header[b-qsn6fy5e9x] {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        padding: 18px;
    }

    .customer-search[b-qsn6fy5e9x] {
        flex: 1 1 auto;
        width: 100%;
        max-width: none;
    }

    .customer-table[b-qsn6fy5e9x] {
        min-width: 1050px;
    }

    .customer-error-state[b-qsn6fy5e9x] {
        align-items: flex-start;
        flex-direction: column;
        margin: 16px 18px;
    }
}

@media (max-width: 520px) {
    .customer-dashboard[b-qsn6fy5e9x] {
        padding: 18px 10px 22px;
    }

    .customer-dashboard-header[b-qsn6fy5e9x] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .customer-dashboard-heading h4[b-qsn6fy5e9x] {
        font-size: 23px;
    }

    .customer-dashboard-header > .customer-primary-button[b-qsn6fy5e9x] {
        width: 100%;
    }

    .customer-statistics[b-qsn6fy5e9x] {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        margin-bottom: 18px;
    }

    .customer-stat-card[b-qsn6fy5e9x],
    .customer-stat-card:last-child[b-qsn6fy5e9x] {
        grid-column: auto;
        min-height: 100px;
        padding: 16px;
    }

    .customer-stat-value[b-qsn6fy5e9x] {
        font-size: 24px;
    }

    .customer-list-card[b-qsn6fy5e9x] {
        border-radius: 10px;
    }

    .customer-list-header[b-qsn6fy5e9x] {
        padding: 16px;
    }

    .customer-search[b-qsn6fy5e9x] {
        gap: 7px;
    }

    .customer-list-footer[b-qsn6fy5e9x] {
        padding-right: 16px;
        padding-left: 16px;
    }

    .customer-state[b-qsn6fy5e9x] {
        min-height: 250px;
        padding: 28px 18px;
    }
}

/* =========================================================
   Sortierung der Tabellenüberschriften
   ========================================================= */

.customer-sort-button[b-qsn6fy5e9x] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0;
    border: none;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-align: left;
    cursor: pointer;
    transition: color 0.15s ease;
}

    .customer-sort-button:hover[b-qsn6fy5e9x] {
        color: var(--bs-primary);
    }

    .customer-sort-button i[b-qsn6fy5e9x] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        font-size: 0.85rem;
        opacity: 0.5;
        transition: opacity 0.15s ease, color 0.15s ease;
    }

    .customer-sort-button:hover i[b-qsn6fy5e9x] {
        opacity: 1;
    }

    .customer-sort-button:focus-visible[b-qsn6fy5e9x] {
        outline: 2px solid var(--bs-primary);
        outline-offset: 3px;
        border-radius: 3px;
    }

    .customer-sort-button:focus:not(:focus-visible)[b-qsn6fy5e9x] {
        outline: none;
    }

.customer-table thead th:has(.customer-sort-button)[b-qsn6fy5e9x] {
    white-space: nowrap;
}

.customer-sort-button i.ri-arrow-up-line[b-qsn6fy5e9x],
.customer-sort-button i.ri-arrow-down-line[b-qsn6fy5e9x] {
    color: var(--bs-primary);
    opacity: 1;
}

/* =========================================================
   Bewegungsreduktion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .customer-primary-button[b-qsn6fy5e9x],
    .customer-stat-card[b-qsn6fy5e9x],
    .customer-search[b-qsn6fy5e9x],
    .customer-table tbody tr[b-qsn6fy5e9x],
    .customer-edit-button[b-qsn6fy5e9x],
    .customer-secondary-button[b-qsn6fy5e9x],
    .customer-sort-button[b-qsn6fy5e9x],
    .customer-sort-button i[b-qsn6fy5e9x] {
        transition: none;
    }
}


/* =========================================================
   Kundentyp-Badges
   ========================================================= */

.customer-column-type[b-qsn6fy5e9x] {
    width: 145px;
}

.customer-type-badge[b-qsn6fy5e9x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: 5px 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 650;
    line-height: 1.3;
    white-space: nowrap;
}

/* Unternehmen – Grün */
.customer-type-company[b-qsn6fy5e9x] {
    border-color: #b9e4c8;
    background: #e8f7ed;
    color: #237644;
}

/* Privatperson – Blau */
.customer-type-private[b-qsn6fy5e9x] {
    border-color: #bfd7ff;
    background: #eaf2ff;
    color: #285db0;
}

/* Lieferant – Gelb */
.customer-type-supplier[b-qsn6fy5e9x] {
    border-color: #f0d994;
    background: #fff6d9;
    color: #87630b;
}

/* Unbekannter Kundentyp */
.customer-type-unknown[b-qsn6fy5e9x] {
    border-color: var(--customer-border);
    background: var(--customer-subtle);
    color: var(--customer-muted);
}

/* Dark Theme */
[data-bs-theme="dark"] .customer-type-company[b-qsn6fy5e9x] {
    border-color: #315c42;
    background: #20392a;
    color: #91dfaa;
}

[data-bs-theme="dark"] .customer-type-private[b-qsn6fy5e9x] {
    border-color: #354f78;
    background: #24334c;
    color: #a8c9ff;
}

[data-bs-theme="dark"] .customer-type-supplier[b-qsn6fy5e9x] {
    border-color: #665326;
    background: #40351c;
    color: #f2d477;
}

/* Kunde / Lieferant – Violett */
.customer-type-customer-supplier[b-qsn6fy5e9x] {
    border-color: #d8c4f5;
    background: #f1e9fc;
    color: #6941a5;
}

/* Dark Theme */
[data-bs-theme="dark"] .customer-type-customer-supplier[b-qsn6fy5e9x] {
    border-color: #594174;
    background: #352743;
    color: #d5b8ff;
}

/* /Pages/Login.razor.rz.scp.css */
/* ========================================================= */
/* LOGIN THEME                                               */
/* Komplett autark von Adminto / Bootstrap / Dark Mode       */
/* ========================================================= */

/* Browser-eigenes Passwort-Auge ausblenden */
.login-input-wrapper input[type="password"][b-vvd11b1o42]::-ms-reveal,
.login-input-wrapper input[type="password"][b-vvd11b1o42]::-ms-clear {
    display: none;
}


.login-page[b-vvd11b1o42] {
    --login-primary: #dc1525;
    --login-primary-hover: #bc1020;
    --login-primary-active: #9d0d1b;
    --login-primary-light: #fff0f2;
    --login-primary-lighter: #fff7f8;
    --login-accent: #ff3344;
    --login-accent-hover: #dc1525;
    --login-text: #20242b;
    --login-text-soft: #515963;
    --login-text-muted: #737b86;
    --login-white: #ffffff;
    --login-page-bg: #f4f5f7;
    --login-input-bg: #ffffff;
    --login-input-border: #e0e3e8;
    --login-input-border-hover: #bbc1ca;
    --login-danger: #a53b4a;
    --login-danger-bg: #fff4f5;
    --login-danger-border: #f2ccd2;
    --login-shadow: 0 28px 80px rgba(24, 29, 37, 0.12);
    --login-shadow-button: 0 14px 28px rgba(220, 21, 37, 0.24);
    position: relative;
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px 30px;
    overflow: hidden;
    color-scheme: light;
    color: var(--login-text);
    background: radial-gradient( circle at 12% 18%, rgba(220, 21, 37, 0.20), transparent 34% ), radial-gradient( circle at 88% 20%, rgba(220, 21, 37, 0.12), transparent 38% ), linear-gradient( 135deg, #fafafa 0%, #f2f3f5 48%, #fff7f8 100% );
    font-family: Inter, "Segoe UI", Arial, sans-serif;
}


    /* ========================================================= */
    /* RESET NUR FÜR LOGIN                                       */
    /* ========================================================= */

    .login-page[b-vvd11b1o42],
    .login-page *[b-vvd11b1o42] {
        box-sizing: border-box;
    }

        .login-page button[b-vvd11b1o42],
        .login-page input[b-vvd11b1o42] {
            font: inherit;
        }

        .login-page input[b-vvd11b1o42],
        .login-page button[b-vvd11b1o42],
        .login-page a[b-vvd11b1o42] {
            color-scheme: light;
        }


/* ========================================================= */
/* BACKGROUND SHAPES                                         */
/* ========================================================= */

.login-background-shape[b-vvd11b1o42] {
    position: absolute;
    pointer-events: none;
    border-radius: 999px;
}

.login-background-shape-one[b-vvd11b1o42] {
    width: 440px;
    height: 440px;
    top: -200px;
    left: -170px;
    background: rgba(220, 21, 37, 0.16);
    filter: blur(4px);
}

.login-background-shape-two[b-vvd11b1o42] {
    width: 540px;
    height: 540px;
    right: -250px;
    bottom: -230px;
    background: rgba(220, 21, 37, 0.10);
    filter: blur(4px);
}

.login-background-shape-three[b-vvd11b1o42] {
    width: 180px;
    height: 180px;
    top: 15%;
    right: 8%;
    background: linear-gradient( 145deg, rgba(220, 21, 37, 0.07), rgba(220, 21, 37, 0.11) );
    transform: rotate(25deg);
    filter: blur(1px);
}


/* ========================================================= */
/* LOGIN SHELL                                               */
/* ========================================================= */

.login-shell[b-vvd11b1o42] {
    position: relative;
    z-index: 2;
    width: min(1060px, 100%);
    min-height: 620px;
    display: grid;
    grid-template-columns: 1fr 0.95fr;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(220, 21, 37, 0.08);
    border-radius: 28px;
    box-shadow: var(--login-shadow);
}


/* ========================================================= */
/* BRAND PANEL                                               */
/* ========================================================= */

.login-brand-panel[b-vvd11b1o42] {
    position: relative;
    display: flex;
    padding: 56px;
    overflow: hidden;
    color: #ffffff;
    background: linear-gradient( 145deg, #15181e 0%, #20242c 42%, #303640 100% );
}

    .login-brand-panel[b-vvd11b1o42]::before {
        content: "";
        position: absolute;
        width: 390px;
        height: 390px;
        top: -150px;
        right: -130px;
        border-radius: 50%;
        background: radial-gradient( circle, rgba(220, 21, 37, 0.20), rgba(220, 21, 37, 0.03) 58%, transparent 70% );
    }

    .login-brand-panel[b-vvd11b1o42]::after {
        content: "";
        position: absolute;
        width: 300px;
        height: 300px;
        bottom: -150px;
        left: -100px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.05);
    }


/* ========================================================= */
/* BRAND CONTENT                                             */
/* ========================================================= */

.brand-content[b-vvd11b1o42] {
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.brand-logo[b-vvd11b1o42] {
    width: 400px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    margin-bottom: 44px;
}

.brand-copy[b-vvd11b1o42] {
    max-width: 430px;
    margin-top: auto;
    margin-bottom: auto;
}

.brand-kicker[b-vvd11b1o42] {
    display: inline-flex;
    margin-bottom: 20px;
    padding: 8px 13px;
    color: #ffffff;
    background: var(--login-accent);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.brand-copy h1[b-vvd11b1o42] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(34px, 3.4vw, 48px);
    font-weight: 760;
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.brand-copy p[b-vvd11b1o42] {
    max-width: 390px;
    margin: 22px 0 0;
    color: rgba(255, 255, 255, 0.86);
    font-size: 16px;
    line-height: 1.7;
}


/* ========================================================= */
/* BRAND STATUS                                              */
/* ========================================================= */

.brand-badge[b-vvd11b1o42] {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 10px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 13px;
    font-weight: 500;
}

.brand-badge-dot[b-vvd11b1o42] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--login-accent);
    box-shadow: 0 0 0 5px rgba(220, 21, 37, 0.14);
}


/* ========================================================= */
/* FORM PANEL                                                */
/* ========================================================= */

.login-form-panel[b-vvd11b1o42] {
    display: flex;
    align-items: center;
    padding: 64px 58px;
    color: var(--login-text);
    background: #ffffff;
}

.login-form-wrapper[b-vvd11b1o42] {
    width: 100%;
    max-width: 390px;
    margin: 0 auto;
}


/* ========================================================= */
/* HEADING                                                   */
/* ========================================================= */

.login-heading[b-vvd11b1o42] {
    margin-bottom: 34px;
}

.login-eyebrow[b-vvd11b1o42] {
    display: block;
    margin-bottom: 9px;
    color: var(--login-primary);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.login-heading h2[b-vvd11b1o42] {
    margin: 0;
    color: var(--login-text);
    font-size: 35px;
    font-weight: 760;
    line-height: 1.12;
    letter-spacing: -0.035em;
}

.login-heading p[b-vvd11b1o42] {
    margin: 11px 0 0;
    color: var(--login-text-muted);
    font-size: 14px;
    line-height: 1.55;
}


/* ========================================================= */
/* FIELDS                                                    */
/* ========================================================= */

.login-field[b-vvd11b1o42] {
    margin-bottom: 20px;
}

    .login-field label[b-vvd11b1o42] {
        display: block;
        margin-bottom: 8px;
        color: var(--login-text);
        font-size: 13px;
        font-weight: 700;
    }

.login-input-wrapper[b-vvd11b1o42] {
    position: relative;
    display: flex;
    align-items: center;
}

.login-input-icon[b-vvd11b1o42] {
    position: absolute;
    left: 17px;
    z-index: 2;
    color: #858e9a;
    font-size: 19px;
    pointer-events: none;
    transition: color 0.18s ease;
}


/* ========================================================= */
/* INPUT                                                     */
/* ========================================================= */

.login-input-wrapper input[b-vvd11b1o42] {
    width: 100%;
    height: 56px;
    padding: 0 52px 0 48px;
    color: var(--login-text) !important;
    background: #ffffff !important;
    border: 1px solid var(--login-input-border) !important;
    border-radius: 14px;
    outline: none;
    box-shadow: 0 2px 5px rgba(24, 29, 37, 0.02);
    font-size: 14px;
    caret-color: var(--login-primary);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

    .login-input-wrapper input[b-vvd11b1o42]::placeholder {
        color: #8c949e !important;
        opacity: 1;
    }

    .login-input-wrapper input:hover[b-vvd11b1o42] {
        border-color: var(--login-input-border-hover) !important;
    }

    .login-input-wrapper input:focus[b-vvd11b1o42] {
        color: var(--login-text) !important;
        background: #ffffff !important;
        border-color: var(--login-primary) !important;
        box-shadow: 0 0 0 4px rgba(220, 21, 37, 0.10), 0 8px 20px rgba(24, 29, 37, 0.06);
    }

.login-input-wrapper:focus-within
.login-input-icon[b-vvd11b1o42] {
    color: var(--login-primary);
}


/* ========================================================= */
/* AUTOFILL                                                  */
/* Verhindert Browser / Dark Theme Verfärbung                */
/* ========================================================= */

.login-page input:-webkit-autofill[b-vvd11b1o42],
.login-page input:-webkit-autofill:hover[b-vvd11b1o42],
.login-page input:-webkit-autofill:focus[b-vvd11b1o42],
.login-page input:-webkit-autofill:active[b-vvd11b1o42] {
    -webkit-text-fill-color: var(--login-text) !important;
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    caret-color: var(--login-primary) !important;
    transition: background-color 9999s ease-out 0s;
}


/* ========================================================= */
/* PASSWORD BUTTON                                           */
/* ========================================================= */

.password-toggle[b-vvd11b1o42] {
    position: absolute;
    right: 9px;
    z-index: 2;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #737b86 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 10px;
    outline: none;
    box-shadow: none !important;
    cursor: pointer;
    transition: color 0.15s ease, background-color 0.15s ease, transform 0.15s ease;
}

    .password-toggle:hover[b-vvd11b1o42] {
        color: var(--login-primary) !important;
        background: var(--login-primary-light) !important;
    }

    .password-toggle:active[b-vvd11b1o42] {
        transform: scale(0.94);
    }

    .password-toggle i[b-vvd11b1o42] {
        color: inherit !important;
        font-size: 18px;
    }


/* ========================================================= */
/* OPTIONS                                                   */
/* ========================================================= */

.login-options[b-vvd11b1o42] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 5px 0 27px;
}


/* ========================================================= */
/* REMEMBER ME                                               */
/* ========================================================= */

.remember-option[b-vvd11b1o42] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--login-text-soft);
    font-size: 13px;
    cursor: pointer;
    user-select: none;
}

    .remember-option input[b-vvd11b1o42] {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }

.custom-checkbox[b-vvd11b1o42] {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: transparent;
    background: #ffffff;
    border: 1px solid #e0e3e8;
    border-radius: 5px;
    font-size: 12px;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.remember-option:hover
.custom-checkbox[b-vvd11b1o42] {
    border-color: var(--login-primary);
}

.remember-option input:checked + .custom-checkbox[b-vvd11b1o42] {
    color: #ffffff;
    background: var(--login-primary);
    border-color: var(--login-primary);
    box-shadow: 0 3px 9px rgba(220, 21, 37, 0.18);
}

.custom-checkbox i[b-vvd11b1o42] {
    color: inherit !important;
}


/* ========================================================= */
/* FORGOT PASSWORD                                           */
/* ========================================================= */

.forgot-password[b-vvd11b1o42] {
    color: var(--login-primary) !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    transition: color 0.15s ease;
}

    .forgot-password:hover[b-vvd11b1o42] {
        color: var(--login-primary-hover) !important;
        text-decoration: underline !important;
    }


/* ========================================================= */
/* LOGIN BUTTON                                              */
/* ========================================================= */

.login-button[b-vvd11b1o42] {
    position: relative;
    width: 100%;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 22px;
    overflow: hidden;
    color: #ffffff !important;
    background: linear-gradient( 135deg, #c81020 0%, #ee2335 100% ) !important;
    border: 0 !important;
    border-radius: 14px;
    outline: none;
    box-shadow: var(--login-shadow-button) !important;
    font-size: 14px;
    font-weight: 750;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

    .login-button[b-vvd11b1o42]::before {
        content: "";
        position: absolute;
        width: 85px;
        height: 190px;
        top: -65px;
        left: -110px;
        background: rgba(255, 255, 255, 0.14);
        transform: rotate(25deg);
        transition: left 0.45s ease;
    }

    .login-button:hover:not(:disabled)[b-vvd11b1o42] {
        transform: translateY(-2px);
        box-shadow: 0 18px 34px rgba(220, 21, 37, 0.30) !important;
    }

        .login-button:hover:not(:disabled)[b-vvd11b1o42]::before {
            left: calc(100% + 20px);
        }

    .login-button:active:not(:disabled)[b-vvd11b1o42] {
        transform: translateY(0);
    }

    .login-button:focus-visible[b-vvd11b1o42] {
        box-shadow: 0 0 0 4px rgba(220, 21, 37, 0.13), var(--login-shadow-button) !important;
    }

    .login-button:disabled[b-vvd11b1o42] {
        opacity: 0.65;
        cursor: default;
    }

    .login-button i[b-vvd11b1o42] {
        color: #ffffff !important;
        font-size: 19px;
    }


/* ========================================================= */
/* SPINNER                                                   */
/* ========================================================= */

.login-spinner[b-vvd11b1o42] {
    width: 17px;
    height: 17px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: login-spin-b-vvd11b1o42 0.7s linear infinite;
}

@keyframes login-spin-b-vvd11b1o42 {

    to {
        transform: rotate(360deg);
    }
}


/* ========================================================= */
/* ALERT                                                     */
/* ========================================================= */

.login-alert[b-vvd11b1o42] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding: 12px 14px;
    color: var(--login-danger);
    background: var(--login-danger-bg);
    border: 1px solid var(--login-danger-border);
    border-radius: 12px;
    font-size: 13px;
}

.login-alert-icon[b-vvd11b1o42] {
    display: flex;
    color: var(--login-danger);
    font-size: 18px;
}

    .login-alert-icon i[b-vvd11b1o42] {
        color: inherit !important;
    }


/* ========================================================= */
/* SECURITY                                                  */
/* ========================================================= */

.login-security[b-vvd11b1o42] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
    color: var(--login-text-muted);
    font-size: 12px;
}

.login-security-icon[b-vvd11b1o42] {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #c81020;
    background: rgba(220, 21, 37, 0.22);
    border-radius: 7px;
}

    .login-security-icon i[b-vvd11b1o42] {
        color: inherit !important;
        font-size: 15px;
    }


/* ========================================================= */
/* FOOTER                                                    */
/* ========================================================= */

.login-footer[b-vvd11b1o42] {
    position: relative;
    z-index: 2;
    margin-top: 24px;
    color: #737b86;
    font-size: 12px;
    text-align: center;
}

    .login-footer a[b-vvd11b1o42] {
        color: var(--login-primary) !important;
        font-weight: 700;
        text-decoration: none !important;
    }

        .login-footer a:hover[b-vvd11b1o42] {
            color: var(--login-primary-hover) !important;
            text-decoration: underline !important;
        }


/* ========================================================= */
/* RESPONSIVE                                                */
/* ========================================================= */

@media (max-width: 900px) {

    .login-shell[b-vvd11b1o42] {
        max-width: 520px;
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .login-brand-panel[b-vvd11b1o42] {
        padding: 34px 36px;
    }

    .brand-content[b-vvd11b1o42] {
        align-items: center;
    }

    .brand-logo[b-vvd11b1o42] {
        width: 220px;
    }

    .brand-copy[b-vvd11b1o42] {
        display: none;
    }

    .brand-badge[b-vvd11b1o42] {
        display: none;
    }

    .login-form-panel[b-vvd11b1o42] {
        padding: 46px 38px 48px;
    }
}


/* ========================================================= */
/* MOBILE                                                    */
/* ========================================================= */

@media (max-width: 560px) {

    .login-page[b-vvd11b1o42] {
        justify-content: flex-start;
        padding: 20px 14px;
    }

    .login-shell[b-vvd11b1o42] {
        border-radius: 22px;
    }

    .login-brand-panel[b-vvd11b1o42] {
        padding: 28px 24px;
    }

    .brand-logo[b-vvd11b1o42] {
        width: 190px;
    }

    .login-form-panel[b-vvd11b1o42] {
        padding: 34px 24px 38px;
    }

    .login-heading[b-vvd11b1o42] {
        margin-bottom: 28px;
    }

        .login-heading h2[b-vvd11b1o42] {
            font-size: 29px;
        }

    .login-options[b-vvd11b1o42] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        margin-bottom: 24px;
    }

    .login-footer[b-vvd11b1o42] {
        margin-top: 18px;
    }
}

    .login-page button:focus-visible[b-vvd11b1o42], .login-page a:focus-visible[b-vvd11b1o42] {
        outline: 3px solid var(--login-primary);
        outline-offset: 4px;
    }

    .login-page input:disabled[b-vvd11b1o42] {
        opacity: .7;
        cursor: wait;
    }

@media (max-width: 900px) {
    .brand-logo[b-vvd11b1o42] {
        margin-bottom: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .login-page *[b-vvd11b1o42], .login-page *[b-vvd11b1o42]::before, .login-page *[b-vvd11b1o42]::after {
        transition: none !important;
    }

    .login-spinner[b-vvd11b1o42] {
        animation-duration: 1.5s;
    }
}
/* /Pages/Process/Process.razor.rz.scp.css */
/* =========================================================
   Dashboard
   ========================================================= */

.process-dashboard[b-v1xeimkidd] {
    --process-accent: #d53528;
    --process-accent-hover: #b92b20;
    --process-border: var(--bs-border-color, #e8e7eb);
    --process-surface: var(--bs-body-bg, #ffffff);
    --process-subtle: var(--bs-tertiary-bg, #f7f7f9);
    --process-text: var(--bs-body-color, #292832);
    --process-muted: var(--bs-secondary-color, #777580);
    padding: 28px 24px 36px;
    color: var(--process-text);
}

/* =========================================================
   Kopfbereich
   ========================================================= */

.process-dashboard-header[b-v1xeimkidd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
}

.process-dashboard-heading[b-v1xeimkidd] {
    min-width: 0;
}

.process-dashboard-eyebrow[b-v1xeimkidd] {
    display: inline-block;
    margin-bottom: 7px;
    color: var(--process-accent);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 1.4px;
}

.process-dashboard-heading h4[b-v1xeimkidd] {
    margin: 0;
    color: var(--process-text);
    font-size: 26px;
    font-weight: 750;
    letter-spacing: -0.8px;
    line-height: 1.25;
}

.process-dashboard-heading p[b-v1xeimkidd] {
    margin: 7px 0 0;
    color: var(--process-muted);
    font-size: 13px;
    line-height: 1.5;
}

.process-create-button[b-v1xeimkidd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 10px 16px;
    border: 1px solid var(--process-accent);
    border-radius: 9px;
    background: var(--process-accent);
    color: #ffffff;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
    box-shadow: 0 2px 5px rgba(213, 53, 40, 0.12);
    transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

    .process-create-button i[b-v1xeimkidd] {
        font-size: 17px;
        line-height: 1;
    }

    .process-create-button:hover[b-v1xeimkidd] {
        border-color: var(--process-accent-hover);
        background: var(--process-accent-hover);
        color: #ffffff;
        box-shadow: 0 4px 10px rgba(213, 53, 40, 0.18);
        transform: translateY(-1px);
    }

    .process-create-button:focus-visible[b-v1xeimkidd],
    .process-secondary-button:focus-visible[b-v1xeimkidd],
    .process-footer-link:focus-visible[b-v1xeimkidd],
    .process-search-clear:focus-visible[b-v1xeimkidd] {
        outline: 2px solid var(--process-accent);
        outline-offset: 3px;
    }

/* =========================================================
   Kennzahlen
   ========================================================= */

.process-statistics[b-v1xeimkidd] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.process-stat-card[b-v1xeimkidd] {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    min-width: 0;
    min-height: 124px;
    padding: 20px;
    overflow: hidden;
    border: 1px solid var(--process-border);
    border-radius: 12px;
    background: var(--process-surface);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

    .process-stat-card:hover[b-v1xeimkidd] {
        border-color: color-mix(in srgb, var(--process-accent) 24%, var(--process-border));
        box-shadow: 0 5px 18px rgba(35, 31, 45, 0.045);
        transform: translateY(-1px);
    }

.process-stat-icon[b-v1xeimkidd] {
    display: flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 11px;
}

    .process-stat-icon i[b-v1xeimkidd] {
        font-size: 20px;
        line-height: 1;
    }

.process-stat-icon-neutral[b-v1xeimkidd] {
    background: var(--process-subtle);
    color: var(--process-muted);
}

.process-stat-icon-warning[b-v1xeimkidd] {
    background: #fff4df;
    color: #b9770e;
}

.process-stat-icon-info[b-v1xeimkidd] {
    background: #eaf2ff;
    color: #3268bd;
}

.process-stat-content[b-v1xeimkidd] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.process-stat-label[b-v1xeimkidd] {
    color: var(--process-muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
}

.process-stat-value[b-v1xeimkidd] {
    margin-top: 4px;
    color: var(--process-text);
    font-size: 27px;
    font-weight: 750;
    letter-spacing: -0.8px;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.process-stat-description[b-v1xeimkidd] {
    margin-top: 5px;
    color: var(--process-muted);
    font-size: 10px;
    line-height: 1.4;
}

/* =========================================================
   Vorgangsliste
   ========================================================= */

.process-list-card[b-v1xeimkidd] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--process-border);
    border-radius: 12px;
    background: var(--process-surface);
}

.process-list-header[b-v1xeimkidd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 21px 22px;
    border-bottom: 1px solid var(--process-border);
}

.process-list-heading[b-v1xeimkidd] {
    min-width: 0;
}

    .process-list-heading h5[b-v1xeimkidd] {
        margin: 0;
        color: var(--process-text);
        font-size: 14px;
        font-weight: 750;
        letter-spacing: -0.15px;
    }

    .process-list-heading p[b-v1xeimkidd] {
        margin: 5px 0 0;
        color: var(--process-muted);
        font-size: 11px;
        line-height: 1.5;
    }

/* =========================================================
   Suche
   ========================================================= */

.process-search[b-v1xeimkidd] {
    display: flex;
    align-items: center;
    gap: 9px;
    width: min(100%, 340px);
    min-height: 39px;
    padding: 0 11px;
    border: 1px solid var(--process-border);
    border-radius: 8px;
    background: var(--process-surface);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .process-search:focus-within[b-v1xeimkidd] {
        border-color: color-mix(in srgb, var(--process-accent) 65%, var(--process-border));
        box-shadow: 0 0 0 3px rgba(213, 53, 40, 0.08);
    }

    .process-search > i[b-v1xeimkidd] {
        flex: 0 0 auto;
        color: var(--process-muted);
        font-size: 16px;
    }

    .process-search .form-control[b-v1xeimkidd] {
        min-width: 0;
        padding: 8px 0;
        border: 0;
        outline: none;
        background: transparent;
        box-shadow: none;
        color: var(--process-text);
        font-size: 11px;
    }

        .process-search .form-control[b-v1xeimkidd]::placeholder {
            color: var(--process-muted);
            opacity: 0.85;
        }

        .process-search .form-control[b-v1xeimkidd]::-webkit-search-cancel-button {
            display: none;
        }

.process-search-clear[b-v1xeimkidd] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--process-muted);
    cursor: pointer;
}

    .process-search-clear:hover[b-v1xeimkidd] {
        background: var(--process-subtle);
        color: var(--process-text);
    }

    .process-search-clear i[b-v1xeimkidd] {
        font-size: 16px;
    }

/* =========================================================
   Tabelle
   ========================================================= */

.process-table-wrapper[b-v1xeimkidd] {
    width: 100%;
}

.process-table[b-v1xeimkidd] {
    width: 100%;
    color: var(--process-text);
    border-collapse: separate;
    border-spacing: 0;
}

    .process-table thead th[b-v1xeimkidd] {
        padding: 13px 18px;
        border-bottom: 1px solid var(--process-border);
        background: var(--process-subtle);
        color: var(--process-muted);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.3px;
        white-space: nowrap;
    }

        .process-table thead th:first-child[b-v1xeimkidd],
        .process-table tbody td:first-child[b-v1xeimkidd] {
            padding-left: 22px;
        }

        .process-table thead th:last-child[b-v1xeimkidd],
        .process-table tbody td:last-child[b-v1xeimkidd] {
            padding-right: 20px;
        }

.process-column-customer-number[b-v1xeimkidd] {
    width: 165px;
}

.process-column-status[b-v1xeimkidd] {
    width: 205px;
}

.process-column-action[b-v1xeimkidd] {
    width: 45px;
}

.process-table tbody td[b-v1xeimkidd] {
    padding: 15px 18px;
    border-bottom: 1px solid var(--process-border);
    background: transparent;
    font-size: 12px;
    vertical-align: middle;
}

.process-table tbody tr:last-child td[b-v1xeimkidd] {
    border-bottom: 0;
}

.process-table-row[b-v1xeimkidd] {
    cursor: pointer;
    outline-offset: -2px;
    transition: background-color 0.14s ease;
}

    .process-table-row:hover td[b-v1xeimkidd] {
        background: var(--process-subtle);
    }

    .process-table-row:focus-visible[b-v1xeimkidd] {
        outline: 2px solid var(--process-accent);
        outline-offset: -3px;
    }

.process-customer-number[b-v1xeimkidd] {
    color: var(--process-text);
    font-size: 12px;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
}

.process-customer[b-v1xeimkidd] {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.process-customer-avatar[b-v1xeimkidd] {
    display: flex;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--process-border);
    border-radius: 9px;
    background: var(--process-subtle);
    color: var(--process-muted);
}

    .process-customer-avatar i[b-v1xeimkidd] {
        font-size: 16px;
    }

.process-customer-name[b-v1xeimkidd] {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--process-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}

.process-muted[b-v1xeimkidd] {
    color: var(--process-muted);
    font-size: 11px;
    font-weight: 400;
}

/* =========================================================
   Status
   ========================================================= */

.process-table thead th.process-column-status[b-v1xeimkidd],
.process-table tbody td:has(.process-status)[b-v1xeimkidd] {
    text-align: center;
    vertical-align: middle;
}

.process-status[b-v1xeimkidd] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    width: 170px;
    max-width: 100%;
    min-height: 30px;
    padding: 6px 9px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    text-align: left;
}

.process-status-dot[b-v1xeimkidd] {
    display: inline-block;
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

/* Gelb: Erforderlich */

.process-status-warning[b-v1xeimkidd] {
    border-color: #f2e2bd;
    background: #fff8e9;
    color: #98630d;
}

    .process-status-warning .process-status-dot[b-v1xeimkidd] {
        background: #d99b24;
    }

/* Grün: Erledigt */

.process-status-success[b-v1xeimkidd] {
    border-color: #d6eadf;
    background: #f0f8f3;
    color: #347651;
}

    .process-status-success .process-status-dot[b-v1xeimkidd] {
        background: #4e9b70;
    }

/* Grau: Nicht erforderlich */

.process-status-neutral[b-v1xeimkidd] {
    border-color: #dedde3;
    background: #f3f2f5;
    color: #777580;
}

    .process-status-neutral .process-status-dot[b-v1xeimkidd] {
        background: #9b99a3;
    }

/* =========================================================
   Zeilenaktion
   ========================================================= */

.process-action-cell[b-v1xeimkidd] {
    text-align: right;
}

.process-open-icon[b-v1xeimkidd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    color: var(--process-muted);
    transition: background-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

    .process-open-icon i[b-v1xeimkidd] {
        font-size: 19px;
    }

.process-table-row:hover .process-open-icon[b-v1xeimkidd] {
    background: rgba(213, 53, 40, 0.08);
    color: var(--process-accent);
    transform: translateX(2px);
}

/* =========================================================
   Tabellenfuß
   ========================================================= */

.process-list-footer[b-v1xeimkidd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 43px;
    padding: 10px 22px;
    border-top: 1px solid var(--process-border);
    background: var(--process-surface);
    color: var(--process-muted);
    font-size: 10px;
}

.process-footer-link[b-v1xeimkidd] {
    padding: 3px 0;
    border: 0;
    background: transparent;
    color: var(--process-accent);
    font-size: 10px;
    font-weight: 650;
    cursor: pointer;
}

    .process-footer-link:hover[b-v1xeimkidd] {
        color: var(--process-accent-hover);
        text-decoration: underline;
    }

/* =========================================================
   Lade-, Fehler- und Leerzustände
   ========================================================= */

.process-state[b-v1xeimkidd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 285px;
    padding: 36px 24px;
    text-align: center;
}

.process-state-compact[b-v1xeimkidd] {
    min-height: 245px;
}

.process-state-icon[b-v1xeimkidd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 16px;
    border: 1px solid var(--process-border);
    border-radius: 15px;
    background: var(--process-subtle);
    color: var(--process-muted);
}

    .process-state-icon i[b-v1xeimkidd] {
        font-size: 25px;
    }

.process-state-icon-error[b-v1xeimkidd] {
    border-color: #f3d6d3;
    background: #fff1ef;
    color: var(--process-accent);
}

.process-loading-spinner[b-v1xeimkidd] {
    width: 28px;
    height: 28px;
    margin-bottom: 18px;
    border-width: 2px;
    color: var(--process-accent);
}

.process-state h6[b-v1xeimkidd] {
    margin: 0;
    color: var(--process-text);
    font-size: 13px;
    font-weight: 700;
}

.process-state p[b-v1xeimkidd] {
    max-width: 420px;
    margin: 8px 0 0;
    color: var(--process-muted);
    font-size: 11px;
    line-height: 1.7;
}

.process-state .process-create-button[b-v1xeimkidd],
.process-state .process-secondary-button[b-v1xeimkidd] {
    margin-top: 19px;
}

.process-secondary-button[b-v1xeimkidd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid var(--process-border);
    border-radius: 8px;
    background: var(--process-surface);
    color: var(--process-text);
    font-size: 11px;
    font-weight: 600;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

    .process-secondary-button:hover[b-v1xeimkidd] {
        border-color: var(--process-accent);
        background: var(--process-subtle);
        color: var(--process-accent);
    }

/* =========================================================
   Responsive Layout
   ========================================================= */

@media (max-width: 1100px) {
    .process-statistics[b-v1xeimkidd] {
        gap: 12px;
    }

    .process-stat-card[b-v1xeimkidd] {
        gap: 11px;
        padding: 16px;
    }

    .process-stat-icon[b-v1xeimkidd] {
        flex-basis: 36px;
        width: 36px;
        height: 36px;
    }

        .process-stat-icon i[b-v1xeimkidd] {
            font-size: 18px;
        }

    .process-stat-label[b-v1xeimkidd] {
        font-size: 10px;
    }

    .process-stat-description[b-v1xeimkidd] {
        font-size: 9px;
    }

    .process-column-status[b-v1xeimkidd] {
        width: auto;
    }
}

@media (max-width: 800px) {
    .process-dashboard[b-v1xeimkidd] {
        padding: 22px 16px 28px;
    }

    .process-dashboard-header[b-v1xeimkidd] {
        margin-bottom: 22px;
    }

    .process-statistics[b-v1xeimkidd] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .process-stat-card:last-child[b-v1xeimkidd] {
        grid-column: 1 / -1;
    }

    .process-list-header[b-v1xeimkidd] {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
        padding: 18px;
    }

    .process-search[b-v1xeimkidd] {
        width: 100%;
        max-width: none;
    }

    .process-table[b-v1xeimkidd] {
        min-width: 760px;
    }
}

@media (max-width: 520px) {
    .process-dashboard[b-v1xeimkidd] {
        padding: 18px 10px 22px;
    }

    .process-dashboard-header[b-v1xeimkidd] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .process-dashboard-heading h4[b-v1xeimkidd] {
        font-size: 23px;
    }

    .process-create-button[b-v1xeimkidd] {
        width: 100%;
    }

    .process-statistics[b-v1xeimkidd] {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        margin-bottom: 18px;
    }

    .process-stat-card[b-v1xeimkidd],
    .process-stat-card:last-child[b-v1xeimkidd] {
        grid-column: auto;
        min-height: 100px;
        padding: 16px;
    }

    .process-stat-value[b-v1xeimkidd] {
        font-size: 24px;
    }

    .process-list-card[b-v1xeimkidd] {
        border-radius: 10px;
    }

    .process-list-header[b-v1xeimkidd] {
        padding: 16px;
    }

    .process-list-footer[b-v1xeimkidd] {
        padding-right: 16px;
        padding-left: 16px;
    }

    .process-state[b-v1xeimkidd] {
        min-height: 250px;
        padding: 28px 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .process-create-button[b-v1xeimkidd],
    .process-stat-card[b-v1xeimkidd],
    .process-search[b-v1xeimkidd],
    .process-table-row[b-v1xeimkidd],
    .process-open-icon[b-v1xeimkidd],
    .process-secondary-button[b-v1xeimkidd] {
        transition: none;
    }
}

/* =========================================================
   Dark Mode
   ========================================================= */

[data-bs-theme="dark"] .process-dashboard[b-v1xeimkidd] {
    --process-accent: #ff8177;
    --process-accent-hover: #ff9a92;
    --process-border: #35313c;
    --process-surface: #211e27;
    --process-subtle: #292530;
    --process-text: #eeeaf2;
    --process-muted: #aaa4b3;
}

/* Kopfbereich */

[data-bs-theme="dark"] .process-dashboard-heading h4[b-v1xeimkidd],
[data-bs-theme="dark"] .process-list-heading h5[b-v1xeimkidd] {
    color: var(--process-text);
}

[data-bs-theme="dark"] .process-dashboard-heading p[b-v1xeimkidd],
[data-bs-theme="dark"] .process-list-heading p[b-v1xeimkidd] {
    color: var(--process-muted);
}

[data-bs-theme="dark"] .process-create-button[b-v1xeimkidd] {
    background: #d53528;
    border-color: #d53528;
    color: #ffffff;
    box-shadow: none;
}

    [data-bs-theme="dark"] .process-create-button:hover[b-v1xeimkidd] {
        background: #b92b20;
        border-color: #b92b20;
        color: #ffffff;
    }

/* Kennzahlen */

[data-bs-theme="dark"] .process-stat-card[b-v1xeimkidd] {
    background: var(--process-surface);
    border-color: var(--process-border);
    box-shadow: none;
}

    [data-bs-theme="dark"] .process-stat-card:hover[b-v1xeimkidd] {
        border-color: #51414b;
        box-shadow: 0 5px 18px rgba(0, 0, 0, 0.15);
    }

[data-bs-theme="dark"] .process-stat-icon-neutral[b-v1xeimkidd] {
    background: #302b38;
    color: #c1b9ce;
}

[data-bs-theme="dark"] .process-stat-icon-warning[b-v1xeimkidd] {
    background: #3b3020;
    color: #f0c16d;
}

[data-bs-theme="dark"] .process-stat-icon-info[b-v1xeimkidd] {
    background: #252f43;
    color: #9bbcff;
}

[data-bs-theme="dark"] .process-stat-label[b-v1xeimkidd],
[data-bs-theme="dark"] .process-stat-description[b-v1xeimkidd] {
    color: var(--process-muted);
}

[data-bs-theme="dark"] .process-stat-value[b-v1xeimkidd] {
    color: var(--process-text);
}

/* Vorgangsliste und Tabellenkopf */

[data-bs-theme="dark"] .process-list-card[b-v1xeimkidd] {
    background: var(--process-surface);
    border-color: var(--process-border);
}

[data-bs-theme="dark"] .process-list-header[b-v1xeimkidd],
[data-bs-theme="dark"] .process-list-footer[b-v1xeimkidd] {
    background: var(--process-surface);
    border-color: var(--process-border);
}

[data-bs-theme="dark"] .process-table[b-v1xeimkidd] {
    --bs-table-color: var(--process-text);
    --bs-table-bg: transparent;
    --bs-table-hover-color: var(--process-text);
    --bs-table-hover-bg: var(--process-subtle);
    --bs-table-border-color: var(--process-border);
    color: var(--process-text);
}

    [data-bs-theme="dark"] .process-table thead th[b-v1xeimkidd] {
        background: var(--process-subtle);
        color: var(--process-muted);
        border-color: var(--process-border);
    }

    [data-bs-theme="dark"] .process-table tbody td[b-v1xeimkidd] {
        background: transparent;
        color: var(--process-text);
        border-color: var(--process-border);
    }

[data-bs-theme="dark"] .process-table-row:hover td[b-v1xeimkidd] {
    background: var(--process-subtle);
}

[data-bs-theme="dark"] .process-table-row:focus-visible[b-v1xeimkidd] {
    outline-color: var(--process-accent);
}

[data-bs-theme="dark"] .process-customer-avatar[b-v1xeimkidd] {
    background: #302b38;
    border-color: #413b49;
    color: #c1b9ce;
}

[data-bs-theme="dark"] .process-customer-name[b-v1xeimkidd],
[data-bs-theme="dark"] .process-customer-number[b-v1xeimkidd] {
    color: var(--process-text);
}

[data-bs-theme="dark"] .process-muted[b-v1xeimkidd] {
    color: var(--process-muted);
}

/* Status-Badges */

[data-bs-theme="dark"] .process-status-warning[b-v1xeimkidd] {
    background: #3b3020;
    border-color: #5a4628;
    color: #f0c16d;
}

    [data-bs-theme="dark"] .process-status-warning .process-status-dot[b-v1xeimkidd] {
        background: #f0b84f;
    }

[data-bs-theme="dark"] .process-status-success[b-v1xeimkidd] {
    background: #20352b;
    border-color: #315541;
    color: #8bd4a7;
}

    [data-bs-theme="dark"] .process-status-success .process-status-dot[b-v1xeimkidd] {
        background: #69bd8b;
    }

[data-bs-theme="dark"] .process-status-neutral[b-v1xeimkidd] {
    border-color: #494351;
    background: #302b38;
    color: #c1b9ce;
}

    [data-bs-theme="dark"] .process-status-neutral .process-status-dot[b-v1xeimkidd] {
        background: #aaa4b3;
    }

/* Zeilenaktion */

[data-bs-theme="dark"] .process-open-icon[b-v1xeimkidd] {
    color: #aaa4b3;
}

[data-bs-theme="dark"] .process-table-row:hover .process-open-icon[b-v1xeimkidd] {
    background: rgba(255, 129, 119, 0.12);
    color: #ff8177;
}

/* Suche */

[data-bs-theme="dark"] .process-search[b-v1xeimkidd] {
    background: #1c191f;
    border-color: var(--process-border);
}

    [data-bs-theme="dark"] .process-search:focus-within[b-v1xeimkidd] {
        border-color: #a84a43;
        box-shadow: 0 0 0 3px rgba(255, 129, 119, 0.08);
    }

    [data-bs-theme="dark"] .process-search .form-control[b-v1xeimkidd] {
        background: transparent;
        color: var(--process-text);
    }

        [data-bs-theme="dark"] .process-search .form-control[b-v1xeimkidd]::placeholder {
            color: #8f8999;
        }

    [data-bs-theme="dark"] .process-search > i[b-v1xeimkidd] {
        color: var(--process-muted);
    }

[data-bs-theme="dark"] .process-search-clear[b-v1xeimkidd] {
    color: var(--process-muted);
}

    [data-bs-theme="dark"] .process-search-clear:hover[b-v1xeimkidd] {
        background: #35313c;
        color: var(--process-text);
    }

/* Fußbereich und Buttons */

[data-bs-theme="dark"] .process-list-footer[b-v1xeimkidd] {
    color: var(--process-muted);
}

[data-bs-theme="dark"] .process-footer-link[b-v1xeimkidd] {
    color: #ff8177;
}

    [data-bs-theme="dark"] .process-footer-link:hover[b-v1xeimkidd] {
        color: #ffaaa3;
    }

[data-bs-theme="dark"] .process-secondary-button[b-v1xeimkidd] {
    background: var(--process-surface);
    border-color: #494351;
    color: var(--process-text);
}

    [data-bs-theme="dark"] .process-secondary-button:hover[b-v1xeimkidd] {
        background: var(--process-subtle);
        border-color: #a84a43;
        color: #ff8177;
    }

/* Lade-, Fehler- und Leerzustände */

[data-bs-theme="dark"] .process-state h6[b-v1xeimkidd] {
    color: var(--process-text);
}

[data-bs-theme="dark"] .process-state p[b-v1xeimkidd] {
    color: var(--process-muted);
}

[data-bs-theme="dark"] .process-state-icon[b-v1xeimkidd] {
    background: #302b38;
    border-color: #413b49;
    color: #c1b9ce;
}

[data-bs-theme="dark"] .process-state-icon-error[b-v1xeimkidd] {
    background: #3a2527;
    border-color: #653536;
    color: #ff8b81;
}

[data-bs-theme="dark"] .process-loading-spinner[b-v1xeimkidd] {
    color: #ff8177;
}

/* Systemseitige Formular- und Autofill-Darstellung */

[data-bs-theme="dark"] .process-search input[b-v1xeimkidd] {
    color-scheme: dark;
}

    [data-bs-theme="dark"] .process-search input:-webkit-autofill[b-v1xeimkidd],
    [data-bs-theme="dark"] .process-search input:-webkit-autofill:hover[b-v1xeimkidd],
    [data-bs-theme="dark"] .process-search input:-webkit-autofill:focus[b-v1xeimkidd] {
        -webkit-text-fill-color: var(--process-text);
        transition: background-color 9999s ease-out;
    }

/* Sortierbare Tabellenüberschriften */

.process-sort-button[b-v1xeimkidd] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0;
    border: none;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-align: left;
    cursor: pointer;
    transition: color 0.15s ease;
}

    .process-sort-button:hover[b-v1xeimkidd] {
        color: var(--bs-primary);
    }

    .process-sort-button i[b-v1xeimkidd] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        font-size: 0.85rem;
        opacity: 0.5;
        transition: opacity 0.15s ease, color 0.15s ease;
    }

    .process-sort-button:hover i[b-v1xeimkidd] {
        opacity: 1;
    }

    .process-sort-button:focus-visible[b-v1xeimkidd] {
        outline: 2px solid var(--bs-primary);
        outline-offset: 3px;
        border-radius: 3px;
    }

    .process-sort-button:focus:not(:focus-visible)[b-v1xeimkidd] {
        outline: none;
    }

/* Aktive Sortierspalte */

.process-table thead th:has(.process-sort-button)[b-v1xeimkidd] {
    white-space: nowrap;
}

.process-sort-button i.ri-arrow-up-line[b-v1xeimkidd],
.process-sort-button i.ri-arrow-down-line[b-v1xeimkidd] {
    color: var(--bs-primary);
    opacity: 1;
}
/* /Pages/Process/ProcessDetailsPanel.razor.rz.scp.css */
/* =========================================================
   Theme
   ========================================================= */
.process-details-panel[b-ygeajra8n6] {
    --process-bg: #ffffff;
    --process-surface: #f8f9fb;
    --process-surface-hover: #f0f1f4;
    --process-border: #e5e7eb;
    --process-text: #25232b;
    --process-muted: #777480;
    --process-primary: #d53528;
    --process-primary-hover: #bd2d22;
    --process-primary-soft: rgb(213 53 40 / 8%);
    --process-shadow: 0 12px 40px rgb(0 0 0 / 12%);
    /* Panel */
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    width: min(640px, 100vw);
    height: 100vh;
    height: 100dvh;
    max-width: 100%;
    overflow: hidden;
    border-left: 1px solid var(--process-border);
    background: var(--process-bg);
    color: var(--process-text);
    box-shadow: var(--process-shadow);
    animation: process-panel-in-b-ygeajra8n6 0.25s ease;
}

html[data-bs-theme="dark"] .process-details-panel[b-ygeajra8n6] {
    --process-bg: #1c191f;
    --process-surface: #242129;
    --process-surface-hover: #302c36;
    --process-border: #3b3742;
    --process-text: #f4f2f7;
    --process-muted: #aaa5b3;
    --process-primary-soft: rgb(213 53 40 / 14%);
    --process-shadow: 0 12px 40px rgb(0 0 0 / 35%);
}

/* =========================================================
   Backdrop
   ========================================================= */

.process-details-backdrop[b-ygeajra8n6] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgb(12 10 16 / 55%);
    backdrop-filter: blur(3px);
    animation: process-backdrop-in-b-ygeajra8n6 0.2s ease;
}

/* =========================================================
   Header
   ========================================================= */

.process-details-header[b-ygeajra8n6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.4rem 1.5rem 1.25rem;
    border-bottom: 1px solid var(--process-border);
    background: var(--process-bg);
}

.process-details-heading[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.process-details-eyebrow[b-ygeajra8n6] {
    color: var(--process-primary);
    font-size: 0.7rem;
    font-weight: 750;
    letter-spacing: 0.12em;
}

.process-details-header h4[b-ygeajra8n6] {
    margin: 0;
    color: var(--process-text);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.025em;
}

.process-details-heading p[b-ygeajra8n6] {
    margin: 0;
    color: var(--process-muted);
    font-size: 0.85rem;
}

.process-details-close[b-ygeajra8n6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--process-border);
    border-radius: 10px;
    background: var(--process-bg);
    color: var(--process-muted);
    font-size: 1.25rem;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

    .process-details-close:hover[b-ygeajra8n6] {
        border-color: var(--process-primary);
        background: var(--process-primary-soft);
        color: var(--process-primary);
    }

    .process-details-close:focus-visible[b-ygeajra8n6] {
        outline: 2px solid var(--process-primary);
        outline-offset: 2px;
    }

/* =========================================================
   Main navigation
   ========================================================= */

.process-details-navigation[b-ygeajra8n6] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.35rem;
    padding: 0.75rem 1rem 0;
    border-bottom: 1px solid var(--process-border);
    background: var(--process-bg);
}

.process-details-tab[b-ygeajra8n6] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-width: 0;
    min-height: 76px;
    padding: 0.7rem 0.15rem 0.85rem;
    border: 1px solid transparent;
    border-radius: 10px 10px 0 0;
    background: transparent;
    color: var(--process-muted);
    font-family: inherit;
    font-size: 0.75rem;
    font-weight: 550;
    line-height: 1.2;
    text-align: center;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

    .process-details-tab i[b-ygeajra8n6] {
        font-size: 1.3rem;
        line-height: 1;
        transition: transform 0.2s ease;
    }

    .process-details-tab span[b-ygeajra8n6] {
        overflow-wrap: anywhere;
    }

    .process-details-tab:hover[b-ygeajra8n6] {
        background: var(--process-surface);
        color: var(--process-text);
    }

        .process-details-tab:hover i[b-ygeajra8n6] {
            transform: translateY(-1px);
        }

    .process-details-tab.active[b-ygeajra8n6] {
        border-color: var(--process-border);
        border-bottom-color: var(--process-bg);
        background: var(--process-primary-soft);
        color: var(--process-primary);
        font-weight: 700;
    }

        .process-details-tab.active[b-ygeajra8n6]::after {
            position: absolute;
            right: 8px;
            bottom: -1px;
            left: 8px;
            height: 3px;
            border-radius: 3px 3px 0 0;
            background: var(--process-primary);
            content: "";
        }

html[data-bs-theme="dark"] .process-details-tab.active[b-ygeajra8n6] {
    color: #ff8177;
}

.process-details-tab:focus-visible[b-ygeajra8n6] {
    outline: 2px solid var(--process-primary);
    outline-offset: -3px;
}

/* =========================================================
   Content area
   ========================================================= */

.process-details-body[b-ygeajra8n6] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 1.5rem;
    min-height: 0;
    padding: 1.5rem;
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--process-bg);
    color: var(--process-text);
    scrollbar-width: thin;
    scrollbar-color: var(--process-border) transparent;
}

    .process-details-body[b-ygeajra8n6]::-webkit-scrollbar {
        width: 6px;
    }

    .process-details-body[b-ygeajra8n6]::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background: var(--process-border);
    }

    .process-details-body[b-ygeajra8n6]::-webkit-scrollbar-track {
        background: transparent;
    }

/* =========================================================
   Overview sections
   ========================================================= */

.process-details-section[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    animation: process-content-in-b-ygeajra8n6 0.2s ease;
}

.process-details-section-heading[b-ygeajra8n6] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

    .process-details-section-heading > div[b-ygeajra8n6] {
        min-width: 0;
    }

    .process-details-section-heading h5[b-ygeajra8n6] {
        margin: 0;
        color: var(--process-text);
        font-size: 0.95rem;
        font-weight: 700;
        letter-spacing: -0.01em;
    }

    .process-details-section-heading p[b-ygeajra8n6] {
        margin: 0.2rem 0 0;
        color: var(--process-muted);
        font-size: 0.8rem;
        line-height: 1.4;
    }

.process-details-icon[b-ygeajra8n6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border: 1px solid var(--process-border);
    border-radius: 12px;
    background: var(--process-surface);
    font-size: 1.2rem;
}

    .process-details-icon.customer-icon[b-ygeajra8n6] {
        color: #5b8def;
    }

    .process-details-icon.processing-icon[b-ygeajra8n6] {
        color: #a184ed;
    }

    .process-details-icon.appointment-icon[b-ygeajra8n6] {
        color: #38a782;
    }

    .process-details-icon.note-icon[b-ygeajra8n6] {
        color: #e5a044;
    }

/* =========================================================
   Cards and fields
   ========================================================= */

.process-details-card[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--process-border);
    border-radius: 13px;
    background: var(--process-surface);
}

.process-details-field[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
    padding: 0.95rem 1rem;
}

    .process-details-field + .process-details-field[b-ygeajra8n6] {
        border-top: 1px solid var(--process-border);
    }

    .process-details-field > span:first-child[b-ygeajra8n6] {
        color: var(--process-muted);
        font-size: 0.78rem;
        font-weight: 500;
    }

    .process-details-field strong[b-ygeajra8n6] {
        overflow-wrap: anywhere;
        color: var(--process-text);
        font-size: 0.9rem;
        font-weight: 600;
        line-height: 1.5;
    }

/* =========================================================
   Status badges
   ========================================================= */

.process-details-status[b-ygeajra8n6] {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 0.4rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 650;
}

    .process-details-status.status-warning[b-ygeajra8n6] {
        border-color: rgb(225 166 34 / 22%);
        background: rgb(255 193 7 / 12%);
        color: #b58108;
    }

    .process-details-status.status-success[b-ygeajra8n6] {
        border-color: rgb(25 135 84 / 20%);
        background: rgb(25 135 84 / 10%);
        color: #21845a;
    }

html[data-bs-theme="dark"] .process-details-status.status-warning[b-ygeajra8n6] {
    color: #ffd36a;
}

html[data-bs-theme="dark"] .process-details-status.status-success[b-ygeajra8n6] {
    color: #75d6a6;
}

/* =========================================================
   Appointment display
   ========================================================= */

.process-details-appointment[b-ygeajra8n6] {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    padding: 1rem;
    border: 1px solid var(--process-border);
    border-radius: 13px;
    background: var(--process-surface);
}

    .process-details-appointment > i[b-ygeajra8n6] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 38px;
        width: 38px;
        height: 38px;
        border-radius: 10px;
        background: rgb(56 167 130 / 12%);
        color: #38a782;
        font-size: 1.2rem;
    }

    .process-details-appointment > div[b-ygeajra8n6] {
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
        min-width: 0;
        padding-top: 0.1rem;
    }

    .process-details-appointment span[b-ygeajra8n6] {
        color: var(--process-muted);
        font-size: 0.8rem;
    }

    .process-details-appointment strong[b-ygeajra8n6] {
        overflow-wrap: anywhere;
        color: var(--process-text);
        font-size: 0.9rem;
        font-weight: 600;
        line-height: 1.5;
    }

/* =========================================================
   Conversation notes
   ========================================================= */

.process-details-notes[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    color: var(--process-text);
}

.process-details-notes-toolbar[b-ygeajra8n6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.process-details-notes-count[b-ygeajra8n6] {
    color: var(--process-muted);
    font-size: 0.82rem;
}

.process-details-note-button[b-ygeajra8n6],
.process-details-note-save[b-ygeajra8n6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 38px;
    padding: 0.6rem 0.85rem;
    border: 1px solid var(--process-primary);
    border-radius: 9px;
    background: var(--process-primary);
    color: #fff;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 650;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}

    .process-details-note-button:hover:not(:disabled)[b-ygeajra8n6],
    .process-details-note-save:hover:not(:disabled)[b-ygeajra8n6] {
        transform: translateY(-1px);
        border-color: var(--process-primary-hover);
        background: var(--process-primary-hover);
    }

    .process-details-note-button:disabled[b-ygeajra8n6],
    .process-details-note-save:disabled[b-ygeajra8n6] {
        opacity: 0.55;
        cursor: not-allowed;
    }

.process-details-note-editor[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    padding: 1rem;
    border: 1px solid var(--process-border);
    border-radius: 13px;
    background: var(--process-surface);
    animation: process-content-in-b-ygeajra8n6 0.2s ease;
}

    .process-details-note-editor label[b-ygeajra8n6] {
        color: var(--process-text);
        font-size: 0.85rem;
        font-weight: 650;
    }

.process-details-note-textarea[b-ygeajra8n6] {
    width: 100%;
    min-height: 130px;
    padding: 0.85rem;
    resize: vertical;
    border: 1px solid var(--process-border);
    border-radius: 9px;
    outline: none;
    background: var(--process-bg);
    color: var(--process-text);
    font: inherit;
    font-size: 0.9rem;
    line-height: 1.6;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

    .process-details-note-textarea[b-ygeajra8n6]::placeholder {
        color: var(--process-muted);
        opacity: 0.8;
    }

    .process-details-note-textarea:focus[b-ygeajra8n6] {
        border-color: var(--process-primary);
        box-shadow: 0 0 0 3px rgb(213 53 40 / 12%);
    }

    .process-details-note-textarea:disabled[b-ygeajra8n6] {
        opacity: 0.65;
        cursor: not-allowed;
    }

.process-details-note-editor-footer[b-ygeajra8n6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

    .process-details-note-editor-footer > span[b-ygeajra8n6] {
        color: var(--process-muted);
        font-size: 0.76rem;
    }

.process-details-note-editor-actions[b-ygeajra8n6] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.process-details-note-cancel[b-ygeajra8n6] {
    min-height: 38px;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--process-border);
    border-radius: 9px;
    background: var(--process-bg);
    color: var(--process-text);
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 550;
    cursor: pointer;
    transition: background 0.2s ease;
}

    .process-details-note-cancel:hover:not(:disabled)[b-ygeajra8n6] {
        background: var(--process-surface-hover);
    }

    .process-details-note-cancel:disabled[b-ygeajra8n6] {
        opacity: 0.55;
        cursor: not-allowed;
    }

/* =========================================================
   Empty state
   ========================================================= */

.process-details-note-empty[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    padding: 2rem 1.25rem;
    border: 1px dashed var(--process-border);
    border-radius: 13px;
    background: var(--process-surface);
    color: var(--process-muted);
    text-align: center;
}

    .process-details-note-empty > i[b-ygeajra8n6] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        margin-bottom: 0.15rem;
        border-radius: 14px;
        background: var(--process-primary-soft);
        color: var(--process-primary);
        font-size: 1.6rem;
    }

    .process-details-note-empty strong[b-ygeajra8n6] {
        color: var(--process-text);
        font-size: 0.9rem;
        font-weight: 650;
    }

    .process-details-note-empty span[b-ygeajra8n6] {
        max-width: 300px;
        font-size: 0.82rem;
        line-height: 1.6;
    }

/* =========================================================
   Note entries
   ========================================================= */

.process-details-notes-list[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.process-details-note-entry[b-ygeajra8n6] {
    padding: 1rem;
    border: 1px solid var(--process-border);
    border-radius: 12px;
    background: var(--process-surface);
    transition: border-color 0.2s ease;
}

    .process-details-note-entry:hover[b-ygeajra8n6] {
        border-color: rgb(213 53 40 / 35%);
    }

.process-details-note-entry-header[b-ygeajra8n6] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.75rem;
}

.process-details-note-entry-icon[b-ygeajra8n6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: var(--process-primary-soft);
    color: var(--process-primary);
    font-size: 1rem;
}

.process-details-note-date[b-ygeajra8n6] {
    color: var(--process-muted);
    font-size: 0.77rem;
    font-weight: 500;
}

.process-details-note-entry-content[b-ygeajra8n6] {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--process-text);
    font-size: 0.88rem;
    line-height: 1.7;
    white-space: pre-wrap;
}

/* =========================================================
   Placeholder views
   ========================================================= */

.process-details-placeholder[b-ygeajra8n6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: 2rem 1.5rem;
    text-align: center;
    animation: process-content-in-b-ygeajra8n6 0.2s ease;
}

    .process-details-placeholder > .process-details-icon[b-ygeajra8n6] {
        width: 58px;
        height: 58px;
        border-radius: 16px;
        font-size: 1.65rem;
    }

    .process-details-placeholder h5[b-ygeajra8n6] {
        margin: 1rem 0 0.45rem;
        color: var(--process-text);
        font-size: 1rem;
        font-weight: 700;
    }

    .process-details-placeholder p[b-ygeajra8n6] {
        max-width: 330px;
        margin: 0;
        color: var(--process-muted);
        font-size: 0.88rem;
        line-height: 1.7;
    }

/* =========================================================
   Footer
   ========================================================= */

.process-details-footer[b-ygeajra8n6] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--process-border);
    background: var(--process-bg);
}

    .process-details-footer .btn-light[b-ygeajra8n6] {
        min-height: 38px;
        padding: 0.55rem 1rem;
        border: 1px solid var(--process-border);
        border-radius: 9px;
        background: var(--process-surface);
        color: var(--process-text);
        font-size: 0.85rem;
        font-weight: 600;
        transition: background 0.2s ease, border-color 0.2s ease;
    }

        .process-details-footer .btn-light:hover[b-ygeajra8n6] {
            border-color: var(--process-border);
            background: var(--process-surface-hover);
            color: var(--process-text);
        }

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 560px) {
    .process-details-panel[b-ygeajra8n6] {
        width: 100%;
    }

    .process-details-header[b-ygeajra8n6] {
        padding: 1.1rem 1rem;
    }

    .process-details-navigation[b-ygeajra8n6] {
        gap: 0.15rem;
        padding: 0.5rem 0.5rem 0;
    }

    .process-details-tab[b-ygeajra8n6] {
        min-height: 67px;
        gap: 0.35rem;
        padding: 0.55rem 0.05rem 0.7rem;
        font-size: 0.66rem;
    }

        .process-details-tab i[b-ygeajra8n6] {
            font-size: 1.15rem;
        }

        .process-details-tab.active[b-ygeajra8n6]::after {
            right: 5px;
            left: 5px;
        }

    .process-details-body[b-ygeajra8n6] {
        gap: 1.25rem;
        padding: 1rem;
    }

    .process-details-footer[b-ygeajra8n6] {
        padding: 0.85rem 1rem;
    }
}

@media (max-width: 360px) {
    .process-details-tab[b-ygeajra8n6] {
        font-size: 0.6rem;
    }

        .process-details-tab i[b-ygeajra8n6] {
            font-size: 1.05rem;
        }

    .process-details-note-editor-actions[b-ygeajra8n6] {
        width: 100%;
    }

        .process-details-note-editor-actions > button[b-ygeajra8n6] {
            flex: 1;
        }
}

/* =========================================================
   Animations
   ========================================================= */

@keyframes process-panel-in-b-ygeajra8n6 {
    from {
        transform: translateX(24px);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes process-backdrop-in-b-ygeajra8n6 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes process-content-in-b-ygeajra8n6 {
    from {
        transform: translateY(5px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* =========================================================
   Accessibility
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .process-details-panel[b-ygeajra8n6],
    .process-details-backdrop[b-ygeajra8n6],
    .process-details-panel *[b-ygeajra8n6],
    .process-details-panel *[b-ygeajra8n6]::before,
    .process-details-panel *[b-ygeajra8n6]::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}
/* /Pages/Process/ProcessDetailsPanelElements/ProcessAppointmentsSection.razor.rz.scp.css */

/* =========================================================
   Terminverwaltung
   ========================================================= */

.process-details-appointments[b-62ec4wrmnr] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    padding-bottom: 12px;
}

.process-details-appointments-toolbar[b-62ec4wrmnr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.process-details-appointments-count[b-62ec4wrmnr] {
    color: var(--bs-secondary-color, #77727d);
    font-size: 12px;
    font-weight: 500;
}

.process-details-icon.appointment-icon[b-62ec4wrmnr] {
    background: rgba(213, 53, 40, .09);
    color: #d53528;
}

.process-details-appointment-button[b-62ec4wrmnr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid rgba(213, 53, 40, .2);
    border-radius: 9px;
    background: rgba(213, 53, 40, .08);
    color: #d53528;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}

    .process-details-appointment-button i[b-62ec4wrmnr] {
        font-size: 16px;
    }

    .process-details-appointment-button:hover:not(:disabled)[b-62ec4wrmnr] {
        border-color: rgba(213, 53, 40, .4);
        background: rgba(213, 53, 40, .14);
    }

    .process-details-appointment-button:disabled[b-62ec4wrmnr] {
        opacity: .55;
        cursor: not-allowed;
    }

/* =========================================================
   Terminformular
   ========================================================= */

.process-details-appointment-editor[b-62ec4wrmnr],
.process-details-appointment-edit-area[b-62ec4wrmnr] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.process-details-appointment-editor[b-62ec4wrmnr] {
    padding: 16px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-card-bg, #fff);
}

    .process-details-appointment-editor h6[b-62ec4wrmnr] {
        margin: 0 0 2px;
        color: var(--bs-heading-color, #242129);
        font-size: 13px;
        font-weight: 700;
    }

    .process-details-appointment-editor label[b-62ec4wrmnr],
    .process-details-appointment-edit-area label[b-62ec4wrmnr] {
        display: block;
        margin-bottom: 6px;
        color: var(--bs-heading-color, #242129);
        font-size: 12px;
        font-weight: 600;
    }

.process-details-appointment-input[b-62ec4wrmnr] {
    display: block;
    width: 100%;
    min-height: 40px;
    padding: 9px 11px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 9px;
    outline: none;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #242129);
    font-family: inherit;
    font-size: 13px;
    transition: border-color .15s ease, box-shadow .15s ease;
}

    .process-details-appointment-input:focus[b-62ec4wrmnr] {
        border-color: rgba(213, 53, 40, .65);
        box-shadow: 0 0 0 3px rgba(213, 53, 40, .09);
    }

    .process-details-appointment-input:disabled[b-62ec4wrmnr] {
        opacity: .65;
        cursor: not-allowed;
    }

.process-details-appointment-editor-footer[b-62ec4wrmnr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 3px;
}

.process-details-appointment-actions[b-62ec4wrmnr] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.process-details-appointment-cancel[b-62ec4wrmnr],
.process-details-appointment-save[b-62ec4wrmnr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}

.process-details-appointment-cancel[b-62ec4wrmnr] {
    border-color: var(--bs-border-color, #e7e5e9);
    background: transparent;
    color: var(--bs-secondary-color, #77727d);
}

    .process-details-appointment-cancel:hover:not(:disabled)[b-62ec4wrmnr] {
        background: var(--bs-tertiary-bg, #f6f5f7);
    }

.process-details-appointment-save[b-62ec4wrmnr] {
    background: #d53528;
    color: #fff;
}

    .process-details-appointment-save:hover:not(:disabled)[b-62ec4wrmnr] {
        background: #b92d22;
    }

    .process-details-appointment-save:disabled[b-62ec4wrmnr],
    .process-details-appointment-cancel:disabled[b-62ec4wrmnr] {
        opacity: .55;
        cursor: not-allowed;
    }

/* =========================================================
   Leerer Zustand und Ladezustand
   ========================================================= */

.process-details-appointment-empty[b-62ec4wrmnr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 180px;
    padding: 24px 18px;
    border: 1px dashed var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-tertiary-bg, #faf9fb);
    color: var(--bs-secondary-color, #77727d);
    text-align: center;
    font-size: 12px;
}

    .process-details-appointment-empty > i[b-62ec4wrmnr] {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 46px;
        height: 46px;
        margin-bottom: 3px;
        border-radius: 13px;
        background: rgba(213, 53, 40, .08);
        color: #d53528;
        font-size: 23px;
    }

    .process-details-appointment-empty strong[b-62ec4wrmnr] {
        color: var(--bs-heading-color, #242129);
        font-size: 13px;
        font-weight: 600;
    }

    .process-details-appointment-empty span[b-62ec4wrmnr] {
        max-width: 280px;
        line-height: 1.6;
    }

/* =========================================================
   Terminliste
   ========================================================= */

.process-details-appointments-list[b-62ec4wrmnr] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.process-details-appointment-entry[b-62ec4wrmnr] {
    min-width: 0;
    padding: 15px 16px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-card-bg, #fff);
    transition: border-color .15s ease;
}

    .process-details-appointment-entry:hover[b-62ec4wrmnr] {
        border-color: rgba(213, 53, 40, .25);
    }

.process-details-appointment-entry-header[b-62ec4wrmnr] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.process-details-appointment-entry-icon[b-62ec4wrmnr] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: rgba(213, 53, 40, .08);
    color: #d53528;
    font-size: 17px;
}

.process-details-appointment-meta[b-62ec4wrmnr] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

    .process-details-appointment-meta strong[b-62ec4wrmnr] {
        color: var(--bs-heading-color, #242129);
        font-size: 13px;
        font-weight: 700;
    }

    .process-details-appointment-meta span[b-62ec4wrmnr] {
        display: flex;
        align-items: center;
        gap: 6px;
        color: var(--bs-secondary-color, #77727d);
        font-size: 12px;
        overflow-wrap: anywhere;
    }

        .process-details-appointment-meta span i[b-62ec4wrmnr] {
            font-size: 14px;
        }

.process-details-appointment-entry-footer[b-62ec4wrmnr] {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
    margin-top: 12px;
}

.process-details-appointment-edit-button[b-62ec4wrmnr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 8px;
    background: transparent;
    color: var(--bs-secondary-color, #77727d);
    font-size: 15px;
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}

    .process-details-appointment-edit-button:hover:not(:disabled)[b-62ec4wrmnr] {
        border-color: rgba(213, 53, 40, .3);
        background: rgba(213, 53, 40, .07);
        color: #d53528;
    }

    .process-details-appointment-edit-button:disabled[b-62ec4wrmnr] {
        opacity: .45;
        cursor: not-allowed;
    }

/* =========================================================
   Löschen bestätigen
   ========================================================= */

.process-details-appointment-delete-confirmation[b-62ec4wrmnr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--bs-border-color, #e7e5e9);
}

    .process-details-appointment-delete-confirmation > span[b-62ec4wrmnr] {
        color: var(--bs-body-color, #37323d);
        font-size: 12px;
        font-weight: 600;
    }

/* =========================================================
   Fehlermeldung
   ========================================================= */

.process-details-appointments .alert[b-62ec4wrmnr] {
    margin: 0;
    border-radius: 9px;
    font-size: 12px;
    line-height: 1.5;
}

/* =========================================================
   Dark Theme
   ========================================================= */

[data-bs-theme="dark"] .process-details-icon.appointment-icon[b-62ec4wrmnr] {
    background: rgba(213, 53, 40, .15);
    color: #ff8b81;
}

[data-bs-theme="dark"] .process-details-appointments-count[b-62ec4wrmnr] {
    color: #a7a1ad;
}

[data-bs-theme="dark"] .process-details-appointment-button[b-62ec4wrmnr] {
    border-color: rgba(255, 139, 129, .25);
    background: rgba(213, 53, 40, .14);
    color: #ff8b81;
}

    [data-bs-theme="dark"] .process-details-appointment-button:hover:not(:disabled)[b-62ec4wrmnr] {
        border-color: rgba(255, 139, 129, .4);
        background: rgba(213, 53, 40, .22);
    }

[data-bs-theme="dark"] .process-details-appointment-editor[b-62ec4wrmnr],
[data-bs-theme="dark"] .process-details-appointment-entry[b-62ec4wrmnr] {
    border-color: #38333e;
    background: #242129;
}

    [data-bs-theme="dark"] .process-details-appointment-editor h6[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-editor label[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-edit-area label[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-meta strong[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-empty strong[b-62ec4wrmnr] {
        color: #f0edf3;
    }

[data-bs-theme="dark"] .process-details-appointment-input[b-62ec4wrmnr] {
    border-color: #45404b;
    background: #1c191f;
    color: #f0edf3;
}

    [data-bs-theme="dark"] .process-details-appointment-input:focus[b-62ec4wrmnr] {
        border-color: rgba(255, 139, 129, .65);
        box-shadow: 0 0 0 3px rgba(213, 53, 40, .13);
    }

[data-bs-theme="dark"] .process-details-appointment-cancel[b-62ec4wrmnr] {
    border-color: #45404b;
    color: #c0bac8;
}

    [data-bs-theme="dark"] .process-details-appointment-cancel:hover:not(:disabled)[b-62ec4wrmnr] {
        background: #302b35;
    }

[data-bs-theme="dark"] .process-details-appointment-empty[b-62ec4wrmnr] {
    border-color: #45404b;
    background: #211e25;
}

    [data-bs-theme="dark"] .process-details-appointment-empty > i[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-entry-icon[b-62ec4wrmnr] {
        background: rgba(213, 53, 40, .15);
        color: #ff8b81;
    }

    [data-bs-theme="dark"] .process-details-appointment-empty[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-empty span[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-meta span[b-62ec4wrmnr],
    [data-bs-theme="dark"] .process-details-appointment-delete-confirmation > span[b-62ec4wrmnr] {
        color: #c0bac8;
    }

[data-bs-theme="dark"] .process-details-appointment-entry:hover[b-62ec4wrmnr] {
    border-color: rgba(255, 139, 129, .3);
}

[data-bs-theme="dark"] .process-details-appointment-edit-button[b-62ec4wrmnr] {
    border-color: #45404b;
    color: #b7b0bf;
}

    [data-bs-theme="dark"] .process-details-appointment-edit-button:hover:not(:disabled)[b-62ec4wrmnr] {
        border-color: rgba(255, 139, 129, .35);
        background: rgba(213, 53, 40, .14);
        color: #ff8b81;
    }

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 560px) {
    .process-details-appointments[b-62ec4wrmnr] {
        gap: 15px;
    }

    .process-details-appointment-editor[b-62ec4wrmnr] {
        padding: 13px;
    }

    .process-details-appointment-entry[b-62ec4wrmnr] {
        padding: 13px;
    }

    .process-details-appointment-empty[b-62ec4wrmnr] {
        min-height: 160px;
        padding: 20px 14px;
    }

    .process-details-appointment-delete-confirmation[b-62ec4wrmnr] {
        align-items: flex-start;
        flex-direction: column;
    }

        .process-details-appointment-delete-confirmation .process-details-appointment-actions[b-62ec4wrmnr] {
            width: 100%;
        }
}

@media (max-width: 360px) {
    .process-details-appointment-editor-footer[b-62ec4wrmnr] {
        align-items: flex-start;
        flex-direction: column;
    }

        .process-details-appointment-editor-footer > div:last-child[b-62ec4wrmnr] {
            width: 100%;
        }

    .process-details-appointment-actions[b-62ec4wrmnr] {
        width: 100%;
    }

    .process-details-appointment-cancel[b-62ec4wrmnr],
    .process-details-appointment-save[b-62ec4wrmnr] {
        flex: 1;
    }

    .process-details-appointment-button[b-62ec4wrmnr] {
        padding: 7px 9px;
    }
}

/* =========================================================
   Terminnotiz
   ========================================================= */

.process-details-appointment-note[b-62ec4wrmnr] {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    min-width: 0;
    margin-top: 12px;
    padding: 11px 12px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 9px;
    background: var(--bs-tertiary-bg, #f6f5f7);
    color: var(--bs-body-color, #37323d);
    font-size: 12px;
    line-height: 1.65;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

    .process-details-appointment-note > i[b-62ec4wrmnr] {
        flex: 0 0 auto;
        margin-top: 2px;
        color: #d53528;
        font-size: 15px;
    }

[data-bs-theme="dark"] .process-details-appointment-note[b-62ec4wrmnr] {
    border-color: #38333e;
    background: #1c191f;
    color: #d0cad6;
}

    [data-bs-theme="dark"] .process-details-appointment-note > i[b-62ec4wrmnr] {
        color: #ff8b81;
    }
/* /Pages/Process/ProcessDetailsPanelElements/ProcessConversationNotesSection.razor.rz.scp.css */
/* =========================================================
   Gesprächsnotizen
   ========================================================= */
.process-details-notes[b-eqc15dbcx9] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    padding-bottom: 12px;
}

/* =========================================================
   Abschnittsüberschrift
   ========================================================= */

.process-details-section[b-eqc15dbcx9] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

.process-details-section-heading[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    gap: 13px;
}

    .process-details-section-heading > div:last-child[b-eqc15dbcx9] {
        min-width: 0;
    }

    .process-details-section-heading h5[b-eqc15dbcx9] {
        margin: 0;
        color: var(--bs-heading-color, #242129);
        font-size: 15px;
        font-weight: 700;
        line-height: 1.4;
    }

    .process-details-section-heading p[b-eqc15dbcx9] {
        margin: 4px 0 0;
        color: var(--bs-secondary-color, #77727d);
        font-size: 12px;
        line-height: 1.5;
    }

.process-details-icon[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(119, 114, 125, .12);
    color: #77727d;
    font-size: 20px;
}

    .process-details-icon.note-icon[b-eqc15dbcx9] {
        background: rgba(213, 53, 40, .09);
        color: #d53528;
    }

/* =========================================================
   Werkzeugleiste
   ========================================================= */

.process-details-notes-toolbar[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.process-details-notes-count[b-eqc15dbcx9] {
    color: var(--bs-secondary-color, #77727d);
    font-size: 12px;
    font-weight: 500;
}

.process-details-note-button[b-eqc15dbcx9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid rgba(213, 53, 40, .2);
    border-radius: 9px;
    background: rgba(213, 53, 40, .08);
    color: #d53528;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}

    .process-details-note-button i[b-eqc15dbcx9] {
        font-size: 16px;
    }

    .process-details-note-button:hover:not(:disabled)[b-eqc15dbcx9] {
        border-color: rgba(213, 53, 40, .4);
        background: rgba(213, 53, 40, .14);
    }

    .process-details-note-button:active:not(:disabled)[b-eqc15dbcx9] {
        transform: translateY(1px);
    }

    .process-details-note-button:disabled[b-eqc15dbcx9] {
        opacity: .55;
        cursor: not-allowed;
    }

/* =========================================================
   Editor
   ========================================================= */

.process-details-note-editor[b-eqc15dbcx9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-card-bg, #fff);
}

    .process-details-note-editor label[b-eqc15dbcx9] {
        color: var(--bs-heading-color, #242129);
        font-size: 12px;
        font-weight: 600;
    }

.process-details-note-textarea[b-eqc15dbcx9] {
    display: block;
    width: 100%;
    min-height: 120px;
    padding: 12px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 9px;
    outline: none;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #242129);
    font-family: inherit;
    font-size: 13px;
    line-height: 1.6;
    resize: vertical;
    transition: border-color .15s ease, box-shadow .15s ease;
}

    .process-details-note-textarea[b-eqc15dbcx9]::placeholder {
        color: var(--bs-secondary-color, #77727d);
        opacity: .75;
    }

    .process-details-note-textarea:focus[b-eqc15dbcx9] {
        border-color: rgba(213, 53, 40, .65);
        box-shadow: 0 0 0 3px rgba(213, 53, 40, .09);
    }

    .process-details-note-textarea:disabled[b-eqc15dbcx9] {
        opacity: .65;
        cursor: not-allowed;
    }

.process-details-note-editor-footer[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

    .process-details-note-editor-footer > span[b-eqc15dbcx9] {
        color: var(--bs-secondary-color, #77727d);
        font-size: 11px;
        white-space: nowrap;
    }

.process-details-note-editor-actions[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.process-details-note-cancel[b-eqc15dbcx9],
.process-details-note-save[b-eqc15dbcx9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}

.process-details-note-cancel[b-eqc15dbcx9] {
    border-color: var(--bs-border-color, #e7e5e9);
    background: transparent;
    color: var(--bs-secondary-color, #77727d);
}

    .process-details-note-cancel:hover:not(:disabled)[b-eqc15dbcx9] {
        background: var(--bs-tertiary-bg, #f6f5f7);
    }

.process-details-note-save[b-eqc15dbcx9] {
    background: #d53528;
    color: #fff;
}

    .process-details-note-save:hover:not(:disabled)[b-eqc15dbcx9] {
        background: #b92d22;
    }

    .process-details-note-save:disabled[b-eqc15dbcx9],
    .process-details-note-cancel:disabled[b-eqc15dbcx9] {
        opacity: .55;
        cursor: not-allowed;
    }

/* =========================================================
   Fehlermeldung
   ========================================================= */

.process-details-notes .alert[b-eqc15dbcx9] {
    margin: 0;
    border-radius: 9px;
    font-size: 12px;
    line-height: 1.5;
}

/* =========================================================
   Leerer Zustand
   ========================================================= */

.process-details-note-empty[b-eqc15dbcx9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 180px;
    padding: 24px 18px;
    border: 1px dashed var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-tertiary-bg, #faf9fb);
    text-align: center;
}

    .process-details-note-empty > i[b-eqc15dbcx9] {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 46px;
        height: 46px;
        margin-bottom: 3px;
        border-radius: 13px;
        background: rgba(213, 53, 40, .08);
        color: #d53528;
        font-size: 23px;
    }

    .process-details-note-empty strong[b-eqc15dbcx9] {
        color: var(--bs-heading-color, #242129);
        font-size: 13px;
        font-weight: 600;
    }

    .process-details-note-empty span[b-eqc15dbcx9] {
        max-width: 280px;
        color: var(--bs-secondary-color, #77727d);
        font-size: 12px;
        line-height: 1.6;
    }

/* =========================================================
   Notizenliste
   ========================================================= */

.process-details-notes-list[b-eqc15dbcx9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.process-details-note-entry[b-eqc15dbcx9] {
    min-width: 0;
    padding: 15px 16px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-card-bg, #fff);
    transition: border-color .15s ease;
}

    .process-details-note-entry:hover[b-eqc15dbcx9] {
        border-color: rgba(213, 53, 40, .25);
    }

.process-details-note-entry-header[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 12px;
}

.process-details-note-entry-icon[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: rgba(213, 53, 40, .08);
    color: #d53528;
    font-size: 15px;
}

.process-details-note-date[b-eqc15dbcx9] {
    color: var(--bs-secondary-color, #77727d);
    font-size: 11px;
    font-weight: 500;
}

.process-details-note-entry-content[b-eqc15dbcx9] {
    margin: 0;
    color: var(--bs-body-color, #37323d);
    font-size: 13px;
    line-height: 1.75;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

/* =========================================================
   Dark Theme
   ========================================================= */

[data-bs-theme="dark"] .process-details-section-heading h5[b-eqc15dbcx9],
[data-bs-theme="dark"] .process-details-note-editor label[b-eqc15dbcx9],
[data-bs-theme="dark"] .process-details-note-empty strong[b-eqc15dbcx9] {
    color: #f0edf3;
}

[data-bs-theme="dark"] .process-details-section-heading p[b-eqc15dbcx9],
[data-bs-theme="dark"] .process-details-notes-count[b-eqc15dbcx9],
[data-bs-theme="dark"] .process-details-note-editor-footer > span[b-eqc15dbcx9],
[data-bs-theme="dark"] .process-details-note-date[b-eqc15dbcx9] {
    color: #a7a1ad;
}

[data-bs-theme="dark"] .process-details-icon.note-icon[b-eqc15dbcx9] {
    background: rgba(213, 53, 40, .15);
    color: #ff8b81;
}

[data-bs-theme="dark"] .process-details-note-button[b-eqc15dbcx9] {
    border-color: rgba(255, 139, 129, .25);
    background: rgba(213, 53, 40, .14);
    color: #ff8b81;
}

    [data-bs-theme="dark"] .process-details-note-button:hover:not(:disabled)[b-eqc15dbcx9] {
        border-color: rgba(255, 139, 129, .4);
        background: rgba(213, 53, 40, .22);
    }

[data-bs-theme="dark"] .process-details-note-editor[b-eqc15dbcx9],
[data-bs-theme="dark"] .process-details-note-entry[b-eqc15dbcx9] {
    border-color: #38333e;
    background: #242129;
}

[data-bs-theme="dark"] .process-details-note-textarea[b-eqc15dbcx9] {
    border-color: #45404b;
    background: #1c191f;
    color: #f0edf3;
}

    [data-bs-theme="dark"] .process-details-note-textarea:focus[b-eqc15dbcx9] {
        border-color: rgba(255, 139, 129, .65);
        box-shadow: 0 0 0 3px rgba(213, 53, 40, .13);
    }

[data-bs-theme="dark"] .process-details-note-cancel[b-eqc15dbcx9] {
    border-color: #45404b;
    color: #c0bac8;
}

    [data-bs-theme="dark"] .process-details-note-cancel:hover:not(:disabled)[b-eqc15dbcx9] {
        background: #302b35;
    }

[data-bs-theme="dark"] .process-details-note-empty[b-eqc15dbcx9] {
    border-color: #45404b;
    background: #211e25;
}

    [data-bs-theme="dark"] .process-details-note-empty > i[b-eqc15dbcx9],
    [data-bs-theme="dark"] .process-details-note-entry-icon[b-eqc15dbcx9] {
        background: rgba(213, 53, 40, .15);
        color: #ff8b81;
    }

    [data-bs-theme="dark"] .process-details-note-empty span[b-eqc15dbcx9],
    [data-bs-theme="dark"] .process-details-note-entry-content[b-eqc15dbcx9] {
        color: #c0bac8;
    }

[data-bs-theme="dark"] .process-details-note-entry:hover[b-eqc15dbcx9] {
    border-color: rgba(255, 139, 129, .3);
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 560px) {
    .process-details-section[b-eqc15dbcx9] {
        gap: 16px;
    }

    .process-details-notes[b-eqc15dbcx9] {
        gap: 15px;
    }

    .process-details-note-editor[b-eqc15dbcx9] {
        padding: 13px;
    }

    .process-details-note-entry[b-eqc15dbcx9] {
        padding: 13px;
    }

    .process-details-note-empty[b-eqc15dbcx9] {
        min-height: 160px;
        padding: 20px 14px;
    }
}

@media (max-width: 360px) {
    .process-details-note-editor-footer[b-eqc15dbcx9] {
        align-items: flex-start;
        flex-direction: column;
    }

    .process-details-note-editor-actions[b-eqc15dbcx9] {
        width: 100%;
    }

    .process-details-note-cancel[b-eqc15dbcx9],
    .process-details-note-save[b-eqc15dbcx9] {
        flex: 1;
    }

    .process-details-note-button[b-eqc15dbcx9] {
        padding: 7px 9px;
    }
}

/* =========================================================
   Notiz bearbeiten – Button rechts unten
   ========================================================= */
.process-details-note-entry-footer[b-eqc15dbcx9] {
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
}

.process-details-note-edit-button[b-eqc15dbcx9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 5px 9px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 8px;
    background: transparent;
    color: var(--bs-secondary-color, #77727d);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}

    .process-details-note-edit-button i[b-eqc15dbcx9] {
        font-size: 14px;
    }

    .process-details-note-edit-button:hover:not(:disabled)[b-eqc15dbcx9] {
        border-color: rgba(213, 53, 40, .3);
        background: rgba(213, 53, 40, .07);
        color: #d53528;
    }

    .process-details-note-edit-button:disabled[b-eqc15dbcx9] {
        opacity: .45;
        cursor: not-allowed;
    }

/* =========================================================
   Inline-Bearbeitung
   ========================================================= */

.process-details-note-edit-area[b-eqc15dbcx9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

    .process-details-note-edit-area .process-details-note-textarea[b-eqc15dbcx9] {
        box-sizing: border-box;
    }

    .process-details-note-edit-area .process-details-note-editor-footer[b-eqc15dbcx9] {
        margin-top: 0;
    }

/* =========================================================
   Dark Theme
   ========================================================= */

[data-bs-theme="dark"] .process-details-note-edit-button[b-eqc15dbcx9] {
    border-color: #45404b;
    color: #b7b0bf;
}

    [data-bs-theme="dark"] .process-details-note-edit-button:hover:not(:disabled)[b-eqc15dbcx9] {
        border-color: rgba(255, 139, 129, .35);
        background: rgba(213, 53, 40, .14);
        color: #ff8b81;
    }

.process-details-note-meta[b-eqc15dbcx9] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.process-details-note-author[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--bs-body-color, #37323d);
    font-size: 12px;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.process-details-note-meta .process-details-note-date[b-eqc15dbcx9],
.process-details-note-updated[b-eqc15dbcx9] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    color: var(--bs-secondary-color, #77727d);
    font-size: 11px;
    font-weight: 500;
}

[data-bs-theme="dark"] .process-details-note-author[b-eqc15dbcx9] {
    color: #f0edf3;
}

[data-bs-theme="dark"] .process-details-note-meta .process-details-note-date[b-eqc15dbcx9],
[data-bs-theme="dark"] .process-details-note-updated[b-eqc15dbcx9] {
    color: #a7a1ad;
}
/* /Pages/Process/ProcessDetailsPanelElements/ProcessOverviewSection.razor.rz.scp.css */
/* =========================================================
   Process Overview
   ========================================================= */
.process-overview[b-08ky4qputo] {
    display: flex;
    flex-direction: column;
    gap: 26px;
    min-width: 0;
    padding-bottom: 12px;
}

/* =========================================================
   Kundenkarte
   ========================================================= */

.process-overview-customer[b-08ky4qputo] {
    overflow: hidden;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-card-bg, #fff);
}

/* Ansprechpartner bearbeiten */

.process-overview-customer-header[b-08ky4qputo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}

    .process-overview-customer-header .process-overview-customer-top[b-08ky4qputo] {
        flex: 1;
        min-width: 0;
    }

.process-overview-edit-contact-button[b-08ky4qputo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    margin: 15px 15px 0 0;
    padding: 0;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 8px;
    background: var(--bs-tertiary-bg, #f7f7f9);
    color: var(--bs-secondary-color, #77727d);
    cursor: pointer;
    transition: color .2s ease, border-color .2s ease, background .2s ease;
}

    .process-overview-edit-contact-button i[b-08ky4qputo] {
        font-size: 16px;
    }

    .process-overview-edit-contact-button:hover:not(:disabled)[b-08ky4qputo] {
        border-color: #d53528;
        background: rgba(213, 53, 40, .08);
        color: #d53528;
    }

    .process-overview-edit-contact-button:focus-visible[b-08ky4qputo] {
        outline: 2px solid #d53528;
        outline-offset: 2px;
    }

    .process-overview-edit-contact-button:disabled[b-08ky4qputo] {
        opacity: .5;
        cursor: not-allowed;
    }

.process-overview-contact-editor[b-08ky4qputo] {
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin: 0 18px 14px;
    padding: 14px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 9px;
    background: var(--bs-tertiary-bg, #f7f7f9);
}

    .process-overview-contact-editor > label[b-08ky4qputo] {
        color: var(--bs-heading-color, #242129);
        font-size: 12px;
        font-weight: 600;
    }

    .process-overview-contact-editor .form-select[b-08ky4qputo] {
        min-width: 0;
        font-size: 12px;
    }

.process-overview-contact-editor-actions[b-08ky4qputo] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

    .process-overview-contact-editor-actions button[b-08ky4qputo] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
    }

.process-overview-contact-editor-error[b-08ky4qputo] {
    color: #c52e24;
    font-size: 12px;
    line-height: 1.5;
}

.process-overview-customer-top[b-08ky4qputo] {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 15px 18px;
}

.process-overview-avatar[b-08ky4qputo] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(213, 53, 40, .15);
    border-radius: 11px;
    background: rgba(213, 53, 40, .09);
    color: #d53528;
    font-size: 17px;
    font-weight: 700;
}

.process-overview-customer-info[b-08ky4qputo] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.process-overview-eyebrow[b-08ky4qputo] {
    color: #d53528;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

.process-overview-customer-info h3[b-08ky4qputo] {
    margin: 0;
    color: var(--bs-heading-color, #242129);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.process-overview-customer-number[b-08ky4qputo] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--bs-secondary-color, #77727d);
    font-size: 11px;
}

    .process-overview-customer-number i[b-08ky4qputo] {
        font-size: 14px;
    }

/* =========================================================
   Kundeninformationen
   ========================================================= */

.process-overview-customer-details[b-08ky4qputo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 16px;
    margin-top: 0;
    padding: 14px 18px 18px;
    border-top: 1px solid var(--bs-border-color, #e7e5e9);
}

.process-overview-customer-detail[b-08ky4qputo] {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 9px;
    min-width: 0;
    padding: 10px 0;
    border: none;
    border-radius: 0;
    background: transparent;
}

    .process-overview-customer-detail > i[b-08ky4qputo] {
        margin-top: 2px;
        color: var(--bs-secondary-color, #77727d);
        font-size: 16px;
        line-height: 1.4;
    }

    .process-overview-customer-detail > div[b-08ky4qputo] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        min-width: 0;
    }

        .process-overview-customer-detail > div > span[b-08ky4qputo],
        .process-overview-customer-detail > span:first-child[b-08ky4qputo] {
            color: var(--bs-secondary-color, #77727d);
            font-size: 10px;
            font-weight: 500;
            line-height: 1.4;
        }

    .process-overview-customer-detail strong[b-08ky4qputo],
    .process-overview-customer-detail a[b-08ky4qputo] {
        display: block;
        max-width: 100%;
        color: var(--bs-heading-color, #242129);
        font-size: 12px;
        font-weight: 600;
        line-height: 1.5;
        overflow-wrap: anywhere;
    }

    .process-overview-customer-detail a[b-08ky4qputo] {
        text-decoration: none;
    }

        .process-overview-customer-detail a:hover[b-08ky4qputo] {
            color: #d53528;
            text-decoration: underline;
        }

.process-overview-detail-empty[b-08ky4qputo] {
    color: var(--bs-secondary-color, #77727d);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
}

.process-overview-contact-person[b-08ky4qputo] {
    grid-column: 1 / -1;
}

.process-overview-contact-person-name[b-08ky4qputo] {
    font-size: 1rem;
}

.process-overview-missing-value[b-08ky4qputo] {
    color: var(--text-muted, #999);
    font-weight: 400;
    font-style: italic;
}

/* =========================================================
   Kundenhinweise
   ========================================================= */

.process-overview-customer-notes[b-08ky4qputo] {
    display: flex;
    grid-column: 1 / -1;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
    padding: 13px 0 4px;
    border-top: 1px solid var(--bs-border-color, #e7e5e9);
}

    .process-overview-customer-notes > span[b-08ky4qputo] {
        display: flex;
        align-items: center;
        gap: 7px;
        color: var(--bs-secondary-color, #77727d);
        font-size: 11px;
        font-weight: 500;
    }

        .process-overview-customer-notes > span i[b-08ky4qputo] {
            font-size: 14px;
        }

    .process-overview-customer-notes p[b-08ky4qputo] {
        width: 100%;
        margin: 0;
        padding: 10px 12px;
        border-left: 3px solid #d53528;
        border-radius: 0 6px 6px 0;
        background: rgba(213, 53, 40, .05);
        color: var(--bs-heading-color, #242129);
        font-size: 12px;
        line-height: 1.7;
        white-space: pre-wrap;
        overflow-wrap: anywhere;
    }

/* =========================================================
   Ladeanzeige für Kundendaten
   ========================================================= */

.process-overview-customer-loading[b-08ky4qputo] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 18px;
    border-top: 1px solid var(--bs-border-color, #e7e5e9);
    color: var(--bs-secondary-color, #77727d);
    font-size: 12px;
}

    .process-overview-customer-loading i[b-08ky4qputo] {
        font-size: 15px;
    }

/* =========================================================
   Abschnittsüberschriften
   ========================================================= */

.process-overview-section[b-08ky4qputo] {
    display: flex;
    flex-direction: column;
    gap: 15px;
    min-width: 0;
}

.process-overview-section-heading[b-08ky4qputo] {
    display: flex;
    align-items: center;
    gap: 13px;
}

    .process-overview-section-heading > div:last-child[b-08ky4qputo] {
        min-width: 0;
    }

    .process-overview-section-heading h4[b-08ky4qputo] {
        margin: 0;
        color: var(--bs-heading-color, #242129);
        font-size: 15px;
        font-weight: 700;
        line-height: 1.4;
    }

    .process-overview-section-heading p[b-08ky4qputo] {
        margin: 4px 0 0;
        color: var(--bs-secondary-color, #77727d);
        font-size: 12px;
        line-height: 1.5;
    }

.process-overview-section-icon[b-08ky4qputo] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    font-size: 20px;
}

.processing-icon[b-08ky4qputo] {
    color: #b7791f;
    background: rgba(217, 153, 48, .13);
}

.appointment-icon[b-08ky4qputo] {
    color: #4779bd;
    background: rgba(71, 121, 189, .12);
}

.reference-icon[b-08ky4qputo] {
    color: #77727d;
    background: rgba(119, 114, 125, .12);
}

/* =========================================================
   Bearbeitungsstatus
   ========================================================= */

.process-overview-status-grid[b-08ky4qputo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.process-overview-status-card[b-08ky4qputo] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
    min-height: 126px;
    padding: 15px;
    border: 1px solid var(--bs-border-color, #e7e5eb);
    border-radius: 12px;
    background: var(--bs-card-bg, #fff);
    transition: border-color .2s ease, box-shadow .2s ease;
}

    .process-overview-status-card:has(.process-overview-completion.is-complete)[b-08ky4qputo] {
        border-color: rgba(35, 131, 75, .28);
    }

.process-overview-status-icon[b-08ky4qputo] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    font-size: 18px;
}

.callback-icon[b-08ky4qputo] {
    color: #b7791f;
    background: rgba(217, 153, 48, .13);
}

.acknowledgement-icon[b-08ky4qputo] {
    color: #4779bd;
    background: rgba(71, 121, 189, .12);
}

.process-overview-status-content[b-08ky4qputo] {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-self: center;
    gap: 8px;
    min-width: 0;
}

.process-overview-status-label[b-08ky4qputo] {
    color: var(--bs-heading-color, #242129);
    font-size: 13px;
    font-weight: 700;
}

.process-overview-status-content strong[b-08ky4qputo] {
    color: var(--bs-heading-color, #242129);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.process-overview-status-indicator[b-08ky4qputo] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    font-size: 14px;
}

    .process-overview-status-indicator.is-pending[b-08ky4qputo] {
        color: #946200;
        background: rgba(217, 153, 48, .14);
    }

    .process-overview-status-indicator.is-complete[b-08ky4qputo] {
        color: #23834b;
        background: rgba(35, 131, 75, .11);
    }

/* =========================================================
   Anforderung und Erledigt-Status
   ========================================================= */

.process-overview-requirement[b-08ky4qputo],
.process-overview-completion[b-08ky4qputo] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    font-size: 11px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

    .process-overview-requirement i[b-08ky4qputo],
    .process-overview-completion i[b-08ky4qputo] {
        flex-shrink: 0;
        font-size: 14px;
    }

    .process-overview-requirement.is-required[b-08ky4qputo] {
        color: #4779bd;
    }

    .process-overview-requirement.is-not-required[b-08ky4qputo] {
        color: var(--bs-secondary-color, #77727d);
    }

    .process-overview-completion.is-complete[b-08ky4qputo] {
        color: #23834b;
        font-weight: 600;
    }

    .process-overview-completion.is-pending[b-08ky4qputo] {
        color: #946200;
    }

    .process-overview-completion.is-not-required[b-08ky4qputo] {
        color: var(--bs-secondary-color, #77727d);
    }

.process-overview-status-card .process-overview-toggle[b-08ky4qputo] {
    align-self: center;
    flex-shrink: 0;
}

/* =========================================================
   Drei-Stufen-Schalter
   ========================================================= */

.process-overview-toggle[b-08ky4qputo] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 48px;
    width: 48px;
    height: 28px;
    padding: 3px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 999px;
    background: var(--bs-tertiary-bg, #f0eff2);
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease;
}

    .process-overview-toggle.is-pending[b-08ky4qputo] {
        justify-content: center;
        border-color: #d99a30;
        background: #d99a30;
    }

    .process-overview-toggle.is-complete[b-08ky4qputo] {
        justify-content: flex-end;
        border-color: #269b68;
        background: #269b68;
    }

.process-overview-toggle-thumb[b-08ky4qputo] {
    display: block;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
    transition: transform .2s ease;
}

.process-overview-toggle:hover:not(:disabled)[b-08ky4qputo] {
    filter: brightness(.96);
}

.process-overview-toggle:focus-visible[b-08ky4qputo] {
    outline: 2px solid #d53528;
    outline-offset: 3px;
}

.process-overview-toggle:disabled[b-08ky4qputo] {
    opacity: .5;
    cursor: not-allowed;
}

/* =========================================================
   Hinweise zur Bearbeitung
   ========================================================= */

.process-overview-notice[b-08ky4qputo] {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 12px 14px;
    border: 1px solid rgba(217, 153, 48, .22);
    border-radius: 10px;
    background: rgba(217, 153, 48, .08);
    color: #946200;
    font-size: 12px;
    line-height: 1.6;
}

    .process-overview-notice > i[b-08ky4qputo] {
        flex-shrink: 0;
        margin-top: 1px;
        font-size: 16px;
    }

    .process-overview-notice.is-success[b-08ky4qputo] {
        border-color: rgba(35, 131, 75, .18);
        background: rgba(35, 131, 75, .07);
        color: #23834b;
    }

    .process-overview-notice.is-error[b-08ky4qputo] {
        border-color: rgba(213, 53, 40, .22);
        background: rgba(213, 53, 40, .07);
        color: #c52e24;
    }

/* =========================================================
   Allgemeine Inhaltskarte
   ========================================================= */

.process-overview-card[b-08ky4qputo] {
    overflow: hidden;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 12px;
    background: var(--bs-card-bg, #fff);
}

/* =========================================================
   Termin
   ========================================================= */

.process-overview-appointment[b-08ky4qputo] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    padding: 18px;
}

.process-overview-appointment-date[b-08ky4qputo] {
    display: flex;
    flex: 0 0 60px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 66px;
    padding: 8px;
    border: 1px solid rgba(71, 121, 189, .18);
    border-radius: 12px;
    background: rgba(71, 121, 189, .09);
    color: #4779bd;
}

    .process-overview-appointment-date span[b-08ky4qputo] {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
    }

    .process-overview-appointment-date strong[b-08ky4qputo] {
        font-size: 24px;
        line-height: 1.2;
    }

.process-overview-appointment-details[b-08ky4qputo] {
    display: flex;
    flex: 1 1 180px;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

    .process-overview-appointment-details > strong[b-08ky4qputo] {
        color: var(--bs-heading-color, #242129);
        font-size: 13px;
        font-weight: 600;
        line-height: 1.5;
        overflow-wrap: normal;
        word-break: normal;
        text-transform: capitalize;
    }

    .process-overview-appointment-details > span[b-08ky4qputo] {
        display: flex;
        align-items: center;
        gap: 6px;
        color: var(--bs-secondary-color, #77727d);
        font-size: 12px;
    }

        .process-overview-appointment-details > span i[b-08ky4qputo] {
            font-size: 15px;
        }

.process-overview-appointment-badge[b-08ky4qputo] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
    padding: 5px 9px;
    border-radius: 20px;
    background: rgba(71, 121, 189, .1);
    color: #4779bd;
    font-size: 11px;
    font-weight: 600;
}

/* =========================================================
   Terminnotiz
   ========================================================= */

.process-overview-appointment-note[b-08ky4qputo] {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    margin-top: 2px;
    padding: 11px 12px;
    border: 1px solid var(--bs-border-color, #e7e5e9);
    border-radius: 9px;
    background: var(--bs-tertiary-bg, #f6f5f7);
    color: var(--bs-body-color, #37323d);
    font-size: 12px;
    line-height: 1.65;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

    .process-overview-appointment-note > i[b-08ky4qputo] {
        flex: 0 0 auto;
        margin-top: 2px;
        color: #4779bd;
        font-size: 15px;
    }

    .process-overview-appointment-note > span[b-08ky4qputo] {
        min-width: 0;
    }

/* =========================================================
   Kein Termin vorhanden
   ========================================================= */

.process-overview-empty[b-08ky4qputo] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px;
}

.process-overview-empty-icon[b-08ky4qputo] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 11px;
    background: var(--bs-tertiary-bg, #f6f5f7);
    color: var(--bs-secondary-color, #77727d);
    font-size: 20px;
}

.process-overview-empty > div:last-child[b-08ky4qputo] {
    min-width: 0;
}

.process-overview-empty strong[b-08ky4qputo] {
    display: block;
    color: var(--bs-heading-color, #242129);
    font-size: 13px;
    font-weight: 600;
}

.process-overview-empty p[b-08ky4qputo] {
    margin: 5px 0 0;
    color: var(--bs-secondary-color, #77727d);
    font-size: 12px;
    line-height: 1.5;
}

/* =========================================================
   Weitere Informationen
   ========================================================= */

.process-overview-reference-row[b-08ky4qputo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 16px;
}

    .process-overview-reference-row > span[b-08ky4qputo] {
        color: var(--bs-secondary-color, #77727d);
        font-size: 11px;
    }

    .process-overview-reference-row strong[b-08ky4qputo] {
        color: var(--bs-heading-color, #242129);
        font-size: 12px;
        font-weight: 600;
    }

/* =========================================================
   Dark Theme
   ========================================================= */

[data-bs-theme="dark"] .process-overview-customer[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-status-card[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-card[b-08ky4qputo] {
    border-color: #38333e;
    background: #242129;
}

[data-bs-theme="dark"] .process-overview-customer-info h3[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-section-heading h4[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-status-content strong[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-status-label[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-appointment-details > strong[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-empty strong[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-reference-row strong[b-08ky4qputo] {
    color: #f0edf3;
}

[data-bs-theme="dark"] .process-overview-customer-number[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-section-heading p[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-appointment-details > span[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-empty p[b-08ky4qputo],
[data-bs-theme="dark"] .process-overview-reference-row > span[b-08ky4qputo] {
    color: #a7a1ad;
}

[data-bs-theme="dark"] .process-overview-avatar[b-08ky4qputo] {
    border-color: rgba(213, 53, 40, .3);
    background: rgba(213, 53, 40, .15);
    color: #ff8b81;
}

[data-bs-theme="dark"] .process-overview-notice[b-08ky4qputo] {
    color: #f0c16d;
}

    [data-bs-theme="dark"] .process-overview-notice.is-success[b-08ky4qputo] {
        color: #76d69a;
    }

    [data-bs-theme="dark"] .process-overview-notice.is-error[b-08ky4qputo] {
        color: #ff8b81;
    }

[data-bs-theme="dark"] .process-overview-appointment-date[b-08ky4qputo] {
    border-color: rgba(110, 159, 224, .2);
    background: rgba(71, 121, 189, .15);
    color: #9bc4ff;
}

[data-bs-theme="dark"] .process-overview-appointment-badge[b-08ky4qputo] {
    background: rgba(71, 121, 189, .17);
    color: #9bc4ff;
}

[data-bs-theme="dark"] .process-overview-appointment-note[b-08ky4qputo] {
    border-color: #38333e;
    background: #1c191f;
    color: #d0cad6;
}

    [data-bs-theme="dark"] .process-overview-appointment-note > i[b-08ky4qputo] {
        color: #9bc4ff;
    }

[data-bs-theme="dark"] .process-overview-empty-icon[b-08ky4qputo] {
    background: #302b35;
    color: #b7b0bf;
}

/* Dark Theme: Ansprechpartner bearbeiten */

[data-bs-theme="dark"] .process-overview-edit-contact-button[b-08ky4qputo] {
    border-color: #4b4552;
    background: #302b35;
    color: #a7a1ad;
}

    [data-bs-theme="dark"] .process-overview-edit-contact-button:hover:not(:disabled)[b-08ky4qputo] {
        border-color: #ff8b81;
        background: rgba(213, 53, 40, .12);
        color: #ff8b81;
    }

[data-bs-theme="dark"] .process-overview-contact-editor[b-08ky4qputo] {
    border-color: #38333e;
    background: #1c191f;
}

    [data-bs-theme="dark"] .process-overview-contact-editor > label[b-08ky4qputo] {
        color: #f0edf3;
    }

[data-bs-theme="dark"] .process-overview-contact-editor-error[b-08ky4qputo] {
    color: #ff8b81;
}

/* Dark Theme: Drei-Stufen-Schalter */

[data-bs-theme="dark"] .process-overview-toggle[b-08ky4qputo] {
    border-color: #4b4552;
    background: #302b35;
}

    [data-bs-theme="dark"] .process-overview-toggle.is-pending[b-08ky4qputo] {
        border-color: #d99a30;
        background: #d99a30;
    }

    [data-bs-theme="dark"] .process-overview-toggle.is-complete[b-08ky4qputo] {
        border-color: #269b68;
        background: #269b68;
    }

    [data-bs-theme="dark"] .process-overview-toggle:focus-visible[b-08ky4qputo] {
        outline-color: #ff8177;
    }

[data-bs-theme="dark"] .process-overview-requirement.is-required[b-08ky4qputo] {
    color: #9bc4ff;
}

[data-bs-theme="dark"] .process-overview-requirement.is-not-required[b-08ky4qputo] {
    color: #a7a1ad;
}

[data-bs-theme="dark"] .process-overview-completion.is-complete[b-08ky4qputo] {
    color: #76d69a;
}

[data-bs-theme="dark"] .process-overview-completion.is-pending[b-08ky4qputo] {
    color: #f0c16d;
}

[data-bs-theme="dark"] .process-overview-completion.is-not-required[b-08ky4qputo] {
    color: #a7a1ad;
}

/* Kundeninformationen im Dark Theme */

[data-bs-theme="dark"] .process-overview-customer-details[b-08ky4qputo] {
    border-top-color: #38333e;
}

[data-bs-theme="dark"] .process-overview-customer-detail[b-08ky4qputo] {
    border: none;
    background: transparent;
}

    [data-bs-theme="dark"] .process-overview-customer-detail > i[b-08ky4qputo],
    [data-bs-theme="dark"] .process-overview-customer-detail > div > span[b-08ky4qputo],
    [data-bs-theme="dark"] .process-overview-customer-detail > span:first-child[b-08ky4qputo],
    [data-bs-theme="dark"] .process-overview-customer-notes > span[b-08ky4qputo],
    [data-bs-theme="dark"] .process-overview-customer-loading[b-08ky4qputo] {
        color: #a7a1ad;
    }

    [data-bs-theme="dark"] .process-overview-customer-detail strong[b-08ky4qputo],
    [data-bs-theme="dark"] .process-overview-customer-detail a[b-08ky4qputo],
    [data-bs-theme="dark"] .process-overview-customer-notes p[b-08ky4qputo] {
        color: #f0edf3;
    }

        [data-bs-theme="dark"] .process-overview-customer-detail a:hover[b-08ky4qputo] {
            color: #ff8b81;
        }

[data-bs-theme="dark"] .process-overview-customer-notes[b-08ky4qputo] {
    border-top-color: #38333e;
}

    [data-bs-theme="dark"] .process-overview-customer-notes p[b-08ky4qputo] {
        border-left-color: #d53528;
        background: rgba(213, 53, 40, .09);
    }

[data-bs-theme="dark"] .process-overview-customer-loading[b-08ky4qputo] {
    border-top-color: #38333e;
}

/* =========================================================
   Kundentyp-Badges
   ========================================================= */

.customer-type-badge[b-08ky4qputo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    padding: 5px 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 650;
    line-height: 1.3;
    white-space: nowrap;
}

.customer-type-company[b-08ky4qputo] {
    border-color: #b9e4c8;
    background: #e8f7ed;
    color: #237644;
}

.customer-type-private[b-08ky4qputo] {
    border-color: #bfd7ff;
    background: #eaf2ff;
    color: #285db0;
}

.customer-type-supplier[b-08ky4qputo] {
    border-color: #f0d994;
    background: #fff6d9;
    color: #87630b;
}

.customer-type-unknown[b-08ky4qputo] {
    border-color: var(--bs-border-color, #e8e7eb);
    background: var(--bs-tertiary-bg, #f7f7f9);
    color: var(--bs-secondary-color, #777580);
}

[data-bs-theme="dark"] .customer-type-company[b-08ky4qputo] {
    border-color: #315c42;
    background: #20392a;
    color: #91dfaa;
}

[data-bs-theme="dark"] .customer-type-private[b-08ky4qputo] {
    border-color: #354f78;
    background: #24334c;
    color: #a8c9ff;
}

[data-bs-theme="dark"] .customer-type-supplier[b-08ky4qputo] {
    border-color: #665326;
    background: #40351c;
    color: #f2d477;
}

.customer-type-customer-supplier[b-08ky4qputo] {
    border-color: #d8c4f7;
    background: #f3ebff;
    color: #6b21a8;
}

[data-bs-theme="dark"] .customer-type-customer-supplier[b-08ky4qputo] {
    border-color: #58337a;
    background: #36204d;
    color: #d8b4fe;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 560px) {
    .process-overview[b-08ky4qputo] {
        gap: 23px;
    }

    .process-overview-customer-top[b-08ky4qputo] {
        gap: 12px;
        padding: 13px 15px;
    }

    .process-overview-edit-contact-button[b-08ky4qputo] {
        margin: 13px 12px 0 0;
    }

    .process-overview-contact-editor[b-08ky4qputo] {
        margin-right: 15px;
        margin-left: 15px;
    }

    .process-overview-avatar[b-08ky4qputo] {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .process-overview-customer-info h3[b-08ky4qputo] {
        font-size: 15px;
    }

    .process-overview-customer-details[b-08ky4qputo] {
        gap: 8px 12px;
        padding: 12px 15px 15px;
    }

    .process-overview-customer-detail[b-08ky4qputo] {
        grid-template-columns: 16px minmax(0, 1fr);
        gap: 7px;
        padding: 8px 0;
    }

        .process-overview-customer-detail > i[b-08ky4qputo] {
            font-size: 14px;
        }

        .process-overview-customer-detail strong[b-08ky4qputo],
        .process-overview-customer-detail a[b-08ky4qputo] {
            font-size: 11px;
        }

    .process-overview-status-grid[b-08ky4qputo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .process-overview-status-card[b-08ky4qputo] {
        min-height: 116px;
        padding: 14px;
    }

    .process-overview-appointment[b-08ky4qputo] {
        gap: 12px;
        padding: 14px;
    }

    .process-overview-appointment-details[b-08ky4qputo] {
        flex-basis: calc(100% - 72px);
    }

    .process-overview-appointment-badge[b-08ky4qputo] {
        margin-left: 72px;
    }
}

@media (max-width: 360px) {
    .process-overview-customer-top[b-08ky4qputo] {
        align-items: flex-start;
    }

    .process-overview-customer-details[b-08ky4qputo] {
        gap: 7px 8px;
        padding: 10px;
    }

    .process-overview-customer-detail[b-08ky4qputo] {
        grid-template-columns: 14px minmax(0, 1fr);
        gap: 5px;
        padding: 7px 0;
    }

        .process-overview-customer-detail > i[b-08ky4qputo] {
            font-size: 13px;
        }

        .process-overview-customer-detail > div > span[b-08ky4qputo],
        .process-overview-customer-detail > span:first-child[b-08ky4qputo] {
            font-size: 9px;
        }

        .process-overview-customer-detail strong[b-08ky4qputo],
        .process-overview-customer-detail a[b-08ky4qputo] {
            font-size: 10px;
        }

    .process-overview-appointment-date[b-08ky4qputo] {
        flex-basis: 52px;
        width: 52px;
    }

    .process-overview-appointment-details[b-08ky4qputo] {
        flex-basis: calc(100% - 64px);
    }

    .process-overview-appointment-badge[b-08ky4qputo] {
        margin-left: 64px;
    }
}

/* =========================================================
   Accessibility
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .process-overview-toggle[b-08ky4qputo],
    .process-overview-toggle-thumb[b-08ky4qputo],
    .process-overview-status-card[b-08ky4qputo],
    .process-overview-edit-contact-button[b-08ky4qputo] {
        animation: none;
        transition: none;
    }
}

.process-overview-section:first-child > .process-overview-card[b-08ky4qputo] {
    width: 100%;
    margin-left: 0;
    box-sizing: border-box;
    padding: 16px 18px;
}