/* =========================================================
   FluxPike – einheitliches Hauptmenü und einheitlicher Footer
   Verbindlicher Projektstandard nach dem Vorbild Probleme / Störungen.
   Diese Datei ist die einzige CSS-Quelle für site-topbar und site-footer.
   ========================================================= */

:root{
  --kopf-footer-dunkel:var(--fp-marke-dunkel);
  --kopf-footer-dunkel-2:var(--fp-marke-tief);
  --kopf-footer-cyan:var(--fp-marke-tuerkis);
  --kopf-footer-signal:var(--fp-marke-limette);
  --kopf-footer-cyan-alpha-28:rgba(39,189,208,.28);
  --kopf-footer-signal-alpha-08:rgba(183,232,62,.08);
}

/* Hauptmenü beginnt bündig am oberen Fensterrand. */
body{padding-top:0;}
html:not(.ansicht-eingebettet),
body:not(.ansicht-eingebettet){min-height:100%;}
body:not(.ansicht-eingebettet){
  display:flex;
  flex-direction:column;
  min-height:100vh;
}
body:not(.ansicht-eingebettet) > main.container{flex:1 0 auto;}


body:not(.ansicht-eingebettet) .site-topbar{
  position:sticky;
  top:0;
  z-index:1000;
  flex:0 0 auto;
  padding:7px 12px 0;
  border:0;
  background:linear-gradient(180deg,var(--fp-farbwert-071a20) 0%,var(--fp-farbwert-0c252d) 100%);
  color:var(--fp-weiss);
  box-shadow:0 12px 30px var(--fp-farbwert-rgba-4-23-29-_20);
}
body:not(.ansicht-eingebettet) .site-topbar::after{
  content:"";
  display:block;
  height:3px;
  margin:7px -12px 0;
  background:linear-gradient(90deg,var(--kopf-footer-signal) 0 18%,var(--kopf-footer-cyan) 18% 52%,var(--fp-farbwert-rgba-255-255-255-_12) 52% 100%);
}
body:not(.ansicht-eingebettet) .topbar-inner{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
  padding:0;
}
body:not(.ansicht-eingebettet) .main-nav{
  display:flex;
  flex:1 1 auto;
  flex-wrap:nowrap;
  align-items:center;
  gap:5px;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:thin;
  scrollbar-color:var(--fp-farbwert-rgba-183-232-62-_45) transparent;
  overscroll-behavior-inline:contain;
}
body:not(.ansicht-eingebettet) .main-nav::-webkit-scrollbar{height:4px;}
body:not(.ansicht-eingebettet) .main-nav::-webkit-scrollbar-thumb{border-radius:999px;background:var(--fp-farbwert-rgba-183-232-62-_45);}
body:not(.ansicht-eingebettet) .main-nav .nav-btn{
  display:inline-grid;
  place-items:center;
  flex:0 0 36px;
  width:36px;
  min-width:36px;
  height:36px;
  min-height:36px;
  padding:0;
  border:1px solid var(--fp-farbwert-rgba-255-255-255-_11);
  border-radius:10px 10px 10px 4px;
  background:var(--fp-weiss-alpha-055);
  color:var(--fp-farbwert-e7f0f1);
  text-decoration:none;
  box-shadow:inset 0 1px 0 var(--fp-farbwert-rgba-255-255-255-_035);
  transition:transform .15s ease,background .15s ease,border-color .15s ease;
}
body:not(.ansicht-eingebettet) .main-nav .nav-btn:hover{
  border-color:var(--fp-farbwert-rgba-39-189-208-_75);
  background:var(--fp-farbwert-rgba-39-189-208-_14);
  transform:translateY(-1px);
}
body:not(.ansicht-eingebettet) .main-nav .nav-btn.active,
body:not(.ansicht-eingebettet) .main-nav [aria-current="page"].nav-btn{
  border-color:var(--kopf-footer-signal);
  background:var(--kopf-footer-signal);
  color:var(--fp-marke-gruen-tief);
  box-shadow:0 0 0 2px var(--fp-limette-alpha),0 8px 18px var(--fp-farbwert-rgba-0-0-0-_18);
}
body:not(.ansicht-eingebettet) .main-nav .nav-btn .nav-ico{
  display:block;
  width:18px;
  height:18px;
  opacity:1;
  filter:invert(1) brightness(1.08);
}
body:not(.ansicht-eingebettet) .main-nav .nav-btn.active .nav-ico,
body:not(.ansicht-eingebettet) .main-nav [aria-current="page"].nav-btn .nav-ico{
  filter:none;
}
body:not(.ansicht-eingebettet) .main-nav .nav-btn.disabled{
  opacity:.5;
  pointer-events:none;
}
body:not(.ansicht-eingebettet) .brand-right{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:4px 5px 4px 10px;
  border:1px solid var(--fp-farbwert-rgba-255-255-255-_10);
  border-radius:12px 12px 12px 4px;
  background:var(--fp-weiss-alpha-045);
}
body:not(.ansicht-eingebettet) .brand-right .brand-link{
  color:var(--kopf-footer-signal);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  text-decoration:none;
}
body:not(.ansicht-eingebettet) .brand-right .user-chip{
  display:block;
  max-width:180px;
  overflow:hidden;
  color:var(--fp-farbwert-c4d3d6);
  font-size:.72rem;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.ansicht-eingebettet) .brand-right .btn.icon-only,
