/* JK Diagnostic Step 8.2a Fix C - Performance-Test style shell/navigation/logo
   Ziel: Alle Hauptseiten sollen Sidebar, Logo und Links exakt im Performance-Cockpit-Stil darstellen. */
:root{
  --jkd-perf-bg:#050812;
  --jkd-perf-panel:rgba(12,20,35,.86);
  --jkd-perf-panel2:rgba(16,27,45,.92);
  --jkd-perf-line:rgba(83,201,255,.22);
  --jkd-perf-line-soft:rgba(75,179,255,.16);
  --jkd-perf-cyan:#35d6ff;
  --jkd-perf-blue:#1179ff;
  --jkd-perf-white:#f6fbff;
  --jkd-perf-muted:#8ea8bd;
  --jkd-perf-green:#49f0a7;
  --jkd-perf-yellow:#ffd166;
  --jkd-perf-red:#ff5874;
  --jkd-perf-shadow:0 24px 60px rgba(0,0,0,.42);
}
html{min-height:100%;background:var(--jkd-perf-bg);} 
html,body{margin:0;min-height:100%;}
body.jkd-clean-active{
  height:100vh;
  overflow:hidden;
  color:var(--jkd-perf-white);
  background:
    radial-gradient(circle at 15% 15%,rgba(16,121,255,.18),transparent 34rem),
    radial-gradient(circle at 85% 5%,rgba(53,214,255,.14),transparent 26rem),
    linear-gradient(135deg,#050812 0%,#09111f 48%,#04060d 100%);
}
body.jkd-clean-active *,body.jkd-clean-active *::before,body.jkd-clean-active *::after{box-sizing:border-box;}
body.jkd-clean-active a{color:inherit;text-decoration:none;}
body.jkd-clean-active button,
body.jkd-clean-active input,
body.jkd-clean-active select{font:inherit;}

/* App shell: Sidebar/Header fix, nur Content scrollt */
body.jkd-clean-active .app-shell,
body.jkd-clean-active .jkd-shell,
body.jkd-clean-active .backup-shell{
  min-height:100vh!important;
  height:100vh!important;
  display:grid!important;
  grid-template-columns:286px minmax(0,1fr)!important;
  overflow:hidden!important;
}
body.jkd-clean-active .license-shell{min-height:100vh!important;height:100vh!important;overflow:hidden!important;}
body.jkd-clean-active .sidebar,
body.jkd-clean-active .jkd-sidebar,
body.jkd-clean-active .backup-sidebar{
  position:sticky!important;
  top:0!important;
  height:100vh!important;
  width:286px!important;
  min-width:286px!important;
  max-width:286px!important;
  padding:22px 18px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  border-right:1px solid var(--jkd-perf-line-soft)!important;
  background:rgba(3,7,14,.68)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(53,214,255,.45) transparent;
}
body.jkd-clean-active .main,
body.jkd-clean-active .jkd-main,
body.jkd-clean-active .backup-main,
body.jkd-clean-active .license-main{
  min-width:0!important;
  height:100vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable;
  padding-bottom:56px!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(53,214,255,.45) rgba(255,255,255,.04);
}
body.jkd-clean-active .topbar,
body.jkd-clean-active .jkd-topbar,
body.jkd-clean-active .backup-hero,
body.jkd-clean-active .license-hero,
body.jkd-clean-active .jkd-hero{
  position:sticky!important;
  top:0!important;
  z-index:40!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}

/* Logo/Brand exakt in Performance-Test-Größe */
body.jkd-clean-active .brand,
body.jkd-clean-active .jkd-brand,
body.jkd-clean-active .backup-brand,
body.jkd-clean-active a.jkd-brand{
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  min-height:auto!important;
  height:auto!important;
  padding:0!important;
  margin:0 0 28px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--jkd-perf-white)!important;
  text-decoration:none!important;
}
body.jkd-clean-active .jkd-brand-mark,
body.jkd-clean-active .brand-mark,
body.jkd-clean-active .logo-mark,
body.jkd-clean-active .backup-brand-mark{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  min-height:58px!important;
  max-height:58px!important;
  border-radius:20px!important;
  border:1px solid rgba(53,214,255,.34)!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(145deg,rgba(17,121,255,.18),rgba(53,214,255,.06))!important;
  box-shadow:0 0 28px rgba(53,214,255,.16)!important;
  overflow:hidden!important;
  color:var(--jkd-perf-cyan)!important;
  font-size:19px!important;
  font-weight:900!important;
  line-height:1!important;
}
body.jkd-clean-active .jkd-brand-mark img,
body.jkd-clean-active .brand img,
body.jkd-clean-active .brand-mark img,
body.jkd-clean-active .logo-mark img,
body.jkd-clean-active .backup-brand img,
body.jkd-clean-active .backup-brand-mark img{
  display:block!important;
  width:52px!important;
  height:52px!important;
  max-width:52px!important;
  max-height:52px!important;
  object-fit:contain!important;
}
body.jkd-clean-active .jkd-brand-mark.fallback-mark::before,
body.jkd-clean-active .brand-mark.fallback-mark::before,
body.jkd-clean-active .logo-mark.fallback-mark::before{content:'JK';}
body.jkd-clean-active .jkd-brand-text strong,
body.jkd-clean-active .brand strong,
body.jkd-clean-active .brand-title,
body.jkd-clean-active .backup-brand strong{
  display:block!important;
  font-size:18px!important;
  line-height:1.15!important;
  font-weight:900!important;
  letter-spacing:.3px!important;
  color:var(--jkd-perf-white)!important;
  margin:0!important;
  white-space:nowrap!important;
}
body.jkd-clean-active .jkd-brand-text small,
body.jkd-clean-active .brand small,
body.jkd-clean-active .brand-subtitle,
body.jkd-clean-active .backup-brand small{
  display:block!important;
  color:var(--jkd-perf-muted)!important;
  font-size:13px!important;
  line-height:1.35!important;
  margin-top:2px!important;
  white-space:nowrap!important;
  font-weight:500!important;
  letter-spacing:0!important;
  text-transform:none!important;
}

