/*
 * John Liddiard (aka JohntheFish) www.c5magic.co.uk
 * This software is licensed under the terms described in the ConcreteCMS marketplace.
 * Please find the add-on there for the latest license copy.
 */


/*
 * We make the input into a target for clicking to popup
 * the selector. A text input is also readonly, so doesn't take
 * direct text entry. However, it still has the focus
 * etc to match ui styling.
 */
.jtf-widget input {
    cursor: pointer !important;
}

.jtf-widget input[type=text] {
    background: inherit !important;
}

/*
 * Sets a loading overlay, appears while the ajax dialog is
 * loading and masks the repeater input.
 */
.jtf-widget,
.jtf-dialog_body
.jtf-widget button {
    position: relative;
}

.jtf-widget .jtf-widget_loading,
.jtf-dialog_body .jtf-dialog_loading,
.jtf-widget .jtf-widget_button_loading {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 50px;
    margin-top: -15px;
    background: rgba(255, 255, 255, 0.8);
}

.jtf-widget.plugin_select .jtf-widget_loading {
    margin: auto;
    min-height: inherit;
}

.jtf-widget .jtf-widget-select-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #555555;
    cursor: pointer;
}

.jtf-widget .jtf-widget_loading img {
    padding-left: 45%;
    padding-top: 15px;
}

.jtf-loading .jtf-widget_button_loading img {
    margin: auto;
    padding-top: 15px;
}

.jtf-dialog_body .jtf-dialog_loading img {
    margin: auto;
    padding-top: 60px;
    padding-left: 45%;
}

.ccm-loading .jtf-widget .jtf-widget_loading,
.jtf-loading .jtf-dialog_loading,
.jtf-loading .jtf-widget_button_loading {
    display: block;
}

/*
 * Keep the table headers nice. Make sure the icons line up.
 */
.plugin_system_list th {
    white-space: nowrap;
}

.plugin_system_list th a,
.plugin_system_list th a:focus,
.plugin_system_list th a:hover,
.plugin_search_controls a,
.plugin_search_controls a:focus,
.plugin_search_controls a:hover {
    text-decoration: none !important;
    padding: 10px 0;
    color: #3f9edc !important;
    outline: none !important;
}

.plugin_system_list th a:hover,
.plugin_search_controls a:hover {
    color: #2076af !important;
}

.plugin_system_list th a .sort_order_icon {
    display: inline;
}

/*
 * Highlight the selected plugin
 */
.plugin_system_list .plugin_selected td {
    background-color: #d9edf7 !important;
}

/*
 * Some fine tuning of bootstrap select
 */

.plugin_list_search_element .bootstrap-select .filter-option {
    white-space: normal;
}


/*
 * Size input to match select2
 * (previouisly 46px, chnaged to 40 for c5v8)
 */
.jtf-select2-selectize .plugin_list_search_element input.plugin_search_input {
    min-height: 40px;
}

/*
 * Needed to make select 2 display better in edit mode dialogs.
 * The core displays it OK in dashboard dialogs.
 *
 * This is a complete hack solution, but it appears to work :-)
 */
.jtf-select2-selectize .select2-container.form-control {
    width: 100%;
    height: 38px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.jtf-select2-selectize .select2-container-multi .select2-choices {
    margin-left: -13px;
    margin-top: -7px;
    margin-right: -13px;
}

/*
 * Format and align search and clear buttons
 */
.plugin_list_search_element .plugin_search_controls {
    margin-top: 25px;
}

.plugin_list_search_element .plugin_search_controls a,
.plugin_list_search_element .plugin_search_controls a:hover {
    text-decoration: none !important;
    font-size: 24px;
    cursor: pointer;
    padding: 5px;
}


/*
 * For now, we want a select, even when already selected. More robust
 * that way against lost defaults and just feels more natural for users, even
 * if it does nothing new.
 * Uncomment for no button on plugin that is already selected
.plugin_system_list .plugin_selected .action-select-plugin{
    display:none;
}
*/

.plugin_system_list .plugin_help_icon {
    cursor: pointer;
    font-size: 18px;
}

.plugin_system_list .plugin_help_icon .fa-minus-circle {
    cursor: pointer;
}

.plugin_system_list .plugin_help {
    display: none;
}

.plugin_system_list .show_plugin_help .plugin_help {
    display: block;
}

.plugin_system_list .plugin_help_all_controls {
    font-size: 18px !important;
    display: inline-block;
    float: right;
}

.plugin_system_list .plugin_help_all_controls a,
.plugin_system_list .plugin_help_all_controls a:hover {
    margin-right: 10px;
    text-decoration: none !important;
}

.plugin_system_list .plugin_help_all_controls .plugin_help_show_all_icon {
    cursor: pointer;
}

.plugin_system_list .plugin_help_all_controls .plugin_help_hide_all_icon {
    cursor: pointer;
}

.plugin_system_list .plugin_selected td {
    background-color: #d9edf7 !important;
}

/*
 *
 */
.table-striped .row_selected td {
    background-color: #d9edf7 !important;
}