/* =========================================================
   HEAD BOXES 9 – Linienfarbe
   ========================================================= */
.head-boxes-9 h2::before,
.head-boxes-9 h2::after {
  content: "";
  width: 50px;
  height: 2px;
  display: inline-block;
  background-color: #ff2457;
}

/* =========================================================
   ROOT / THEME VARIABLES
   ========================================================= */
:root {
  --xt-nav-link: #e9eef5;
  --xt-nav-hover: #ff2457;
  --xt-nav-active: #ff2457;
  --xt-nav-bg: rgba(10, 12, 18, 0.10);

  --xt-dd-bg: rgba(15, 18, 25, 0.75);
  --xt-dd-border: rgba(255, 255, 255, 0.12);

  --xt-accent: #ff2457;
}

/* =========================================================
   BOOTSTRAP DARK THEME VARIABLES
   ========================================================= */
[data-bs-theme="dark"] {
  --bs-primary: #ff2457;
  --bs-primary-rgb: 255, 36, 87;
  --bs-primary-text-emphasis: #ff2457;

  --bs-secondary: #0f1219;
  --bs-secondary-rgb: 15, 18, 25;
}

/* =========================================================
   NAVBAR
   ========================================================= */
.navbar {
  background: var(--xt-nav-bg);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

#nxNavBarContent .nav-link {
  color: var(--xt-nav-link) !important;
  position: relative;
}

#nxNavBarContent .nav-link i,
#nxNavBarContent .nav-link .bi {
  color: currentColor !important;
}

#nxNavBarContent .nav-link:hover,
#nxNavBarContent .nav-link:focus,
#nxNavBarContent .nav-item.show > .nav-link,
#nxNavBarContent .nav-link.active {
  color: var(--xt-nav-active) !important;
}

#nxNavBarContent .nav-link::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 4px;
  height: 2px;
  background: transparent;
  transition: background-color .2s ease;
}

#nxNavBarContent .nav-link:hover::after,
#nxNavBarContent .nav-item.show > .nav-link::after,
#nxNavBarContent .nav-link.active::after {
  background: var(--xt-nav-active);
}

/* =========================================================
   DROPDOWN
   ========================================================= */
#nxNavBarContent .dropdown-menu {
  background: var(--xt-dd-bg) !important;
  border: 1px solid var(--xt-dd-border) !important;
  border-radius: 10px;
  padding: 6px;
  box-shadow: 0 10px 25px rgba(0,0,0,.35);
}

#nxNavBarContent .dropdown-item {
  background: transparent !important;
  color: var(--xt-nav-link) !important;
  border-radius: 8px;
  padding: 8px 12px;
}

#nxNavBarContent .dropdown-item:hover,
#nxNavBarContent .dropdown-item:focus {
  color: var(--xt-nav-hover) !important;
  background: rgba(255,255,255,.08) !important;
}

#nxNavBarContent .dropdown-divider {
  border-top-color: rgba(255,255,255,.12) !important;
}

/* =========================================================
   FOOTER LINKS
   ========================================================= */
.foot_link {
  color: #e9eef5;
  text-decoration: none;
  font-weight: 500;
  transition: color .2s ease, text-shadow .2s ease;
}

.foot_link:hover,
.foot_link:focus {
  color: #ff2457;
  text-shadow: 0 0 6px rgba(255,36,87,.6);
}

/* =========================================================
   HEAD BOXES – Subtitle
   ========================================================= */
.head-boxes .head-boxes-foot {
  opacity: 0;
  transform: translateY(-2px);
  transition: opacity .2s ease, transform .2s ease;
}

.head-boxes .head-boxes-foot.js-visible {
  opacity: 1;
  transform: translateY(0);
  font-size: .85rem;
  letter-spacing: .3px;
  color: var(--xt-accent);
  text-shadow: 0 0 8px rgba(255,36,87,.35);
}

.head-boxes .head-boxes-foot.js-visible::before {
  display: none;
}

/* =========================================================
   GLOBAL LINKS
   ========================================================= */
a {
  color: inherit;
  text-decoration: none;
}

a:hover,
a:focus {
  color: #ff2457 !important;
}

a.btn {
  color: var(--bs-btn-color, #dfd7ca) !important;
}

a.btn:hover,
a.btn:focus {
  color: var(--bs-btn-hover-color, #dfd7ca) !important;
}

/* =========================================================
   NEWS
   ========================================================= */
.news {
  background: rgba(var(--bs-secondary-rgb), 0.75);
}

/* =========================================================
   PRIMARY BUTTON – XTREAMS THEME
   ========================================================= */
[data-bs-theme="dark"] .btn-primary {
  --bs-btn-color: #dfd7ca;
  --bs-btn-bg: #ff2457;
  --bs-btn-border-color: #ff2457;

  --bs-btn-hover-color: #dfd7ca;
  --bs-btn-hover-bg: #9f1436;
  --bs-btn-hover-border-color: #9f1436;

  --bs-btn-active-color: #dfd7ca;
  --bs-btn-active-bg: #6f0e26;
  --bs-btn-active-border-color: #6f0e26;

  --bs-btn-disabled-color: #dfd7ca;
  --bs-btn-disabled-bg: #ff2457;
  --bs-btn-disabled-border-color: #ff2457;

  text-shadow: 0 1px 2px rgba(0,0,0,.55) !important;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

[data-bs-theme="dark"] .btn-primary:hover {
  box-shadow:
    0 0 0 2px rgba(255,36,87,.12),
    0 10px 26px rgba(159,20,54,.55);
}
/* TSViewer: erzwinge light color-scheme (wichtig für iframe) */
#tsviewer-card,
#tsviewer-widget,
.tsviewer-frame,
.tsviewer-iframe {
  color-scheme: light !important;
}
/* =========================================================
   TSVIEWER – SIDEBAR FIX (kein horizontaler Scroll)
   ========================================================= */

/* Sidebar-Wrapper darf NICHT scrollen */
.widget-tsviewer-sidebar,
.widget-tsviewer-sidebar .card-body {
  overflow-x: hidden !important;
}

/* TSViewer iframe: leicht skalieren, damit alles reinpasst */
.widget-tsviewer-sidebar iframe {
  width: 760px !important;
  height: 520px !important;

  transform: scale(0.88);
  transform-origin: 0 0;

  border: 0 !important;
  display: block !important;
  max-width: none !important;
}


/* Höhe korrigieren, damit nichts abgeschnitten wird */
.widget-tsviewer-sidebar .card-body {
  height: calc(520px * 0.88); /* exakt passend zur Scale */
  overflow: hidden;
}

}
@media (max-width: 1200px) {
  .widget-tsviewer-sidebar iframe {
    transform: scale(0.82);
  }
}