/*---------------------------------------------------------------------------------------------
    Container
---------------------------------------------------------------------------------------------*/

#poststuff .cfs_input .inside {
    margin: 0;
    padding: 0;
}

.cfs_input .field {
    padding: 10px 12px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #dfdfdf;
}

.cfs_input .field:last-child {
    border-bottom: none;
}

.cfs_input .field input[type="text"],
.cfs_input .field textarea,
.cfs_input .field select {
    width: 99.8%;
}

.cfs_input .field label {
    font-weight: bold;
    padding: 0 0 0.4em 0;
    cursor: default;
    display: block;
}

.cfs_input .field p.notes {
    margin: 0 0 1em 0;
    color: #999;
    font-size:0.9em;
}

.cfs_input.no_box {
    background: none;
    border: none;
}

.cfs_input.no_box .hndle,
.cfs_input.no_box .handlediv {
    display: none;
}

.cfs_input.no_box .field {
    padding: 10px 0;
    border: none;
}

.cfs_input .error {
    padding: 7px 10px;
    margin: 5px 0;
    background: #ffebe8;
    border: 1px solid #dcc6d7;
    border-left: 4px solid #dc3232;
    font-weight: bold;
}

.hidden {
    display: none;
}

/*---------------------------------------------------------------------------------------------
    Select
---------------------------------------------------------------------------------------------*/

.cfs_select select {
    line-height:1;
    height:auto;
}

.cfs_select select.multiple {
    height: 100px !important;
}

.cfs_select .select2 {
    width: 99.95%;
}

/*---------------------------------------------------------------------------------------------
    True / false
---------------------------------------------------------------------------------------------*/

.cfs_input .field .cfs_true_false label {
    font-weight: normal;
}

/*---------------------------------------------------------------------------------------------
    Date
---------------------------------------------------------------------------------------------*/

.cfs_input .cfs_date input.date {
    width: 160px;
    background: #fff url(../images/icon-calendar.png) right 4px center no-repeat;
}


/*---------------------------------------------------------------------------------------------
    Color
---------------------------------------------------------------------------------------------*/

.cfs_input .cfs_color input.color {
    width: 120px;
}

/*---------------------------------------------------------------------------------------------
    Wysiwyg
---------------------------------------------------------------------------------------------*/

.cfs_wysiwyg table.mceLayout {
    background: #fff;
}

.cfs_wysiwyg textarea {
    height: 200px;
}

.cfs_wysiwyg .wp-media-buttons {
    padding: 5px 0;
}

/*---------------------------------------------------------------------------------------------
    File
---------------------------------------------------------------------------------------------*/

.cfs_file .file_url img {
    padding: 5px;
    background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAIUlEQVQYV2NkYGCQBGJ08BxdgHGIKMTiF0wPgjwz2BUCADTeBYguWvyCAAAAAElFTkSuQmCC);
    vertical-align: bottom;
    box-shadow: 0 1px 2px #ddd;
    max-width: 50%;
    height: auto;
}

.cfs_file .media.button.hidden {
    display: none;
}

/*---------------------------------------------------------------------------------------------
    Relationship, User
---------------------------------------------------------------------------------------------*/

.cfs_relationship .post_list,
.cfs_term .post_list,
.cfs_user .post_list {
    float: left;
    overflow-y: scroll;
    background: #f5f5f5;
    border: 1px solid #dfdfdf;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    height: 205px;
    width: 49%;
    -webkit-border-radius: 1px 1px 1px 1px;
    border-radius: 1px 1px 1px 1px;
}

.cfs_relationship .post_list.selected_posts,
.cfs_term .post_list.selected_posts,
.cfs_user .post_list.selected_posts {
    float: right;
}

.cfs_relationship .post_list div,
.cfs_term .post_list div,
.cfs_user .post_list div {
    padding: 4px 6px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
}

.cfs_relationship .post_list.available_posts > div,
.cfs_term .post_list.available_posts > div,
.cfs_user .post_list.available_posts > div {
    position: relative;
    padding-right: 3em;
}

.cfs_relationship .post_list.available_posts > div:after,
.cfs_term .post_list.available_posts > div:after,
.cfs_user .post_list.available_posts > div:after {
    position: absolute;
    right: 1px;
    top: 3px;
    content: '\f139';
    font-size: 19px;
}

.cfs_relationship .post_list div:last-child,
.cfs_term .post_list div:last-child,
.cfs_user .post_list div:last-child {
    border-bottom: none;
}

.cfs_relationship .post_list div:hover,
.cfs_term .post_list div:hover,
.cfs_user .post_list div:hover {
    background: #eee;
}

.cfs_relationship .available_posts div.used,
.cfs_term .available_posts div.used,
.cfs_user .available_posts div.used{
    display: none;
}

.cfs_relationship .selected_posts div,
.cfs_term .selected_posts div,
.cfs_user .selected_posts div {
    cursor: move;
}

.cfs_relationship .selected_posts div span.remove,
.cfs_term .selected_posts div span.remove,
.cfs_user .selected_posts div span.remove {
    float: right;
    width: 20px;
    height: 16px;
    cursor: pointer;
}

.cfs_relationship .filter_posts,
.cfs_term .filter_posts,
.cfs_user .filter_posts {
    margin-bottom: 10px;
}

.cfs_input .field .cfs_relationship .cfs_filter_input,
.cfs_input .field .cfs_term .cfs_filter_input,
.cfs_input .field .cfs_user .cfs_filter_input{
    width: 220px;
    margin: 0;
}

.cfs_relationship .cfs_filter_help,
.cfs_term .cfs_filter_help,
.cfs_user .cfs_filter_help {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-top: 4px;
    vertical-align: top;
}

