boxMenuItem.less

.boxmenu-item {
  display: flex;
  
  &__inner {
    width: 100%;
    margin: 0 @menu-item-padding-hoz @menu-item-padding-ver;
    padding: @menu-item-inner-padding-ver @menu-item-inner-padding-hoz;
    background-color: @menu-item;
    color: @menu-item-inverted;
    border: 1px solid @menu-item-border-color;
    border-radius: @item-border-radius;
  }

  &__image-container {
    margin-bottom: @menu-item-image-margin;
  }

  &__title {
    margin-bottom: @menu-item-title-margin;
    .menu-item-title;
  }

  &__body {
    margin-bottom: @menu-item-body-margin;
    .menu-item-body;
  }

  &__body a {
    .link-text;
  }

  &__duration {
    margin-bottom: @menu-item-duration-margin;
    .menu-item-body;
  }

  &__progress {
    margin-bottom: @menu-item-progress-margin;
  }

  &__button-container {
    display: flex;
    align-items: center;
  }

  &__button {
    background-color: @menu-item-btn-color;
    color: @menu-item-btn-color-inverted;

    .no-touch &:not(.is-disabled):not(.is-locked):hover {
      background-color: @menu-item-btn-color-hover;
      color: @menu-item-btn-color-inverted-hover;
      .transition(background-color @duration ease-in, color @duration ease-in;);
    }
  }

  &__button.is-locked,
  &__button.is-disabled {
    background-color: @disabled;
    color: @disabled-inverted;
  }

  &__status {
    margin-left: @menu-item-status-margin;
  }

  &.has-img-zoom &__image-container {
    .img-zoom();
  }
}