systelab-wizard-steps {
  $button-width: 45px;
  $button-height: 45px;

  .slab-steps-wizard {
    display: table;
    width: 100%;
    position: relative;

    .slab-step {
      display: flex;
      flex-direction: column;
      flex: 1;
      text-align: center;

      .slab-step-text {
        margin-top: 10px;
        margin-bottom: 2px;
      }

      .slab-step-optional-text {
        color: $secondary;
      }

      .slab-step-button-container {
        display: flex;

        .step-line {
          border-bottom: 1px solid #ccc;
          height: 20px;
          flex: 1;

          &.slab-step-visited {
            border-bottom: 1px solid $primary;
          }
          &.slab-step-first {
            border-bottom: 1px solid transparent;
          }
          &.slab-step-last {
            border-bottom: 1px solid transparent;
          }

        }

        .step-line-left {
          margin-right: 5px;
        }

        .step-line-right {
          margin-left: 5px;
        }

        button {
          width: $button-width;
          height: $button-height;
          text-align: center;
          padding: 6px 0;
          font-size: 15px;
          line-height: 1.428571429;
          border-radius: 3px;
        }

        button[disabled] {
          opacity: 1 !important;
          filter: alpha(opacity=100) !important;
        }
      }
    }

    .slab-row {
      display: flex;
    }

    .slab-step-round {
      border-radius: 50% !important;
    }
  }
}