/**
 * caret
 */

.caret {
  .icon-xt(@content: @icon-xt-chevron-down, @size: @icon-small);
  &:after {
    .icon-right();
  }
  // activation
  &.in {
    .icon-xt(@content: @icon-xt-chevron-up, @size: @icon-small);
    &:after {
      .anim-y-inverse.in();
    }
  }
  &.out {
    &:after {
      .anim-y.in();
    }
  }
  // inverse
  &.caret-inverse {
    .icon-xt(@content: @icon-xt-chevron-up, @size: @icon-small);
    &.in {
      .icon-xt(@content: @icon-xt-chevron-down, @size: @icon-small);
      &:after {
        .anim-y.in();
      }
    }
    &.out {
      &:after {
        .anim-y-inverse.in();
      }
    }
  }
  // horizontal
  &.caret-horizontal {
    .icon-xt(@content: @icon-xt-chevron-right, @size: @icon-small);
    &.in {
      .icon-xt(@content: @icon-xt-chevron-left, @size: @icon-small);
      &:after {
        .anim-x-inverse.in();
      }
    }
    &.out {
      &:after {
        .anim-x.in();
      }
    }
    // inverse
    &.caret-inverse {
      .icon-xt(@content: @icon-xt-chevron-left, @size: @icon-small, @position: before);
      &:after {
        content: '';
      }
      &:before {
        .icon-left();
      }
      &.in {
        .icon-xt(@content: @icon-xt-chevron-right, @size: @icon-small, @position: before);
        &:before {
          .anim-x.in();
        }
      }
      &.out {
        &:before {
          .anim-x-inverse.in();
        }
      }
    }
  }
}