/* /Components/Dashboard/DashboardWidget.razor.rz.scp.css */
/* Lade-Zustand der Dashboard-Kachel mittig darstellen.
   Keine Marken-Hex-Werte – Farben kommen über MudBlazor (Color.Primary)
   bzw. var(--std-*). */
.std-widget-loading[b-xqeshq1d7m] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 96px;
}
/* /Components/Hub/HubTile.razor.rz.scp.css */
/* Die Kachel-Optik (Rahmen, Hover-Anhebung, Sperr-/„Jetzt dran"-Zustand,
   Fokusrahmen) liegt bewusst GLOBAL in wwwroot/app.css unter der
   std-tile-hover-Familie – identisch zu den Dashboard-Kacheln.
   Grund: Scoped Component-CSS greift auf der MudPaper-Kind-Komponente nicht
   zuverlässig; ohne Rahmen wären die Kacheln auf weißem Grund unsichtbar. */
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ===== Haupt-App-Container =====
   Höhe = exakt Viewport. Header + Footer sind flex-shrink:0 (fixe Höhe),
   Content nimmt den Rest und scrollt intern (overflow-y: auto unten). */
.std-app[b-3bmf8x40bs] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background-color: #FFFFFF;
    overflow: hidden;
}

/* ===== Header / Top-Menü ===== */
.std-header[b-3bmf8x40bs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    height: 56px;
    background: linear-gradient(135deg, var(--std-primary) 0%, var(--std-secondary) 100%);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    position: sticky;
    top: 0;
    z-index: 100;
    flex-shrink: 0;
}

/* Linker Header-Bereich: Logo + ggf. Verwaltung-Link */
.std-header-left[b-3bmf8x40bs] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* ===== Marken-Logo (Icon links) ===== */
/* Brand-Button: gleiches Aussehen wie .std-btn-auth (Rahmen + Hintergrund),
   trägt nur das Logo-Icon. Größe = Icon-Größe der übrigen Header-Buttons
   (1.1rem, siehe font-size von .std-btn-auth), sonst ist der Home-Button
   größer als seine Nachbarn (Bug #287). */
.std-brand-icon[b-3bmf8x40bs] {
    width: 1.1rem;
    height: 1.1rem;
    display: block;
}

