/*  ~/Extensions/Footable.css
    
    Jenzabar extensions to the Footable framework.

    

    Index:
        Alignment
        Create New Item Popup  
        Header Table
        Filtering field
        Table 2
        Export to PDF
        Display Table
        Pagination
        Reassign Can
        Trash Can
        Expanded row area
        
        
  */

/*******************************
   Alignment
 *******************************/
table.footable-details.table-condensed td {
    text-align: left;
}

/*******************************
   Create New Item Popup
 *******************************/
.create-new-item-popup {
    position: relative;
    width: 100%;
    display: block;
    z-index: 10;
}

.panel .panel-heading .create-new-item-popup-arrow-box .glyphicon {
    color: #8A6D3B;
    font-size: 1.7em;
    position: absolute;
    top: .35em;
    left: .35em;
}

.create-new-item-popup-arrow-box {
    padding: 9px 14px;
    position: absolute;
    border-top-color: #E1DDCA;
    background: #FCF8E3 !important;
    margin-top: 10px;
    opacity: 1;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    color: #8A6D3B;
    top: 2.5em;
    max-width: 276px;
}

.create-new-item-popup-arrow-box:after,
.create-new-item-popup-arrow-box:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.create-new-item-popup-arrow-box:after {
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #FCF8E3;
    border-width: 5px;
    margin-left: -5px;
}

.create-new-item-popup-arrow-box:before {
    border-color: rgba(49, 154, 245, 0);
    border-bottom-color: #FCF8E3;
    border-width: 11px;
    margin-left: -11px;
}



/*******************************
   Header Table
 *******************************/
.jzb-header-table {
    margin: 0;
    padding: 0;
    font-size: .8em;
    background: #ededed;
}



.footable.breakpoint > tbody > tr > td > span.footable-toggle {
        display: inline-block;
    font-family: 'footable';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    padding-right: 10px;
    font-size: 1em;
    color: #428bca;
    opacity: 1;
}

.footable.breakpoint > tbody > tr > td > span.footable-toggle:hover {
    cursor: pointer;
}

.jzb-footable-word-normal.footable td {
    word-break: normal;
    word-wrap: normal;
}

.footable > thead > tr > th {
    background-color: #ededed;
}

.footable > thead > tr > th:nth-of-type(1) {
    min-width: 4.5em;
}

table.footable > thead > tr > td.footable-sortable,
table.footable > thead > tr > th.footable-sortable,
table.footable > tbody > tr > td.footable-sortable,
table.footable > tbody > tr > th.footable-sortable,
table.footable > tfoot > tr > td.footable-sortable,
table.footable > tfoot > tr > th.footable-sortable {
    padding-right: 0;
    position: inherit;
}

table.footable > thead > tr > td > span.fa,
table.footable > thead > tr > th > span.fa {
    padding-left: 5px;
}

.panel .jzb-filter-area {
    background-color: #ededed;
    padding-top: 15px;
    padding-bottom: 0px;
    margin-top: -15px;
}

.jzb-no-rows-message {
    padding-top: 1.5em;
}

.jzb-block-table-header > thead > tr > th {
    background-color: #fff;
}

.displayTableFormat2MainClass div.jzb-noRowsMessage.row {
    padding-top: 1em;
}

.footable-row-detail-inner .footable-row-detail-row:not(:first-child) .footable-row-detail-name,
.footable-row-detail-inner .footable-row-detail-row:not(:first-child) .footable-row-detail-value {
    padding-top: 1em;
    vertical-align: top;
}

tr.footable-detail-row > td > table.footable-details > tbody > tr > th,
tr.footable-detail-row > td > table.footable-details > tbody > tr > td {
    border-style: none;
}

.footable-row-detail-value .glyphicon.glyphicon-trash {
    font-size: 1.8em;
}

.footable-filtering-search {
    padding-left: 10px;
}

.displayTableFormat2TableClass th[data-visible="false"] { display: none; }
.displayTableFormat2TableClass th[data-breakpoints="all"] { display: none; }
@media(max-width: 480px) {
    .displayTableFormat2TableClass th[data-breakpoints="xs"] { display: none; }
}
@media(max-width: 768px) {
    .displayTableFormat2TableClass th[data-breakpoints="sm"] { display: none; }
}
@media(max-width: 992px) {
    .displayTableFormat2TableClass th[data-breakpoints="md"] { display: none; }
}

