/* /Components/Account/Shared/LoginLayout.razor.rz.scp.css */
.login-page[b-8ta2hzyzko] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 32px 16px;
    background: var(--tsc-sidebar);
    background-image: linear-gradient(180deg, var(--tsc-yellow) 0, var(--tsc-yellow) 6px, transparent 6px);
}

/* Hinweis der Demo-Instanz (DemoBanner) so breit wie die Karte, als eigene Fläche über ihr */
.login-page[b-8ta2hzyzko]  .demo-banner {
    width: 100%;
    max-width: 400px;
    padding: calc(12px + var(--demo-stripe)) 16px 12px 16px;
    border: 1px solid #F0D88F;
    border-bottom: 2px solid var(--tsc-warning);
    border-radius: var(--tsc-radius);
}

.login-card[b-8ta2hzyzko] {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 400px;
    padding: 32px 28px 28px 28px;
    border-radius: var(--tsc-radius);
    background: var(--tsc-surface);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
}

.login-crest[b-8ta2hzyzko] {
    align-self: center;
    width: auto;
    height: 140px;
    margin-bottom: 12px;
}

.login-title[b-8ta2hzyzko] {
    margin-bottom: 20px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 700;
}

/* Impressum und Datenschutz unter der Karte, hell auf Vereinsblau */
.login-legal[b-8ta2hzyzko] {
    color: #DCE5F2;
    font-size: 0.875rem;
}
/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
/* Inhalt füllt die Höhe der Seite, die Fußzeile steht darunter am unteren Rand des Fensters. Bei langem Inhalt rutscht sie
   mit nach unten, sie überdeckt nie etwas. Die Höhe reichen main, .content und .page-body weiter (app.css, Mein Konto). */
.account-layout[b-fuar05rg0h] {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.account-main[b-fuar05rg0h] {
    flex: 1 0 auto;
}

/* Impressum, Datenschutzerklärung und Datenschutz intern klein und gedämpft unter dem Inhalt von Mein Konto */
.account-legal[b-fuar05rg0h] {
    margin-top: 48px;
    padding-top: 12px;
    border-top: 1px solid var(--tsc-divider);
    color: var(--tsc-muted);
    font-size: 0.8125rem;
}
/* /Components/Layout/DemoBanner.razor.rz.scp.css */
/* Gelb wie eine Warnung (docs/oberflaeche.md): auffällig, aber ohne den Inhalt zu verdecken. Steht im Fluss der Seite,
   nicht fest, damit auf dem Smartphone nichts überlagert wird. Der schraffierte Streifen oben und die kräftige
   Unterkante heben die Leiste von den gelben Hinweisen im Inhalt ab, ohne nach Fehler auszusehen. */
.demo-banner[b-v9vt4wxfn6] {
    --demo-stripe: 5px;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    padding: calc(10px + var(--demo-stripe)) 16px 10px 16px;
    border-bottom: 2px solid var(--tsc-warning);
    background:
        repeating-linear-gradient(-45deg, var(--tsc-warning) 0 8px, var(--tsc-yellow) 8px 16px) top / 100% var(--demo-stripe) no-repeat,
        var(--tsc-warning-soft);
    color: var(--tsc-warning-text);
    font-size: 0.9375rem;
    line-height: 1.4;
}

    .demo-banner strong[b-v9vt4wxfn6] {
        padding: 1px 8px;
        border-radius: 999px;
        background: var(--tsc-warning);
        color: #FFFFFF;
        font-size: 0.8125rem;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .demo-banner span[b-v9vt4wxfn6] {
        flex: 1 1 20rem;
    }

    .demo-banner a[b-v9vt4wxfn6] {
        color: inherit;
        font-weight: 600;
    }

/* Auf dem Desktop höher und mit größerer Schrift; auf dem Smartphone bleibt die Leiste kompakt. */
@media (min-width: 641px) {
    .demo-banner[b-v9vt4wxfn6] {
        --demo-stripe: 6px;
        align-items: center;
        gap: 6px 16px;
        padding: calc(16px + var(--demo-stripe)) 48px 16px 48px;
        font-size: 1rem;
    }

        .demo-banner strong[b-v9vt4wxfn6] {
            padding: 3px 12px;
            font-size: 0.875rem;
        }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-6k30zxe5wj] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    /* Sichtbare Höhe: Safari auf iPad und iPhone rechnet 100vh mit eingeklappter Adressleiste; ist sie sichtbar, wäre
       die Seitenleiste unten abgeschnitten. Browser ohne dvh behalten die Zeile davor. */
    min-height: 100dvh;
}

main[b-6k30zxe5wj] {
    flex: 1;
    min-width: 0;
}

.sidebar[b-6k30zxe5wj] {
    background: var(--tsc-sidebar);
}

.content[b-6k30zxe5wj] {
    padding-left: 16px;
    padding-right: 16px;
}

@media (min-width: 641px) {
    .page[b-6k30zxe5wj] {
        flex-direction: row;
    }

    /* Spalte: Streifen und Kopf oben, das Menü füllt den Rest (NavMenu.razor.css) */
    .sidebar[b-6k30zxe5wj] {
        display: flex;
        flex: 0 0 248px;
        flex-direction: column;
        width: 248px;
        height: 100vh;
        height: 100dvh;
        position: sticky;
        top: 0;
    }

    .content[b-6k30zxe5wj] {
        padding: 40px 48px 48px 48px;
    }
}

#blazor-error-ui[b-6k30zxe5wj] {
    color-scheme: light only;
    background: var(--tsc-warning-soft);
    color: var(--tsc-warning-text);
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-6k30zxe5wj] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Seitenleiste nach docs/oberflaeche.md: Vereinsblau, oben ein schmaler Streifen Gelb und Blau */

.sidebar-stripe[b-vvmoocm2ku] {
    display: flex;
    height: 6px;
}

    .sidebar-stripe span:first-child[b-vvmoocm2ku] {
        flex: 3;
        background: var(--tsc-yellow);
    }

    .sidebar-stripe span:last-child[b-vvmoocm2ku] {
        flex: 1;
        background: var(--tsc-stripe-blue);
    }

.sidebar-top[b-vvmoocm2ku] {
    position: relative;
}

.sidebar-brand[b-vvmoocm2ku] {
    display: block;
    padding: 16px 20px;
    color: #FFFFFF;
    font-size: 1.1875rem;
    font-weight: 700;
    text-decoration: none;
}

    .sidebar-brand:hover[b-vvmoocm2ku] {
        color: #FFFFFF;
    }

/* Menüknopf auf schmalen Bildschirmen (ohne JavaScript: Checkbox klappt das Menü auf) */
.navbar-toggler[b-vvmoocm2ku] {
    appearance: none;
    cursor: pointer;
    width: 3rem;
    height: 2.5rem;
    position: absolute;
    top: 0.6rem;
    right: 16px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--tsc-radius-sm);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.6rem rgba(255, 255, 255, 0.08);
}

    .navbar-toggler:checked[b-vvmoocm2ku] {
        background-color: rgba(255, 255, 255, 0.25);
    }

.nav-scrollable[b-vvmoocm2ku] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-vvmoocm2ku] {
    display: block;
}

.sidebar-nav[b-vvmoocm2ku] {
    display: flex;
    flex-direction: column;
    padding-bottom: 8px;
}

.nav-section[b-vvmoocm2ku] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 10px;
}

.nav-link[b-vvmoocm2ku] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 10px 14px;
    border: none;
    border-radius: var(--tsc-radius-sm);
    background: none;
    color: #DCE5F2;
    font-size: 0.9375rem;
    text-align: left;
    text-decoration: none;
}

    .nav-link:hover[b-vvmoocm2ku] {
        background: rgba(255, 255, 255, 0.08);
        color: #FFFFFF;
    }

    .nav-link.active[b-vvmoocm2ku] {
        background: rgba(255, 255, 255, 0.12);
        color: #FFFFFF;
    }