/* ===== Rechter Header-Bereich (Support / Profil / An-/Abmelden) ===== */
.std-header-right[b-3bmf8x40bs] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== Auth-Button (icon-only, einheitlich für An-/Abmelden, Support, Profil, Verwaltung) ===== */
.std-btn-auth[b-3bmf8x40bs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid #FFFFFF;
    color: #FFFFFF;
    padding: 8px 10px;
    /* Feste Höhe statt inhaltsgetriebener Höhe: die bi-Glyphen (Font-Metrik)
       und das Logo-IMG würden sonst unterschiedlich hohe Buttons ergeben (Bug #287). */
    height: 37px;
    box-sizing: border-box;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1.1rem;
    line-height: 1;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.std-btn-auth:hover[b-3bmf8x40bs] {
    background-color: rgba(255, 255, 255, 0.3);
    color: #FFFFFF;
    text-decoration: none;
}

/* ===== #1048: Beschriftung neben dem Icon ab Desktop-Breite =====
   Unterhalb von 992 px bleiben die Header-Buttons icon-only mit Tooltip – auf
   schmalen Viewports ist der Platz nicht da. Ab 992 px steht die Bedeutung
   daneben, weil der Header dort ohnehin Luft hat und Icons allein nicht
   selbsterklärend sind (Veranstalter-Rückmeldung).

   Das Label trägt aria-hidden: Der Zugangsname steht bereits im aria-label des
   Buttons, sonst läse ein Screenreader die Beschriftung doppelt vor. Tooltip
   (title) und aria-label bleiben in beiden Zuständen erhalten. */
.std-btn-label[b-3bmf8x40bs] {
    display: none;
}

@media (min-width: 992px) {
    .std-btn-label[b-3bmf8x40bs] {
        display: inline;
        margin-left: 6px;
        font-size: 0.9rem;
        /* Die Glyphen sind 1.1rem – ohne eigene Zeilenhöhe säße der Text
           gegenüber dem Icon leicht versetzt. */
        line-height: 1;
    }

    /* Der Profil-Button trägt den Anzeigenamen. Lange Namen dürfen den Header
       nicht auseinanderziehen, deshalb Kürzung mit Ellipsis – der vollständige
       Name steht im title-Attribut. */
    .std-btn-label-user[b-3bmf8x40bs] {
        display: inline-block;
        max-width: 14ch;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: bottom;
    }
}

/* Verwaltung-Link im Header: aktiv = volle Deckung (kennzeichnet aktuellen /admin-Zustand) */
.std-btn-admin.active[b-3bmf8x40bs] {
    background-color: rgba(255, 255, 255, 0.35);
    border-color: rgba(255, 255, 255, 0.9);
}

/* ===== Standard-Content (Nicht-Admin-Seiten) =====
   Outer/Inner-Pattern (siehe CLAUDE.md Pattern 6, Layout-Patterns):
   Outer ist full-width und scrollt — Scrollbar sitzt damit am rechten
   Viewport-Rand, nicht am rechten Rand eines zentrierten Containers.
   min-height:0 ist in Flex-Containern Pflicht, sonst überrennt der
   Content seinen flex-Anteil und der Footer wandert raus. */
.std-content[b-3bmf8x40bs] {
    flex: 1;
    width: 100%;
    overflow-y: auto;
    min-height: 0;
}

/* Inner-Container begrenzt + zentriert den eigentlichen Content auf
   max. 1400 px. */
.std-content-inner[b-3bmf8x40bs] {
    padding: 24px;
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}

/* ===== Admin-Layout (2-Spaltig: Sidebar + Content) ===== */
.std-admin-layout[b-3bmf8x40bs] {
    flex: 1;
    display: flex;
    min-height: 0;
}

/* #1043: Breite als CSS-Variable, damit der Anfasser sie zur Laufzeit setzen kann.
   Der Fallback 280px gilt, solange nichts gemerkt ist – vorher waren es 240px, bei
   denen lange Gruppentitel wie „Veranstaltungsmanagement" abgeschnitten wurden. */
.std-admin-sidebar[b-3bmf8x40bs] {
    width: var(--std-sidebar-width, 280px);
    flex-shrink: 0;
    background-color: var(--std-light);
    border-right: 1px solid var(--std-border);
    overflow-y: auto;
    padding: 16px 0;
    display: flex;
    flex-direction: column;
}

/* #1043: Anfasser zwischen Navigation und Inhalt. Schmaler Streifen mit großzügiger
   Trefferfläche; die sichtbare Linie erscheint erst bei Hover oder Fokus, damit die
   Oberfläche ruhig bleibt. */
.std-sidebar-resizer[b-3bmf8x40bs] {
    flex: 0 0 6px;
    cursor: col-resize;
    background-color: transparent;
    border: none;
    padding: 0;
    position: relative;
    touch-action: none;
}

.std-sidebar-resizer[b-3bmf8x40bs]::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 2px;
    width: 2px;
    background-color: transparent;
    transition: background-color 0.15s ease;
}

.std-sidebar-resizer:hover[b-3bmf8x40bs]::after,
.std-sidebar-resizer:focus-visible[b-3bmf8x40bs]::after,
body[data-std-sidebar-resizing] .std-sidebar-resizer[b-3bmf8x40bs]::after {
    background-color: var(--std-primary);
}

.std-sidebar-resizer:focus-visible[b-3bmf8x40bs] {
    outline: 2px solid var(--std-primary);
    outline-offset: -2px;
}

/* Während des Ziehens darf der Inhalt nicht markiert werden, sonst „klebt" Text
   am Mauszeiger. */
body[data-std-sidebar-resizing][b-3bmf8x40bs] {
    user-select: none;
    cursor: col-resize;
}

/* #1043: Lange Beschriftungen brechen um, statt abgeschnitten zu werden. */
.std-admin-sidebar-header[b-3bmf8x40bs],
.std-admin-nav-link[b-3bmf8x40bs],
.std-admin-nav-group-title[b-3bmf8x40bs] {
    overflow-wrap: anywhere;
    hyphens: auto;
}

.std-admin-nav-link[b-3bmf8x40bs] {
    align-items: flex-start;
}

/* Das Icon behält seine Zeile, auch wenn der Text zweizeilig wird. */
.std-admin-nav-link .bi[b-3bmf8x40bs] {
    flex-shrink: 0;
    line-height: 1.5;
}