/* DisplayTableFormat2 */
@media (min-width: 480px) {
    .btn-group.jzb-dropdown-button-combo.btn-m {
        margin: 0em .7em .1em .7em;
        padding: 0;
        float: right;
        position: relative;
        top: 0.7em;
    }
}

@media (max-width: 480px) {
    .btn-group.jzb-dropdown-button-combo.btn-xs {
        margin: 2em 0em 1.5em -0.5em;
        padding: 0;
        float: left;
    }

    .jzb-wizard-button ul.dropdown-menu {
        margin-bottom: 1em;
    }
}

.btn-group.jzb-dropdown-button-combo {
    padding-top: 0em;
    margin-left: 0px;
}

.btn-group.jzb-dropdown-button-combo .form-control {
    display: inline-block;
    width: auto;
    border-radius: 4px 0 0 4px;
    font-size: 12px;
}

.btn-group.jzb-dropdown-button-combo .jzb-combo-hint-text {
    color: #777;
    font-size: .85em;
    position: absolute;
    top: -1.7em;
    left: .1em;
}

.footable-filtering-search {
    padding-left: 10px;
}

/*******************************
   Filtering field
 *******************************/
tr.footable-filtering form.form-inline div.input-group div.input-group-btn {
    display: none;
}
tr.footable-filtering form.form-inline div.input-group input.form-control {
    border-bottom-right-radius: 4px !important;
    border-top-right-radius: 4px !important;
}

/*******************************
   Table 2
 *******************************/
.jzb-table-format2 .jzb-chartcat {
    margin: .4em -15px 0 0;
}
.jzb-table-format2 .jzb-chartcat span {
    height: 1.3em;
    width: 1.3em;
}
.jzb-table-format2 .jzb-wizard-button {
    margin-top: 0;
}

.jzb-filterField .input-group {
    width: 100% !important;
}

.jzb-filterField .caret {
    border-top-color: rgb(51, 51, 51);
}

@media (max-width:480px) {
    .jzb-action_dropdown_width {
        width: 100% !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .jzb-action_dropdown_width {
        width: 100% !important;
    }
}

/*******************************
   Export to PDF
 *******************************/
.export-to-pdf-btn a.jzb-exportToPdf {
    width: 9em;
    border: 1px solid;
    border-radius: 4px;
    background-color: #428BCA;
    border-color: #BAB4AD;
    padding-left: 0;
    padding-right: 0;
}

.export-to-pdf-btn a.jzb-exportToPdf .panel.jzb-add-participant .panel-heading .btn .glyphicon {
    color: #FFF;
    opacity: 0.9;
    margin-right: 0.3em;
}


/*******************************
   Display Table
 *******************************/

.displayTableFormat2TableClass {
    border: none;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
    margin-bottom: 0;
}

.displayTableFormat2TableClass.jzb-card-base {
    border: none;
}

.jzb-displaytableviewingtext {
    margin: .7em 0 .7em 0;
}

.jzb-displayActionsView {
    float: right;
}

ul.jzb-list-inline.jzb-quickfilters {
    margin-left: -1.2em;
}

.jzb-list-inline.jzb-quickfilters div.checkbox {
    margin-top: 1px;
}

.jzb-list-inline.jzb-quickfilters div.checkbox input {
    margin: 0;
    position: relative;
    vertical-align: middle;
}

.jzb-list-inline.jzb-quickfilters div.checkbox label {
    padding: 0 10px 0 0;
}

span.jzb-quickfilter-separator {
    border-left: 1px solid #b2b2b2;
    padding-left: 2em;
}

@media (max-width: 767px) {
    li.jzb-quickfilter-separator {
        padding-top: 1em !important;
    }

    span.jzb-quickfilter-separator {
        border-top: 1px solid #b2b2b2;
        padding-top: 1em !important;
        border-left: none;
        padding-left: 0;
    }
}

.jzb-quickfilter-dropdown {
    margin-left: 0em;
    margin-right: 2em;
    text-align: left;
}

/*For the case where there is only a dropdown quickfilter but no 
    checkbox quickfilers. Designed for Add Multiple Invitees in Events*/
.jzb-quickfilter-dropdown-only {
    margin-left: -10px;
}

@media (max-width: 767px) {
    .jzb-quickfilter-dropdown-only {
        margin-top: -1.5em;
    }
}


#jzbDisplayTableActionButton {
    -webkit-border-top-left-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;

    border-left: 1px solid #bab4ad;
}



