.rules-form {
  margin: 30px;
  max-width: 850px;
}

.rules-form .new-rule-header-container {
  margin-bottom: 30px;
}

.rules-form .new-rule-header-container .new-rule-title {
  font-weight: 200;
  font-size: 24px;
  margin-bottom: 20px;
}

.rules-form .new-rule-header-container .new-rule-title i {
  font-size: 24px;
  margin-right: 10px;
}

.rules-form .new-rule-header-container .new-rule-subtext-link {
  margin-left: 3px;
}

.rules-form .new-rule-header-container .new-rule-subtext-link:after {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
}

.rules-form .rule-form-section-header-container {
  margin: 40px 0 30px 0;
}

.rules-form .rule-form-section-header-container .rule-form-section-header {
  font-weight: 400;
  font-size: 18px;
  margin-right: 4px;
}

.rules-form .rule-form-section-header-container i {
  vertical-align: 1px;
}

.rules-form .button-container {
  margin-top: 50px;
}

.rules-form .button-container .primary-button {
  margin-right: 10px;
}

.rules-form .rule-name-container {
  height: 32px;
  width: 100%;
  display: flex;
}

.rules-form .rule-name-container .rule-name-input {
  height: 32px;
  max-width: 320px;
  min-width: 320px;
}

.rules-form .rule-name-container .rule-name-input .name-text-field input {
  padding: 0 12px 0 12px;
}

.rules-form .rule-name-container .rule-name-input .name-text-field div:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.rules-form .rule-name-container .rule-name-input-label {
  line-height: 32px;
  margin-right: 10px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-weight: bold;
  min-width: 50px;
}

.rules-form .rule-form-editor-row {
  height: 32px;
  margin-bottom: 25px;
  width: 100%;
  display: flex;
}

.rules-form .rule-form-editor-row .rules-form-input-label {
  line-height: 32px;
  margin-right: 10px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-weight: bold;
  min-width: 50px;
}

.rules-form .rule-form-editor-row .rules-form-input-label.rules-form-middle-string {
  text-align: center;
  margin-left: 10px;
}

.rules-form .rule-form-editor-row .rule-form-editor-remove-row {
  width: 40px;
}

.rules-form .rule-form-editor-row .rule-form-editor-remove-row .ms-Button {
  height: 32px;
}

.rules-form .rule-form-editor-row .rule-form-editor-input {
  height: 32px;
  max-width: 320px;
  min-width: 320px;
}

.rules-form .rule-form-editor-row .rule-form-editor-input .ms-Dropdown:focus {
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.rules-form .rule-form-editor-row .rule-form-editor-input input.disabled {
  background-color: #f4f4f4;
  border-color: #f4f4f4;
  padding-left: 12px;
}

.rules-form .rule-form-editor-row .rule-form-editor-input .field-drop-down .input-text-box input {
  padding: 0 12px 0 12px;
}

.rules-form .rule-form-editor-row .rule-form-editor-input .field-drop-down .input-text-box:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.rules-form .rule-form-editor-row .rule-form-editor-input .identity-picker-resolved.identity-picker-resolved-single-bg:focus {
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  border: 1px solid rgba(0, 120, 212, 1);
  border: 1px solid var(--communication-background,rgba(0, 120, 212, 1));
  padding: 0px;
}

.rules-form .rule-form-editor-row .rule-form-editor-input .value-input input {
  padding: 0 12px 0 12px;
}

.rules-form .rule-form-editor-row .rule-form-editor-input .value-input div:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.rules-form .rule-form-editor-row .rule-form-editor-input .value-input.is-disabled input {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.rules-form .rule-form-editor-row .rule-form-editor-input .value-input.is-disabled div:hover {
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.rules-form .rule-form-editor-row .rule-form-editor-input .rules-identity-search:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.rules-form .rule-form-editor-row .rule-form-editor-two-input-container {
  margin-left: 30px;
  display: flex;
  height: 32px;
}

.rules-form .rule-form-editor-row .rule-form-editor-two-input-container .rule-form-editor-input {
  max-width: 200px;
  min-width: 200px;
}

.rule-icon-placeholder {
  width: 20px;
}
