/* ═══════════════════════════════════════════════════════════
   portal-nav.css — Shared navigation patterns
   Used by all four portals: Care (privat), Systems (business),
   Community, Akademie (wissen)
   ═══════════════════════════════════════════════════════════ */

/* ── Mobile: icon-only theme toggle + compact konto ── */
.theme-toggle__sun,
.theme-toggle__moon { display: none; }

@media (max-width: 860px) {
  .pg-nav__home { display: none !important; }
}

@media (max-width: 820px) {
  body.pg-page #themeToggle.theme-toggle [data-theme-label] { display: none; }
  body.pg-page #themeToggle.theme-toggle {
    padding: 0 !important; width: 28px !important; height: 28px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
  }
  html[data-theme="dark"] body.pg-page #themeToggle.theme-toggle .theme-toggle__sun { display: block; }
  html[data-theme="light"] body.pg-page #themeToggle.theme-toggle .theme-toggle__moon { display: block; }
  #nav-konto-label { display: none !important; }
  .pg-nav__konto {
    padding: 0 !important; width: 28px !important; height: 28px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    margin-right: 3.8rem !important;
  }
}

/* ── Chapter nav base (Care, Systems, Community) ── */
.care-chapnav,
.biz-chapnav,
.comm-chapnav {
  position: sticky; top: 58px; z-index: 150;
  background: rgba(6,9,13,.82);
  backdrop-filter: blur(20px) saturate(1.4); -webkit-backdrop-filter: blur(20px) saturate(1.4);
  border-bottom: 1px solid rgba(255,255,255,.06);
  overflow-x: auto; scrollbar-width: none;
}
.care-chapnav::-webkit-scrollbar,
.biz-chapnav::-webkit-scrollbar,
.comm-chapnav::-webkit-scrollbar { display: none; }

.care-chapnav__inner,
.biz-chapnav__inner,
.comm-chapnav__inner {
  display: flex; align-items: center; gap: .25rem;
  padding: 0 1.4rem; height: 42px; width: max-content; min-width: 100%;
}

.care-chapnav__link,
.biz-chapnav__link,
.comm-chapnav__link {
  display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .75rem;
  border-radius: 999px; font-family: var(--font-heading); font-size: .72rem; font-weight: 700;
  letter-spacing: .03em; color: rgba(228,224,255,.42); text-decoration: none;
  white-space: nowrap; transition: background .2s, color .2s; flex-shrink: 0;
}
.care-chapnav__link:hover,
.biz-chapnav__link:hover,
.comm-chapnav__link:hover { color: rgba(228,224,255,.85); background: rgba(255,255,255,.07); }

.care-chapnav__link.is-active,
.biz-chapnav__link.is-active,
.comm-chapnav__link.is-active { color: var(--wa); background: var(--wa-dim); }

.care-chapnav__sep,
.biz-chapnav__sep,
.comm-chapnav__sep {
  width: 1px; height: 14px; background: rgba(255,255,255,.08); flex-shrink: 0; margin: 0 .15rem;
}

.care-chapnav__link--cta,
.biz-chapnav__link--cta,
.comm-chapnav__link--cta {
  color: var(--wa) !important; border: 1px solid var(--wa-glow); margin-left: .5rem;
}
.care-chapnav__link--cta:hover,
.biz-chapnav__link--cta:hover,
.comm-chapnav__link--cta:hover { background: var(--wa-dim); }

@media (max-width: 820px) {
  .care-chapnav,
  .biz-chapnav,
  .comm-chapnav { display: none; }
}