/* Navigation exakt im Performance-Test-Stil */
body.jkd-clean-active .nav,
body.jkd-clean-active .jkd-nav,
body.jkd-clean-active .backup-nav,
body.jkd-clean-active .jkd-clean-main-nav{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  margin:0!important;
  width:100%!important;
  max-width:100%!important;
}
body.jkd-clean-active .nav a,
body.jkd-clean-active .nav a.nav-link,
body.jkd-clean-active .jkd-nav a,
body.jkd-clean-active .backup-nav a,
body.jkd-clean-active .jkd-clean-main-nav a{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:0!important;
  height:auto!important;
  padding:12px 14px!important;
  margin:0!important;
  color:#bed4e5!important;
  border:1px solid transparent!important;
  border-radius:15px!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:15px!important;
  line-height:1.25!important;
  font-weight:700!important;
  letter-spacing:0!important;
  text-align:left!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  transition:160ms ease!important;
}
body.jkd-clean-active .nav a:hover,
body.jkd-clean-active .nav a.nav-link:hover,
body.jkd-clean-active .jkd-nav a:hover,
body.jkd-clean-active .backup-nav a:hover,
body.jkd-clean-active .jkd-clean-main-nav a:hover,
body.jkd-clean-active .nav a.active,
body.jkd-clean-active .nav a.nav-link.active,
body.jkd-clean-active .jkd-nav a.active,
body.jkd-clean-active .backup-nav a.active,
body.jkd-clean-active .jkd-clean-main-nav a.active{
  color:var(--jkd-perf-white)!important;
  border-color:rgba(53,214,255,.28)!important;
  background:linear-gradient(90deg,rgba(17,121,255,.22),rgba(53,214,255,.08))!important;
  box-shadow:0 0 24px rgba(17,121,255,.12)!important;
  transform:none!important;
}
body.jkd-clean-active .nav a span,
body.jkd-clean-active .jkd-nav a span,
body.jkd-clean-active .backup-nav a span{
  display:inline!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:inherit!important;
  line-height:inherit!important;
  white-space:inherit!important;
}
body.jkd-clean-active .jkd-nav-icon,
body.jkd-clean-active .jkd-nav-tag{display:none!important;}