.std-admin-sidebar-header[b-3bmf8x40bs] {
    padding: 0 20px 12px 20px;
    margin-bottom: 8px;
    color: var(--std-primary);
    font-weight: 600;
    font-size: 0.95rem;
    border-bottom: 1px solid var(--std-border);
    display: flex;
    align-items: center;
    gap: 8px;
}

.std-admin-nav-link[b-3bmf8x40bs] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    color: #333333;
    text-decoration: none;
    font-size: 0.9rem;
    border-left: 3px solid transparent;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.std-admin-nav-link:hover[b-3bmf8x40bs] {
    background-color: rgba(20, 55, 94, 0.08);
    color: var(--std-primary);
    text-decoration: none;
}

.std-admin-nav-link.active[b-3bmf8x40bs] {
    background-color: rgba(20, 55, 94, 0.12);
    color: var(--std-primary);
    border-left-color: var(--std-primary);
    font-weight: 600;
}

.std-admin-nav-link .bi[b-3bmf8x40bs] {
    font-size: 1rem;
    width: 18px;
    text-align: center;
}

/* Zähler-Badge am Menüpunkt (z.B. offene Antrags-Eingänge, UC29) */
.std-nav-badge[b-3bmf8x40bs] {
    margin-left: auto;
    min-width: 20px;
    padding: 1px 7px;
    border-radius: 10px;
    background-color: var(--std-primary);
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
}

/* ===== Aufgaben-Gruppen der Admin-Navigation (#230) ===== */
/* Jede Gruppe ist ein <details>; der <summary> ist der klickbare Gruppen-Header. */
.std-admin-nav-group[b-3bmf8x40bs] {
    border-bottom: 1px solid rgba(155, 175, 200, 0.4);
}

/* Gruppen-Header: optisch wie ein Nav-Link, aber als Sektions-Überschrift fett.
   Das native Aufklapp-Dreieck wird entfernt (eigener Chevron rechts). */
.std-admin-nav-group-header[b-3bmf8x40bs] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    color: var(--std-primary);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
    user-select: none;
    border-left: 3px solid transparent;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.std-admin-nav-group-header[b-3bmf8x40bs]::-webkit-details-marker {
    display: none;
}

.std-admin-nav-group-header:hover[b-3bmf8x40bs] {
    background-color: rgba(20, 55, 94, 0.08);
}

.std-admin-nav-group-header .bi[b-3bmf8x40bs] {
    font-size: 1rem;
    width: 18px;
    text-align: center;
}

.std-admin-nav-group-title[b-3bmf8x40bs] {
    flex: 1;
}

/* Chevron rechts; dreht sich beim Aufklappen. */
.std-admin-nav-group-chevron[b-3bmf8x40bs] {
    transition: transform 0.15s ease;
}

.std-admin-nav-group[open] .std-admin-nav-group-chevron[b-3bmf8x40bs] {
    transform: rotate(180deg);
}

/* Aktiver Bereich: Header hervorgehoben (linke Akzentlinie + leichter Hintergrund). */
.std-admin-nav-group.active > .std-admin-nav-group-header[b-3bmf8x40bs] {
    background-color: rgba(20, 55, 94, 0.06);
    border-left-color: var(--std-primary);
}

/* Items innerhalb einer Gruppe leicht eingerückt, damit die Hierarchie sichtbar ist. */
.std-admin-nav-group .std-admin-nav-link[b-3bmf8x40bs] {
    padding-left: 38px;
}

/* Menüpunkte, die als <button> statt <a> rendern (Hilfe/Kontakt in der Mandanten-Sidebar, #147):
   Button-Chrome zurücksetzen, damit sie exakt wie ein verlinkter Nav-Link aussehen. */
button.std-admin-nav-link[b-3bmf8x40bs] {
    width: 100%;
    background: none;
    border: none;
    border-left: 3px solid transparent;
    font-family: inherit;
    font-size: 0.9rem;
    cursor: pointer;
}

/* ===== Deaktivierte ("bald verfügbar") Menüpunkte der Schausteller-Navigation (#231) ===== */
/* Noch nicht umgesetzte Ziele (abhängige Work Items #159/#160/#161, FIM-geführtes Profil) werden
   als nicht-klickbarer Platzhalter gezeigt, damit die Gruppenstruktur vollständig sichtbar ist. */
.std-admin-nav-link.std-nav-disabled[b-3bmf8x40bs] {
    color: #8a93a0;
    cursor: default;
}

.std-admin-nav-link.std-nav-disabled:hover[b-3bmf8x40bs] {
    background-color: transparent;
    color: #8a93a0;
}