html[data-theme="light"] .care-chapnav,
html[data-theme="light"] .biz-chapnav,
html[data-theme="light"] .comm-chapnav {
  background: #eef2f5 !important; backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important; border-bottom-color: rgba(0,0,0,.1) !important;
}
html[data-theme="light"] .care-chapnav__link,
html[data-theme="light"] .biz-chapnav__link,
html[data-theme="light"] .comm-chapnav__link { color: rgba(13,17,23,.45); }
html[data-theme="light"] .care-chapnav__link:hover,
html[data-theme="light"] .biz-chapnav__link:hover,
html[data-theme="light"] .comm-chapnav__link:hover { color: #0d1117; background: rgba(0,0,0,.05); }
html[data-theme="light"] .care-chapnav__link.is-active,
html[data-theme="light"] .biz-chapnav__link.is-active,
html[data-theme="light"] .comm-chapnav__link.is-active { color: var(--wa); }
html[data-theme="light"] .care-chapnav__sep,
html[data-theme="light"] .biz-chapnav__sep,
html[data-theme="light"] .comm-chapnav__sep { background: rgba(0,0,0,.1); }

/* ── Portal ChapNav (customer portal page navigation) ── */
.portal-chapnav {
  position: sticky; top: 58px; z-index: 150;
  background: rgba(6,9,13,.82);
  backdrop-filter: blur(20px) saturate(1.4); -webkit-backdrop-filter: blur(20px) saturate(1.4);
  border-bottom: 1px solid rgba(255,255,255,.06);
  overflow-x: auto; scrollbar-width: none;
}
.portal-chapnav::-webkit-scrollbar { display: none; }

.portal-chapnav__inner {
  display: flex; align-items: center; gap: .25rem;
  padding: 0 1.4rem; height: 42px; width: max-content; min-width: 100%;
}

.portal-chapnav__link {
  display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .75rem;
  border-radius: 999px; font-family: var(--font-heading); font-size: .72rem; font-weight: 700;
  letter-spacing: .03em; color: rgba(228,224,255,.42); text-decoration: none;
  white-space: nowrap; transition: background .2s, color .2s; flex-shrink: 0;
}
.portal-chapnav__link:hover { color: rgba(228,224,255,.85); background: rgba(255,255,255,.07); }
.portal-chapnav__link.is-active { color: var(--wa); background: var(--wa-dim); }

.portal-chapnav__sep {
  width: 1px; height: 14px; background: rgba(255,255,255,.08); flex-shrink: 0; margin: 0 .15rem;
}

.portal-logout {
  display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .7rem;
  border-radius: 8px; border: 1px solid rgba(255,255,255,.1);
  background: transparent; color: rgba(240,246,255,.45); font-family: var(--font-heading);
  font-size: .74rem; font-weight: 600; cursor: pointer; transition: border-color .15s, color .15s;
  text-decoration: none; flex-shrink: 0;
}
.portal-logout:hover { border-color: rgba(239,68,68,.4); color: #f87171; }

html[data-theme="light"] .portal-chapnav {
  background: #eef2f5 !important; backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important; border-bottom-color: rgba(0,0,0,.1) !important;
}
html[data-theme="light"] .portal-chapnav__link { color: rgba(13,17,23,.45); }
html[data-theme="light"] .portal-chapnav__link:hover { color: #0d1117; background: rgba(0,0,0,.05); }
html[data-theme="light"] .portal-chapnav__link.is-active { color: var(--wa); }
html[data-theme="light"] .portal-chapnav__sep { background: rgba(0,0,0,.1); }
html[data-theme="light"] .portal-logout { border-color: rgba(0,0,0,.12); color: rgba(13,17,23,.45); }
html[data-theme="light"] .portal-logout:hover { border-color: rgba(220,38,38,.35); color: #dc2626; }

@media (max-width: 820px) {
  .portal-chapnav { display: none; }
}

/* ── Portal mobile burger ── */
.portal-burger { display: none; }

@media (max-width: 820px) {
  .portal-burger {
    display: flex; position: fixed; bottom: 1.5rem; right: 1.4rem; z-index: 500;
    width: 52px; height: 52px; border-radius: 50%;
    border: 1px solid var(--wa-glow);
    background: rgba(6,9,13,.92); backdrop-filter: blur(16px);
    box-shadow: 0 8px 32px rgba(0,0,0,.4), 0 0 24px var(--wa-dim);
    align-items: center; justify-content: center; cursor: pointer;
    color: var(--wa); transition: background .2s, box-shadow .2s;
  }
  .portal-burger:hover { background: var(--wa-dim); }
  .portal-burger svg { pointer-events: none; }
}

.portal-mobile-menu {
  position: fixed; right: 0; top: 0; bottom: 0; z-index: 490;
  width: min(88vw, 320px); background: #0d1117;
  border-left: 1px solid rgba(255,255,255,.1);
  transform: translateX(100%); transition: transform .3s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column; overflow-y: auto;
}
.portal-mobile-menu.is-open { transform: none; }

.portal-mobile-menu__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.2rem 1.4rem; border-bottom: 1px solid rgba(255,255,255,.08); flex-shrink: 0;
}
.portal-mobile-menu__title {
  font-family: var(--font-heading); font-size: .9rem; font-weight: 700; color: #f0f6ff;
}
.portal-mobile-menu__close {
  width: 32px; height: 32px; border-radius: 8px;
  background: rgba(255,255,255,.07); border: none; color: #f0f6ff;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.portal-mobile-menu__links {
  padding: .8rem .6rem; display: flex; flex-direction: column; gap: .2rem; flex: 1; overflow-y: auto;
}
.portal-mobile-menu__link {
  display: flex; align-items: center; gap: .6rem; padding: .75rem 1rem;
  border-radius: 10px; font-family: var(--font-heading); font-size: .88rem; font-weight: 600;
  color: rgba(240,246,255,.55); text-decoration: none; transition: background .15s, color .15s;
}
.portal-mobile-menu__link:hover { background: rgba(255,255,255,.06); color: #f0f6ff; }
.portal-mobile-menu__link.is-active { background: var(--wa-dim); color: var(--wa); }
.portal-mobile-menu__sep { height: 1px; background: rgba(255,255,255,.07); margin: .4rem .8rem; }
.portal-mobile-menu__foot {
  padding: .8rem .6rem; border-top: 1px solid rgba(255,255,255,.07); flex-shrink: 0;
}

html[data-theme="light"] .portal-mobile-menu { background: #f5f7fa; border-left-color: rgba(0,0,0,.1); }
html[data-theme="light"] .portal-mobile-menu__head { border-bottom-color: rgba(0,0,0,.08); }
html[data-theme="light"] .portal-mobile-menu__title { color: #0d1117; }
html[data-theme="light"] .portal-mobile-menu__close { background: rgba(0,0,0,.06); color: #0d1117; }
html[data-theme="light"] .portal-mobile-menu__link { color: rgba(13,17,23,.5); }
html[data-theme="light"] .portal-mobile-menu__link:hover { background: rgba(0,0,0,.05); color: #0d1117; }
html[data-theme="light"] .portal-mobile-menu__sep { background: rgba(0,0,0,.08); }

/* ── Mobile burger buttons ── */
.care-burger, .biz-burger, .comm-burger, .wis-burger { display: none; }
@media (max-width: 820px) {
  .care-burger, .biz-burger, .comm-burger, .wis-burger {
    display: flex; position: fixed; bottom: 1.5rem; right: 1.4rem; z-index: 500;
    width: 52px; height: 52px; border-radius: 50%;
    border: 1px solid var(--wa-glow);
    background: rgba(6,9,13,.92); backdrop-filter: blur(16px);
    box-shadow: 0 8px 32px rgba(0,0,0,.4), 0 0 24px var(--wa-dim);
    align-items: center; justify-content: center; cursor: pointer;
    color: var(--wa); transition: background .2s, box-shadow .2s;
  }
  .care-burger:hover, .biz-burger:hover, .comm-burger:hover, .wis-burger:hover { background: var(--wa-dim); }
  .care-burger svg, .biz-burger svg, .comm-burger svg, .wis-burger svg { pointer-events: none; }
}

/* ── Mobile slide-out side menu (structural) ── */
.care-mobile-menu,
.biz-mobile-menu,
.comm-mobile-menu,
.wis-mobile-menu {
  position: fixed; right: 0; top: 0; bottom: 0; z-index: 490;
  width: min(88vw, 320px); background: #0d1117;
  border-left: 1px solid rgba(255,255,255,.1);
  transform: translateX(100%); transition: transform .3s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column; overflow-y: auto;
}
.care-mobile-menu.is-open,
.biz-mobile-menu.is-open,
.comm-mobile-menu.is-open,
.wis-mobile-menu.is-open { transform: none; }

.care-mobile-menu__head,
.biz-mobile-menu__head,
.comm-mobile-menu__head,
.wis-mobile-menu__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.2rem 1.4rem; border-bottom: 1px solid rgba(255,255,255,.08); flex-shrink: 0;
}
.care-mobile-menu__title,
.biz-mobile-menu__title,
.comm-mobile-menu__title,
.wis-mobile-menu__title {
  font-family: var(--font-heading); font-size: .9rem; font-weight: 700; color: #f0f6ff;
}
.care-mobile-menu__close,
.biz-mobile-menu__close,
.comm-mobile-menu__close,
.wis-mobile-menu__close {
  width: 32px; height: 32px; border-radius: 8px;
  background: rgba(255,255,255,.07); border: none; color: #f0f6ff;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.care-mobile-menu__links,
.biz-mobile-menu__links,
.comm-mobile-menu__links,
.wis-mobile-menu__links {
  padding: .8rem .6rem; display: flex; flex-direction: column; gap: .2rem; overflow-y: auto;
}

html[data-theme="light"] .care-mobile-menu,
html[data-theme="light"] .biz-mobile-menu,
html[data-theme="light"] .comm-mobile-menu,
html[data-theme="light"] .wis-mobile-menu {
  background: #f5f7fa; border-left-color: rgba(0,0,0,.1);
}
html[data-theme="light"] .care-mobile-menu__head,
html[data-theme="light"] .biz-mobile-menu__head,
html[data-theme="light"] .comm-mobile-menu__head,
html[data-theme="light"] .wis-mobile-menu__head { border-bottom-color: rgba(0,0,0,.08); }
html[data-theme="light"] .care-mobile-menu__title,
html[data-theme="light"] .biz-mobile-menu__title,
html[data-theme="light"] .comm-mobile-menu__title,
html[data-theme="light"] .wis-mobile-menu__title { color: #0d1117; }
html[data-theme="light"] .care-mobile-menu__close,
html[data-theme="light"] .biz-mobile-menu__close,
html[data-theme="light"] .comm-mobile-menu__close,
html[data-theme="light"] .wis-mobile-menu__close { background: rgba(0,0,0,.06); color: #0d1117; }