/* Hide the banner entirely when not needed. */
.wildfire-cookies-banner-hidden .cookiesjsr-banner {
  display: none;
}

/* Remove UPPERCASE buttons labels. */
.cookiesjsr-btn,
.cookiesjsr-layer--title {
  text-transform: none;
}

/* Remove excessive animation on cookie buttons. */
.cookiesjsr-btn:hover,
.cookies-fallback--btn:hover {
  transform: unset;
}

/* Animate the banner. */
@keyframes slideUp {
  0% {
    transform: translateY(100%);
  }
  100% {
    transform: translateX(0);
  }
}
.cookiesjsr-banner {
  animation: 1s ease-out 0s 1 slideUp;
  /* The built-in slide up effect usually doesn't work. But when it does, it
  looks jerky because our custom slide up animation is playing at the same time.
  Disable the unreliable built-in effect so ours always looks good. */
  transition: none;
}

/* Fix cookie settings dialog layout in RTL */
@media (min-width: 768px) {
  .cookiesjsr-service-group--tab {
    padding-left: 1.25em;
    padding-right: 1.25em;
    width: 30%;
  }
  [dir=rtl] .cookiesjsr-service-group--content {
    right: unset;
    left: 0;
  }
}
/* Fix link separator position in banner in RTL */
[dir=rtl] .cookiesjsr-links.links--row li:first-child:before {
  content: "";
}
[dir=rtl] .cookiesjsr-links.links--row li:last-child:before {
  content: none;
}

/* Reverse the button order so Agree is first. */
.cookiesjsr-banner--action {
  flex-direction: row-reverse;
}

/* Restore cookie settings dialog text colors that were changed by our themes. */
.region-footer .cookiesjsr-layer--footer div {
  color: #333;
}
.region-footer .cookiesjsr-service--always-on span {
  color: #0a0;
}
.region-content div.cookies-fallback div,
.region-content div.cookies-fallback a {
  color: #333;
}
.region-content div.cookies-fallback button {
  text-transform: none;
}

/* Style banner to stand out from content*/
#cookiesjsr .cookiesjsr-layer--actions .denyAll,
#cookiesjsr .cookiesjsr-banner--action button.denyAll {
  background-color: #ccc;
  color: rgba(55,55,55,0.75);
}
#cookiesjsr .cookiesjsr--app .cookiesjsr-banner {
  background-color: rgba(0,0,0,0.5);
  backdrop-filter: blur(4px);
}
.cookiesjsr-banner--text {
  color: #fff;
}
#cookiesjsr .cookiesjsr-banner--info .cookiesjsr-banner--links a {
  color: #fff;
}

/* Make cookie button width match other buttons */
.cookiesjsr-btn {
  width: unset;
}
.cookiesjsr-layer--actions {
  justify-contents: flex-end;
}

/* Make the iframe cookies placeholder match the selected block aspect ratio */
.block-inline-blockiframe .cookies-fallback--wrap {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* Set the background for remote video and iframe. */
.block-inline-blockremote-video div.cookies-fallback--wrap,
.block-inline-blockgoogle-map .cookies-fallback--wrap,
.block-inline-blockiframe .cookies-fallback--wrap,
.block-inline-blocksocial-media-post .cookies-fallback--wrap {
  background: none;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.block-inline-blockgoogle-map .cookies-fallback--wrap {
  background-image: url('../images/googlemap.jpg');
}
.block-inline-blockiframe .cookies-fallback--wrap,
.block-inline-blocksocial-media-post .cookies-fallback--wrap {
  background-image: url('../images/iframe.jpg');
}
.block-inline-blocksocial-media-post .cookies-fallback--wrap {
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}
.cookies-fallback {
  background: none;
}
.cookies-fallback--video--overlay,
.cookies-fallback--iframe--overlay,
.cookies-fallback--social_media--overlay {
  background: #ffffff99;
  backdrop-filter: blur(4px);
  border: none;
}

/* Cookies module adds a block at the bottom of pages for the cookie settings ui
popup form. Drupal adds a contextual link button to this (and every) block,
which only admins see, but it adds a odd-looking gap at the bottom of every
page. Hide the button as we don't use contextual links on blocks anyway. */
.block-cookies-ui-block .contextual button.trigger {
  display: none;
}