/****************************************
    Pagination
 ****************************************/
.jzb-pagination td.footable-last-column.footable-first-column {
    border: none;
}

.jzb-pagination div ul,
.jzb-pagination div ul li {
    margin: 0;
    padding: 0;
}

.jzb-pagination div {
    margin: 0;
    padding: 0 .85em;
}

.jzb-pagination ul {
    margin-right: 5px !important;
}

tfoot.jzb-pagination {
    font-size: .8em;
}

.jzb-pagination-showall {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #428bca;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}

tfoot tr.footable-paging td,
tfoot tr.show-x-rows-button td {
    padding-left: 20px;
}

tfoot tr.footable-paging td ul.pagination {
    padding-left: 0.85em;
}

tfoot tr.footable-paging td span.label-default {
    display: none !important;
}

table.footable tr.footable-empty > td {
    color: #767676;
    font-size: 1.2em !important;
    padding-top: 1em;
}

/****************************************
    Reassign can
 ****************************************/
@media (max-width: 767px) {
    .glyphicon.jzb-glyph-glyphicon-reassign {
        font-size: 1.5em;
    }

    .footableRow .jzb-glyph-glyphicon-reassign {
        color: #428bca;
    }
}
/* Display the reassign icon in the color of link*/
.footableRow .glyphicon.jzb-glyph-glyphicon-reassign,
.footable-row-detail .jzb-glyph-glyphicon-reassign {
    color: #428bca;
    cursor: pointer;
}

/* Display the reassign icon in orange when hovered over */
.footableRow .jzb-glyph-glyphicon-reassign:hover,
.footable-row-detail .jzb-glyph-glyphicon-reassign:hover {
    color: #e29128;
}

/* Display the reassign icon in orange when hovered over on Select Milestones page */
.DeleteCustomMilestone .jzb-glyph-glyphicon-reassign:hover {
    color: #e29128;
}


/*******************************
   Trash Can
 *******************************/
@media (max-width: 767px) {
    .footableRow .glyphicon.glyphicon-trash {
        color: #428bca;
    }
}

/* Display the trash icon in the color of link*/
.footableRow .glyphicon.glyphicon-trash,
.footable-row-detail .glyphicon-trash,
.enable-trash-hover.glyphicon-trash,
.enable-trash-hover.glyphicon-trash  {
    color: #428bca;
    cursor: pointer;
}

/* Display the trash icon in orange when hovered over */
.footableRow .glyphicon-trash:hover,
.footable-row-detail .glyphicon-trash:hover,
.enable-trash-hover.glyphicon-trash:hover,
.enable-trash-hover.glyphicon-trash:hover  {
    color: #e29128;
}

/***************************************************************************
Realign column value over to go under column header on expanded row
****************************************************************************/
    @media(max-width:400px) {
        .realigncolumndetail {
            margin-left: -11em;
        }
         .realigncolumdetail > ul > li {
             margin-left: -1.5em;
         }
    }
     @media(min-width:401px) and (max-width: 420px) {
         .realigncolumndetail {
             margin-left: -12.5em;
         }
         .realigncolumdetail > ul > li {
             margin-left: -1.5em;
         }
     }
    @media (min-width:421px) and (max-width: 1200px) {
        .realigncolumndetail {
            margin-left: -13em;
        }
        .realigncolumdetail > ul > li {
             margin-left: -1.5em;
         }
    }

    @media (min-width: 1201px) {
        .realigncolumndetail {
            margin-left: -0.5em;
        }
    }


/*******************************
   Expanded row area
 *******************************/
table.footable-details {
    border: none;
}

table.footable-details tr {
    background-color: #ffffff;
}

table.footable-details > tbody > tr > td:nth-child(2) {
    word-break: normal;
}

}