body:not(.ansicht-eingebettet) .brand-right .user-badge{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  margin-left:0;
  padding:0;
  border:1px solid var(--fp-farbwert-rgba-255-255-255-_12);
  border-radius:9px;
  background:var(--fp-farbwert-rgba-255-255-255-_07);
  color:var(--fp-weiss);
  box-shadow:none;
}

body:not(.ansicht-eingebettet) .nav-mini{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-right:8px;
}
body:not(.ansicht-eingebettet) .nav-mini .nav-btn,
body:not(.ansicht-eingebettet) .nav-mini .nav-btn.icon-only{
  flex-basis:36px;
  min-width:36px;
  padding:0;
  line-height:1.1;
}
body:not(.ansicht-eingebettet) .user-badge--abstand{position:relative;margin-left:6px;}

body:not(.ansicht-eingebettet) footer.site-footer{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  width:min(1320px,calc(100% - 32px));
  box-sizing:border-box;
  margin:24px auto 12px;
  padding:15px 18px;
  border:1px solid var(--fp-weiss-alpha-08);
  border-top:3px solid var(--kopf-footer-cyan);
  border-radius:18px 18px 18px 6px;
  background:
    linear-gradient(105deg,var(--fp-weiss-alpha-045),transparent 42%),
    linear-gradient(135deg,var(--kopf-footer-dunkel-2),var(--kopf-footer-dunkel));
  color:var(--fp-farbwert-bdcdd0);
  text-align:left;
  box-shadow:0 16px 36px var(--fp-farbwert-rgba-7-29-36-_16);
  font-size:.76rem;
}
body:not(.ansicht-eingebettet) footer.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg,var(--kopf-footer-signal) 0 18%,var(--kopf-footer-cyan) 18% 52%,transparent 52%) top left/100% 3px no-repeat,
    radial-gradient(circle at 12% 130%,var(--fp-limette-alpha),transparent 38%);
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__marke{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__logo-link{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:2px 5px;
  border-radius:10px 10px 10px 4px;
  text-decoration:none;
  transition:transform .15s ease,filter .15s ease;
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__logo-link:hover{
  transform:translateY(-1px);
  filter:drop-shadow(0 6px 14px var(--kopf-footer-cyan-alpha-28));
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__logo{
  display:block;
  width:132px;
  height:auto;
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__identitaet{
  display:grid;
  gap:1px;
  min-width:0;
  padding-left:13px;
  border-left:1px solid var(--fp-farbwert-rgba-255-255-255-_12);
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__identitaet strong{
  overflow:hidden;
  color:var(--kopf-footer-signal);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.04em;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__identitaet span{
  color:var(--fp-farbwert-c4d3d6);
  font-size:.68rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__rechts{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:13px;
  min-width:0;
}
body:not(.ansicht-eingebettet) footer.site-footer .site-footer__copyright{
  color:var(--fp-farbwert-bdcdd0);
  white-space:nowrap;
}
body:not(.ansicht-eingebettet) footer.site-footer .footer-nav{
  display:flex;
  align-items:center;
  gap:7px;
}
body:not(.ansicht-eingebettet) footer.site-footer .footer-nav a{
  padding:5px 8px;
  border:1px solid var(--fp-farbwert-rgba-255-255-255-_10);
  border-radius:8px 8px 8px 3px;
  background:var(--fp-weiss-alpha-045);
  color:var(--fp-farbwert-e2ecee);
  text-decoration:none;
  transition:border-color .15s ease,color .15s ease,background .15s ease;
}
body:not(.ansicht-eingebettet) footer.site-footer .footer-nav a:hover,
body:not(.ansicht-eingebettet) footer.site-footer .footer-nav a:focus-visible{
  border-color:var(--kopf-footer-signal);
  background:var(--kopf-footer-signal-alpha-08);
  color:var(--kopf-footer-signal);
}
body:not(.ansicht-eingebettet) footer.site-footer .sep{color:var(--fp-farbwert-rgba-255-255-255-_28);}

html.ansicht-eingebettet,
body.ansicht-eingebettet{background:transparent;}
body.ansicht-eingebettet .site-topbar,
body.ansicht-eingebettet .site-footer{display:none;}

@media (max-width:900px){
  body:not(.ansicht-eingebettet) .brand-right .user-chip{display:none;}
  body:not(.ansicht-eingebettet) .brand-right .brand-link{display:none;}
}
@media (max-width:640px){
  body:not(.ansicht-eingebettet) .site-topbar{padding-left:7px;padding-right:7px;}
  body:not(.ansicht-eingebettet) .site-topbar::after{margin-left:-7px;margin-right:-7px;}
  body:not(.ansicht-eingebettet) footer.site-footer{
    align-items:stretch;
    flex-direction:column;
    gap:13px;
  }
  body:not(.ansicht-eingebettet) footer.site-footer .site-footer__rechts{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  body:not(.ansicht-eingebettet) footer.site-footer .site-footer__copyright{white-space:normal;}
}
@media print{
  .site-topbar,
  .site-footer{display:none;}
}
