/* ============================================================================
   Betreiber-Leiste nach WordPress-Muster. Wird in ALLEN drei Layouts
   eingebunden und ist nur mit der Rolle Admin sichtbar. Der Rollen-Claim steckt
   im Auth-Cookie, also kein DB-Zugriff pro Request.
   ============================================================================ */

.pj-adminbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 32px;
    background: #1d2327;
    color: #c3c4c7;
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    font-size: 13px;
    line-height: 32px;
    display: flex;
    align-items: center;
    gap: .25rem;
    padding-inline: .75rem;
    z-index: 1080;
}

/* body bekommt padding-top: 32px, damit die Leiste nichts verdeckt. Gesetzt in
   _AdminBar.cshtml, nicht global — ohne Admin-Rolle gibt es keinen Versatz. */
body.pj-mit-adminbar { padding-top: 32px; }

.pj-adminbar-marke {
    font-weight: 600;
    color: #fff;
    padding-right: .75rem;
    white-space: nowrap;
}

.pj-adminbar a {
    color: #c3c4c7;
    text-decoration: none;
    padding-inline: .7rem;
    height: 32px;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.pj-adminbar a:hover,
.pj-adminbar a:focus-visible { background: #2c3338; color: #72aee6; }
.pj-adminbar a.pj-aktiv { background: #2c3338; color: #fff; }

/* "Diese Rally bearbeiten" — nur sichtbar, wenn man auf einer Rally steht.
   Optisch abgesetzt, weil es die einzige kontextabhaengige Aktion ist. */
.pj-adminbar a.pj-kontext { color: #f0c33c; }

.pj-adminbar-fueller { flex: 1 1 auto; }

.pj-adminbar-nutzer {
    color: #8c8f94;
    padding-left: .75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Auf Mobil klappt die Leiste auf ein Icon zusammen: die Links verschwinden
   hinter dem Details-Element, die Hoehe von 32 px bleibt. */
.pj-adminbar-mobil { display: none; }

@media (max-width: 767.98px) {
    .pj-adminbar-nav, .pj-adminbar-nutzer { display: none; }

    .pj-adminbar-mobil { display: block; position: relative; }
    .pj-adminbar-mobil > summary {
        list-style: none;
        cursor: pointer;
        color: #c3c4c7;
        padding-inline: .5rem;
    }
    .pj-adminbar-mobil > summary::-webkit-details-marker { display: none; }

    .pj-adminbar-mobil[open] > .pj-adminbar-aufklapp {
        position: absolute;
        top: 32px;
        left: 0;
        min-width: 12rem;
        background: #1d2327;
        border: 1px solid #2c3338;
        padding: .35rem 0;
        display: flex;
        flex-direction: column;
        line-height: 1.4;
    }

    .pj-adminbar-mobil[open] > .pj-adminbar-aufklapp a { height: auto; padding: .5rem .9rem; }
}