:root{
  --dci-notice-icon-color:#329eed;
  --dci-notice-icon-font-size:52px;
  --dci-notice-color1:#08AEEC;
  --dci-notice-color2:#2499e2;

  --dci-notice-hover-color1:#2fcfe2;
  --dci-notice-hover-color2:#08AEEC;

  --dci-skip-color:#e0f5ff;
  --dci-skip-hover-color:#d9f1fd;

}
#{$prefix}-global-notice {


  &#{$prefix}-notice-data {
    #{$prefix}-notice-content {
      h3 {
        > i {
          font-size: var(--dci-notice-icon-font-size,12px);
          color: var(--dci-notice-icon-color);
          margin-top: -15px;
          display: inline-block;
        }
      }
    }
    .custom-msg{
      font-size: 1.2em;
    }
    border-left-color: var( --dci-notice-color1);

    #{$prefix}-button-allow {
      background: linear-gradient(313deg, var( --dci-notice-color1), var( --dci-notice-color2) 100%);

      &:hover {
        --dci-notice-color1: var(--dci-notice-hover-color1);
        --dci-notice-color2: var(--dci-notice-hover-color2);
      }
    }

    #{$prefix}-button-skip {
      background-color: var(--dci-skip-color);

      &:hover {
        background-color: var(--dci-skip-hover-color);
      }
    }
  }
}