/* „bald verfügbar"-Hinweis rechts am Platzhalter. */
.std-nav-soon[b-3bmf8x40bs] {
    margin-left: auto;
    padding: 1px 7px;
    border-radius: 10px;
    background-color: var(--std-light);
    color: var(--std-secondary);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

.std-admin-content[b-3bmf8x40bs] {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
    min-width: 0;
    box-sizing: border-box;
}

/* ===== Blazor Error-UI ===== */
#blazor-error-ui[b-3bmf8x40bs] {
    color-scheme: light only;
    background: #b32121;
    color: #FFFFFF;
    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-3bmf8x40bs] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
    .std-header[b-3bmf8x40bs] {
        padding: 0 12px;
        height: 52px;
    }

    .std-content-inner[b-3bmf8x40bs] {
        padding: 16px;
    }

    /* ===== #1043: Overlay-Menü statt stummer Icon-Spalte =====
       Bis #1043 schrumpfte die Navigation hier auf 56 px und blendete alle
       Beschriftungen per font-size: 0 aus. Übrig blieben Icons ohne Text – für
       neue Nutzer nicht selbsterklärend und damit gegen das Leitprinzip des
       Systems. Jetzt ist die Navigation standardmäßig ausgeblendet und wird über
       den Hamburger im Header als vollständig beschriftetes Overlay eingeblendet. */
    .std-admin-sidebar[b-3bmf8x40bs] {
        position: fixed;
        top: 52px; /* Höhe des Headers auf dieser Breite */
        left: 0;
        bottom: 0;
        z-index: 1200;
        width: min(85vw, 320px);
        transform: translateX(-100%);
        transition: transform 0.2s ease;
        box-shadow: 2px 0 12px rgba(0, 0, 0, 0.25);
    }

    body[data-std-nav-open] .std-admin-sidebar[b-3bmf8x40bs] {
        transform: translateX(0);
    }

    /* Abdunklung hinter dem Overlay – macht sichtbar, dass der Inhalt dahinter
       liegt, und dient als Schließfläche (Klick wird in std-sidebar.js behandelt). */
    body[data-std-nav-open] .std-admin-layout[b-3bmf8x40bs]::before {
        content: "";
        position: fixed;
        top: 52px;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.4);
        z-index: 1100;
    }

    /* Der Anfasser ergibt auf Smartphone-Breite keinen Sinn – dort ist die
       Navigation ein Overlay fester Breite. */
    .std-sidebar-resizer[b-3bmf8x40bs] {
        display: none;
    }

    .std-admin-content[b-3bmf8x40bs] {
        padding: 16px;
    }
}

/* Der Hamburger erscheint nur dort, wo die Navigation zum Overlay wird. */
.std-nav-toggle[b-3bmf8x40bs] {
    display: none;
}

@media (max-width: 768px) {
    .std-nav-toggle[b-3bmf8x40bs] {
        display: inline-flex;
    }
}
/* /Components/Layout/NotificationBell.razor.rz.scp.css */
/* UC29-Feinschliff: Glocken-Dropdown im Header.
   Farben über die Marken-CSS-Variablen aus app.css (:root). */

.std-bell-wrapper[b-evisekak64] {
    position: relative;
    display: inline-block;
}

.std-bell-badge[b-evisekak64] {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 8px;
    background: #C62828;
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
}

.std-bell-overlay[b-evisekak64] {
    position: fixed;
    inset: 0;
    z-index: 1290;
    background: transparent;
}

.std-bell-dropdown[b-evisekak64] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 1300;
    width: 340px;
    max-height: 420px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--std-border);
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.std-bell-header[b-evisekak64] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid var(--std-light);
    color: var(--std-primary);
    font-weight: 600;
}

.std-bell-mark-all[b-evisekak64] {
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--std-secondary);
    font-size: 1.1rem;
    padding: 4px 6px;
}

.std-bell-item[b-evisekak64] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    border-bottom: 1px solid var(--std-light);
    background: transparent;
    text-align: left;
    cursor: pointer;
    color: #333;
}

.std-bell-item:hover[b-evisekak64] {
    background: var(--std-light);
}

.std-bell-item-error .std-bell-item-title[b-evisekak64] {
    color: #C62828;
}

.std-bell-item-title[b-evisekak64] {
    font-weight: 600;
    font-size: 0.9rem;
}

