:root {
  --dark-background: #3b3d41;
  --action-color: #007a80;
  --action-color-hover: #003a3d;
  --action-color-disabled: #89bdbf;
  --action-color-on-dark: #18cdd6;
  --almost-white: #f6f6f6;
  --headings-font-family: "Open Sans", Helvetica, Arial, Verdana, sans-serif;
}

/* open-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: url("/_Resources/Static/Packages/Esn.Dna.Site/Fonts/open-sans-latin-300.woff2")
      format("woff2");
}
/* open-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: url("/_Resources/Static/Packages/Esn.Dna.Site/Fonts/open-sans-latin-700.woff2")
  format("woff2");
}

/** Page */
.c-page {
  min-height: 100vh;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: space-between;

  // container the site if wanted:
  /* max-width: 1920px
  margin: 0 auto; */
}

.c-page .c-header {
  height: 80px;
}

.c-page .main {
  flex: 1 0 auto;
}

.c-page__main-content {
  flex: 1;
}

.c-logo {
  max-width: 180px;
}

/** Header and Footer */
.c-header .c-logo__image {
  max-width: 152px;
}

.c-page__footer {
  position: relative;
  margin-top: 50px;
}

.c-page__footer,
.c-page__header {
  background-color: var(--dark-background);
  color: #fff;
}

.c-headline,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--text-color) !important;
}

.c-headline [data-neos-placeholder]::before {
  color: var(--text-color) !important;
}

.c-page__footer .c-headline,
.c-page__footer .c-headline [data-neos-placeholder]::before,
.c-page__footer h1,
.c-page__footer h2,
.c-page__footer h3,
.c-page__footer h4,
.c-page__footer h5,
.c-page__footer h6 {
  color: #fff !important;
}

.c-headline.c-banner__title {
  color: #fff !important;
}

.c-page__footer .c-headline {
  font-weight: 300;
}

a {
  color: var(--action-color);
}

.c-page__footer a {
  color: var(--action-color-on-dark) !important;
}

.c-page__footer .c-footer__link-wrapper {
  border-top: 2px solid #fff;
  padding: 20px 0 0;
}

/* .c-page__header .c-button:not(.c-button--plain, .c-button--secondary) {
background-color: #fff!important;
} */

.c-button.c-button--secondary {
  border-color: #000;
  color: #000;
}

.c-dropdown-menu .c-dropdown-menu__nav-list {
  background-color: var(--dark-background) !important;
  border-color: var(--almost-white) !important;
  color: #fff !important;
}

.c-dropdown-menu__nav-item--active {
  color: var(--action-color-on-dark) !important;
}

.c-dropdown-menu__nav-item-link,
.c-dropdown-menu__nav-item-button,
.c-dropdown-menu__nav-item:hover::before,
.c-dropdown-menu__nav-item--active::before {
  color: #fff;
}

/** explicit color overrides (Buttons, Icons, Links */

.c-button:not(.c-button--plain) .c-button__link,
.c-form-button .c-form-button__label {
  padding: 10px inherit 10px inherit;
}

/** Stage */

.c-stage__installer .c-headline,
.c-stage__installer h1,
.c-stage__installer h2,
.c-stage__installer h3,
.c-stage__installer h4,
.c-stage__installer h5,
.c-stage__installer h6 {
  color: #fff !important;
}

.c-main-content .c-stage.container .c-banner {
  height: 200px;
}
@media (min-width: 992px) {
  .c-main-content .c-stage.container .c-banner {
      height: 430px;
  }
}
.c-main-content .c-stage.container:not(.c-stage__installer) {
  max-width: 100%;
  padding: 0;
}