/* Überschrift einer Gruppe im Menü, z. B. „Verwaltung“ */
.nav-group[b-vvmoocm2ku] {
    padding: 22px 24px 6px 24px;
    color: #9FB3D1;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Verwaltung unten, direkt über der Trennlinie mit den Konto-Einträgen */
.nav-admin[b-vvmoocm2ku] {
    margin-top: 6px;
}

.nav-account[b-vvmoocm2ku] {
    margin-top: 18px;
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

@media (min-width: 641px) {
    .navbar-toggler[b-vvmoocm2ku] {
        display: none;
    }

    /* Kopf und Menü füllen die Höhe der Seitenleiste genau; eine feste Rechnung mit 100vh war um einige Pixel zu hoch
       und ließ jede Seite leicht scrollen. */
    .sidebar-top[b-vvmoocm2ku] {
        display: flex;
        flex: 1;
        flex-direction: column;
        min-height: 0;
    }

    /* Auf breiten Bildschirmen immer sichtbar; scrollt bei sehr langen Menüs */
    .nav-scrollable[b-vvmoocm2ku] {
        display: block;
        flex: 1;
        min-height: 0;
        overflow-y: auto;
    }

    .sidebar-nav[b-vvmoocm2ku] {
        min-height: 100%;
        padding-bottom: 18px;
    }

    /* Verwaltung und Konto rutschen gemeinsam nach unten; ohne Verwaltung das Konto allein */
    .nav-admin[b-vvmoocm2ku] {
        margin-top: auto;
        padding-top: 18px;
    }

    .nav-account[b-vvmoocm2ku] {
        margin-top: auto;
    }

    .nav-admin + .nav-account[b-vvmoocm2ku] {
        margin-top: 10px;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-bp63ti289b],
.components-reconnect-repeated-attempt-visible[b-bp63ti289b],
.components-reconnect-failed-visible[b-bp63ti289b],
.components-pause-visible[b-bp63ti289b],
.components-resume-failed-visible[b-bp63ti289b],
.components-rejoining-animation[b-bp63ti289b] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-retrying[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-failed[b-bp63ti289b],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-bp63ti289b] {
    display: block;
}


#components-reconnect-modal[b-bp63ti289b] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-bp63ti289b 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-bp63ti289b 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-bp63ti289b 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-bp63ti289b]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-bp63ti289b 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-bp63ti289b {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-bp63ti289b {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-bp63ti289b {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-bp63ti289b] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-bp63ti289b] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-bp63ti289b] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-bp63ti289b] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-bp63ti289b] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-bp63ti289b] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-bp63ti289b] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-bp63ti289b 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-bp63ti289b] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-bp63ti289b {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/AnnualMeetings/AgendaEditor.razor.rz.scp.css */
.agenda[b-bwsthxj3f7] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.agenda-section[b-bwsthxj3f7] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.agenda-title[b-bwsthxj3f7] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
}

.agenda-list[b-bwsthxj3f7] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
    padding-left: 22px;
}

/* Je Versammlung: gestrichelt, damit klar ist, dass sich hier etwas ändert; zwischen den Punkten ein „+“ */
.agenda-meeting[b-bwsthxj3f7] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px;
    border: 1px dashed var(--tsc-border-strong);
    border-radius: var(--tsc-radius-sm);
    background: var(--tsc-surface);
}

.agenda-insert[b-bwsthxj3f7] {
    align-self: center;
    width: 26px;
    height: 22px;
    padding: 0;
    border: 1px dashed var(--tsc-border-strong);
    border-radius: 999px;
    background: transparent;
    color: var(--tsc-accent);
    font-weight: 600;
    line-height: 1;
}

    .agenda-insert:hover:not(:disabled)[b-bwsthxj3f7] {
        border-style: solid;
        border-color: var(--tsc-accent);
        background: var(--tsc-accent-soft);
    }

.agenda-entry[b-bwsthxj3f7] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 4px 0;
}

.agenda-entry-free[b-bwsthxj3f7] {
    flex-direction: row;
    gap: 6px;
    align-items: center;
}

.agenda-variant[b-bwsthxj3f7] {
    display: inline-block;
    width: auto;
    max-width: 100%;
}
/* /Components/Pages/AnnualMeetings/AnnualMeetingEditor.razor.rz.scp.css */
/* Wie der Editor eines Dokuments (Docs/DocEditor.razor.css): Spalten, Reiter, Vorschau. */

.doc-head[b-ktfy3y60vb] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.doc-head-title[b-ktfy3y60vb] {
    min-width: 0;
}

.doc-title[b-ktfy3y60vb] {
    font-size: 1.625rem;
    overflow-wrap: anywhere;
}

.doc-grid[b-ktfy3y60vb] {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    align-items: flex-start;
}

.doc-column[b-ktfy3y60vb] {
    display: flex;
    flex: 1 1 420px;
    flex-direction: column;
    gap: 18px;
    max-width: 720px;
    min-width: 0;
}

.doc-form[b-ktfy3y60vb] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.doc-preview[b-ktfy3y60vb] {
    display: flex;
    flex: 1 1 480px;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.preview-bar[b-ktfy3y60vb] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--tsc-border);
}

.preview-label[b-ktfy3y60vb] {
    color: var(--tsc-accent);
    font-weight: 600;
}

/* Serienbrief: Reiter links und über der Vorschau, die Linie darunter wie im Kündigungsassistenten */
.doc-tabs[b-ktfy3y60vb] {
    border-bottom: 1px solid var(--tsc-border);
}

.preview-bar-tabs[b-ktfy3y60vb] {
    padding-bottom: 0;
}

/* Serienbrief: Umschläge, wenn alle ausgetragen werden */
.preview-empty[b-ktfy3y60vb] {
    text-align: center;
}

/* Serienbrief: blättern zwischen den Empfängern, „‹ 3 von 87 ›“ */
.preview-nav[b-ktfy3y60vb] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.preview-nav-text[b-ktfy3y60vb] {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 4px 10px;
    justify-content: center;
    min-width: 0;
    text-align: center;
    overflow-wrap: anywhere;
}

/* Immer die ganze Seite: Seitenbilder auf die verfügbare Höhe verkleinert, weitere Seiten darunter. Breite und Höhe
   der Seite in mm setzt die Seite (A4 hochkant, Briefumschlag quer). */
.preview-stage[b-ktfy3y60vb] {
    --page-width: 210;
    --page-height: 297;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    overflow-y: auto;
}

    /* Briefumschläge quer (EnvelopeLayout) */
    .preview-stage.page-envelope-dl[b-ktfy3y60vb] {
        --page-width: 220;
        --page-height: 110;
    }

    .preview-stage.page-envelope-c5[b-ktfy3y60vb] {
        --page-width: 229;
        --page-height: 162;
    }

    .preview-stage.page-envelope-c6[b-ktfy3y60vb] {
        --page-width: 162;
        --page-height: 114;
    }

    .preview-stage[b-ktfy3y60vb]  .page-image {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
        height: 100%;
        aspect-ratio: var(--page-width) / var(--page-height);
        object-fit: contain;
        background: white;
        box-shadow: 0 2px 12px rgba(20, 36, 60, 0.12);
    }

.preview-download[b-ktfy3y60vb] {
    display: none;
}

/* Nebeneinander: Vorschau steht fest, während links gescrollt wird. */
@media (min-width: 1100px) {
    .doc-preview[b-ktfy3y60vb] {
        position: sticky;
        top: 24px;
        height: calc(100vh - 48px);
        height: calc(100dvh - 48px);
    }

    /* Größe aus Höhe und Breite des Bereichs: Ist er schmaler als eine A4-Seite in voller Höhe (Monitor im Hochformat),
       wird die Seite kleiner, statt mit weißen Rändern oben und unten auf die volle Höhe gestreckt zu werden. */
    .preview-stage[b-ktfy3y60vb] {
        flex: 1 1 0;
        height: auto;
        min-height: 0;
        container-type: size;
    }

        .preview-stage[b-ktfy3y60vb]  .page-image {
            max-width: none;
            height: min(100cqh, 100cqw * var(--page-height) / var(--page-width));
        }
}


/* ---------- JHV: Kacheln links wie die Felder des Briefs ---------- */

.card-block[b-ktfy3y60vb] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

.field-row[b-ktfy3y60vb] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

    .field-row > div[b-ktfy3y60vb] {
        flex: 1 1 180px;
    }

.buffer[b-ktfy3y60vb] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    align-items: center;
    margin-top: 6px;
}

.buffer-meter[b-ktfy3y60vb] {
    width: 180px;
    height: 12px;
}

.buffer-text[b-ktfy3y60vb] {
    font-size: 0.875rem;
}

