/* ============================================================
   fairInstitut – gemeinsame Staff-Sidebar (fi-*)
   Eigener Namensraum, kollidiert NICHT mit Seiten-CSS.
   Sidebar immer navy (theme-unabhängig); Appbar/Content folgen dem Theme.
   Wird von sidebar.js befüllt. Variablen mit Fallback → robust auf jeder Seite.
   ============================================================ */
.fi-app{display:grid;grid-template-columns:266px 1fr;min-height:100vh}
.fi-app.fi-collapsed{grid-template-columns:76px 1fr}
.fi-sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,#213d51,#152636);color:#e8eef4;display:flex;flex-direction:column;overflow:hidden;z-index:40}
.fi-brand{display:flex;align-items:center;gap:11px;padding:15px 16px 13px;border-bottom:1px solid rgba(255,255,255,.09);min-height:64px}
.fi-logo{width:38px;height:38px;border-radius:10px;background:#fff;color:#203c50;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;flex:0 0 auto;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.fi-bt{font-weight:700;font-size:15px;line-height:1.15;white-space:nowrap}
.fi-bs{font-size:11px;color:#aebfce;white-space:nowrap;letter-spacing:.04em;text-transform:uppercase}
.fi-nav{flex:1;overflow-y:auto;padding:10px 10px 16px}
.fi-nav::-webkit-scrollbar{width:8px}.fi-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:8px}
.fi-group{margin-top:15px}.fi-group:first-child{margin-top:4px}
.fi-glabel{font-size:10.5px;text-transform:uppercase;letter-spacing:.13em;color:#8ba0b3;padding:0 10px 6px;font-weight:700;white-space:nowrap;overflow:hidden}
.fi-link{display:flex;align-items:center;gap:11px;min-height:44px;padding:10px 11px;border-radius:9px;color:#d3deea;text-decoration:none;font-size:14px;font-weight:500;line-height:1.2;margin-bottom:2px;white-space:nowrap;overflow:hidden}
.fi-link:hover{background:rgba(255,255,255,.09);color:#fff}
.fi-link.active{background:#fff;color:#203c50;font-weight:700;box-shadow:0 2px 10px rgba(0,0,0,.16)}
.fi-ic{width:20px;height:20px;flex:0 0 auto;color:#a3b6c8;display:flex;align-items:center;justify-content:center}
.fi-ic svg{width:19px;height:19px}
.fi-link:hover .fi-ic{color:#fff}
.fi-link.active .fi-ic{color:#203c50}
.fi-user{border-top:1px solid rgba(255,255,255,.09);padding:11px 12px;display:flex;align-items:center;gap:10px}
.fi-av{width:36px;height:36px;border-radius:50%;background:var(--gold,#b6892f);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13.5px;flex:0 0 auto}
.fi-uinfo{min-width:0;flex:1}
.fi-un{font-size:13px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fi-ur{font-size:11.5px;color:#a9bccd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fi-iconbtn{appearance:none;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#e7eef5;width:44px;height:44px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.fi-iconbtn:hover{background:var(--gold,#b6892f);border-color:var(--gold,#b6892f);color:#fff}
.fi-iconbtn svg{width:17px;height:17px}
.fi-main{min-width:0;display:flex;flex-direction:column}
.fi-appbar{position:sticky;top:0;z-index:30;background:var(--card,#fff);border-bottom:1px solid var(--line,#e4e9f0);display:flex;align-items:center;gap:11px;padding:10px 20px;min-height:64px}
.fi-titleblock{min-width:0}
.fi-eyebrow{font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted,#5b6675);font-weight:700}
.fi-appbar h1{font-size:19px;margin:0;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink,#16202c)}
.fi-burger,.fi-collapse{appearance:none;background:var(--card,#fff);border:1px solid var(--line,#e4e9f0);color:var(--ink,#16202c);width:44px;height:44px;border-radius:9px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.fi-burger:hover,.fi-collapse:hover{background:var(--gold,#b6892f);border-color:var(--gold,#b6892f);color:#fff}
.fi-burger svg,.fi-collapse svg{width:19px;height:19px}
.fi-burger{display:none}
.fi-content{padding:20px;max-width:1180px;width:100%;margin:0 auto}
.fi-backdrop{display:none;position:fixed;inset:0;background:rgba(15,22,30,.5);z-index:35}
/* Collapsed-Rail (Desktop) */
.fi-app.fi-collapsed .fi-bx,.fi-app.fi-collapsed .fi-lx,.fi-app.fi-collapsed .fi-uinfo{display:none}
.fi-app.fi-collapsed .fi-glabel{height:1px;padding:0;margin:0 0 6px;opacity:0}
.fi-app.fi-collapsed .fi-link{justify-content:center;padding:10px 0}
.fi-app.fi-collapsed .fi-brand{justify-content:center;padding:15px 0 13px}
.fi-app.fi-collapsed .fi-user{justify-content:center;flex-wrap:wrap;gap:8px}
/* Mobil: Drawer */
@media(max-width:1000px){
 body.fi-nav-open{overflow:hidden;overscroll-behavior:none}
 body.fi-nav-open > :not(.fi-app){pointer-events:none!important}
 .fi-app,.fi-app.fi-collapsed{grid-template-columns:1fr;min-width:0;max-width:100%;overflow-x:clip}
 .fi-main,.fi-content,.fi-appbar{min-width:0;max-width:100%}
 .fi-sidebar{position:fixed;left:0;top:0;bottom:0;width:266px;height:100vh;transform:translateX(-100%);transition:transform .22s ease}
 .fi-sidebar.fi-open{transform:none;box-shadow:0 0 44px rgba(0,0,0,.45)}
 .fi-burger{display:flex}.fi-collapse{display:none}
 .fi-backdrop.fi-show{display:block}
 .fi-app.fi-collapsed .fi-bx,.fi-app.fi-collapsed .fi-lx,.fi-app.fi-collapsed .fi-uinfo{display:block}
 .fi-app.fi-collapsed .fi-glabel{height:auto;opacity:1;padding:0 10px 6px;margin:0}
 .fi-app.fi-collapsed .fi-link{justify-content:flex-start;padding:9px 11px}
 .fi-app.fi-collapsed .fi-brand{justify-content:flex-start;padding:15px 16px 13px}
 .fi-app.fi-collapsed .fi-user{justify-content:flex-start;flex-wrap:nowrap}
}
@media(max-width:560px){
 .fi-appbar{flex-wrap:wrap;padding:10px 12px}
 .fi-titleblock{flex:1 1 calc(100% - 56px)}
 .fi-appbar .spacer{display:none}
 .fi-appbar>#tn-badge{order:2;flex:1 1 100%;justify-content:center;white-space:normal!important;text-align:center}
 .fi-appbar>.btn.sm{order:3;flex:1 1 calc(33.333% - 8px);min-width:0;padding:7px 6px;white-space:normal;text-align:center}
 .fi-eyebrow{display:none}
}
/* Druck: Sidebar/Appbar verschwinden → Dokumente (Nachweis, Zertifikat, Profiling) drucken sauber */
@media print{
 .fi-sidebar,.fi-appbar,.fi-backdrop{display:none!important}
 .fi-app,.fi-app.fi-collapsed{display:block!important}
 .fi-main{display:block!important}
 .fi-content{padding:0!important;margin:0!important;max-width:none!important}
}
