/* ==========================================================================
   PflegePur Navigator · Fachmodule
   Zentrale Sidebar-/Modul-Geometrie
   Stand: 12.09.2026
   Referenz: §37.3
   Betrifft: §37.3 · §7a · §45 · §5 Prävention

   WICHTIG:
   - Globale Navbar bleibt ausschließlich in pflegepur-shell.js.
   - Fachmodule definieren nur Inhalt/Menüpunkte.
   - Breiten, Rundungen, Typografie, Aktivzustände und CTA werden hier gepflegt.
   ========================================================================== */

:root{
  --pp-fach-side-w:164px;
  --pp-fach-radius:18px;
  --pp-fach-side-bg:#07263e;
  --pp-fach-side-bg-2:#09263e;
  --pp-fach-side-text:#d9e8ee;
  --pp-fach-side-muted:rgba(255,255,255,.34);
  --pp-fach-kicker:#6fe6c5;
  --pp-fach-active:#15957a;
  --pp-fach-cta:#17a889;
  --pp-fach-stage:#f4f7f7;
  --pp-fach-nav-h:40px;
  --pp-fach-cta-h:42px;
  --pp-fach-nav-fs:11px;
  --pp-fach-title-fs:21px;
}

/* ─────────────────────────────────────────────────────────────
   Navigator-native Hosts: §37.3 + §7a
   ───────────────────────────────────────────────────────────── */