.deadline-alert[b-ktfy3y60vb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.special-case summary[b-ktfy3y60vb] {
    cursor: pointer;
}

.special-case[open][b-ktfy3y60vb] {
    gap: 10px;
}

.date-input[b-ktfy3y60vb] {
    max-width: 220px;
}

.honor-list[b-ktfy3y60vb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
    padding-left: 18px;
}

/* Bestätigung eines Schritts, wie beim Kündigungsassistenten */
.follow-up[b-ktfy3y60vb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: center;
    padding-top: 12px;
    border-top: 1px solid var(--tsc-border);
}

.follow-up-done[b-ktfy3y60vb] {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: var(--tsc-success);
    font-weight: 600;
}

    .follow-up-done .text-secondary[b-ktfy3y60vb] {
        font-weight: 400;
    }

/* Digitale Briefmarken im Schritt „Post“ (A121), gestaltet wie die Kachel im Serienbrief */
.stamp-box[b-ktfy3y60vb] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

.stamp-guide summary[b-ktfy3y60vb] {
    cursor: pointer;
    color: var(--tsc-accent);
}

.stamp-guide ol[b-ktfy3y60vb] {
    margin: 8px 0 0;
    padding-left: 1.4rem;
}

/* Inhalt einer Kachel der Schritte: Abschnitte mit Trennlinie, damit Dateien und Briefmarken nicht gedrängt stehen (A122) */
.step-body[b-ktfy3y60vb] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.step-part[b-ktfy3y60vb] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    .step-part + .step-part[b-ktfy3y60vb] {
        padding-top: 14px;
        border-top: 1px solid var(--tsc-border);
    }

.step-part-title[b-ktfy3y60vb] {
    font-weight: 600;
}

.stamp-warning[b-ktfy3y60vb] {
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--tsc-warning-soft);
    color: var(--tsc-warning-text);
}

.stamp-actions[b-ktfy3y60vb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: center;
    padding-top: 10px;
    border-top: 1px solid var(--tsc-border);
}

/* Wie oft gedruckt wird, deutlich über den Knöpfen (A123) */
.print-count[b-ktfy3y60vb] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-weight: 600;
}

.print-count-number[b-ktfy3y60vb] {
    font-size: 1.375rem;
    line-height: 1.2;
    color: var(--tsc-accent);
}
/* /Components/Pages/AnnualMeetings/Overview.razor.rz.scp.css */
.overview[b-vmf723r8t6] {
    display: flex;
    flex-direction: column;
    gap: 36px;
}

.overview-head[b-vmf723r8t6] {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: flex-end;
    justify-content: space-between;
}

.overview-intro[b-vmf723r8t6] {
    flex: 1 1 420px;
    max-width: 760px;
}

/* Neue JHV als Kachel wie die Felder des Briefs */
.new-meeting[b-vmf723r8t6] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 760px;
    padding: 18px;
    border: 1px solid var(--tsc-border);
    border-radius: var(--tsc-radius);
    background: var(--tsc-surface);
}

.new-meeting-fields[b-vmf723r8t6] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}

    .new-meeting-fields > div[b-vmf723r8t6] {
        flex: 0 1 200px;
    }

.row-link[b-vmf723r8t6] {
    color: var(--tsc-text);
    font-weight: 600;
    text-decoration: none;
}

    .row-link:hover[b-vmf723r8t6] {
        color: var(--tsc-accent);
        text-decoration: underline;
    }
/* /Components/Pages/Cancellation/CancellationCase.razor.rz.scp.css */
/* Bearbeitungsseite nach docs/oberflaeche.md und docs/entwurf/Bearbeiten.dc.html */

.case-head[b-15quvzyve6] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.case-title[b-15quvzyve6] {
    font-size: 1.625rem;
}

.case-grid[b-15quvzyve6] {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    align-items: flex-start;
}

.case-column[b-15quvzyve6] {
    display: flex;
    flex: 1 1 420px;
    flex-direction: column;
    gap: 18px;
    max-width: 600px;
    min-width: 0;
}

.case-form[b-15quvzyve6] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.case-card[b-15quvzyve6] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

    .case-card h2[b-15quvzyve6] {
        display: flex;
        gap: 10px;
        align-items: center;
        margin: 0;
        font-size: 1.0625rem;
    }

.num[b-15quvzyve6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: var(--tsc-accent-soft);
    color: var(--tsc-accent);
    font-size: 0.8125rem;
    font-weight: 700;
}

/* Unterzeichner als Text auf Höhe des Datumsfelds daneben */
.signatory-line[b-15quvzyve6] {
    padding: 7px 0;
}

.date-input[b-15quvzyve6] {
    max-width: 220px;
}

.year-input[b-15quvzyve6] {
    width: 110px;
}

/* Erklärung der Kulanz: normaler Inhalt, hellblau statt Warnfarbe */
.explain-box[b-15quvzyve6] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border-radius: 10px;
    background: var(--tsc-info-soft);
    line-height: 1.45;
}

/* Aufgeklappter Abschnitt (Überweisungsbitte): heller grauer Grund */
.sub-box[b-15quvzyve6] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 14px 16px;
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

.person-row[b-15quvzyve6] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--tsc-divider);
}

.person-grid[b-15quvzyve6] {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr) minmax(0, 1fr) 36px;
    gap: 8px;
    align-items: end;
}

.person-remove[b-15quvzyve6] {
    display: flex;
    align-items: center;
    height: 38px;
}

.address-grid[b-15quvzyve6] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.span-1[b-15quvzyve6] {
    grid-column: span 1;
}

.span-3[b-15quvzyve6] {
    grid-column: span 3;
}

.span-4[b-15quvzyve6] {
    grid-column: span 4;
}

.two-columns[b-15quvzyve6] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

/* ---------- Vorschau ---------- */

.case-preview[b-15quvzyve6] {
    display: flex;
    flex: 1 1 480px;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.preview-bar[b-15quvzyve6] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--tsc-border);
}

.preview-tab[b-15quvzyve6] {
    padding: 8px 14px;
    border: none;
    border-bottom: 2px solid transparent;
    background: none;
    color: var(--tsc-muted);
    font: inherit;
    cursor: pointer;
}

    .preview-tab.active[b-15quvzyve6] {
        border-bottom-color: var(--tsc-accent);
        color: var(--tsc-accent);
        font-weight: 600;
    }

/* Immer die ganze Seite: Seitenbilder auf die verfügbare Höhe verkleinert, weitere Seiten darunter */
.preview-stage[b-15quvzyve6] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    overflow-y: auto;
}

    .preview-stage[b-15quvzyve6]  .page-image {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
        height: 100%;
        aspect-ratio: 210 / 297;
        object-fit: contain;
        background: white;
        box-shadow: 0 2px 12px rgba(20, 36, 60, 0.12);
    }

.preview-missing[b-15quvzyve6] {
    margin: 0;
    color: var(--tsc-muted);
}

.mail-preview[b-15quvzyve6] {
    display: flex;
    flex-direction: column;
    min-height: 420px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface);
}

.mail-head[b-15quvzyve6] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--tsc-divider);
}

.mail-body[b-15quvzyve6] {
    padding: 16px 18px;
    white-space: pre-line;
    line-height: 1.55;
}

/* Nebeneinander: Vorschau steht fest, während das Formular scrollt, und reicht dann vom oberen bis zum unteren Rand
   (je 24px Abstand). Die Seitenbilder nehmen, was der Hinweisbereich mit seiner festen Höhe übrig lässt. Vor dem
   Scrollen steht die Spalte tiefer und ragt unten etwas über den Rand. */
@media (min-width: 1100px) {
    .case-preview[b-15quvzyve6] {
        position: sticky;
        top: 24px;
        height: calc(100vh - 48px);
        height: calc(100dvh - 48px);
    }

    /* Größe aus Höhe und Breite des Bereichs: Ist er schmaler als eine A4-Seite in voller Höhe (Monitor im Hochformat),
       wird die Seite kleiner, statt mit weißen Rändern oben und unten auf die volle Höhe gestreckt zu werden. */
    .preview-stage[b-15quvzyve6] {
        flex: 1 1 0;
        height: auto;
        min-height: 0;
        container-type: size;
    }

        .preview-stage[b-15quvzyve6]  .page-image {
            max-width: none;
            height: min(100cqh, 100cqw * 297 / 210);
        }

    .preview-missing[b-15quvzyve6] {
        flex: 1 1 0;
    }

    .mail-preview[b-15quvzyve6] {
        flex: 1 1 0;
        min-height: 0;
        overflow-y: auto;
    }
}

/* Untereinander: Seitenbilder in voller Breite */
@media (max-width: 1099.98px) {
    .case-column[b-15quvzyve6] {
        max-width: none;
    }

    .preview-stage[b-15quvzyve6] {
        height: auto;
        min-height: 0;
        overflow-y: visible;
    }

        .preview-stage[b-15quvzyve6]  .page-image {
            width: 100%;
            max-width: 640px;
            height: auto;
        }
}

