// ===================================
//             Messages
// ===================================




.message {
  position:relative;
  word-wrap:break-word;
  padding:0.25em 1em;
  background:$button-color;
  border:1px solid $button-active;
  color:$button-text;
  font-weight:bold;
  text-decoration:none;
  @include rounded($radius);
  &.small {
    font-size:0.8em;
  }
  &.large {
    font-size:1.5em;
  }
  &.info {
    background-color:$info-background;
    color:$info-color;
    border-color:$info-border;
  }
  &.alert {
    background-color:$alert-background;
    color:$alert-color;
    border-color:$alert-border;
  }
  &.warning {
    background:$warning-background;
    color:$warning-color;
    border-color:$warning-border;
  }
  &.error {
    background:$error-background;
    color:$error-color;
    border-color:$error-border;
  }
  &.success {
    background:$success-background;
    color:$success-color;
    border-color:$success-border;
  }
  &.square {
    @include rounded(0);
  }
  &.round {
    @include rounded(9999px);
  }
  &.dismissible {
    padding-right:3em;
    &:after {
      content:'X';
      display:block;
      padding:0.5em 0;
      font-size:0.8em;
      text-align:center;
      position:absolute;
      top:0;
      right:1em;
      line-height:1.5;
    }
  }
}