.lbaic-settings-notice {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 16px;
  border: 1px solid var(--lbaic-settings-notice-border-color, var(--lbaic-settings-notice-color));
  border-radius: var(--lbaic-settings-notice-border-radius, 6px);
  background-color: var(--lbaic-settings-notice-bg);

  &-in {
    display: flex;
    margin-block-end: auto;
  }

  .lbaic-settings-button {
    padding-block: 6px;
    padding-inline: 12px;
    border: 1px solid var(--lbaic-settings-notice-color);
    border-radius: var(--lbaic-settings-notice-button-border-radius, 6px);
    color: var(--lbaic-settings-notice-color);
    background-color: var(--lbaic-settings-white);

    &:before, &:after {
      display: none;
    }

    &-label {
      font-size: var(--lbaic-settings-fs-13);
      line-height: var(--lbaic-settings-lh-16);
    }

    &:hover {
      color: var(--lbaic-settings-white);
      background-color: var(--lbaic-settings-notice-color);
    }
  }

  &-i {
    width: 20px;
    height: auto;
    flex: 0 0 20px;
    display: block;
    margin-inline-end: 16px;
    fill: var(--lbaic-settings-notice-color);
  }

  &-title {
    font-size: var(--lbaic-settings-fs-13);
    line-height: var(--lbaic-settings-lh-20);
    color: var(--lbaic-settings-notice-color);

    &:not(:last-child) {
      margin-block-end: 4px;
    }
  }

  &-desc {
    font-size: var(--lbaic-settings-fs-12);
    line-height: var(--lbaic-settings-lh-20);
    color: var(--lbaic-settings-notice-color);

    &:not(:last-child) {
      margin-block-end: 8px;
    }
  }

  &-action {
    display: flex;
    margin-inline-start: auto;

    &-in {
      width: 10px;
      height: 10px;
      flex: 0 0 10px;
      fill: var(--lbaic-settings-notice-color);
    }
  }

  &.default {
    --lbaic-settings-notice-color: var(--lbaic-settings-notice-default-color);
    --lbaic-settings-notice-bg: var(--lbaic-settings-notice-default-bg);
  }

  &.error {
    --lbaic-settings-notice-color: var(--lbaic-settings-notice-error-color);
    --lbaic-settings-notice-bg: var(--lbaic-settings-notice-error-bg);
  }

  &.warning {
    --lbaic-settings-notice-color: var(--lbaic-settings-notice-warning-color);
    --lbaic-settings-notice-bg: var(--lbaic-settings-notice-warning-bg);
  }

  &.success {
    --lbaic-settings-notice-color: var(--lbaic-settings-notice-success-color);
    --lbaic-settings-notice-bg: var(--lbaic-settings-notice-success-bg);
  }

  &-close {
    width: 20px;
    height: auto;
    flex: 0 0 20px;
    display: block;
  }

  &-code-copy {
    width: 12px;
    height: 12px;

    &-i {
      color: var(--lbaic-settings-notice-color);
      fill: var(--lbaic-settings-notice-color);
      stroke: var(--lbaic-settings-notice-color);
    }
  }
}