/* Die Linie ragt beidseitig 16 px über den Menütext hinaus. */
.tm-header .uk-navbar-nav > li > a::before {
  left: 9px;
  right: calc(102% - 9px);
}

.tm-header .uk-navbar-nav > li:hover > a::before,
.tm-header .uk-navbar-nav > li > a:focus::before,
.tm-header .uk-navbar-nav > li > a.uk-open::before,
.tm-header .uk-navbar-nav > li.uk-active > a::before {
  right: 9px;
}

/* Desktop-Untermenüs der gemeinsamen Roomtrix-Navigation. */
.tm-header .uk-navbar-dropdown {
  --dropdown-accent: var(--color-form-yellow);
  --dropdown-text: var(--color-brand-deep);
  width: 220px;
  padding: 6px;
  border-radius: 11px;
  background: var(--color-white);
  box-shadow: 0 10px 24px rgb(0 45 70 / 12%);
}

.tm-header .uk-navbar-dropdown::before {
  position: absolute;
  top: -6px;
  left: calc(50% - 6px);
  width: 12px;
  height: 12px;
  background: var(--color-white);
  transform: rotate(45deg);
  content: "";
}

.tm-header .uk-navbar-dropdown-nav {
  position: relative;
  font-size: 15px;
  line-height: 1.3;
}

.tm-header .uk-navbar-dropdown-nav > li > a {
  position: relative;
  padding: 10px 29px 10px 12px;
  border-inline-start: 3px solid transparent;
  border-radius: 6px;
  color: var(--dropdown-text);
}

.tm-header .uk-navbar-dropdown-nav > li > a:hover,
.tm-header .uk-navbar-dropdown-nav > li > a:focus,
.tm-header .uk-navbar-dropdown-nav > li.uk-active > a {
  border-inline-start-color: var(--dropdown-accent);
  background: #e5f3fa;
  color: var(--dropdown-text);
}

.tm-header .uk-navbar-dropdown-nav > li > a:hover::after,
.tm-header .uk-navbar-dropdown-nav > li > a:focus::after,
.tm-header .uk-navbar-dropdown-nav > li.uk-active > a::after {
  position: absolute;
  inset-inline-end: 12px;
  top: 50%;
  transform: translateY(-50%);
  content: "→" / "";
}

/* Mobiles Seitenmenü. */
#tm-mobile .roomtrix-mobile-panel {
  display: flex;
  flex-direction: column;
  width: min(100%, 300px);
  padding: 8px;
  background: var(--color-white);
  color: var(--color-brand-deep);
  font: 16px/1.35 Molengo, sans-serif;
}

.roomtrix-mobile-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 13px;
}

#tm-mobile .roomtrix-mobile-logo {
  display: inline-flex;
  align-items: center;
  padding: 5px 8px;
}

#tm-mobile .uk-offcanvas-close {
  position: static;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border-radius: 50%;
  background: #e5f3fa;
  color: var(--color-brand-deep);
}

#tm-mobile a {
  color: var(--color-brand-deep);
  text-decoration: none;
}

.roomtrix-mobile-nav > a,
.roomtrix-mobile-solutions-label {
  display: block;
  min-height: 46px;
  padding: 12px 15px;
  box-sizing: border-box;
}

.roomtrix-mobile-nav > a[aria-current="page"] {
  padding-inline-start: 12px;
  border-inline-start: 3px solid var(--color-form-yellow);
  border-radius: 8px;
  background: #e5f3fa;
}

.roomtrix-mobile-solutions ul {
  margin: 0 0 4px 18px;
  padding: 0 8px 0 14px;
  border-inline-start: 1px solid #cbe6f5;
  list-style: none;
}

.roomtrix-mobile-solutions li a {
  display: block;
  padding: 6px 0;
  font-size: 15px;
}

.roomtrix-mobile-solutions a[aria-current="page"] {
  font-weight: bold;
}

.roomtrix-mobile-footer {
  margin-top: auto;
  padding-top: 32px;
}

#tm-mobile .roomtrix-mobile-contact {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 46px;
  border-radius: 11px;
  background: var(--color-form-yellow);
  color: #302300;
}

#tm-mobile .roomtrix-mobile-contact:hover,
#tm-mobile .roomtrix-mobile-contact:focus-visible {
  background: var(--color-form-yellow-light);
}

.roomtrix-mobile-legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin: 12px 0 6px;
  font-size: 13px;
}

#tm-mobile :is(a, button):focus-visible {
  outline: 2px solid var(--color-brand-deep);
  outline-offset: -2px;
}

/* Kontaktbutton im Desktop-Hauptmenü. */
.tm-header .uk-navbar-nav > .roomtrix-desktop-contact {
  display: flex;
  align-items: center;
  margin-inline-start: 12px;
}

.tm-header .uk-navbar-container .uk-navbar-nav > .roomtrix-desktop-contact > a {
  height: auto;
  padding: 10px 17px;
  border-radius: 5px;
  background: linear-gradient(var(--color-form-yellow-light), var(--color-form-yellow-light)) left center / 0% 100% no-repeat var(--color-form-yellow);
  white-space: nowrap;
  transition: background-size .25s ease-out;
}

.tm-header .uk-navbar-container .uk-navbar-nav > .roomtrix-desktop-contact > a::before {
  content: none;
}

.tm-header .uk-navbar-container .uk-navbar-nav > .roomtrix-desktop-contact > a:hover,
.tm-header .uk-navbar-container .uk-navbar-nav > .roomtrix-desktop-contact > a:focus-visible {
  background-size: 100% 100%;
}

.tm-header .uk-navbar-container .uk-navbar-nav > .roomtrix-desktop-contact > a:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 3px;
}

.tm-header .uk-navbar-container .uk-navbar-nav > .roomtrix-desktop-contact > a:is(:link, :visited, :hover, :focus, :active) {
  color: var(--color-practice-heading);
}

@media (prefers-reduced-motion: reduce) {
  .tm-header .uk-navbar-container .uk-navbar-nav > .roomtrix-desktop-contact > a {
    transition: none;
  }
}


/* Schwebender Menüöffner in der mobilen Kopfzeile. */
.tm-header-mobile .uk-navbar-toggle[href="#tm-mobile"] {
  position: fixed;
  top: max(16px, env(safe-area-inset-top));
  right: max(16px, env(safe-area-inset-right));
  z-index: 900;
  width: 46px;
  height: 46px;
  padding: 0;
  border-radius: 50%;
  background: var(--color-brand);
  color: var(--color-white);
  box-shadow: 0 4px 16px rgb(0 45 70 / 22%);
}

.tm-header-mobile .uk-navbar-toggle[href="#tm-mobile"]:is(:hover, :focus-visible) {
  background: var(--color-brand-deep);
  color: var(--color-white);
}

.tm-header-mobile .uk-navbar-toggle[href="#tm-mobile"]:focus-visible {
  outline: 2px solid var(--color-form-yellow);
  outline-offset: 2px;
}

.uk-offcanvas-container .tm-header-mobile .uk-navbar-toggle[href="#tm-mobile"] {
  visibility: hidden;
}