@media (min-width:821px){
  .pp373-native-shell,
  .pp7a-native-shell{
    display:grid!important;
    grid-template-columns:var(--pp-fach-side-w) minmax(0,1fr)!important;
    min-height:calc(100vh - 88px)!important;
    margin:0!important;
    background:var(--pp-fach-stage)!important;
    border:0!important;
    border-radius:var(--pp-fach-radius)!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  .pp373-native-side,
  .pp7a-native-side{
    min-height:100%!important;
    padding:18px 10px 14px!important;
    display:flex!important;
    flex-direction:column!important;
    background:var(--pp-fach-side-bg)!important;
    color:var(--pp-fach-side-text)!important;
    border-radius:var(--pp-fach-radius) 0 0 var(--pp-fach-radius)!important;
    overflow:hidden!important;
  }

  .pp373-native-side-k,
  .pp7a-native-side-k{
    padding:4px 9px 14px!important;
    color:var(--pp-fach-kicker)!important;
    font-size:9px!important;
    font-weight:950!important;
    letter-spacing:.11em!important;
    text-transform:uppercase!important;
  }

  .pp373-native-side h2,
  .pp7a-native-side h2{
    padding:0 9px 14px!important;
    margin:0!important;
    color:#fff!important;
    font-size:var(--pp-fach-title-fs)!important;
    line-height:1.05!important;
    font-weight:900!important;
    letter-spacing:-.03em!important;
  }

  .pp373-native-nav,
  .pp7a-native-nav{
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
  }

  .pp373-native-nav button,
  .pp7a-native-nav button{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    width:100%!important;
    min-height:var(--pp-fach-nav-h)!important;
    padding:0 10px!important;
    margin:0!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    color:var(--pp-fach-side-text)!important;
    font:inherit!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:780!important;
    line-height:1.2!important;
    text-align:left!important;
    cursor:pointer!important;
    box-shadow:none!important;
    transform:none!important;
  }

  .pp373-native-nav button:hover,
  .pp7a-native-nav button:hover{
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
  }

  .pp373-native-nav button.active,
  .pp7a-native-nav button.active{
    background:var(--pp-fach-active)!important;
    color:#fff!important;
  }

  .pp373-native-start,
  .pp7a-native-start{
    margin-top:14px!important;
    min-height:var(--pp-fach-cta-h)!important;
    padding:0 10px!important;
    border:0!important;
    border-radius:10px!important;
    background:var(--pp-fach-cta)!important;
    color:#fff!important;
    font:inherit!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:900!important;
    cursor:pointer!important;
    box-shadow:none!important;
  }

  .pp373-native-foot,
  .pp7a-native-foot{
    margin-top:auto!important;
    padding:16px 9px 0!important;
    font-size:8px!important;
    line-height:1.35!important;
    color:var(--pp-fach-side-muted)!important;
  }

  .pp373-native-main,
  .pp7a-native-main{
    min-width:0!important;
    background:var(--pp-fach-stage)!important;
    position:relative!important;
    border-radius:0 var(--pp-fach-radius) var(--pp-fach-radius) 0!important;
    overflow:hidden!important;
  }
}

/* ─────────────────────────────────────────────────────────────
   Navigator-native Host: §45
   ───────────────────────────────────────────────────────────── */
@media (min-width:901px){
  body.pp45-module-open #page45{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-height:calc(100vh - 80px)!important;
    padding:calc(var(--header-h,60px) + 6px) 0 0!important;
    margin:0!important;
    background:transparent!important;
    box-sizing:border-box!important;
  }

  body.pp45-module-open .pp45-native-wrap{
    display:grid!important;
    grid-template-columns:var(--pp-fach-side-w) minmax(0,1fr)!important;
    min-height:calc(100vh - 88px)!important;
    margin:0!important;
    background:var(--pp-fach-stage)!important;
    border:0!important;
    border-radius:var(--pp-fach-radius)!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  body.pp45-module-open .pp45-native-side{
    min-height:100%!important;
    margin:0!important;
    padding:18px 10px 14px!important;
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
    background:var(--pp-fach-side-bg)!important;
    color:var(--pp-fach-side-text)!important;
    border-radius:var(--pp-fach-radius) 0 0 var(--pp-fach-radius)!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  body.pp45-module-open .pp45-native-brand{
    padding:4px 9px 14px!important;
    margin:0 0 5px!important;
    border-bottom:0!important;
  }

  body.pp45-module-open .pp45-native-brand b{
    display:block!important;
    margin:0 0 5px!important;
    color:#fff!important;
    font-size:var(--pp-fach-title-fs)!important;
    line-height:1.05!important;
    font-weight:900!important;
    letter-spacing:-.03em!important;
  }

  body.pp45-module-open .pp45-native-brand small{
    display:block!important;
    color:rgba(255,255,255,.52)!important;
    font-size:9px!important;
    line-height:1.45!important;
  }

  body.pp45-module-open .pp45-native-nav{
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
    margin:0!important;
  }

  body.pp45-module-open .pp45-native-nav button{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:var(--pp-fach-nav-h)!important;
    padding:0 10px!important;
    margin:0!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    color:var(--pp-fach-side-text)!important;
    font:inherit!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:780!important;
    line-height:1.2!important;
    text-align:left!important;
    cursor:pointer!important;
    box-shadow:none!important;
    transform:none!important;
  }

  body.pp45-module-open .pp45-native-nav button:hover{
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
    transform:none!important;
  }

  body.pp45-module-open .pp45-native-nav button.active{
    background:var(--pp-fach-active)!important;
    color:#fff!important;
  }

  body.pp45-module-open .pp45-native-side .pp45-new{
    margin-top:14px!important;
    min-height:var(--pp-fach-cta-h)!important;
    padding:0 10px!important;
    border:0!important;
    border-radius:10px!important;
    background:var(--pp-fach-cta)!important;
    color:#fff!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:900!important;
    box-shadow:none!important;
  }

  body.pp45-module-open .pp45-native-main{
    min-width:0!important;
    margin:0!important;
    background:var(--pp-fach-stage)!important;
    border-radius:0 var(--pp-fach-radius) var(--pp-fach-radius) 0!important;
    overflow:hidden!important;
  }

  body.pp45-module-open .pp45-native-head{
    min-height:58px!important;
    padding:10px 15px!important;
    background:#fff!important;
    box-shadow:none!important;
  }

  body.pp45-module-open .pp45-native-head span:first-child{font-size:8px!important}
  body.pp45-module-open .pp45-native-head strong{font-size:15px!important;margin-top:2px!important}
}

/* ─────────────────────────────────────────────────────────────
   Standalone Fachseite: §5 Prävention
   ───────────────────────────────────────────────────────────── */
@media (min-width:901px){
  body:has(.pp5-fach-side){
    padding-left:204px!important;
  }

  .pp5-fach-side{
    position:fixed!important;
    display:flex!important;
    flex-direction:column!important;
    left:0!important;
    top:72px!important;
    bottom:10px!important;
    width:204px!important;
    z-index:145!important;
    padding:20px 12px 14px!important;
    margin:0!important;
    background:linear-gradient(180deg,var(--pp-fach-side-bg),var(--pp-fach-side-bg-2))!important;
    color:var(--pp-fach-side-text)!important;
    border-radius:18px 0 18px 0!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  .pp5-fach-k{
    padding:7px 10px 0!important;
    color:var(--pp-fach-kicker)!important;
    font-size:8.5px!important;
    line-height:1.28!important;
    font-weight:900!important;
    letter-spacing:.11em!important;
  }

  .pp5-fach-title{
    padding:16px 10px 0!important;
    color:#fff!important;
    font-size:26px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:-.045em!important;
  }

  .pp5-fach-sub{
    padding:7px 10px 13px!important;
    color:rgba(255,255,255,.43)!important;
    font-size:9px!important;
    line-height:1.45!important;
    font-weight:600!important;
  }

  .pp5-fach-nav{
    display:flex!important;
    flex-direction:column!important;
    gap:6px!important;
    margin-top:3px!important;
  }

  .pp5-fach-nav button{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:var(--pp-fach-cta-h)!important;
    padding:0 12px!important;
    margin:0!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    color:rgba(255,255,255,.78)!important;
    box-shadow:none!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:800!important;
    line-height:1.2!important;
    text-align:left!important;
  }

  .pp5-fach-nav button:hover{
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
  }

  .pp5-fach-nav button.active{
    background:var(--pp-fach-active)!important;
    color:#fff!important;
  }

  .pp5-fach-cta{
    margin-top:14px!important;
    min-height:44px!important;
    padding:0 12px!important;
    border:0!important;
    border-radius:10px!important;
    background:var(--pp-fach-cta)!important;
    color:#fff!important;
    box-shadow:none!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:900!important;
  }

  .pp5-fach-foot{
    margin-top:auto!important;
    padding:12px 10px 0!important;
    color:rgba(255,255,255,.28)!important;
    font-size:7.5px!important;
    line-height:1.35!important;
  }
}

/* Mobile: Fachsidebar wird durch die jeweilige kompakte Navigation ersetzt. */
@media (max-width:900px){
  .pp5-fach-side{display:none!important}
  body:has(.pp5-fach-side){padding-left:0!important}
}


/* ─────────────────────────────────────────────────────────────
   Navigator-native Host: §5 Prävention
   ───────────────────────────────────────────────────────────── */
@media (min-width:901px){
  body.pp5-module-open #pagePraevention{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-height:calc(100vh - 80px)!important;
    padding:calc(var(--header-h,60px) + 6px) 0 0!important;
    margin:0!important;
    background:transparent!important;
    box-sizing:border-box!important;
  }

  body.pp5-module-open .pp5-native-shell{
    display:grid!important;
    grid-template-columns:var(--pp-fach-side-w) minmax(0,1fr)!important;
    min-height:calc(100vh - 88px)!important;
    margin:0!important;
    background:var(--pp-fach-stage)!important;
    border:0!important;
    border-radius:var(--pp-fach-radius)!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  body.pp5-module-open .pp5-native-side{
    min-height:100%!important;
    padding:18px 10px 14px!important;
    display:flex!important;
    flex-direction:column!important;
    background:var(--pp-fach-side-bg)!important;
    color:var(--pp-fach-side-text)!important;
    border-radius:var(--pp-fach-radius) 0 0 var(--pp-fach-radius)!important;
    overflow:hidden!important;
  }

  body.pp5-module-open .pp5-native-k{
    padding:4px 9px 14px!important;
    color:var(--pp-fach-kicker)!important;
    font-size:9px!important;
    font-weight:950!important;
    letter-spacing:.11em!important;
    text-transform:uppercase!important;
  }

  body.pp5-module-open .pp5-native-title{
    padding:0 9px 4px!important;
    margin:0!important;
    color:#fff!important;
    font-size:var(--pp-fach-title-fs)!important;
    line-height:1.05!important;
    font-weight:900!important;
    letter-spacing:-.03em!important;
  }

  body.pp5-module-open .pp5-native-sub{
    padding:0 9px 14px!important;
    color:rgba(255,255,255,.45)!important;
    font-size:9px!important;
    line-height:1.45!important;
    font-weight:600!important;
  }

  body.pp5-module-open .pp5-native-nav{
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
  }

  body.pp5-module-open .pp5-native-nav button{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    width:100%!important;
    min-height:var(--pp-fach-nav-h)!important;
    padding:0 10px!important;
    margin:0!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    color:var(--pp-fach-side-text)!important;
    font:inherit!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:780!important;
    line-height:1.2!important;
    text-align:left!important;
    cursor:pointer!important;
    box-shadow:none!important;
  }

  body.pp5-module-open .pp5-native-nav button:hover{
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
  }

  body.pp5-module-open .pp5-native-nav button.active{
    background:var(--pp-fach-active)!important;
    color:#fff!important;
  }

  body.pp5-module-open .pp5-native-start{
    margin-top:14px!important;
    min-height:var(--pp-fach-cta-h)!important;
    padding:0 10px!important;
    border:0!important;
    border-radius:10px!important;
    background:var(--pp-fach-cta)!important;
    color:#fff!important;
    font:inherit!important;
    font-size:var(--pp-fach-nav-fs)!important;
    font-weight:900!important;
    cursor:pointer!important;
    box-shadow:none!important;
  }

  body.pp5-module-open .pp5-native-foot{
    margin-top:auto!important;
    padding:16px 9px 0!important;
    font-size:8px!important;
    line-height:1.35!important;
    color:var(--pp-fach-side-muted)!important;
  }

  body.pp5-module-open .pp5-native-main{
    min-width:0!important;
    background:var(--pp-fach-stage)!important;
    position:relative!important;
    border-radius:0 var(--pp-fach-radius) var(--pp-fach-radius) 0!important;
    overflow:hidden!important;
  }

  body.pp5-module-open .pp5-native-loading{
    position:absolute!important;
    inset:0!important;
    display:none;
    align-items:center!important;
    justify-content:center!important;
    z-index:2!important;
    background:var(--pp-fach-stage)!important;
    color:#71858e!important;
    font-size:11px!important;
  }

  body.pp5-module-open .pp5-native-frame{
    display:block!important;
    width:100%!important;
    height:calc(100dvh - 88px)!important;
    min-height:620px!important;
    border:0!important;
    background:var(--pp-fach-stage)!important;
  }
}

@media(max-width:900px){
  body.pp5-module-open #pagePraevention{
    padding:calc(var(--header-h,60px) + 4px) 0 0!important;
  }
  body.pp5-module-open .pp5-native-shell{display:block!important}
  body.pp5-module-open .pp5-native-side{display:none!important}
  body.pp5-module-open .pp5-native-frame{
    width:100%!important;
    height:calc(100dvh - 68px)!important;
    min-height:540px!important;
    border:0!important;
  }
}