.std-bell-item-body[b-evisekak64] {
    font-size: 0.82rem;
    color: #555;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.std-bell-item-time[b-evisekak64] {
    font-size: 0.72rem;
    color: #888;
}

.std-bell-empty[b-evisekak64] {
    padding: 16px 12px;
    color: #666;
    font-size: 0.9rem;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-211mjnfyp3],
.components-reconnect-repeated-attempt-visible[b-211mjnfyp3],
.components-reconnect-failed-visible[b-211mjnfyp3],
.components-pause-visible[b-211mjnfyp3],
.components-resume-failed-visible[b-211mjnfyp3],
.components-rejoining-animation[b-211mjnfyp3] {
    display: none;
}

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


#components-reconnect-modal[b-211mjnfyp3] {
    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-211mjnfyp3 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-211mjnfyp3 {
    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/Layout/TenantSwitcher.razor.rz.scp.css */
/* #1024: Mandantenumschalter im Header.
   Farben über die Marken-CSS-Variablen aus app.css (:root). */

.std-tenant-wrapper[b-xlotmra1ki] {
    position: relative;
    display: inline-block;
}

.std-tenant-static[b-xlotmra1ki],
.std-tenant-trigger[b-xlotmra1ki] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 240px;
}

.std-tenant-static[b-xlotmra1ki] {
    padding: 8px 10px;
    color: #fff;
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.std-tenant-name[b-xlotmra1ki] {
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.std-tenant-overlay[b-xlotmra1ki] {
    position: fixed;
    inset: 0;
    z-index: 1290;
    background: transparent;
}

.std-tenant-dropdown[b-xlotmra1ki] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 1300;
    min-width: 280px;
    max-height: 420px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--std-border);
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.std-tenant-item[b-xlotmra1ki] {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid var(--std-light);
}

.std-tenant-item:last-child[b-xlotmra1ki] {
    border-bottom: none;
}

.std-tenant-switch-form[b-xlotmra1ki] {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}

.std-tenant-switch[b-xlotmra1ki] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
    color: #333;
    font-size: 0.9rem;
}

.std-tenant-switch:hover[b-xlotmra1ki] {
    background: var(--std-light);
}

.std-tenant-switch[aria-current="true"][b-xlotmra1ki] {
    color: var(--std-primary);
    font-weight: 600;
}

.std-tenant-item-name[b-xlotmra1ki] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.std-tenant-default[b-xlotmra1ki] {
    flex: 0 0 auto;
    padding: 4px 12px;
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--std-secondary);
    font-size: 1.1rem;
}

.std-tenant-default:hover:not(:disabled)[b-xlotmra1ki] {
    background: var(--std-light);
}

.std-tenant-default:disabled[b-xlotmra1ki] {
    cursor: default;
    color: var(--std-primary);
}
/* /Components/Mandant/EventContextHeader.razor.rz.scp.css */
/* #1052: Kopfzeile mit dem aktiven Veranstaltungs-Kontext.
   Bewusst zurückhaltend gestaltet - sie steht auf jeder Seite des Bereichs und darf
   dem eigentlichen Inhalt nicht die Aufmerksamkeit nehmen. Der Veranstaltungsname
   trägt die Betonung, das Label bleibt sekundär. */
.std-event-context-header[b-g91alf67l1] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    margin-bottom: 16px;
    background-color: var(--std-light);
    border: 1px solid var(--std-border);
    border-radius: 6px;
}

.std-event-context-leading[b-g91alf67l1],
.std-event-context-trailing[b-g91alf67l1] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.std-event-context-main[b-g91alf67l1] {
    flex: 1;
    min-width: 0;
}

/* #1072: Zurück-Button und Titel in einer Zeile, mittig zueinander. Vorher stand der
   Button als Geschwister neben dem gesamten mittleren Block: Sobald der Breadcrumb
   diesen zweizeilig machte, zentrierte die Kopfzeile den Block als Ganzes, und der
   Titel saß 10 px unter dem Button. Die Ausrichtung hier unten greift unabhängig
   davon, ob eine Breadcrumb-Zeile darüber steht - anders als eine Regel auf der
   Kopfzeile, die beide Fälle nicht gleichzeitig bedienen kann. */
.std-event-context-titlerow[b-g91alf67l1] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

/* #1047: Breadcrumb-Zeile über dem Veranstaltungsnamen. Bewusst kleiner und blasser
   als der Name darunter - sie ordnet ein, sie ist nicht die Hauptinformation. */
