/** Anpassungen Layout für Contrib Modul Cookies */

/* ein paar eigene störende Design-Angaben zurückdrehen */
.toolbar-tray-open.toolbar-horizontal #cookiesjsr header {
  top: 0;
}
.footer-elementary-links #cookiesjsr a {
  color: inherit;
}
.footer #cookiesjsr {
  text-align: initial;
}
.footer #cookiesjsr ul {
  margin-bottom: 0;
}

#cookiesjsr {
  /*--default-margin: 1.25em;*/
  /*--font-size-reset: 1rem;*/
  --btn-font-color: #fff;
  --btn-border-color: #fff;
  --btn-bg-color: var(--blau);
  --btn-prime-font-color: var(--blau);
  --btn-prime-border-color: #fff;
  --btn-prime-bg-color: #fff;
  --btn-inv-font-color: var(--blau);
  --btn-inv-border-color: var(--blau);
  --btn-inv-bg-color: #fff;
  --btn-prime-inv-font-color: #fff;
  --btn-prime-inv-border-color: var(--blau);
  --btn-prime-inv-bg-color: var(--blau);
  --link-list-font-color: #fff;
  --link-list-separator-color: #fff;
  --banner-logo-offset: 100px;
  --banner-bg-color: var(--dunkelblau);
  --banner-font-color: #fff;
  --layer-header-height: 3.5em;
  --layer-header-bg-color: #f4f2f0;
  --layer-header-font-color: #000f37;
  --layer-body-bg-color: #f4f2f0;
  --layer-tab-bg-color: #f4f2f0;
  --layer-tab-font-color: black;
  --layer-tab-active-bg-color: white;
  --layer-tab-active-font-color: black;
  --layer-bg-dark: #444444;
  --layer-font-light: #444444;
  --layer-font-dark: black;
  --layer-border-color: #e4e5e6;
  --layer-footer-bg-color: #fff;
  --layer-footer-font-color: gray;
  /*--layer-footer-height: 4.5em;*/
  --switch-border-color: #e4e5e6;
  --switch-handle-color: #fff;
  --switch-bg-off: #fff;
  --switch-bg-on: #008332;
  /*--switch-width: 45px;*/
  /*--switch-height: 20px;*/
  --switch-always-on-font-color: #008332;
  --switch-always-on-bg-color: #fff;
}

#cookiesjsr .cookiesjsr-banner.active {
  box-shadow: 0 -1px 1rem rgba(255, 255, 255, 0.5);
}

/* im Desktop-Layout max. Breite im Banner festlegen */
@media (min-width: 768px) {
  #cookiesjsr .cookiesjsr-banner--info {
    max-width: 600px;
    margin-left: auto;
  }
  #cookiesjsr .cookiesjsr-banner--action {
    max-width: 600px;
    margin-right: auto;
  }
}

#cookiesjsr .cookiesjsr-service-group--tab {
  font-weight: normal;
}

#cookiesjsr .cookiesjsr-service a {
  color: var(--btn-prime-font-color);
}
#cookiesjsr .cookiesjsr-service a:hover {
  text-decoration: underline;
}

#cookiesjsr .cookiesjsr-layer button.cookiesjsr-btn {
  display: inherit;
  white-space: initial;
  line-height: 100%;
}

/* Knopf "Alle akzeptieren" optisch hervorheben */
#cookiesjsr .cookiesjsr-btn.cookiesjsr-settings,
#cookiesjsr .cookiesjsr-btn.save {
  background-color: var(--btn-inv-bg-color);
  color: var(--btn-prime-font-color);
}
#cookiesjsr .cookiesjsr-btn.allowAll,
#cookiesjsr .cookiesjsr-btn.allowAll {
  background-color: var(--btn-bg-color);
  font-weight: bold;
  color: var(--btn-font-color);
  order: -1;
}

#cookiesjsr .cookiesjsr-switch::after {
  background-color: var(--layer-header-bg-color);
  border-color: var(--btn-prime-font-color);
}

/* alle Gruppen nicht in Tabs, sondern direkt untereinander anzeigen */
#cookiesjsr .cookiesjsr-service-groups [hidden] {
  display: inherit !important;
}
#cookiesjsr .cookiesjsr-service-group--content {
  color: var(--layer-font-dark);
  background-color: #ffffff;
  width: 100%;
  position: inherit;
}
#cookiesjsr .cookiesjsr-service-group--tab {
  display: none;
}
#cookiesjsr .cookiesjsr-service-group--intro {
  padding-bottom: 0;
}


/* Fallback-Meldung bei Videos anders platzieren aufgrund von embed-responsive */
.cookies-fallback--wrap.disabled {
  position: unset;
  min-height: inherit
}
.cookies-fallback--btn {
  background-color: var(--blau);
}
a.cookies-fallback--link {
  color: var(--blau);
  font-size: inherit;
}
a.cookies-fallback--link:hover {
  text-decoration: unset;
}
.cookies-fallback--text {
  line-height: 120%;
}
.cookies-fallback--btn {
  margin: 0.5rem;
  min-height: 2rem;
}