@media (max-width: 520px) {
    .person-grid[b-15quvzyve6] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 36px;
    }

        .person-grid > :first-child[b-15quvzyve6] {
            grid-column: 1 / -1;
            max-width: 140px;
        }

    .address-grid .span-1[b-15quvzyve6] {
        grid-column: span 2;
    }

    .address-grid .span-3[b-15quvzyve6] {
        grid-column: span 2;
    }

    .sub-box[b-15quvzyve6], .two-columns[b-15quvzyve6] {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Bestätigung nach dem Abschließen (A59): Schaltfläche oder erledigte Zeile mit „zurücknehmen“ */
.follow-up[b-15quvzyve6] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: center;
    padding-top: 12px;
    border-top: 1px solid var(--tsc-border);
}

.follow-up-done[b-15quvzyve6] {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: var(--tsc-success);
    font-weight: 600;
}

    .follow-up-done .text-secondary[b-15quvzyve6] {
        font-weight: 400;
    }
/* /Components/Pages/Cancellation/HintPanel.razor.rz.scp.css */
.hint-panel[b-j5dw8xedwx] {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    height: 200px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface);
}

.hint-head[b-j5dw8xedwx] {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 10px 14px 6px 14px;
    font-size: 0.875rem;
    font-weight: 700;
}

.hint-list[b-j5dw8xedwx] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0 14px 10px 14px;
    overflow-y: auto;
    list-style: none;
}

    .hint-list li[b-j5dw8xedwx] {
        display: flex;
        gap: 8px;
        align-items: flex-start;
        font-size: 0.875rem;
        line-height: 1.4;
    }

.dot[b-j5dw8xedwx] {
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    margin-top: 6px;
    border-radius: 999px;
}

.dot-error[b-j5dw8xedwx] {
    background: var(--tsc-error);
}

.dot-warning[b-j5dw8xedwx] {
    background: var(--tsc-warning);
}

.dot-info[b-j5dw8xedwx] {
    background: var(--tsc-accent);
}

.dot-ok[b-j5dw8xedwx] {
    background: var(--tsc-success);
}
/* /Components/Pages/Cancellation/Overview.razor.rz.scp.css */
.overview[b-dug5qhc8ww] {
    display: flex;
    flex-direction: column;
    gap: 36px;
}

.overview-head[b-dug5qhc8ww] {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: flex-end;
    justify-content: space-between;
}

.overview-intro[b-dug5qhc8ww] {
    flex: 1 1 420px;
}

.draft-row[b-dug5qhc8ww] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
}

.draft-title[b-dug5qhc8ww] {
    font-size: 1.0625rem;
    font-weight: 600;
}

.completed-head[b-dug5qhc8ww] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
    justify-content: space-between;
}

.search-input[b-dug5qhc8ww] {
    width: 220px;
    max-width: 100%;
}

.row-link[b-dug5qhc8ww] {
    color: var(--tsc-text);
    font-weight: 600;
    text-decoration: none;
}

    .row-link:hover[b-dug5qhc8ww] {
        color: var(--tsc-accent);
        text-decoration: underline;
    }
/* /Components/Pages/Docs/DeliverySettings.razor.rz.scp.css */
/* Kachel wie die übrigen im Serienbrief (Format der Umschläge, Briefmarke) */
.delivery[b-qff2ybg76m] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

.delivery-legend[b-qff2ybg76m] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0;
    padding-left: 18px;
}

.delivery-rules[b-qff2ybg76m] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.delivery-rule[b-qff2ybg76m] {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 6px 6px 6px 8px;
    border: 1px solid var(--tsc-border);
    border-radius: var(--tsc-radius-sm);
    background: var(--tsc-surface);
}

.delivery-rule-text[b-qff2ybg76m] {
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Weg der Regel als kleines Etikett, je Weg eine Farbe */
.delivery-route[b-qff2ybg76m] {
    flex: 0 0 auto;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 600;
}

.delivery-route-hand[b-qff2ybg76m] {
    background: var(--tsc-success-soft);
    color: var(--tsc-success-text);
}

.delivery-route-none[b-qff2ybg76m] {
    background: var(--tsc-neutral-soft);
    color: var(--tsc-muted);
}

.delivery-route-post[b-qff2ybg76m] {
    background: var(--tsc-accent-soft);
    color: var(--tsc-accent-dark);
}

/* Weg und PLZ, darunter Ort und Straße; der Knopf darunter */
.delivery-add[b-qff2ybg76m] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    align-items: end;
}

    .delivery-add-actions[b-qff2ybg76m] {
        display: flex;
        grid-column: 1 / -1;
        gap: 8px;
    }

.delivery-result[b-qff2ybg76m] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .delivery-result li[b-qff2ybg76m] {
        display: flex;
        gap: 10px;
        align-items: baseline;
    }

.delivery-result-count[b-qff2ybg76m] {
    min-width: 2.5rem;
    font-weight: 600;
    text-align: right;
}
/* /Components/Pages/Docs/DocEditor.razor.rz.scp.css */
/* Bearbeitungsseite wie im Kündigungsassistenten (docs/oberflaeche.md): links Eingaben, rechts die stehende Vorschau. */

.doc-head[b-kf2ig7ul7v] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.doc-head-title[b-kf2ig7ul7v] {
    min-width: 0;
}

.doc-title[b-kf2ig7ul7v] {
    font-size: 1.625rem;
    overflow-wrap: anywhere;
}

.doc-grid[b-kf2ig7ul7v] {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    align-items: flex-start;
}

.doc-column[b-kf2ig7ul7v] {
    display: flex;
    flex: 1 1 420px;
    flex-direction: column;
    gap: 18px;
    max-width: 720px;
    min-width: 0;
}

.doc-form[b-kf2ig7ul7v] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

/* ---------- Vorschau ---------- */

.doc-preview[b-kf2ig7ul7v] {
    display: flex;
    flex: 1 1 480px;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.preview-bar[b-kf2ig7ul7v] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--tsc-border);
}

.preview-label[b-kf2ig7ul7v] {
    color: var(--tsc-accent);
    font-weight: 600;
}

/* Serienbrief: Reiter links und über der Vorschau, die Linie darunter wie im Kündigungsassistenten */
.doc-tabs[b-kf2ig7ul7v] {
    border-bottom: 1px solid var(--tsc-border);
}

.preview-bar-tabs[b-kf2ig7ul7v] {
    padding-bottom: 0;
}

/* Format der Umschläge im Reiter „Umschläge“, wie die Felder des Briefs */
.envelope-fields[b-kf2ig7ul7v] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

/* Dialog „Neues Dokument speichern?“ (A95): Überschrift mit X; Verwerfen gleich rot, nicht erst beim Darüberfahren */
/* Ohne Erklärtext sonst so schmal wie der Inhalt */
.name-dialog[b-kf2ig7ul7v] {
    width: 100%;
}

.name-head[b-kf2ig7ul7v] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
}

.name-discard[b-kf2ig7ul7v] {
    --bs-btn-color: #B42318;
}

/* Serienbrief: Umschläge, wenn alle ausgetragen werden */
.preview-empty[b-kf2ig7ul7v] {
    text-align: center;
}

/* Serienbrief: blättern zwischen den Empfängern, „‹ 3 von 87 ›“ */
.preview-nav[b-kf2ig7ul7v] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.preview-nav-text[b-kf2ig7ul7v] {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 4px 10px;
    justify-content: center;
    min-width: 0;
    text-align: center;
    overflow-wrap: anywhere;
}

/* Immer die ganze Seite: Seitenbilder auf die verfügbare Höhe verkleinert, weitere Seiten darunter. Breite und Höhe
   der Seite in mm setzt die Seite (A4 hochkant, Briefumschlag quer). */
.preview-stage[b-kf2ig7ul7v] {
    --page-width: 210;
    --page-height: 297;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    overflow-y: auto;
}

    /* Briefumschläge quer (EnvelopeLayout) */
    .preview-stage.page-envelope-dl[b-kf2ig7ul7v] {
        --page-width: 220;
        --page-height: 110;
    }

    .preview-stage.page-envelope-c5[b-kf2ig7ul7v] {
        --page-width: 229;
        --page-height: 162;
    }

    .preview-stage.page-envelope-c6[b-kf2ig7ul7v] {
        --page-width: 162;
        --page-height: 114;
    }

    .preview-stage[b-kf2ig7ul7v]  .page-image {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
        height: 100%;
        aspect-ratio: var(--page-width) / var(--page-height);
        object-fit: contain;
        background: white;
        box-shadow: 0 2px 12px rgba(20, 36, 60, 0.12);
    }

.preview-download[b-kf2ig7ul7v] {
    display: none;
}