.std-event-context-breadcrumb[b-g91alf67l1] {
    font-size: 0.8rem;
    margin-bottom: 2px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    color: #555555;
}

.std-breadcrumb-link[b-g91alf67l1] {
    color: var(--std-secondary);
    text-decoration: none;
}

.std-breadcrumb-link:hover[b-g91alf67l1],
.std-breadcrumb-link:focus-visible[b-g91alf67l1] {
    text-decoration: underline;
}

/* Die aktuelle Ebene ist bewusst kein Link - sie führt nirgendwohin. */
.std-breadcrumb-current[b-g91alf67l1] {
    color: #555555;
    font-weight: 500;
}

.std-breadcrumb-separator[b-g91alf67l1] {
    color: var(--std-border);
}

/* Der Zurück-Button trägt seinen Zieltext; bei langen Zielen darf er umbrechen,
   statt die Kopfzeile zu sprengen. */
.std-event-context-leading .mud-button-label[b-g91alf67l1] {
    white-space: normal;
    text-align: left;
}

.std-event-context-title[b-g91alf67l1] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}

.std-event-context-label[b-g91alf67l1] {
    font-size: 0.85rem;
    color: #555555;
}

.std-event-context-value[b-g91alf67l1] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--std-primary);
    overflow-wrap: anywhere;
}

/* Ohne gewählte Veranstaltung: neutraler Hinweis, keine Warn-Optik - eine noch nicht
   getroffene Auswahl ist kein Fehler (#1044 Teil 2). */
.std-event-context-empty[b-g91alf67l1] {
    font-size: 0.9rem;
    color: #555555;
    font-style: italic;
}

@media (max-width: 768px) {
    .std-event-context-header[b-g91alf67l1] {
        padding: 8px 12px;
        margin-bottom: 12px;
    }

    .std-event-context-value[b-g91alf67l1] {
        font-size: 0.95rem;
    }
}
/* /Components/Mandant/MandantEventSwitcher.razor.rz.scp.css */
/*
    Styling des Veranstaltungs-Switchers im Kopf der Veranstalter-Sidebar (#148).

    #1037: Diese Regeln lagen zuvor in MainLayout.razor.css und griffen dort NICHT:
    Blazor versieht isoliertes CSS mit dem Scope-Attribut der Komponente, zu der die
    .razor.css gehört. Das Markup steht aber in MandantEventSwitcher.razor, dessen
    Elemente das Attribut von MainLayout nie erhalten. Deshalb liegen sie jetzt bei
    ihrer eigenen Komponente.
*/

.std-event-switcher[b-7drgvozxwi] {
    padding: 0 20px 12px 20px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--std-border);
}

.std-event-switcher-label[b-7drgvozxwi] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    color: var(--std-primary);
    font-size: 0.8rem;
    font-weight: 600;
}

/* #1037: Markenlogo (Riesenrad) am Label. standplatz-logo.svg ist fest weiß gezeichnet
   (für den Marine-Header) und in der hellen Sidebar unsichtbar. Statt einer zweiten
   Logo-Datei wird die SVG als Maske verwendet und über die Marken-Farbe eingefärbt –
   so bleibt die SVG-Datei die einzige handgepflegte Quelle des Logos. */
.std-event-switcher-brand[b-7drgvozxwi] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    background-color: var(--std-primary);
    -webkit-mask-image: url('/standplatz-logo.svg');
    mask-image: url('/standplatz-logo.svg');
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

/* #1037: Auswahlfeld und Stern-Schalter nebeneinander; das Feld nimmt den Rest der Breite. */
.std-event-switcher-row[b-7drgvozxwi] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.std-event-switcher-row > :first-child[b-7drgvozxwi] {
    flex: 1 1 auto;
    min-width: 0;
}
/* /Components/Shared/AppFooter.razor.rz.scp.css */
/* Footer: Links Impressum/Datenschutz, rechts Copyright + Versionsnummer.
   Auf schmalen Viewports (Mobile) bleibt die Aufteilung links/rechts erhalten,
   die rechte Seite darf umbrechen und bleibt rechtsbündig. */