/* Sidebar status card wie Performance-Test */
body.jkd-clean-active .jkd-clean-system-card,
body.jkd-clean-active .jkd-sidebar-card,
body.jkd-clean-active .side-card.jkd-delivery-card{
  margin-top:24px!important;
  padding:14px!important;
  border-radius:17px!important;
  background:rgba(9,18,32,.92)!important;
  border:1px solid rgba(53,214,255,.18)!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  color:var(--jkd-perf-white)!important;
}
body.jkd-clean-active .jkd-sidebar-card strong,
body.jkd-clean-active .jkd-clean-system-card strong{display:block!important;font-size:14px!important;margin:0!important;}
body.jkd-clean-active .jkd-sidebar-card small,
body.jkd-clean-active .jkd-clean-system-card small{display:block!important;color:var(--jkd-perf-muted)!important;margin-top:2px!important;font-size:12px!important;line-height:1.35!important;}
body.jkd-clean-active .dot,
body.jkd-clean-active .jkd-clean-dot{width:11px!important;height:11px!important;min-width:11px!important;border-radius:999px!important;display:inline-block!important;background:var(--jkd-perf-cyan)!important;box-shadow:0 0 18px rgba(53,214,255,.85)!important;}

/* Entwicklerkram raus, Fehlercode-JSON bleibt auf fault_codes.php sichtbar */
body.jkd-clean-active .jkd-clean-hidden{display:none!important;}
body.jkd-clean-active:not(.jkd-page-fault_codes) .raw-panel,
body.jkd-clean-active:not(.jkd-page-fault_codes) .debug-panel,
body.jkd-clean-active:not(.jkd-page-fault_codes) .dev-panel,
body.jkd-clean-active:not(.jkd-page-fault_codes) [data-dev-only],
body.jkd-clean-active:not(.jkd-page-fault_codes) .admin-tools,
body.jkd-clean-active:not(.jkd-page-fault_codes) .keygen-link-row{display:none!important;}
body.jkd-clean-active .license-card strong,
body.jkd-clean-active .side-card strong{word-break:break-word;}
body.jkd-clean-active .terminal,
body.jkd-clean-active pre{max-height:340px;overflow:auto;}
body.jkd-clean-active .jkd-clean-scroll-note{position:fixed;right:16px;bottom:14px;z-index:70;color:rgba(246,251,255,.42);font-size:11px;pointer-events:none;}
body.jkd-clean-active.jkd-page-index .sidebar .license-panel{display:none!important;}

@media (max-width:980px){
  body.jkd-clean-active{height:auto;overflow:auto;}
  body.jkd-clean-active .app-shell,
  body.jkd-clean-active .jkd-shell,
  body.jkd-clean-active .backup-shell,
  body.jkd-clean-active .license-shell{
    display:block!important;
    height:auto!important;
    min-height:100vh!important;
    overflow:visible!important;
  }
  body.jkd-clean-active .sidebar,
  body.jkd-clean-active .jkd-sidebar,
  body.jkd-clean-active .backup-sidebar{
    position:relative!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    height:auto!important;
    display:block!important;
  }
  body.jkd-clean-active .main,
  body.jkd-clean-active .jkd-main,
  body.jkd-clean-active .backup-main,
  body.jkd-clean-active .license-main{
    height:auto!important;
    overflow:visible!important;
  }
  body.jkd-clean-active .nav,
  body.jkd-clean-active .jkd-nav,
  body.jkd-clean-active .backup-nav,
  body.jkd-clean-active .jkd-clean-main-nav{grid-template-columns:1fr!important;}
}