/* Nebeneinander: Vorschau steht fest, während links gescrollt wird. */
@media (min-width: 1100px) {
    .doc-preview[b-kf2ig7ul7v] {
        position: sticky;
        top: 24px;
        height: calc(100vh - 48px);
        height: calc(100dvh - 48px);
    }

    /* Größe aus Höhe und Breite des Bereichs: Ist er schmaler als eine A4-Seite in voller Höhe (Monitor im Hochformat),
       wird die Seite kleiner, statt mit weißen Rändern oben und unten auf die volle Höhe gestreckt zu werden. */
    .preview-stage[b-kf2ig7ul7v] {
        flex: 1 1 0;
        height: auto;
        min-height: 0;
        container-type: size;
    }

        .preview-stage[b-kf2ig7ul7v]  .page-image {
            max-width: none;
            height: min(100cqh, 100cqw * var(--page-height) / var(--page-width));
        }
}

/* ---------- Digitale Briefmarke beim Briefumschlag: Kachel wie die Felder des Briefs ---------- */

.stamp-panel[b-kf2ig7ul7v] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

.stamp-note[b-kf2ig7ul7v] {
    margin-top: 0;
}

.stamp-guide summary[b-kf2ig7ul7v] {
    cursor: pointer;
    color: var(--tsc-accent);
}

.stamp-guide ol[b-kf2ig7ul7v] {
    margin: 8px 0 0;
    padding-left: 1.4rem;
}

/* Untereinander: Seitenbilder in voller Breite */
@media (max-width: 1099.98px) {
    .doc-column[b-kf2ig7ul7v] {
        max-width: none;
    }

    .preview-stage[b-kf2ig7ul7v] {
        height: auto;
        min-height: 0;
        overflow-y: visible;
    }

        .preview-stage[b-kf2ig7ul7v]  .page-image {
            width: 100%;
            max-width: 640px;
            height: auto;
        }

    .preview-download[b-kf2ig7ul7v] {
        display: flex;
        justify-content: center;
    }
}
/* /Components/Pages/Docs/Overview.razor.rz.scp.css */
.overview[b-z8w644v2ed] {
    display: flex;
    flex-direction: column;
    gap: 36px;
}

.overview-intro[b-z8w644v2ed] {
    max-width: 760px;
}

.list-head[b-z8w644v2ed] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
    justify-content: space-between;
}

.search-input[b-z8w644v2ed] {
    width: 220px;
    max-width: 100%;
}

/* Lange Titel umbrechen statt die Tabelle zu verbreitern */
.title-cell[b-z8w644v2ed] {
    white-space: normal;
    word-break: break-word;
}

.row-link[b-z8w644v2ed] {
    color: var(--tsc-text);
    font-weight: 600;
    text-decoration: none;
}

    .row-link:hover[b-z8w644v2ed] {
        color: var(--tsc-accent);
        text-decoration: underline;
    }
/* /Components/Pages/Docs/RecipientList.razor.rz.scp.css */
.recipients[b-ptsefu63kb] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.recipients-head[b-ptsefu63kb] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

/* Platzhalter, Import und Formular als Kachel wie die Felder des Briefs; offenes Formular und Import mit blauem Rand */
.recipient-card[b-ptsefu63kb] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

.recipient-card-active[b-ptsefu63kb] {
    border-color: var(--tsc-accent);
}

.placeholder-chips[b-ptsefu63kb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.placeholder-chip[b-ptsefu63kb] {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    padding: 2px 4px 2px 12px;
    border: 1px solid var(--tsc-border);
    border-radius: 999px;
    background: var(--tsc-surface);
}

/* Fest vorgegeben (JHV „Jahre“): ein Schloss statt des Knopfs zum Entfernen, gleich groß */
.placeholder-lock[b-ptsefu63kb] {
    display: inline-flex;
    padding: 5px;
}

    .placeholder-chip .icon-btn[b-ptsefu63kb] {
        padding: 5px;
        border-radius: 999px;
    }

.placeholder-add[b-ptsefu63kb] {
    display: flex;
    gap: 8px;
    align-items: flex-end;
}

    .placeholder-add > div[b-ptsefu63kb] {
        flex: 1 1 auto;
    }

.import-hints[b-ptsefu63kb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.875rem;
}

    .import-hints li[b-ptsefu63kb] {
        display: flex;
        gap: 6px;
        line-height: 1.4;
    }

/* Spalten der Datei und erste Empfänger als kleine Tabellen auf weißem Grund */
.import-table[b-ptsefu63kb] {
    --bs-table-bg: var(--tsc-surface);
    border: 1px solid var(--tsc-border);
    font-size: 0.875rem;
}

    .import-table th[b-ptsefu63kb] {
        color: var(--tsc-muted);
        font-weight: 500;
    }

    .import-table th[b-ptsefu63kb],
    .import-table td[b-ptsefu63kb] {
        padding: 6px 10px;
    }

    .import-table td:first-child[b-ptsefu63kb] {
        font-weight: 600;
    }

/* Nur der Name der Spalte grau und durchgestrichen; das Häkchen daneben bleibt normal, sonst wirkt es gesperrt. */
.import-dropped td:first-child[b-ptsefu63kb] {
    color: var(--tsc-muted);
    font-weight: 400;
    text-decoration: line-through;
}

/* Breite Vorschau (viele Platzhalter) scrollt in sich statt die Seite */
.import-scroll[b-ptsefu63kb] {
    overflow-x: auto;
}

    .import-scroll td[b-ptsefu63kb] {
        white-space: nowrap;
    }

.recipient-tags[b-ptsefu63kb] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.recipient-source[b-ptsefu63kb] {
    align-self: flex-start;
    padding: 0 8px;
    border: 1px solid var(--tsc-border);
    border-radius: 999px;
    color: var(--tsc-muted);
    font-size: 0.75rem;
}

.recipient-grid[b-ptsefu63kb] {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 12px;
}

.span-2[b-ptsefu63kb] {
    grid-column: span 2;
}

.span-3[b-ptsefu63kb] {
    grid-column: span 3;
}

.span-4[b-ptsefu63kb] {
    grid-column: span 4;
}

.span-6[b-ptsefu63kb] {
    grid-column: span 6;
}

.recipient-list[b-ptsefu63kb] {
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface);
}

.recipient-row[b-ptsefu63kb] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 10px 12px;
}

    .recipient-row + .recipient-row[b-ptsefu63kb],
    .recipient-edit + .recipient-row[b-ptsefu63kb] {
        border-top: 1px solid var(--tsc-border);
    }

/* Bearbeiten eines bestehenden Empfängers direkt unter seiner Zeile */
.recipient-edit[b-ptsefu63kb] {
    padding: 0 12px 12px;
}

.recipient-include[b-ptsefu63kb] {
    flex: 0 0 auto;
    margin-top: 4px;
}

.recipient-main[b-ptsefu63kb] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.recipient-name[b-ptsefu63kb] {
    padding: 0;
    border: none;
    background: none;
    color: var(--tsc-text);
    font-weight: 600;
    text-align: left;
}

    .recipient-name:hover:not(:disabled)[b-ptsefu63kb] {
        color: var(--tsc-accent);
        text-decoration: underline;
    }

    .recipient-name:disabled[b-ptsefu63kb] {
        color: var(--tsc-muted);
    }

.recipient-address[b-ptsefu63kb] {
    color: var(--tsc-muted);
    font-size: 0.875rem;
    overflow-wrap: anywhere;
}

.recipient-issue[b-ptsefu63kb] {
    display: flex;
    gap: 6px;
    font-size: 0.8125rem;
    line-height: 1.4;
}

.dot[b-ptsefu63kb] {
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    margin-top: 5px;
    border-radius: 999px;
}

.dot-error[b-ptsefu63kb] {
    background: var(--tsc-error);
}

.dot-warning[b-ptsefu63kb] {
    background: var(--tsc-warning);
}

.dot-info[b-ptsefu63kb] {
    background: var(--tsc-accent);
}

.recipient-excluded .recipient-address[b-ptsefu63kb] {
    text-decoration: line-through;
}

@media (max-width: 575.98px) {
    .recipient-grid > div[b-ptsefu63kb] {
        grid-column: 1 / -1;
    }

    .recipient-grid > .recipient-postal[b-ptsefu63kb] {
        grid-column: span 3;
    }

    .recipient-grid > .recipient-city[b-ptsefu63kb] {
        grid-column: span 5;
    }
}
/* /Components/Pages/Docs/SeriesSettings.razor.rz.scp.css */
/* Wie die Felder des Briefs (DocContentForm) */
.series-fields[b-mqou928jjm] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}
/* /Components/Pages/Home.razor.rz.scp.css */
.home[b-oy8hkhcqj2] {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.module-tiles[b-oy8hkhcqj2] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
    gap: 20px;
}