.std-footer[b-jy8unr52p2] {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.7);
    padding: 10px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
    background: linear-gradient(135deg, var(--std-primary) 0%, var(--std-secondary) 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.std-footer a[b-jy8unr52p2] {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    transition: color 0.15s ease;
}

.std-footer a:hover[b-jy8unr52p2] {
    color: #FFFFFF;
    text-decoration: underline;
}

/* Linker Block: bricht nicht um, schrumpft nicht */
.std-footer-links[b-jy8unr52p2] {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
    white-space: nowrap;
}

/* Rechter Block: rechtsbündig, darf umbrechen */
.std-footer-copyright[b-jy8unr52p2] {
    color: rgba(255, 255, 255, 0.7);
    text-align: right;
    min-width: 0;
    line-height: 1.4;
}

.std-footer-copyright a[b-jy8unr52p2] {
    color: inherit;
}
/* /Components/Shared/FormPager.razor.rz.scp.css */
/* #353: Titelzeile des Seiten-Assistenten – Größe/Abstand wie ein Zwischen-Header,
   damit die rohe h2 (Fokusziel beim Seitenwechsel) sich ins Formular einfügt. */
.std-form-pager-title[b-lssw47y64n] {
    font-size: 1.15rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
}

/* Dezenter Fokusrahmen, wenn der Seitenwechsel den Fokus auf die Titelzeile setzt. */
.std-form-pager-title:focus-visible[b-lssw47y64n] {
    outline: 2px solid var(--std-primary);
    outline-offset: 4px;
    border-radius: 4px;
}
/* /Components/Shared/StandplatzActionMenu.razor.rz.scp.css */
/* StandplatzActionMenu – Drop-in-Ersatz für MudMenu mit Drei-Punkte-Icon.
   Look-and-feel an MudMenu/MudPopover angelehnt (gleiche Schattierung,
   Border-Radius, Farben), aber technisch ein simples absolutes Panel
   ohne MudPopover-Cascading-Mechanik. */

.std-action-menu[b-pgndpp9u9y] {
    position: relative;
    display: inline-block;
}

.std-action-menu-trigger[b-pgndpp9u9y] {
    /* Erbt die MudBlazor-IconButton-Klassen aus dem Markup; hier nur
       Pflicht-Reset, damit native <button> wie ein MudIconButton aussieht. */
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 5px;
    border-radius: 50%;
    color: rgba(0, 0, 0, 0.54);
    transition: background-color 0.15s ease;
}

.std-action-menu-trigger:hover[b-pgndpp9u9y] {
    background-color: rgba(0, 0, 0, 0.08);
}

.std-action-menu-trigger:focus-visible[b-pgndpp9u9y] {
    outline: 2px solid var(--std-primary, #14375E);
    outline-offset: 2px;
}

/* Backdrop fängt Außenklicks ab und schließt das Menü.
   Transparent + fixed-position bedeckt den gesamten Viewport. */
.std-action-menu-backdrop[b-pgndpp9u9y] {
    position: fixed;
    inset: 0;
    z-index: 1300;
    background: transparent;
    cursor: default;
}

/* Panel rechtsbündig zum Trigger – unten anhängend wie ein Dropdown. */
.std-action-menu-panel[b-pgndpp9u9y] {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 1301;
    min-width: 240px;
    padding: 4px 0;
    /* Inhalte (StandplatzActionMenuItem) als vertikale Liste */
    display: flex;
    flex-direction: column;
}
/* /Components/Shared/StandplatzActionMenuItem.razor.rz.scp.css */
/* StandplatzActionMenuItem – einzelne Zeile in StandplatzActionMenu.
   Look-and-feel an MudMenuItem angelehnt. */

.std-action-menu-item[b-8y8ouxgse6] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 16px;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    font-size: 0.875rem;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.87);
    transition: background-color 0.15s ease;
    white-space: nowrap;
}

.std-action-menu-item:hover[b-8y8ouxgse6] {
    background-color: rgba(0, 0, 0, 0.06);
}

.std-action-menu-item:focus-visible[b-8y8ouxgse6] {
    outline: none;
    background-color: rgba(0, 0, 0, 0.08);
}

.std-action-menu-item:disabled[b-8y8ouxgse6] {
    color: rgba(0, 0, 0, 0.38);
    cursor: not-allowed;
}

.std-action-menu-item:disabled:hover[b-8y8ouxgse6] {
    background-color: transparent;
}

.std-action-menu-item-icon[b-8y8ouxgse6] {
    color: rgba(0, 0, 0, 0.54);
    flex-shrink: 0;
}

.std-action-menu-item-label[b-8y8ouxgse6] {
    flex: 1;
}