/* Starter Landing – Nexpell Dark Orange */
:root {
  --nx-template-id: "starter_landing";
  --nx-starter-chrome-bg: #111827;
  --nx-starter-footer-bg: var(--nx-starter-chrome-bg);
  --nx-starter-footer-border: #1f2937;
  --nx-starter-footer-text: #f8fafc;
  --nx-starter-footer-muted: #cbd5e1;
  --nx-starter-footer-link: #f97316;
  --nx-starter-footer-link-hover: #fb923c;
}

/* Navigation und Footer bilden denselben dunklen Rahmen um die Landingpage. */
html body #mainNavbar,
html body #mainNavbar.nx-tk-nav-surface-light,
html body #mainNavbar.nx-tk-nav-surface-dark {
  --nx-nav-bg: var(--nx-starter-chrome-bg);
  --nx-nav-fg: var(--nx-starter-footer-text);
  --nx-nav-surface-light-bg: var(--nx-starter-chrome-bg);
  --nx-nav-surface-light-fg: var(--nx-starter-footer-text);
  --nx-nav-surface-dark-bg: var(--nx-starter-chrome-bg);
  --nx-nav-surface-dark-fg: var(--nx-starter-footer-text);
  --nx-dd-bg: var(--nx-starter-chrome-bg);
  --nx-dd-fg: var(--nx-starter-footer-text);
  color: var(--nx-starter-footer-text) !important;
  background: var(--nx-starter-chrome-bg) !important;
  background-color: var(--nx-starter-chrome-bg) !important;
}

html body #mainNavbar .navbar-brand,
html body #mainNavbar .navbar-nav .nav-link,
html body #mainNavbar #themeToggle {
  color: var(--nx-starter-footer-text) !important;
}

html body #mainNavbar .navbar-nav .nav-link:hover,
html body #mainNavbar .navbar-nav .nav-link:focus,
html body #mainNavbar .navbar-nav .nav-link.active,
html body #mainNavbar .nav-item.dropdown.show > .nav-link {
  color: var(--nx-starter-footer-link-hover) !important;
}

html body #mainNavbar .dropdown-menu {
  color: var(--nx-starter-footer-text) !important;
  background: var(--nx-starter-chrome-bg) !important;
  background-color: var(--nx-starter-chrome-bg) !important;
  border-color: var(--nx-starter-footer-border) !important;
}

/* Der Footer bleibt wie beim hellen Nexpell-Template eine dunkle Abschlussfläche. */
html body footer.nx-footer.nx-tk-bg-footer {
  --nx-color-footer-bg: var(--nx-starter-footer-bg);
  --nx-color-footer-border: var(--nx-starter-footer-border);
  --nx-color-footer-text: var(--nx-starter-footer-text);
  --nx-color-footer-muted: var(--nx-starter-footer-muted);
  --nx-color-footer-link: var(--nx-starter-footer-link);
  --nx-color-footer-link-hover: var(--nx-starter-footer-link-hover);
  color: var(--nx-starter-footer-text) !important;
  background: var(--nx-starter-footer-bg) !important;
  background-color: var(--nx-starter-footer-bg) !important;
  border-top-color: var(--nx-starter-footer-border) !important;
  box-shadow: none !important;
}

html body footer.nx-footer.nx-tk-bg-footer h6,
html body footer.nx-footer.nx-tk-bg-footer .fw-semibold {
  color: var(--nx-starter-footer-text) !important;
}

html body footer.nx-footer.nx-tk-bg-footer p,
html body footer.nx-footer.nx-tk-bg-footer small,
html body footer.nx-footer.nx-tk-bg-footer .small,
html body footer.nx-footer.nx-tk-bg-footer .nx-tk-text-muted,
html body footer.nx-footer.nx-tk-bg-footer [data-nx-inline="year"],
html body footer.nx-footer.nx-tk-bg-footer [data-nx-inline="copyright_text"] {
  color: var(--nx-starter-footer-muted) !important;
}

html body footer.nx-footer.nx-tk-bg-footer a,
html body footer.nx-footer.nx-tk-bg-footer a:link,
html body footer.nx-footer.nx-tk-bg-footer a:visited,
html body footer.nx-footer.nx-tk-bg-footer a:active,
html body footer.nx-footer.nx-tk-bg-footer a:focus {
  color: var(--nx-starter-footer-link) !important;
}

html body footer.nx-footer.nx-tk-bg-footer a:hover,
html body footer.nx-footer.nx-tk-bg-footer a:focus-visible {
  color: var(--nx-starter-footer-link-hover) !important;
}

html body footer.nx-footer.nx-tk-bg-footer .nx-tk-border-footer-top {
  border-color: var(--nx-starter-footer-border) !important;
}

/* Auch die Builder-Zone darf keinen hellen Rand um den Footer erzeugen. */
html body.builder-active [data-nx-zone="footer"],
html body.builder-active .nx-live-item[data-nx-key^="core_footer_"],
html body.builder-active .nx-live-item[data-nx-key^="core_footer_"] > .nx-live-content {
  color: var(--nx-starter-footer-text) !important;
  background: var(--nx-starter-footer-bg) !important;
  background-color: var(--nx-starter-footer-bg) !important;
}

/* Builder-Auswahl darf die tatsächlichen Templatefarben nicht blau einfärben. */
html body.builder-active .nx-live-item.nx-live-active,
html body.builder-active .nx-live-item.nx-live-active > .nx-live-content {
  background-color: transparent !important;
}