/* ===================================================================
   GEMÜ Corporate-Look — Beta. Tokens live von www.gemu-group.com.
   Wird NACH dem Seiten-CSS geladen und korrigiert, was der reine
   Farbtausch nicht trifft.
   =================================================================== */
:root{
  --g-anth:#161F28; --g-red:#D80000; --g-pink:#D11C6B; --g-purple:#724592;
  --g-line:#DFE2E8; --g-surface:#F3F4F4; --g-muted:#50575E; --g-muted2:#ADB1B4;
  --g-grad:linear-gradient(74deg,#D80000 7.88%,#D11C6B,#724592 91.85%);
  --g-ease:.1s cubic-bezier(.4,0,.2,1);
}
body{background:#fff; color:var(--g-anth);}

/* Buttons: Pillen wie im Corporate Web */
button, .btn{border-radius:16px; letter-spacing:.6px; font-weight:700;
  transition:filter var(--g-ease), border-color var(--g-ease), background var(--g-ease);}
.btn.red, button.red{background:var(--g-grad) !important; color:#fff !important; border:none; border-radius:18px;}
.btn.red:hover, button.red:hover{filter:brightness(1.08);}
.btn.ghost, button.ghost{background:#fff !important; border:2px solid var(--g-line) !important;
  color:var(--g-anth) !important; font-weight:700 !important;}
.btn.ghost:hover, button.ghost:hover{border-color:var(--g-anth) !important;}

/* Eingaben */
input[type=text], input[type=password], input[type=number], input[type=date],
select, textarea{background:#fff !important; color:var(--g-anth) !important;
  border:2px solid var(--g-line) !important; border-radius:8px;}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--g-anth) !important;}
input::placeholder, textarea::placeholder{color:var(--g-muted2);}

/* Flach statt Schatten — die Corporate-Website benutzt keine Schatten */
aside, header, .panel, .modal, .card{box-shadow:none !important;}
#stageWrap{box-shadow:none !important; border:1px solid var(--g-line);}

/* Arbeitsfläche: neutrales Hellgrau, damit die Motive sauber beurteilbar bleiben */
main{background:var(--g-surface);}

/* Trennlinien und Ränder */
aside{border-right:1px solid var(--g-line) !important;}

/* Labels liegen auf dunklen Vorschaubildern -> bleiben hell */
.typbtn, .typbtn b, .typbtn span{color:#fff !important;}
.typbtn{background:var(--g-surface);}

/* Titel in Karten, die vorher weiß auf Dunkel standen */
.postCard .t, .prCard .prT, .prCard .prM, .pcard .t, .ctile .n{color:var(--g-anth) !important;}
.prCard .prM, .postCard .m{color:var(--g-muted) !important;}
.prCard:hover{border-color:var(--g-muted2) !important;}

/* Hervorhebungen in Hinweiszeilen */
.viewHint b, .why b, .hint b, .sub b, .legend b{color:var(--g-anth) !important;}

/* Kopfleisten der Werkzeugseiten */
header, .topbar, #topbar{background:#fff !important; border-bottom:1px solid var(--g-line);}
header *, .topbar *{color:var(--g-anth);}
header button, .topbar button{color:var(--g-anth);}

/* Aktiv-Zustände: dunkler Chip, weiße Schrift */
.seg button.active, .tabs button.active, .typbtn.active, button.active{color:#fff !important;}

/* Drop-Zonen */
.drop, .dropzone{background:var(--g-surface) !important; border:2px dashed var(--g-muted2) !important;}
.drop strong, .drop b, .dropzone strong{color:var(--g-anth) !important;}

/* Pillen-Chips (Formatauswahl u. ä.) */
.chip{background:#fff; color:var(--g-anth);}
.chip:hover{color:var(--g-anth) !important; border-color:var(--g-anth) !important;}
.chip.on{background:var(--g-anth) !important; border-color:var(--g-anth) !important; color:#fff !important;}
.thumbs .th.add:hover{color:var(--g-anth) !important;}

/* Deaktivierte Schaltflächen bleiben erkennbar */
.btn:disabled, button:disabled{opacity:.45;}

/* Das GEMÜ-Logo führt überall zurück zur Startseite */
#bar .homeLogo, #topbar .homeLogo{margin-right:10px;}
.homeLogo{display:inline-flex; align-items:center; flex:none; padding:0; margin-right:4px;
  border:none; background:none; text-decoration:none; line-height:0;}
.homeLogo img{height:22px; width:auto; display:block; transition:opacity var(--g-ease);}
.homeLogo:hover img{opacity:.65;}

/* Zurück-Link oben links */
.back, .backLink, #btnBack{color:var(--g-anth);}

/* Scrollbalken bleiben ausgeblendet (Wunsch Dennis), aber Scrollen bleibt aktiv */

/* ===================================================================
   Gemeinsame Kopfzeile (site-nav.js) — bleibt auf allen Seiten oben
   =================================================================== */
body.hasSiteNav{padding-top:46px !important; box-sizing:border-box;}
#siteNav{position:fixed; top:0; left:0; right:0; z-index:90; height:46px;
  display:flex; align-items:center; gap:26px; padding:0 20px;
  background:#fff !important; border-bottom:1px solid var(--g-line);}
#siteNav .snLogo{display:inline-flex; align-items:center; line-height:0;}
#siteNav .snLogo img{height:20px; width:auto; display:block;}
#siteNav nav{display:flex; gap:22px; align-items:center;}
#siteNav nav a{font-size:14px; font-weight:700; letter-spacing:.5px; color:var(--g-anth);
  text-decoration:none; padding:12px 0 10px; border-bottom:2px solid transparent;
  transition:border-color var(--g-ease), color var(--g-ease);}
#siteNav nav a:hover{border-bottom-color:var(--g-red);}
#siteNav nav a.on{border-bottom-color:var(--g-red);}
#siteNav .snWho{margin-left:auto; display:flex; align-items:center; gap:8px;
  font-size:13px; font-weight:700; color:var(--g-anth); white-space:nowrap;}
#siteNav .snAv{display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; border-radius:9999px; background:var(--g-grad);
  color:#fff; font-size:12px; font-weight:700;}
#siteNav .snRole{font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--g-muted); border:1px solid var(--g-line); border-radius:9999px; padding:2px 8px;}
#siteNav .snLogin{font-size:13px; font-weight:700; color:var(--g-anth); text-decoration:none;
  border:2px solid var(--g-line); border-radius:9999px; padding:5px 14px;}
#siteNav .snLogin:hover{border-color:var(--g-anth);}
/* Das Seiten-eigene Home-Logo ist mit der festen Kopfzeile doppelt — ausblenden */
body.hasSiteNav .homeLogo{display:none !important;}
@media (max-width:820px){ #siteNav{gap:14px;} #siteNav nav{gap:12px;} #siteNav nav a{font-size:12px;} #siteNav .snRole{display:none;} }