/* ATTENTION: This breaks if we change the DOM in c-stage */
/* width is max-width of content / 2 minus stage-padding */
/* DISABLED FOR NOW */
/*
.c-main-content .c-stage.container .c-banner {
justify-content: left;
}
.c-main-content .c-stage.container .c-banner .c-banner__content {
height: auto!important;
}
.c-main-content .c-stage.container .c-banner > div {
width: calc(736px / 2 - 15px)
}
@media (min-width: 768px) {
.c-main-content .c-stage.container .c-banner {
  justify-content: center;
}
.c-main-content .c-stage.container .c-banner > div {
  width: calc(736px / 2 - 15px)
}
}

@media (min-width: 992px) {

.c-main-content .c-stage.container .c-banner > div {
  width: calc(960px / 2 - 15px)
}
}

@media (max-width: 1264px) and (min-width: 1201px) {
.c-main-content .c-stage.container .c-banner > div {
  width: 570px
}
}
@media (min-width: 1200px) {
.c-main-content .c-stage.container .c-banner {
  height: 520px;
}
.c-main-content .c-stage.container .c-banner > div {
  width: calc(1170px / 2 - 15px)
}
} */

.c-main-content .c-stage.container .c-banner > div {
  display: none;
}

/** Icons */

.neubrandenburg-icon--detached-house::before,
.neubrandenburg-icon--business::before,
.neubrandenburg-icon--apartment-house::before {
  /* approach is a bit hacky */
  top: 45px !important;
}

.c-form-radio-with-icon__content::before {
  font-size: 56px !important;
}

/** overwriting dropdown to match dark background */
.c-dropdown-menu .c-dropdown-menu__wrapper,
.c-page__header .c-button.c-button--login {
  border: none;
  z-index: 1;
  background-color: transparent !important;
  color: #fff !important;
}

.c-header .c-button.c-button--login .c-button__link,
.c-dropdown-menu__wrapper .c-dropdown-menu__user-name {
  padding-left: 40px;
  z-index: 10;
  line-height: 2;
}

@media (min-width: 576px) {
.c-dropdown-menu .c-dropdown-menu__wrapper::before {
  left: 45px;
}
}

.c-dropdown-menu .c-dropdown-menu__wrapper::before,
.c-header .c-button.c-button--login::before {
  font-family: "neubrandenburg-icons" !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 32px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f109" !important;
  z-index: -1;
}

.c-form-button:disabled,
.c-button--disabled {
  background-color: #757575 !important;
  border-color: #757575 !important;
}

.c-permission__actions .c-permission__edit-button.c-button--disabled,
.c-permission__actions .c-permission__edit-button .c-button--disabled .c-button__link {
  background-color: #ffffff !important;
}

/** gas */
.c-order-list--service-provider .c-order-list__connection-type-icon--gas::after,
.c-order-list--installer .c-order-list__connection-type-icon--gas::after {
  background-color: var(--brand-primary);
}

/** water */
.c-order-list--service-provider .c-order-list__connection-type-icon--water::after,
.c-order-list--installer .c-order-list__connection-type-icon--water::after {
  background-color: var(--brand-primary);
}

/** water */
.c-order-list--service-provider .c-order-list__connection-type-icon--waste-water::after,
.c-order-list--installer .c-order-list__connection-type-icon--waste-water::after {
  background-color: var(--brand-primary);
}

/** water */
.c-order-list--service-provider .c-order-list__connection-type-icon--electricity::after,
.c-order-list--installer .c-order-list__connection-type-icon--electricity::after {
  background-color: var(--brand-primary);
}

/** water */
.c-order-list--service-provider .c-order-list__connection-type-icon--broadband::after,
.c-order-list--installer .c-order-list__connection-type-icon--broadband::after {
  background-color: var(--brand-primary);
}

/** district heat */
.c-order-list--service-provider .c-order-list__connection-type-icon--district-heat::after,
.c-order-list--installer .c-order-list__connection-type-icon--district-heat::after {
  background-color: var(--brand-primary);
}

.c-order-list__item-no-data {
  background-color: #ffffff;
}

/** installer step */

.c-step--compact .c-step__badge:before {
  background-color: var(--brand-primary);
}

/** permission */

.c-permission--yellow .c-permission__badge {
  background-color: #f6a600;
}