@import '../../mixins';

.commit-warning-component {
  flex-direction: column;
  flex-shrink: 0;
  margin-top: var(--spacing-half);

  display: flex;
  background-color: var(--box-alt-background-color);

  .warning-message {
    margin-bottom: 0;
    text-align: center;
    color: var(--text-secondary-color);

    strong {
      color: var(--text-color);
      word-wrap: break-word;
    }
  }

  .warning-icon-container {
    height: 20px;
    position: relative;
    text-align: center;

    .warning-icon,
    .information-icon,
    .error-icon {
      color: var(--commit-message-icon-error-color);

      &.information-icon {
        color: var(--dialog-information-color);
      }

      &.warning-icon {
        color: var(--commit-message-icon-warning-color);
      }

      background: var(--box-alt-background-color);
      border-width: 0 var(--spacing-half);
      border: solid transparent;
      box-sizing: content-box;
      position: relative;
      z-index: 1;
    }

    &:after {
      display: block;
      border-bottom: var(--base-border);
      content: '';
      position: absolute;
      z-index: 0;
      display: block;
      width: 100%;
      top: var(--spacing);
    }
  }
}
