/***** Blacklsit Controls *****/
.blacklist-controls {
    display: block;
    margin-bottom: 40px;
}

.blacklist-controls .field-container {
    display: block;
    margin-bottom: 20px;
}

.blacklist-controls .field-container .desc {
    margin: 0;
    font-weight: normal;
}

.blacklist-controls .field-container label {
    margin-bottom: 6px;
    line-height: 1;
}

.blacklist-controls .field-container label[ for = 'wwlc_cf_enabled_field' ],
.blacklist-controls .field-container label[ for = 'wwlc_cf_required_field' ] {
    display: inline-block;
    width: 76px;
}

.blacklist-controls .field-container #wwlc_cf_field_type {
    display: inline-block;
    width: 180px;
}

.blacklist-controls .field-container.text-field-container label {
    display: block;
}

.blacklist-controls .field-container.select-field-container label {
    display: block;
}

.blacklist-controls .field-container.number-field-container input[ type = 'number' ] {
    width: 100px;
    display: inline-block;
}

.blacklist-controls .attributes-container {

}

.blacklist-controls .attributes-container.numeric-field-attributes-container {
    display: none;
}

.blacklist-controls .attributes-container.numeric-field-attributes-container div {
    margin-bottom: 10px;
}

.blacklist-controls .attributes-container.numeric-field-attributes-container label {
    display: inline-block;
    width: 75px;
}

.blacklist-controls .attributes-container.numeric-field-attributes-container input[ type = "number" ] {
    display: inline-block;
    width: 100px;
}

.blacklist-controls .options-container {

}

.blacklist-controls .options-container.select-field-options-container,
.blacklist-controls .options-container.radio-field-options-container,
.blacklist-controls .options-container.checkbox-field-options-container {
    display: none;
}

.blacklist-controls .options-container.radio-field-options-container strong,
.blacklist-controls .options-container.checkbox-field-options-container strong,
.blacklist-controls .options-container.select-field-options-container strong {
    font-size: 1.2em;
    margin-bottom: 6px;
    display: inline-block;
}

.blacklist-controls .options-container.radio-field-options-container .options-list,
.blacklist-controls .options-container.checkbox-field-options-container .options-list,
.blacklist-controls .options-container.select-field-options-container .options-list {
    max-height: 200px;
    overflow-y: scroll;
    width: 400px;
    background-color: #dfdfdf;
    padding: 10px;
    margin-top: 0;
}

.blacklist-controls .options-container.radio-field-options-container .options-list label,
.blacklist-controls .options-container.checkbox-field-options-container .options-list label,
.blacklist-controls .options-container.select-field-options-container .options-list label {
    display: inline-block;
    width: 130px;
    margin-right: 10px;
}

.blacklist-controls .options-container.radio-field-options-container .options-list input[ type = 'text' ],
.blacklist-controls .options-container.checkbox-field-options-container .options-list input[ type = 'text' ],
.blacklist-controls .options-container.select-field-options-container .options-list input[ type = 'text' ] {
    display: inline-block;
    width: 140px;
    margin-top: 0;
}

.blacklist-controls .options-container.radio-field-options-container .options-list .dashicons,
.blacklist-controls .options-container.checkbox-field-options-container .options-list .dashicons,
.blacklist-controls .options-container.select-field-options-container .options-list .dashicons {
    margin-top: 6px;
    cursor: pointer;
}

.blacklist-controls .options-container.radio-field-options-container .options-list .dashicons.add,
.blacklist-controls .options-container.checkbox-field-options-container .options-list .dashicons.add,
.blacklist-controls .options-container.select-field-options-container .options-list .dashicons.add {
    color: green;
    margin-right: 5px;
}

.blacklist-controls .options-container.radio-field-options-container .options-list .dashicons.remove,
.blacklist-controls .options-container.checkbox-field-options-container .options-list .dashicons.remove,
.blacklist-controls .options-container.select-field-options-container .options-list .dashicons.remove {
    color: red;
}

/***** Button Controls *****/
.button-controls {
    display: block;
    display: block;
    margin-bottom: 40px;
}

.button-controls .button {
    float: left;
    margin-right: 8px;
}

.button-controls.add-mode #cancel-edit-custom-field {
    display: none;
}

.button-controls.add-mode #save-custom-field {
    display: none;
}

.button-controls.add-mode #add-custom-field {
    display: inline-block;
}

.button-controls.edit-mode #cancel-edit-custom-field {
    display: inline-block;
}

.button-controls.edit-mode #save-custom-field {
    display: inline-block;
}

.button-controls.edit-mode #add-custom-field {
    display: none;
}

.button-controls .spinner {
    display: none;
    float: left;
    visibility: visible;
    margin-left: 0;
}

.button-controls.processing .spinner {
    display: inline-block;
}

#err-blacklist-emails-table thead tr th,
#err-blacklist-emails-table tfoot tr th {
    padding: 15px 10px;
}

#err-blacklist-emails-table tbody tr.edited {
    background-color: #fff2d8 !important;
}

#err-blacklist-emails-table tbody tr td.controls .dashicons {
    font-size: 24px;
    display: inline-block;
    cursor: pointer;
}

#err-blacklist-emails-table tbody tr td.controls .edit {
    color: green;
    margin-right: 15px;
}

#err-blacklist-emails-table tbody tr td.controls .delete {
    color: red;
}