.module-tile[b-oy8hkhcqj2] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px;
    border: 1px solid var(--tsc-border);
    border-radius: var(--tsc-radius);
    background: var(--tsc-surface);
    color: var(--tsc-text);
    text-decoration: none;
}

    .module-tile:hover[b-oy8hkhcqj2] {
        border-color: var(--tsc-accent);
        box-shadow: 0 4px 16px rgba(20, 50, 94, 0.10);
        color: var(--tsc-text);
    }

.module-icon[b-oy8hkhcqj2] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--tsc-accent-soft);
    color: var(--tsc-accent);
}

.module-title[b-oy8hkhcqj2] {
    font-size: 1.25rem;
    font-weight: 700;
}

.module-description[b-oy8hkhcqj2] {
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--tsc-muted);
}
/* /Components/Pages/SystemStatus/ErrorCodeList.razor.rz.scp.css */
.code-search[b-wqep8f95fu] {
    width: 320px;
    max-width: 100%;
}

    /* Aktive Suche auch am Feld erkennbar, nicht nur an der Zeile darunter */
    .code-search.is-filtered[b-wqep8f95fu] {
        border-color: var(--tsc-accent);
        box-shadow: 0 0 0 1px var(--tsc-accent);
    }
/* /Components/Pages/SystemStatus/Log.razor.rz.scp.css */
.log-page[b-0pisiklo6y] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.log-filters[b-0pisiklo6y] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    align-items: flex-end;
}

.search-input[b-0pisiklo6y] {
    width: 260px;
    max-width: 100%;
}

/* Auf Höhe der Felder, deren Beschriftung darüber steht */
.log-security-only[b-0pisiklo6y] {
    margin-bottom: 0.45rem;
}

/* Nachricht darf umbrechen, Stufe und Zeit nicht (text-nowrap in der Tabelle) */
.log-message-cell[b-0pisiklo6y] {
    min-width: 12rem;
    width: 100%;
}

.log-source[b-0pisiklo6y] {
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Ganze Nachricht ist der Knopf zum Aufklappen */
.log-toggle[b-0pisiklo6y] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

    .log-toggle:hover .log-message[b-0pisiklo6y] {
        color: var(--tsc-accent);
    }

    .log-toggle:focus-visible[b-0pisiklo6y] {
        outline: 2px solid var(--tsc-accent);
        outline-offset: 2px;
        border-radius: 4px;
    }

/* höchstens zwei Zeilen, der ganze Text steht in den Details */
.log-message[b-0pisiklo6y] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}

.log-time-inline[b-0pisiklo6y] {
    display: none;
    font-size: 0.8125rem;
    color: var(--tsc-muted);
}

.log-event[b-0pisiklo6y] {
    font-weight: 600;
}

.log-repeat[b-0pisiklo6y] {
    font-size: 0.8125rem;
    color: var(--tsc-muted);
}

/* Aufgeklappt: heller grauer Hintergrund, kein Gelb (docs/oberflaeche.md) */
.log-row-open > td[b-0pisiklo6y] {
    border-bottom: 0;
    background: var(--tsc-surface-muted);
}

.log-detail > td[b-0pisiklo6y] {
    background: var(--tsc-surface-muted);
}

.log-fields[b-0pisiklo6y] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 4px 16px;
    margin: 0;
}

    .log-fields dt[b-0pisiklo6y] {
        font-weight: 600;
        color: var(--tsc-label);
    }

    .log-fields dd[b-0pisiklo6y] {
        margin: 0;
        min-width: 0;
    }

.log-break[b-0pisiklo6y] {
    overflow-wrap: anywhere;
}

.log-exception-label[b-0pisiklo6y] {
    margin-top: 12px;
    font-weight: 600;
    color: var(--tsc-label);
}

/* Stacktrace bricht um, statt die Tabelle zu verbreitern */
.log-exception[b-0pisiklo6y] {
    margin: 4px 0 0;
    padding: 10px 12px;
    max-height: 24rem;
    overflow: auto;
    border: 1px solid var(--tsc-border);
    border-radius: var(--tsc-radius-sm);
    background: var(--tsc-surface);
    font-size: 0.8125rem;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.log-paging[b-0pisiklo6y] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

@media (max-width: 575.98px) {
    .log-message-cell[b-0pisiklo6y] {
        min-width: 0;
    }

    .log-time-inline[b-0pisiklo6y] {
        display: block;
    }

    .log-fields[b-0pisiklo6y] {
        grid-template-columns: 1fr;
        gap: 0;
    }

        .log-fields dd[b-0pisiklo6y] {
            margin-bottom: 6px;
        }

    .log-filters .ms-auto[b-0pisiklo6y] {
        margin-left: 0 !important;
    }
}
/* /Components/Pages/SystemStatus/Overview.razor.rz.scp.css */
.system-page[b-d9sequchil] {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.system-nav-row[b-d9sequchil] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: center;
    justify-content: space-between;
}

/* ---------- Zustandsleiste: flach, drei gleichrangige Felder; Farbe nur bei echten Problemen ---------- */

.status-bar[b-d9sequchil] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    border: 1px solid var(--tsc-border);
    border-radius: var(--tsc-radius);
    background: var(--tsc-surface);
}

@media (min-width: 768px) {
    .status-bar[b-d9sequchil] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.status-field[b-d9sequchil] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    padding: 20px 24px;
}

    .status-field + .status-field[b-d9sequchil] {
        border-top: 1px solid var(--tsc-divider);
    }

@media (min-width: 768px) {
    .status-field + .status-field[b-d9sequchil] {
        border-top: 0;
        border-left: 1px solid var(--tsc-divider);
    }

    .status-field:first-child[b-d9sequchil] {
        border-radius: var(--tsc-radius) 0 0 var(--tsc-radius);
    }

    .status-field:last-child[b-d9sequchil] {
        border-radius: 0 var(--tsc-radius) var(--tsc-radius) 0;
    }
}

/* gleiche Überschrift wie die Karten (.system-card h2) */
.status-label[b-d9sequchil] {
    margin: 0 0 6px;
    font-size: 1.0625rem;
    font-weight: 700;
}

.status-value[b-d9sequchil] {
    font-size: 1.125rem;
    font-weight: 700;
}

.status-detail[b-d9sequchil] {
    color: var(--tsc-label);
    font-size: 0.875rem;
    overflow-wrap: anywhere;
}

.status-sep[b-d9sequchil] {
    margin: 0 4px;
    color: var(--tsc-muted);
}

.status-link[b-d9sequchil] {
    color: inherit;
}

/* Warnungen sind normal (z. B. vertippte Passwörter) und bleiben neutral, auch in einem roten Feld */
.status-link-neutral[b-d9sequchil] {
    color: var(--tsc-text);
}

    .status-link:hover[b-d9sequchil] {
        color: var(--tsc-accent);
    }

/* „In Ordnung“: dezentes Grün in der Erfolgsfarbe (docs/oberflaeche.md, Gestaltung) */
.status-ok[b-d9sequchil] {
    background: var(--tsc-success-soft);
    box-shadow: inset 3px 0 0 var(--tsc-success);
}

    .status-ok .status-value[b-d9sequchil] {
        color: var(--tsc-success-text);
    }

.status-warning[b-d9sequchil] {
    background: var(--tsc-warning-soft);
    box-shadow: inset 3px 0 0 var(--tsc-warning);
}

    .status-warning .status-value[b-d9sequchil], .status-warning .status-detail[b-d9sequchil] {
        color: var(--tsc-warning-text);
    }

.status-error[b-d9sequchil] {
    background: var(--tsc-error-soft);
    box-shadow: inset 3px 0 0 var(--tsc-error);
}

    .status-error .status-value[b-d9sequchil], .status-error .status-detail[b-d9sequchil] {
        color: var(--tsc-error-text);
    }

/* ---------- Karten: 1 Spalte auf dem Smartphone (natürliche Höhe), 2 mittel, 3 am Desktop (gleiche Höhe je Zeile) ---------- */

.system-grid[b-d9sequchil] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

@media (min-width: 1000px) {
    .system-grid[b-d9sequchil] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }
}