.cfs_relationship .cfs_filter_help:before,
.cfs_term .cfs_filter_help:before,
.cfs_user .cfs_filter_help:before {
    content: '\f348';
}


/*---------------------------------------------------------------------------------------------
    Loop
---------------------------------------------------------------------------------------------*/

.cfs_delete_field {
    float: right;
    width: 21px;
    height: 18px;
    text-decoration: none;
    margin-right: -1px;
}

.cfs_toggle_field {
    float: right;
    width: 21px;
    height: 18px;
    text-decoration: none;
}

.cfs_toggle_field:before {
    content: '\f140';
    position: relative;
    top: -1px;
}

.open .cfs_toggle_field:before {
    content: '\f142';
}

.cfs_insert_field {
    float: right;
    width: 21px;
    height: 18px;
    text-decoration: none;
}

.loop_wrapper:hover .cfs_insert_field:before {
    content: '\f132';
    position: relative;
    top: 0px;
}

.cfs_input .cfs_loop label {
    padding: 6px 0 0 0;
}

.cfs_input .cfs_loop .field {
    border: none;
    padding: 6px 0;
}

.cfs_input .cfs_loop_toggle {
    float: right;
    width: 20px;
    height: 20px;
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    border-radius: 50%;
}

.cfs_input .cfs_loop_toggle:before {
    content: '\f177';
}

.cfs_loop .loop_wrapper {
    border: 1px solid #dfdfdf;
    border-radius: 1px;
    margin-bottom: 10px;
}

@keyframes highlight {
    0% {
        box-shadow: 0 0 5px 1px rgba(255,255,0,0.8);
    }

    100% {
        box-shadow: 0 0 5px 1px rgba(255,255,0,0);
    }
}

.cfs_loop .loop_wrapper_new {
    animation: highlight 1.5s ease-in-out;
}

.cfs_loop .cfs_loop_head {
    cursor: pointer;
    padding: 5px 5px 5px 30px;
    position: relative;
    background: #f5f5f5;
}

.cfs_loop .cfs_loop_head:before {
    padding: 4px 0;
    display: block;
    position: absolute;
    left: 5px;
    top: 0;
    color: #adadad;
    content: '\f333';
    cursor: move;
}

.cfs_loop .cfs_loop_head:after {
    content: "";
    display: block;
    clear: both;
}

.cfs_loop .notes {
    font-size: 11px;
    font-style: italic;
    color: #999;
    margin-bottom: 1.4em;
}

.cfs_loop .cfs_loop_body {
    padding: 10px 12px;
    background: #f8f8f8;
    display: none;
}

.cfs_loop .cfs_loop_body.open {
    display: block;
    background: #fbfbfb;
    border-top: 1px solid #dfdfdf;
}

.cfs_loop .cfs_loop_body > label:first-of-type {
    padding-top: 0;
}

.cfs_loop .cfs_loop_body > .field {
    padding: 0 0 10px;
}

/*---------------------------------------------------------------------------------------------
    Tabs
---------------------------------------------------------------------------------------------*/

.cfs-tabs {
    display: block;
    border-bottom: 1px solid #ccc;
    background: #FAFAFA;
    margin: 0 0 5px;
    padding-top: 10px;
}

.cfs-tab {
    position: relative;
    display: inline-block;
    padding: 5px 15px;
    margin-left: 12px;
    margin-bottom: -1px;
    border: 1px solid #ccc;
    background-color: #f3f3f3;
    cursor: pointer;
    border-radius: 2px 1px 0 0;
}

.cfs-tab.active {
    background-color: #fff;
}

.cfs-tab.active:after {
    content: '';
    position: absolute;
    right: 0;
    bottom: -2px;
    left: 0;
    border-bottom: 4px solid #fff;
}

.cfs-tab-content {
    display: none;
}

.cfs-tab-content.active {
    display: block;
}

.cfs-tab-notes {
    padding: 10px 12px;
}

/*---------------------------------------------------------------------------------------------
    Icons
---------------------------------------------------------------------------------------------*/

.cfs_input .cfs_loop_toggle,
.cfs_input .cfs_toggle_field,
.cfs_input .cfs_delete_field,
.cfs_input .cfs_insert_field,
.cfs_relationship .selected_posts div span.remove,
.cfs_term .selected_posts div span.remove,
.cfs_user .selected_posts div span.remove,
.cfs_relationship .cfs_filter_help,
.cfs_term .cfs_filter_help,
.cfs_user .cfs_filter_help{
    position: relative;
}

.cfs_input .cfs_loop_toggle:before,
.cfs_input .cfs_toggle_field:before,
.cfs_input .cfs_delete_field:before,
.cfs_input .cfs_insert_field:before,
.cfs_loop .cfs_loop_head:before,
.cfs_relationship .selected_posts div span.remove:before,
.cfs_term .selected_posts div span.remove:before,
.cfs_user .selected_posts div span.remove:before,
.cfs_relationship .cfs_filter_help:before,
.cfs_term .cfs_filter_help:before,
.cfs_user .cfs_filter_help:before,
.cfs_relationship .post_list.available_posts > div:after,
.cfs_term .post_list.available_posts > div:after,
.cfs_user .post_list.available_posts > div:after {
    display: block;
    position: absolute;
    color: #adadad;

    /* dashicons */
    font-size: 20px;
    font-family: dashicons;
    width: 20px;
    height: 20px;
    line-height: 1;
    font-weight: 400;
    text-decoration: inherit;
    vertical-align: top;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    -mos-osx-font-smoothing: grayscale;
}

.cfs_input .cfs_delete_field:before,
.cfs_relationship .selected_posts div span.remove:before,
.cfs_term .selected_posts div span.remove:before,
.cfs_user .selected_posts div span.remove:before {
    content: '\f335';
    font-size: 22px;
    top: -2px;
}
