:root {
  --theme-transparent-dark: rgba(255, 255, 255, 0.788) !important;
}

div[class*="Branding"] {
  display: flex;
  align-items: center;
  gap: 40px;
  flex-wrap: nowrap;
}

#brand-logo-big,
#brand-logo-piksel {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

#brand-logo-big img,
#brand-logo-piksel img {
  display: block;
  max-height: 60px;
}

@media (max-width: 764px) {
  #brand-logo-big img {
    max-height: 36px;
  }

  #brand-logo-piksel {
    display: none;
  }
}

.tjs-mobile-header__ui > div {
  background-color: oklch(94.511% 0.01286 244.48);
}

.tjs-mobile-header__group-right {
  background: transparent !important;
}

button[class*="HamburgerButton"] {
  background: rgb(55 118 178) !important;
}

div[class*="BoxHelpfulHints"] {
  color: #494949;
  line-height: 1.6;
}

button[class*="SidePanel"][class*="StyledButton"] {
  background-color: rgb(55 118 178);
}

div[class*="SidePanel"]
  > div[class*="Box"]:first-child
  > div[class*="Box"]:first-child
  span[class*="TextSpan"] {
  color: #494949;
}

div[class*="SidePanel"]
  > div[class*="Box"]:first-child
  > div[class*="Box"]:first-child
  svg[class*="Icon"] {
  color: #494949;
  fill: #494949;
}

div[class*="WelcomeMessage"]div[class*="Box"] {
  color: #494949 !important;
}

/* .tjs-standard-user-interface__story-wrapper > div > div > div {
  background: rgb(64 79 92);
} */

.tjs-standard-user-interface__story-wrapper button {
  border-radius: 4px;
}

div[class*="BottomBar"] {
  background: #f1f1f1d5;
  color: rgb(32, 31, 31);
  padding: 8px 0;
  padding-left: 18px;
  border-radius: 8px;
}

div[class*="BottomBar"] :is(a, span, label) {
  color: rgb(32, 31, 31);
}

div[class*="DistanceLegend"] {
  background: rgb(32, 31, 31);
}
/* 
.tjs-_buttons__btn--map {
  color: rgb(96 95 104) !important;
  background-color: rgb(255 255 255 / 86%) !important;
}

div[class*="MapNavigationItem"] div {
  background: rgb(236, 225, 225);
  }

div[class*="ZoomControl"] {
  background: rgb(236, 225, 225);
  border-color: rgb(156, 163, 175);
}

div[class*="MapIconButton"] > button {
  background: rgb(236, 225, 225);
  border-color: rgb(156, 163, 175);
} */
