/* Jedi-Ritter DEV-34: Originalbanner 2048 x 388; die Felder bleiben echte HTML-Links.
   Isolierte Regeln greifen nur, wenn das neue Headerbild aktiv ist. */
body.jedi-banner-layout .top-banner,
body.jedi-banner-layout .navbar {
    display:none!important;
}
body.jedi-banner-layout .jedi-hero.jedi-banner {
    position:relative;
    z-index:140;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    isolation:isolate;
    background:#030304!important;
    border:0!important;
}
body.jedi-banner-layout .jedi-hero.jedi-banner::after { content:none!important; }
body.jedi-banner-layout .jedi-banner-stage {
    position:relative;
    width:100%;
    aspect-ratio:2048 / 388;
    color:#f8e9cb;
    font-family:Arial,"Segoe UI",sans-serif;
}
body.jedi-banner-layout .jedi-banner-art {
    display:block;
    width:100%;
    height:100%;
    object-fit:fill;
    pointer-events:none;
    user-select:none;
}
body.jedi-banner-layout .jedi-banner-stage :is(a,button,summary) {
    -webkit-tap-highlight-color:transparent;
}
body.jedi-banner-layout .jedi-banner-stage a { color:#f5dfbd!important;text-decoration:none; }
body.jedi-banner-layout .jedi-banner-stage a:hover { color:#fff7e5!important; }
body.jedi-banner-layout .jedi-banner-stage :is(a,button,summary,input):focus-visible {
    outline:2px solid #ffe5a0;
    outline-offset:3px;
}

/* Linke schwarze Leiste: ausklappbares Schnellmenue. */
body.jedi-banner-layout .jedi-banner-quick {
    position:absolute;
    z-index:12;
    top:78.7%;
    left:4%;
    width:10.8%;
    height:12.7%;
    margin:0;
}
body.jedi-banner-layout .jedi-banner-quick>summary {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:clamp(4px,.4vw,9px);
    width:100%;
    height:100%;
    padding:0 5px;
    list-style:none;
    cursor:pointer;
    color:#f6db9f;
    text-shadow:0 1px 5px #000;
    font-size:clamp(10px,.80vw,16px);
    font-weight:800;
    letter-spacing:.01em;
    white-space:nowrap;
}
body.jedi-banner-layout .jedi-banner-quick>summary::-webkit-details-marker { display:none; }
body.jedi-banner-layout .jedi-banner-quick>summary span:first-child { color:#ff6960;font-size:1.35em; }
body.jedi-banner-layout .jedi-banner-quick>summary:hover,
body.jedi-banner-layout .jedi-banner-quick[open]>summary { background:rgba(135,21,17,.28); }
body.jedi-banner-layout .jedi-banner-popover {
    position:absolute;
    z-index:30;
    left:0;
    top:calc(100% + 7px);
    width:min(330px,84vw);
    max-height:min(70vh,700px);
    padding:12px;
    overflow:auto;
    background:linear-gradient(150deg,#191314,#090a0c);
    border:1px solid #b57f3c;
    box-shadow:0 15px 35px #000e,0 0 18px #8b292255;
    border-radius:8px;
}
body.jedi-banner-layout .jedi-banner-popover>a {
    display:block;
    padding:9px 10px;
    margin-top:2px;
    border-radius:4px;
    font-size:13px;
    line-height:1.25;
}
body.jedi-banner-layout .jedi-banner-popover>a:hover { background:#7b252c88; }
body.jedi-banner-layout .jedi-banner-search { padding:0 0 10px;border-bottom:1px solid #ae7e4655; }
body.jedi-banner-layout .jedi-banner-search label { display:block;margin-bottom:6px;font-size:12px;color:#e6c792; }
body.jedi-banner-layout .jedi-banner-search>div { display:flex;gap:5px; }
body.jedi-banner-layout .jedi-banner-search input[type=search] {
    min-width:0;
    flex:1;
    padding:8px;
    color:#fff;
    background:#111318!important;
    border:1px solid #745739;
    border-radius:5px;
    font-size:13px;
}
body.jedi-banner-layout .jedi-banner-search button {
    border:1px solid #9a6131;
    border-radius:5px;
    padding:6px 9px;
    background:#512024;
    color:#fff5e2;
    cursor:pointer;
    font-size:12px;
}

/* Lange schwarze Leiste: regulaere Hauptnavigation. */
body.jedi-banner-layout .jedi-banner-links {
    position:absolute;
    z-index:6;
    top:78.3%;
    left:15.35%;
    width:70%;
    height:12.8%;
    display:flex;
    align-items:center;
    justify-content:space-evenly;
    gap:clamp(2px,.3vw,9px);
    padding:0 .7%;
}
body.jedi-banner-layout .jedi-banner-links>a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:0;
    height:83%;
    flex:1 1 0;
    padding:0 3px;
    font-size:clamp(10px,.87vw,18px);
    font-weight:750;
    white-space:nowrap;
    color:#f6e4c5!important;
    text-shadow:0 1px 5px #000;
    border-radius:4px;
    transition:color .15s ease,background-color .15s ease;
}
body.jedi-banner-layout .jedi-banner-links>a:hover,
body.jedi-banner-layout .jedi-banner-links>a[aria-current=page] {
    background:linear-gradient(0deg,#8a25267a,#e2ac4830);
    color:#fff6d4!important;
    text-shadow:0 0 8px #ffbf86;
}

/* Obere rechte Logen: Avatar im Kreis, Name auf der schwarzen Plakette. */
body.jedi-banner-layout .jedi-banner-identity {
    position:absolute;
    z-index:7;
    top:22.2%;
    left:75.55%;
    width:15.45%;
    height:19.3%;
    display:flex;
    align-items:center;
    gap:3%;
    overflow:hidden;
    text-shadow:0 1px 6px #000;
}
body.jedi-banner-layout .jedi-banner-face {
    width:22.5%;
    max-height:94%;
    aspect-ratio:1;
    flex:0 0 auto;
    overflow:hidden;
    border-radius:50%;
    border:1px solid #c29951;
    background:#090b0f;
    box-shadow:0 0 7px #000;
}
body.jedi-banner-layout .jedi-banner-face img { width:100%;height:100%;object-fit:cover;display:block; }
body.jedi-banner-layout .jedi-banner-person {
    flex:1;
    min-width:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    text-align:center;
    gap:clamp(1px,.35vw,6px);
    padding-right:2%;
}
body.jedi-banner-layout .jedi-banner-person strong {
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:clamp(11px,1.06vw,22px);
    font-family:Georgia,"Times New Roman",serif;
    color:#fff0cc;
}
body.jedi-banner-layout .jedi-banner-person small {
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:clamp(9px,.68vw,14px);
    color:#d9ba8a;
}

/* Zweite rechte Plakette: echte Kontofunktionen. */
body.jedi-banner-layout .jedi-banner-user-actions {
    position:absolute;
    z-index:7;
    left:77.05%;
    top:43.2%;
    width:14.0%;
    height:11.6%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:2%;
    padding:0 1%;
}
body.jedi-banner-layout .jedi-banner-user-actions>a {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    flex:1;
    min-width:0;
    height:84%;
    padding:1px 3px;
    border-radius:4px;
    font-size:clamp(9px,.72vw,15px);
    font-weight:700;
    white-space:nowrap;
    text-align:center;
    text-shadow:0 1px 4px #000;
}
body.jedi-banner-layout .jedi-banner-user-actions>a:hover {background:#87392f80;}
body.jedi-banner-layout .jedi-banner-count {
    margin-left:4px;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    min-width:16px;
    min-height:16px;
    border-radius:10px;
    padding:1px 4px;
    background:#9d2226;
    color:white;
    font-size:10px;
}

/* Auf schmalen Bildschirmen brauchen die Inhalte normal grosse Klickflaechen,
   statt auf Briefmarkengroesse mit dem Bild herunterzuskalieren. */
@media (max-width:1020px) {
    body.jedi-banner-layout .jedi-banner-stage {
        display:grid;
        grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);
        aspect-ratio:auto;
        background:#0b0a0c;
    }
    body.jedi-banner-layout .jedi-banner-art {
        grid-column:1/-1;
        grid-row:1;
        height:clamp(145px,18.95vw,195px)!important;
        object-fit:cover;
        object-position:center;
    }
    body.jedi-banner-layout .jedi-banner-links {
        position:static;
        grid-row:2;
        grid-column:1/-1;
        width:100%;
        height:48px;
        display:flex;
        justify-content:flex-start;
        gap:4px;
        overflow-x:auto;
        scrollbar-width:thin;
        padding:3px 10px;
        background:linear-gradient(180deg,#2c1113,#08090a);
        border-top:1px solid #9f553c;
        border-bottom:1px solid #6b4c2a;
    }
    body.jedi-banner-layout .jedi-banner-links>a {
        flex:0 0 auto;
        height:36px;
        padding:6px 12px;
        font-size:13px;
    }
    body.jedi-banner-layout .jedi-banner-quick {
        grid-column:1;
        grid-row:3;
        position:relative;
        left:auto;
        top:auto;
        width:100%;
        height:49px;
        padding:6px 5px;
    }
    body.jedi-banner-layout .jedi-banner-quick>summary {
        font-size:12px;
        border-right:1px solid #544032;
    }
    body.jedi-banner-layout .jedi-banner-popover {
        top:calc(100% + 3px);
        left:8px;
        max-width:calc(100vw - 16px);
    }
    body.jedi-banner-layout .jedi-banner-identity {
        position:relative;
        grid-column:2;
        grid-row:3;
        top:auto;
        left:auto;
        width:100%;
        height:49px;
        padding:4px 12px;
        justify-content:flex-end;
        gap:8px;
    }
    body.jedi-banner-layout .jedi-banner-face { width:34px;height:34px;max-height:none; }
    body.jedi-banner-layout .jedi-banner-person { flex:0 1 auto; max-width:175px;text-align:left; }
    body.jedi-banner-layout .jedi-banner-person strong { font-size:13px; }
    body.jedi-banner-layout .jedi-banner-person small { font-size:10px; }
    body.jedi-banner-layout .jedi-banner-user-actions {
        position:static;
        grid-column:1/-1;
        grid-row:4;
        height:42px;
        width:100%;
        border-top:1px solid #42312a;
        border-bottom:1px solid #6b4c2a;
        padding:2px 10px;
        gap:6px;
    }
    body.jedi-banner-layout .jedi-banner-user-actions>a {
        flex:0 1 160px;
        font-size:12px;
        height:34px;
    }
}
@media (max-width:480px) {
    body.jedi-banner-layout .jedi-banner-art {height:145px!important;}
    body.jedi-banner-layout .jedi-banner-links>a {padding:6px 10px;}
    body.jedi-banner-layout .jedi-banner-quick>summary {font-size:11px;letter-spacing:0;}
    body.jedi-banner-layout .jedi-banner-identity {padding-right:7px;gap:5px;}
    body.jedi-banner-layout .jedi-banner-person { max-width:125px; }
    body.jedi-banner-layout .jedi-banner-person small {display:none;}
    body.jedi-banner-layout .jedi-banner-count {min-width:15px;min-height:15px;}
}
@media(prefers-reduced-motion:reduce) {
    body.jedi-banner-layout .jedi-banner-links>a {transition:none;}
}
body.jedi-banner-layout .jedi-banner-quick>summary .jedi-quick-count {
    position:absolute;
    top:0;
    right:0;
    min-width:16px;
    height:16px;
    display:grid;
    place-items:center;
    padding:0 3px;
    border-radius:12px;
    background:#a42025;
    color:#fff;
    font-size:10px;
    font-weight:800;
    line-height:1;
}