@media (min-width: 1400px) {
    .system-grid[b-d9sequchil] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* positioniert: Bezug für die Erklärung hinter dem Info-Symbol */
.system-card[b-d9sequchil] {
    position: relative;
    min-width: 0;
    padding: 20px 24px;
}

    .system-card h2[b-d9sequchil] {
        margin-bottom: 14px;
        font-size: 1.0625rem;
    }

/* Wertespalte beginnt in allen Karten an derselben Stelle: feste Breite der Beschriftungen (längste: „Limit Container“) */
.system-fields[b-d9sequchil] {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    gap: 6px 16px;
    margin: 0;
}

    .system-fields dt[b-d9sequchil] {
        font-weight: 400;
        color: var(--tsc-muted);
    }

    .system-fields dd[b-d9sequchil] {
        margin: 0;
        min-width: 0;
    }

.system-break[b-d9sequchil] {
    overflow-wrap: anywhere;
}

.disk-meter[b-d9sequchil] {
    height: 8px;
    margin-bottom: 6px;
    border-radius: 999px;
    background: var(--tsc-neutral-soft);
    overflow: hidden;
}

.disk-meter-bar[b-d9sequchil] {
    display: block;
    width: 100%;
    height: 100%;
}

.disk-meter-used[b-d9sequchil] {
    fill: var(--tsc-accent);
}

/* Weniger als 10 % frei */
.disk-meter-low[b-d9sequchil] {
    fill: var(--tsc-warning);
}

/* Aktive Benutzer: vier kleine Zahlen nebeneinander */
.active-users[b-d9sequchil] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}

    .active-users > div[b-d9sequchil] {
        display: flex;
        flex-direction: column;
        padding: 6px 10px;
        border-radius: var(--tsc-radius-sm);
        background: var(--tsc-surface-muted);
    }

.active-number[b-d9sequchil] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
}

.active-label[b-d9sequchil] {
    color: var(--tsc-muted);
    font-size: 0.8125rem;
}

@media (max-width: 575.98px) {
    .system-fields[b-d9sequchil] {
        grid-template-columns: 1fr;
        gap: 0;
    }

        .system-fields dd[b-d9sequchil] {
            margin-bottom: 6px;
        }
}

/* Erklärung hinter dem Info-Symbol: unter der Überschrift, die hier mehr Innenabstand hat */
.system-card[b-d9sequchil]  .info-tip-text,
.status-field[b-d9sequchil]  .info-tip-text {
    top: 3.4rem;
}
/* /Components/Pages/Templates/AgendaBlocksEditor.razor.rz.scp.css */
.blocks[b-oisb9v7geu] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.blocks-section[b-oisb9v7geu] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.blocks-title[b-oisb9v7geu] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
}

.blocks-list[b-oisb9v7geu] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Je Baustein: Wortlaute breit, Optionen und Knöpfe daneben; schmal untereinander */
.blocks-item[b-oisb9v7geu] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    align-items: flex-start;
}

/* Wächst mit dem Text, wo der Browser es kann; sonst gibt Rows() die Höhe vor */
.blocks-text textarea[b-oisb9v7geu] {
    resize: vertical;
    field-sizing: content;
}

.blocks-text[b-oisb9v7geu] {
    display: flex;
    flex: 1 1 280px;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.blocks-options[b-oisb9v7geu] {
    display: flex;
    flex: 0 1 220px;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.blocks-actions[b-oisb9v7geu] {
    display: flex;
    gap: 4px;
    min-width: 64px;
}

/* Deaktiviert: blass, bleibt aber bearbeitbar */
.blocks-item-inactive .blocks-text[b-oisb9v7geu] {
    opacity: 0.6;
}
/* /Components/Pages/Templates/AnnualMeeting.razor.rz.scp.css */
.templates-head[b-rjly2i7bo1] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 16px;
}

.templates-tabs[b-rjly2i7bo1] {
    margin-bottom: 16px;
}

.templates-form[b-rjly2i7bo1] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 860px;
}

.templates-card[b-rjly2i7bo1] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
/* /Components/Shared/DocContentForm.razor.rz.scp.css */
/* Felder des Briefs als abgesetzter Block über und unter dem Text. */

.letter-fields[b-2cwawuuea7] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface-muted);
}

/* Datum ohne Ort daneben: nicht über die ganze Breite */
.input-date[b-2cwawuuea7] {
    max-width: 12rem;
}
/* /Components/Shared/LegalLinks.razor.rz.scp.css */
.legal-links[b-5v1sbyclds] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
}

    .legal-links a[b-5v1sbyclds] {
        color: inherit;
        text-decoration: none;
    }

        .legal-links a:hover[b-5v1sbyclds] {
            color: inherit;
            text-decoration: underline;
        }
/* /Components/Shared/RichTextEditor.razor.rz.scp.css */
/* Rahmen wie ein Eingabefeld, oben die Symbolleiste. Das Aussehen des Texts lehnt sich an das PDF an (Schrift,
   Überschriften, Abstände), verbindlich ist aber die Vorschau aus dem Renderer. */
.rich-text[b-rabke6b9a9] {
    border: 1px solid var(--tsc-border-strong);
    border-radius: var(--tsc-radius-sm);
    background: var(--tsc-surface);
}

    .rich-text:focus-within[b-rabke6b9a9] {
        border-color: var(--tsc-accent);
        box-shadow: 0 0 0 3px var(--tsc-accent-soft);
    }

.rich-text-toolbar[b-rabke6b9a9] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    padding: 6px;
    border-bottom: 1px solid var(--tsc-divider);
    background: var(--tsc-surface-muted);
    border-radius: var(--tsc-radius-sm) var(--tsc-radius-sm) 0 0;
}

.rich-text-group[b-rabke6b9a9] {
    display: flex;
    gap: 2px;
}

/* Auswahl der Platzhalter (Serienbrief): so hoch wie die Knöpfe */
.rich-text-placeholder[b-rabke6b9a9] {
    width: auto;
    min-height: 32px;
}

/* Rückgängig und Wiederholen rechts */
.rich-text-history[b-rabke6b9a9] {
    margin-left: auto;
}

.rich-text-tool[b-rabke6b9a9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 6px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--tsc-muted);
}

    .rich-text-tool:hover:not(:disabled)[b-rabke6b9a9] {
        border-color: var(--tsc-border);
        background: var(--tsc-surface);
        color: var(--tsc-text);
    }

    /* Formatierung an der Schreibmarke aktiv */
    .rich-text-tool[aria-pressed="true"][b-rabke6b9a9] {
        border-color: var(--tsc-accent);
        background: var(--tsc-accent-soft);
        color: var(--tsc-accent);
    }

    .rich-text-tool:disabled[b-rabke6b9a9] {
        opacity: 0.35;
    }

.rich-text-heading[b-rabke6b9a9] {
    font-weight: 700;
    font-size: 0.9rem;
}

/* Inhalt von TipTap: Das Skript erzeugt die Elemente, deshalb ::deep. Die Grundregeln stammen aus dem CSS von TipTap
   (injectCSS ist aus, siehe editor.js). */
.rich-text-editor[b-rabke6b9a9]  .ProseMirror {
    position: relative;
    min-height: 12rem;
    padding: 12px 14px;
    outline: none;
    white-space: pre-wrap;
    white-space: break-spaces;
    word-wrap: break-word;
    font-variant-ligatures: none;
    font-feature-settings: "liga" 0;
    color: var(--tsc-text);
}

/* Breite Bildschirme: von Anfang an Platz für einen längeren Text, damit die leere Seite nicht verloren wirkt. Auf dem
   Smartphone bleibt das Feld klein und wächst mit dem Text. */
@media (min-width: 1100px) {
    .rich-text-editor[b-rabke6b9a9]  .ProseMirror {
        min-height: min(32rem, 60vh);
    }
}

.rich-text-editor[b-rabke6b9a9]  img.ProseMirror-separator {
    display: inline !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    border: none !important;
}

.rich-text-editor[b-rabke6b9a9]  .ProseMirror-hideselection *::selection {
    background: transparent;
}

.rich-text-editor[b-rabke6b9a9]  .ProseMirror-hideselection * {
    caret-color: transparent;
}

/* Abstände wie im PDF: zwischen den Blöcken eine Leerzeile. */
.rich-text-editor[b-rabke6b9a9]  .ProseMirror > * {
    margin: 0 0 1em;
}

    .rich-text-editor[b-rabke6b9a9]  .ProseMirror > *:last-child {
        margin-bottom: 0;
    }

.rich-text-editor[b-rabke6b9a9]  .ProseMirror h1 {
    font-size: 1.35rem;
    font-weight: 700;
}

.rich-text-editor[b-rabke6b9a9]  .ProseMirror h2 {
    font-size: 1.15rem;
    font-weight: 700;
}

.rich-text-editor[b-rabke6b9a9]  .ProseMirror ul,
.rich-text-editor[b-rabke6b9a9]  .ProseMirror ol {
    padding-left: 1.5rem;
}

