/* @@@@@@@@@@@@@@@@  Custom Table  @@@@@@@@@@@@@@@@ */

/***    Import icons    ***/
@import url(/RichWidgets/Theme.FontAwesome.css?59324);

.EditableTable {
    width: 100%;
    background: white;
    padding: 5px 0px 0px 0px;
    margin-top: 20px;
    border-top: 2px solid #C2C2C2;
    /* 3d acceleration on */
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    -ms-perspective: 1000px;
    perspective: 1000px;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.EditableTable thead td {
    color: #999;
    font-weight: bold;
    padding: 10px 0px 10px 20px;
    border-bottom: 2px solid #C2C2C2;
}

/* #811910 - style duplicated to support tag <th> */
.EditableTable thead th {
    color: #999;
    font-weight: bold;
    padding: 10px 0px 10px 20px;
    border-bottom: 2px solid #C2C2C2;
}

.EditableTable tbody tr:not(.RowControlGroup) td {
    border-bottom: 1px solid #C2C2C2;
}

.EditableTable tr.Selected td {
    background-color: #EDEDED;
}

.EditableTable td {
    padding: 6px;
}

/* Workaround for ie8 */
/* IE10 or less */
body .EditableTable > tbody > tr{
    display: none\9;
}

/* Workaround for ie8 */
/* IE 9 or over */
:root body .EditableTable > tbody > tr{
    display: table-row;
}

body .EditableTable > tbody > tr:last-child {
    display: none;
}

.EditableTable .ColumnHeader {
    display: none;
    color: #AAA;
}

/* On edit, disable rest of the table... */
.EditableTable.OnEdit,
.EditableTable.OnEdit td.RowWithAddAction {
    background-color: #F6F6F6;
}

.EditableTable.OnEdit tr {
    opacity: 0.4;
    pointer-events: none; /* If row is being edited, clicking on other inputs does nothing */
}

.EditableTable.OnEdit tr.OnEdit,
.EditableTable.OnEdit tr.RowControlGroup {
    opacity: 1;
    pointer-events: auto;
}





/* @@@@@@@@@@@@@@@@@@@@@@@@ */
/*        Controls          */
/* @@@@@@@@@@@@@@@@@@@@@@@@ */

.EditableTable tr.RowControlGroup td {
    text-align: center;
    white-space: nowrap;
    overflow-x: visible;
    padding: 0px;
}

.EditableTable.SupportsEdit > tbody > tr.RowControlGroup {
    display: table-row;
}

.EditableTable tr.RowControlGroup .ControlActions {
    z-index: 1;
    display: inline-block;
    position: absolute;
    font-size: 19px;
}

.EditableTable:not(.SupportsEdit) tr.RowControlGroup .ControlActions {
    display: none;
}

/* Box with controls */
.EditableTable tr.RowControlGroup .ControlActions,
.EditableTable tr.RowControlGroup .ControlActions {
    left: 50%;
    padding: 6px;
    margin-left: -82px;
    margin-top: -2px;
    background: #EDEDED;
    border: 1px solid #CCC;
    border-top: 2px solid #EDEDED; /* same as background */
}

.EditableTable tr.RowControlGroup a {
    display: none;         
    color: #E83E26;
    width: 50px;    
    cursor: pointer;
}

.EditableTable tr.RowControlGroup .ControlActions .SaveRowAction,
.EditableTable tr.RowControlGroup .ControlActions .CancelRowAction,
.EditableTable tr.RowControlGroup .ControlActions .DeleteRowAction {
    display: inline-block;
}

td.RowWithAddAction {
    background: white;
    border-bottom: 2px solid #C2C2C2;
    padding: 0px;
}

td.RowWithAddAction a {
    cursor: pointer;
    /* big clickable area */
    padding: 15px;
    display: inline-block;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

td.RowWithAddAction i {
    font-size: 18px;
    margin-right: 5px;
}

/* @@@@@@@@@@@@@@@@@@@@@@@@ */
/*        Inputs            */
/* @@@@@@@@@@@@@@@@@@@@@@@@ */

.EditableTable input,
.EditableTable textarea,
.EditableTable select { 
    /* remove box shadow from london */
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.EditableTable input::-ms-clear {
    display: none;
}
 
body .EditableTable input:not(.InEditMode),
body .EditableTable textarea:not(.InEditMode),
body .EditableTable select:not(.InEditMode) {
     /* override readonly color to look like labels*/
    color: #333;
    font-size: 14px;
    border: 1px solid transparent;
    background: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

body .EditableTable input:not(.InEditMode) {
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    appearance: textfield;
}

body .EditableTable input[type='checkbox']:not(.InEditMode) {
    -moz-appearance: checkbox;
    -webkit-appearance: checkbox;
    appearance: checkbox;
}

.EditableTable select:not(.InEditMode),
.EditableTable input:not(.InEditMode)::-webkit-inner-spin-button,
.EditableTable input:not(.InEditMode)::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.EditableTable textarea:not(.InEditMode) {
    resize: none;
}

.EditableTable thead .AlignRight {
    /* Align with inputs padding-right */
    padding-right: 18px;
}

.EditableTable .AlignRight,
.EditableTable .AlignRight input {
    text-align: right;
}

/* Add new row doesn't work when we are editing a row */
.RowWithAddAction a[disabled='disabled'] {
    pointer-events: none;
}

.EditableTable tr[isnew]+tr.RowControlGroup a.DeleteRowAction {
    pointer-events: none;
    cursor: default;
    color: #999;
}

.EditableTable.SupportsEdit:not(.WithTouchEvents) tr[isnew]+tr.RowControlGroup td:hover {
    cursor: default;
}

/* @@@@@@@@@@@@@@@@@@@@@@@@ */
/*   Errors & Validations   */
/* @@@@@@@@@@@@@@@@@@@@@@@@ */

.EditableTable thead td.Mandatory:after {
    color: #E83E26;
    content: "*";
    position: absolute;
    margin-left: 3px;
}

/* #811910 - style duplicated to support tag <th> */
.EditableTable thead th.Mandatory:after {
    color: #E83E26;
    content: "*";
    position: absolute;
    margin-left: 3px;
}

/* Don't render InputMandatorySymbol span, since we use labels */
.EditableTable .InputMandatorySymbol {
    display: none;
}

body .EditableTable input.Not_Valid:not(.InEditMode),
body .EditableTable textarea.Not_Valid:not(.InEditMode),
body .EditableTable select.Not_Valid:not(.InEditMode) {
	border: 1px solid #bf1601;
}

/* Hover behaviors only in desktop */
@media screen and (min-width: 1024px) {
	.EditableTable:not(.WithTouchEvents) tbody tr:hover td {
        background-color: #EDEDED;
    }
    
    .EditableTable.SupportsEdit:not(.WithTouchEvents) tbody tr:not(.Selected):hover td,
    .EditableTable.SupportsEdit:not(.WithTouchEvents) tbody tr:not(.Selected) input:hover,
    .EditableTable.SupportsEdit:not(.WithTouchEvents) tbody tr:not(.Selected) textarea:hover,
    .EditableTable.SupportsEdit:not(.WithTouchEvents) tbody tr:not(.Selected) select:hover {
        cursor: pointer;
    }
}


/* Smartphones */
@media screen and (max-width: 764px) {

    .EditableTable thead {
        display: none;
        
    }
    
    /* Force table to not be like tables anymore */
    .EditableTable tbody td {
        padding: 6px 8px;
        display: none;
        
    }

    .EditableTable tr,
    .EditableTable tr td:first-child {
        display: block;
        
    }
    
    .EditableTable input:not(.InEditMode),
    .EditableTable textarea:not(.InEditMode),
    .EditableTable select:not(.InEditMode) {
        padding-left: 0px;
    }
	
    .EditableTable .AlignRight,
    .EditableTable .AlignRight input {
        text-align: left;
    }
	
    .EditableTable tbody tr:not(.RowControlGroup) td {
        border: none;
    }
	
    .EditableTable tbody tr.Selected {
        border: 1px solid #CCC;
    }
	
    .EditableTable tbody tr:not(.RowControlGroup):not(.Selected) td:first-child {
        border-bottom: 1px dotted #CCC;
    }

    .EditableTable tbody tr:not(.RowControlGroup):not(.OnEdit) td:first-child:before {
        content: "\f0dd"; /* v */
        right: 0px;
        font-family: FontAwesome;
        color: #AAA;
        position: absolute;
        margin-right: 15px;
        margin-top: 5px;
    }
    
    .EditableTable tbody tr.Selected:not(.RowControlGroup):not(.OnEdit) td:first-child:before {
        content: "\f0de"; /* ^ */
	padding-top: 5px;
    }
    
    .EditableTable tr.Selected td {
        display: block;
    }
    
    .EditableTable tr.Selected.RowControlGroup td { 
        border: none;
        display: block;        
        position: absolute;
        right: 30px;
        top: 10px;        
    }    
    
    .EditableTable tr.Selected.OnEdit.RowControlGroup td { 
        right: 0px;
        top: 0px;
        background: #DDD;
        padding: 10px;
        width: 65px;
    }
    
    .EditableTable tr.Selected div.ColumnHeader,
    .EditableTable tr.OnEdit div.ColumnHeader {
        display: block;
    }
    
    /* Mandatory in labels instead of inputs */
    .EditableTable tr.OnEdit td.Mandatory:after {
        display: none;
    }
    
    .EditableTable tr.OnEdit td.Mandatory .ColumnHeader:after {
        color: #E83E26;
        content: "*";
        position: absolute;
        margin-left: 3px;
    }

    body .EditableTable input:not(.InEditMode),
    body .EditableTable textarea:not(.InEditMode),
    body .EditableTable select:not(.InEditMode) {
        /* override readonly color to look like labels*/
        font-size: 16px; /* >=16px disables zoom on focus on iOS */
    }
}

/* ExcludeFromPickers: EditableTable, ColumnHeader, OnEdit, RowControlGroup, ControlActions, RowWithAddAction, SaveRowAction, CancelRowAction, DeleteRowAction, AlignRight, SupportsEdit, Selected, Error */