/* @group Navigation */

/* Responsive Navigation 10.02.25 */

/* Desktop Navigation */
.desktop-nav > ul {
  display: flex;
  gap: var(--spacing-32);
}

.desktop-nav > ul > li {
  padding: var(--spacing-8) 0;
  border-bottom: 3px solid transparent;
}

.desktop-nav > ul > li:has(.link-primary) {
  border-bottom-color: var(--action-primary-base);
}

.desktop-nav > ul > li:has(.link-primary:active) {
  border-bottom-color: var(--action-primary-pressed);
}

.desktop-nav .link {
  padding: var(--spacing-12) 0;
}

.desktop-nav .link-primary,
.desktop-nav .link-primary:hover,
.mobile-nav .link-primary:not(.logout-link),
.mobile-nav .link-primary:not(.logout-link):hover {
  text-decoration: none;
}

/* Mobile Navigation */
.mobile-nav {
  min-width: 375px;
  background-color: var(--background-base);
}

.mobile-nav ul {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  padding: var(--spacing-8) 0;
}

.mobile-nav ul > li {
  padding: 0 var(--spacing-16);
}

.mobile-nav ul > li > .link {
  padding: var(--spacing-12) 0;
}

.mobile-nav ul > li > .link > svg {
  margin-left: auto;
}

.mobile-nav ul > li.logout {
  margin-top: var(--spacing-4);
  padding-top: var(--spacing-8);
  border-top: 1px solid var(--border-base);
}


.mobile-nav .navbar-collapse {
  padding: 0;
  border: none;
}

/*#mobile-nav .navbar-header .container {*/
/*  padding-bottom: 1.25rem;*/
/*  border-bottom: 1px solid var(--border-muted);*/
/*}*/

/*.mobile-nav .nav > li > a {*/
/*  padding: 15px 20px;*/
/*  !*border-bottom: 1px solid var(--border-muted);*!*/
/*  position: relative;*/
/*  color: var(--text-action-secondary-base);*/
/*}*/

/*.mobile-nav .nav > li > a:hover{*/
/*  color: var(--text-action-secondary-hover);*/
/*}*/

/*.mobile-nav .nav > li > a:active{*/
/*  color: var(--text-action-secondary-pressed);*/
/*}*/

/* Mobile Pfeil nach rechts */
/*.mobile-nav .nav > li > a::after {*/
/*  content: '›';*/
/*  position: absolute;*/
/*  right: 20px;*/
/*  font-size: 24px;*/
/*  color: var(--text-base);*/
/*}*/

/* Mobile aktiver Link */
/*.mobile-nav .nav > li.active > a, .desktop-nav .nav > li.active > a {*/
/*  color: var(--feedback-error-base);*/
/*}*/

/* Mobile Postfach Badge */
.badge-notification {
  background-color: var(--feedback-error-base);
  color: white;
  border-radius: 50%;
  padding: 3px 6px;
  font-size: 12px;
  margin-left: 10px;
}

/* Mobile Abmelden Button */
/*.mobile-nav .nav > li.logout > a {*/
/*  color: var(--feedback-error-base);*/
/*  border-bottom: none;*/
/*  margin-top: 10px;*/
/*}*/

/*.mobile-nav .nav > li.logout > a::before {*/
/*  content: '↪';*/
/*  margin-right: 10px;*/
/*  transform: scaleX(-1);*/
/*  display: inline-block;*/
/*}*/

/*.mobile-nav .nav > li.logout > a::after {*/
/*  display: none;*/
/*}*/

/* Responsive Breakpoints */

/* Verbesserte Zugänglichkeit */
/*.navbar-header.flex {*/
/*  margin-left: 0;*/
/*  margin-right: 0;*/
/*  gap: 0;*/
/*}*/

/*.navbar-header.flex > span {*/
/*  flex-grow:1;*/
/*}*/

/* Navbar - Toggle Switch - Icon*/

.navbar-toggle {
  margin-right: 0;
}

.navbar-toggle .close-icon {
  display: none;
  font-size: 30px;
  line-height: 20px;
}

.navbar-collapse.in{
  max-height: none;
  background-color: var(--background-base);
  height: 100vh;
}

.navbar-toggle.collapsed .burger-icon {
  display: block;
}
.navbar-toggle.collapsed .close-icon {
  display: none;
}
.navbar-toggle:not(.collapsed) .burger-icon {
  display: none;
}
.navbar-toggle:not(.collapsed) .close-icon {
  display: block;
}

#burger-menu-button{
  background-color: #ddd;
}

#burger-menu-button:focus,
#burger-menu-button:focus-visible,
#burger-menu-button:focus-within
{
  outline: var(--action-focus) solid 2px;
}

.burger-menu {
  padding: 0;
  border: 0;
  margin: 0;
  border-radius: .5rem;
  background-color: var(--surface-subtle);
}

/*@media (min-width: 1200px) {*/
/*  .container {*/
/*     width: 1200px; !important;*/
/*  }*/
/*}*/

header {
  position: relative;
  border-bottom: 1px solid var(--border-muted);
  background-color: var(--background-base);
}

/*Mobile Start*/
/*.mobile-nav {*/
/*  padding: 0;*/
/*}*/

.logo__header {
  display: flex;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--border-muted);
  min-width: 375px;
}

/*.mobile-nav .nav > li {*/
/*  padding: 1rem 2.5rem 1rem 1rem;*/
/*}*/

/*.mobile-nav .nav > li > a {*/
/*  padding: 0;*/
/*}*/

/*.mobile-nav .nav > li > a::after {*/
/*  right: 0;*/
/*}*/

/*Mobile Ende*/

/* Ende-RN  */