@import url("https://fonts.googleapis.com/css2?family=Gabriela&display=swap");

#didomi-host .didomi-popup-notice-buttons {
  display: grid !important;
  grid-template-columns: auto auto !important;
  grid-template-rows: auto auto !important;
  gap: 12px;
  grid-template-areas:
    "learn-more learn-more"
    "disagree dismiss";
}
#didomi-host .didomi-learn-more-button {
  all: unset;
  grid-area: learn-more;
  display: inline !important;
  cursor: pointer;
  color: #3c7a90;
  text-decoration: underline;
  font-size: inherit;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-width: unset !important;
  width: auto !important;
  color: #3c7a90;
}
#didomi-host .didomi-popup-notice .didomi-popup-notice-buttons .didomi-button {
  min-height: auto !important;
}
#didomi-host .didomi-disagree-button,
.didomi-dismiss-button {
  font-family: Gabriela, serif;
  font-weight: 400;
  font-size: 14px;
  padding: 6px 20px;
  white-space: nowrap;
  width: auto;
  min-width: 128px;
  border-radius: 27px !important;
}

#didomi-host .didomi-disagree-button {
  grid-area: disagree;
  border-image: url(./page/common/images/didomi/orange-btn.png) !important;
  border-image-width: 28px !important;
  border-image-repeat: stretch repeat !important;
  border-image-slice: 28 fill !important;
  background-color: transparent !important;
}

#didomi-host .didomi-dismiss-button {
  grid-area: dismiss;
  border-image: url(./page/common/images/didomi/green-btn.png) !important;
  border-image-width: 28px !important;
  border-image-repeat: stretch repeat !important;
  border-image-slice: 28 fill !important;
  background-color: transparent !important;
}

#didomi-host .didomi-disagree-button:hover,
.didomi-dismiss-button:hover {
  transition: ease-in 0.2s opacity;
}

#didomi-host .didomi-disagree-button:active,
#didomi-host .didomi-dismiss-button:active {
  transform: scale(0.96);
  filter: brightness(0.9);
  transition:
    transform 0.08s,
    filter 0.08s;
}

#didomi-host .didomi-components-button {
  font-weight: 400 !important;
}

#didomi-host .didomi-popup-backdrop {
  position: relative;
  background-image: url("./page/common/images/didomi/bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  &:before {
    content: "";
    left: 0;
    top: calc(50% - 300px);
    height: 100vh;
    position: fixed;
    width: 436px;
    background-image: url("./page/common/images/didomi/hat-man.png");
    background-repeat: no-repeat;
  }
}

#didomi-host .didomi-popup-container {
  border: 9px solid transparent;
  border-image: url("./page/common/images/didomi/game-frame.png");
  border-image-width: 28px;
  border-image-repeat: stretch repeat;
  border-image-slice: 28 fill;
}

#didomi-host .didomi-popup-notice-text-container {
  color: #594f50;
}

#didomi-host .didomi-notice-data-processing-container .didomi-notice-data-processing-list,
.didomi-notice-data-processing-title {
  color: #594f50 !important;
}
.didomi-notice-custom-title {
  text-align: center;
  position: relative;
  margin-bottom: 26px !important;
}
.didomi-notice-custom-title:after {
  content: "";
  position: absolute;
  bottom: -18px;
  left: calc(50% - 75px);
  background-image: url("./page/common/layout/monogram.png");
  width: 150px;
  height: 10px;
  background-size: contain;
  background-repeat: no-repeat;
}

#didomi-host .didomi-popup-notice .didomi-popup-notice-buttons {
  margin-top: 12px !important;
}