.rich-text-editor[b-rabke6b9a9]  .ProseMirror li > p {
    margin: 0;
}
/* /Components/Shared/SetupHints.razor.rz.scp.css */
/* Auffällig, aber ruhig: weiße Fläche mit farbigem Rand links; Gelb nur, wenn wirklich etwas fehlt (docs/oberflaeche.md). */
.setup-hints[b-23ke5wr3zd] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px 20px;
    border: 1px solid var(--tsc-border);
    border-left: 4px solid var(--tsc-border-strong);
    border-radius: var(--tsc-radius);
    background: var(--tsc-surface);
}

.setup-hints-incomplete[b-23ke5wr3zd] {
    border-left-color: var(--tsc-warning);
}

.setup-hints-title[b-23ke5wr3zd] {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 700;
}

.setup-hints-list[b-23ke5wr3zd] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    /* Punkt | Text, darunter der Link; ab mittlerer Breite steht der Link rechts daneben. */
    .setup-hints-list li[b-23ke5wr3zd] {
        display: grid;
        grid-template-columns: 8px minmax(0, 1fr);
        gap: 2px 10px;
        font-size: 0.9375rem;
        line-height: 1.45;
    }

.setup-dot[b-23ke5wr3zd] {
    width: 8px;
    height: 8px;
    margin-top: 8px;
    border-radius: 999px;
}

.setup-dot-missing[b-23ke5wr3zd] {
    background: var(--tsc-warning);
}

.setup-dot-hint[b-23ke5wr3zd] {
    background: var(--tsc-border-strong);
}

.setup-consequence[b-23ke5wr3zd] {
    color: var(--tsc-muted);
}

.setup-fix[b-23ke5wr3zd] {
    grid-column: 2;
    justify-self: start;
}

@media (min-width: 768px) {
    .setup-hints-list li[b-23ke5wr3zd] {
        grid-template-columns: 8px minmax(0, 1fr) auto;
        column-gap: 16px;
    }

    .setup-fix[b-23ke5wr3zd] {
        grid-column: 3;
        white-space: nowrap;
    }
}
/* /Components/Shared/SignatureEditor.razor.rz.scp.css */
.signature-size-heading[b-prfqwflf7q] {
    margin: 32px 0 12px;
    font-size: 1rem;
    font-weight: 700;
}

/* Ausschnitt wie aus dem Brief geschnitten: weißes Papier mit Zackenrand oben und unten, leichter Schatten. Der Schatten
   sitzt auf der Figur, weil die Maske ihn am Papier selbst abschneiden würde. */
/* Originalgröße: so breit wie das gerenderte Blatt (LetterLayout.ExcerptWidth), Schrift damit wie 12 pt auf Papier. */
.letter-excerpt[b-prfqwflf7q] {
    max-width: 140mm;
    margin: 0 0 12px;
    filter: drop-shadow(0 2px 6px rgba(20, 36, 60, 0.18));
}

.letter-excerpt-paper[b-prfqwflf7q] {
    --tooth: 12px;
    min-height: 140px;
    padding: 6px 0;
    background: #fff;
    -webkit-mask:
        conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) 50% 0 / var(--tooth) 51% repeat-x,
        conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% 100% / var(--tooth) 51% repeat-x;
    mask:
        conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) 50% 0 / var(--tooth) 51% repeat-x,
        conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% 100% / var(--tooth) 51% repeat-x;
}

    /* preview.js vergibt die Klasse page-image; deren A4-Seitenverhältnis und Schatten gelten hier nicht. */
    .letter-excerpt-paper[b-prfqwflf7q]  .page-image {
        display: block;
        width: 100%;
        max-width: none;
        height: auto;
        aspect-ratio: auto;
        box-shadow: none;
    }

.letter-excerpt figcaption[b-prfqwflf7q] {
    margin-top: 6px;
    font-size: 0.8125rem;
    color: var(--tsc-muted);
}

.scale-button[b-prfqwflf7q] {
    min-width: 36px;
    font-weight: 700;
}

.scale-value[b-prfqwflf7q] {
    min-width: 3.5em;
    text-align: center;
    font-variant-numeric: tabular-nums;
}
/* /Components/Shared/SignaturePad.razor.rz.scp.css */
/* Seitenverhältnis 3 : 1 wie ein Unterschriftsfeld; die Linie sitzt bei drei Vierteln der Höhe. */
.signature-pad[b-5ienf2d4t2] {
    position: relative;
    max-width: 600px;
    aspect-ratio: 3 / 1;
    border: 1px solid var(--tsc-border);
    border-radius: 10px;
    background: var(--tsc-surface);
    /* Kein Markieren, keine Lupe und kein Kontextmenü beim Zeichnen (Safari auf iPad und iPhone) */
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

.signature-canvas[b-5ienf2d4t2] {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    cursor: crosshair;
    /* Kein Scrollen oder Zoomen beim Zeichnen mit dem Finger */
    touch-action: none;
}

    .signature-canvas.erasing[b-5ienf2d4t2] {
        cursor: cell;
    }

.signature-line[b-5ienf2d4t2] {
    position: absolute;
    right: 24px;
    bottom: 25%;
    left: 24px;
    border-bottom: 1px solid var(--tsc-border);
}

/* Werkzeuge links oben (Stift, Radiergummi), Rückgängig und Leeren rechts oben, jeweils als Symbole im Feld */
.signature-modes[b-5ienf2d4t2],
.signature-tools[b-5ienf2d4t2] {
    position: absolute;
    top: 6px;
    z-index: 2;
    display: flex;
    gap: 4px;
}

.signature-modes[b-5ienf2d4t2] {
    left: 6px;
}

.signature-tools[b-5ienf2d4t2] {
    right: 6px;
}

.signature-tool[b-5ienf2d4t2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 8px;
    background: var(--tsc-surface);
    color: var(--tsc-muted);
}

    .signature-tool:hover:not(:disabled)[b-5ienf2d4t2] {
        border-color: var(--tsc-border);
        color: var(--tsc-text);
    }

    /* Leeren verwirft alles: rot, damit es sich vom Rückgängig abhebt */
    .signature-tool-danger[b-5ienf2d4t2],
    .signature-tool-danger:hover:not(:disabled)[b-5ienf2d4t2] {
        color: var(--tsc-error);
    }

    /* Gewähltes Werkzeug */
    .signature-tool.active[b-5ienf2d4t2] {
        border-color: var(--tsc-accent);
        background: var(--tsc-accent-soft);
        color: var(--tsc-accent);
    }

    .signature-tool:disabled[b-5ienf2d4t2] {
        opacity: 0.35;
    }
/* /Components/Shared/StepCard.razor.rz.scp.css */
.step-card[b-fg4fwg77w5] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.step-card-head[b-fg4fwg77w5] {
    margin: 0;
    font-size: 1.0625rem;
}

/* Die ganze Kopfzeile klappt, nicht nur der Pfeil: größere Fläche, auch auf dem Smartphone gut zu treffen */
.step-card-toggle[b-fg4fwg77w5] {
    display: flex;
    gap: 10px;
    align-items: center;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

    .step-card-toggle:focus-visible[b-fg4fwg77w5] {
        outline: 2px solid var(--tsc-accent);
        outline-offset: 4px;
        border-radius: 4px;
    }

.step-card-title[b-fg4fwg77w5] {
    flex: 1 1 auto;
}

.step-card-state[b-fg4fwg77w5] {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    font-size: 0.8125rem;
}

.step-card-chevron[b-fg4fwg77w5] {
    display: inline-flex;
    color: var(--tsc-muted);
    transition: transform 0.15s ease;
}

    .step-card-chevron.open[b-fg4fwg77w5] {
        transform: rotate(180deg);
    }

.step-card-body[b-fg4fwg77w5] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.num[b-fg4fwg77w5] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: var(--tsc-accent-soft);
    color: var(--tsc-accent);
    font-size: 0.8125rem;
    font-weight: 700;
}
/* /Components/Shared/TabBar.razor.rz.scp.css */
/* Wie .preview-tab im Kündigungsassistenten */
.tab-bar[b-rxp332mn6t] {
    display: flex;
    flex-wrap: wrap;
}

.tab[b-rxp332mn6t] {
    padding: 8px 14px;
    border: none;
    border-bottom: 2px solid transparent;
    background: none;
    color: var(--tsc-muted);
    font: inherit;
    cursor: pointer;
}

    .tab:hover[b-rxp332mn6t] {
        color: var(--tsc-text);
    }

    .tab.active[b-rxp332mn6t] {
        border-bottom-color: var(--tsc-accent);
        color: var(--tsc-accent);
        font-weight: 600;
    }