/* __Assets.css    Sections: DETAIL FORM, EDIT FIELDS, BOOKING FORM, POPUP FORM */

/*#region _________________________________ DETAIL FORM _______________________________*/

.DetailFormHeading {
    display:inline-block;
    margin-right:10px;
    margin-left:5px;
    font-family: 'Segoe UI', Arial;
    font-weight:bold;
    font-size:14pt;
    
}

/* Scrollable wrapper on Detail form */
#divDetailFormBody {
    height: calc(100vh - 50px);
    overflow: auto;
    background-color: white;
    color: #222222;
}

/* Chrome Detail form Scrollbar  */
#divDetailFormBody::-webkit-scrollbar {
    background-color: transparent;
    width: 6px;
}

#divDetailFormBody::-webkit-scrollbar-thumb {
    background-color: #dddddd;
}

/* Detail Form Heading Buttons */
#divDetailFormButtons {
    display: inline-block;
    margin-top: 11px;
    margin-bottom: 8px;
    margin-left: 10px;
}

/* Detail Form AddPic, DelPic icons */
#divDetailFormButtons img {
    width: 28px;
    height: 28px;
    margin-left: 7px;
    cursor: pointer;
}

.DetailFormPicWrapper {
    /*background: linear-gradient(180deg, #444444 162px, #FFFFFF 0, #FFFFFF 100%);*/
    /*padding-top: 20px;*/
}

.DetailFormPicWrapper img {
    display: block;
    /*width: 284px;*/
    /*height: 284px;*/
    /*max-width: 284px;*/
    /*max-height: 284px;*/
    /*border-radius: 142px;*/
    /*border: 3px solid #ffffff;*/
    width:100%;
    margin-left: auto;
    margin-right: auto;
}

.DetailFormFields_Live, .DetailFormFields_Edit {
    width: 100%;
    font-size: 14px;
    font-family: 'Segoe UI Light', 'Segoe UI', Arial;
    font-weight: normal;
    color: #333333;
}

.DetailFormFields_Live .fieldrow {
    border-top: 1px solid #f5f5f5;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-left: 15px;
    margin-right: 15px;
}

/* name column*/
    .DetailFormFields_Live .fieldrow .label {
        width: 105px;
        font-size: 12px;
        color: #42a1ba;
        display: inline-block;
        vertical-align: top;
    }
/*.DetailFormFields_Live .fieldrow div:nth-child(1) {
    width: 105px;
    font-size: 12px;
    color: #42a1ba;
    display: inline-block;
    vertical-align: top;
}*/

/*value Column*/
    .DetailFormFields_Live .fieldrow .value {
        padding-left: 3px;
        display: inline-block;
        width: calc(100% - 110px);
        font-size: 14px;
        color: #000000;
        font-family: 'Segoe UI Light','Segoe UI', Arial;
    }
/*.DetailFormFields_Live .fieldrow div:nth-child(2) {
    padding-left: 3px;
    display: inline-block;
    width: calc(100% - 110px);
    font-size: 14px;
    color: #000000;
    font-family: 'Segoe UI Light','Segoe UI', Arial;
}*/

/* linked field value */
.DetailFormFields_Live .fieldrow .fieldlink {
    color:dodgerblue!important;
}
    .DetailFormFields_Live .fieldrow .fieldlink:hover {
        text-decoration:underline;
        cursor:pointer;
    }


/* row */
.DetailFormFields_Edit .fieldrow  {
    border-bottom:1px solid #eeeef2;
    display:table;
    width:100%;
    border-right:2px solid #f5f5f5;
    border-left:2px solid #f5f5f5;
    height:32px;
}

/* Label column*/
.DetailFormFields_Edit .fieldrow .fldLabel {
    width: 110px;
    padding-left: 6px;
    font-size: 10pt;
    display: table-cell;
    vertical-align: middle;
    padding-top: 6px;
    padding-bottom: 6px;
}

/*value Column*/
.DetailFormFields_Edit .fieldrow .fldValue {
    border-left: 1px solid #eeeef2;
    padding-left: 5px;
    display: table-cell;
    width: calc(100% - 110px);
    vertical-align: middle;
    font-family: 'Segoe UI', Arial;
}

.bgdropdown {
    background-image: url(../_engine/images/drop-down-arrow.png);
    background-repeat: no-repeat;
    background-position: center right 6px;
    background-size: 12px;
    width: 100%;
    min-height:20px;
    cursor: pointer;
}

.imgdropdown {
    /* dropdown arrow icon */
    width:20px;
    height:20px;
    padding-right:4px;
    padding-left:4px;
    padding-top:4px;
    padding-bottom:4px;
    cursor: pointer;
    float: right;
    margin-right:2px;
}

/* Textbox */
.DetailFormFields_Edit .fieldrow .fldValue input[type=text] {
        width: 99%;
        border: none;
        padding-right: 3px;
    }

/* Textarea */
.DetailFormFields_Edit .fieldrow .fldValue textarea {
        width: 99%;
        border: none;
        height: 75px;
        padding-top: 4px;
    }

/* Password Textbox */
.DetailFormFields_Edit .fieldrow .fldValue input[type=password] {
        width: 99%;
        border: none;
        padding-right: 3px;
    }

/* List */
.DetailFormFields_Edit .fieldrow .fldValue select {
        width: 99%;
        border: none;
    }

/* Checkbox */
.fieldCheckMark {
    width: 16px;
    height: 16px;
    margin-bottom: 2px;
}

/* Date */
.DetailFormFields_Edit .fieldrow .fldValue #DetailFormBookingDate {
    cursor:pointer;
}

/* Field Locked */
.FieldLocked { color:#777777 }

/* Do not display x in textbox in IE */
.DetailFormFields_Edit .fieldrow .fldValue input::-ms-clear { display: none; }

/* Do not display blue outline in chrome */
.DetailFormFields_Edit .fieldrow .fldValue select:focus {outline:none !important}
.DetailFormFields_Edit .fieldrow .fldValue input:focus {outline:none !important}

/* Edit Fields link */
.EditFieldsLink {
    display: inline-block;
    font-size: 15px;
    font-family: 'Segoe UI Light', 'Segoe UI',Arial;
    float:right;
    cursor:pointer;
    color:cornflowerblue;
    margin-right:15px;
    margin-top:5px;
}
.EditFieldsLink:hover {text-decoration:underline}

.CustomHTML {
    font-size: 25px;
    font-family: 'Segoe UI', Arial;
    color: #333333;
    margin-left: 15px;
    margin-top: 13px;
    margin-bottom: 13px;
}

.BookingRecurWeekdays {
    margin-bottom: 5px;
    font-size: 12px;
    color: #666666;
    font-family: 'Segoe UI', Arial;
    display:inline-block;
    float:right;
    margin-right:10px;
 }

    .BookingRecurWeekdays div {
        display: inline-block;
        margin-left: 2px;
        width: 24px;
        padding-top: 2px;
        padding-bottom: 2px;
        text-align: center;
    }

        .BookingRecurWeekdays div:hover {
            background-color: #aaaaaa;
            color: white;
            cursor: pointer;
        }

.BookingRecurDay_selected {
    background-color: #aaaaaa;
    color: white;
}


/*#endregion*/
/*#region ____________________________ EDIT FIELDS _______________________________________*/
.FieldIcons {
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 11px;
    cursor: pointer;
}

.FieldPropIcon {
    width: 16px;
    height: 16px;
    margin-right: 8px;
}

#divFieldListWrapper {
    border-top: 1px solid #000000;
    height: calc(100vh - 95px - 50px);
    overflow: auto;
    background-color: #f5f5f5;
}

#divFieldList {
    margin-bottom:40px;
}


    #divFieldList .fieldproprow {
        width: 100%;
        border-bottom: 1px solid #FFFFFF;
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 1px;
        padding-bottom: 1px;
    }

    #divFieldList .FieldListSelected {
        /*background-color: #e2f4fd !important;*/
        /*background-color: #f5f5f5 !important*/
        background-color: #ffffff!important;
    }
    
    #divFieldList .fieldproprow .propicon {
        width: 15px;
        height: 15px;
        margin-left: 4px;
        opacity: .7;
    }

    #divFieldList .fieldproprow table {
        font-size: 11pt;
        font-family: 'Segoe UI', Arial;
        color: #000000;
        width: 100%;
    }

    #divFieldList .fieldproprow .fieldprops {
        font-size: 11pt;
        font-family: 'Segoe UI Light', 'Segoe UI', Arial;
        color: #444444;
    }

    #divFieldList .fieldproprow .fieldtextbox {
        width: 100%;
        border: none;
        padding-left: 5px;
        text-overflow: ellipsis;
        background-color: transparent;
    }

        #divFieldList .fieldproprow .fieldtextbox:focus {
            outline: 0;
        }

    #divFieldList .fieldproprow .fieldarrow {
        width: 25px;
        height: 28px;
        padding-left: 15px;
        padding-top: 9px;
        padding-bottom: 9px;
        cursor: pointer;
    }

    #divFieldList .fieldproprow .fieldListItems {
        width: 100%;
        height: 100px;
        font-size: 13px;
        padding: 5px;
    }

    #divFieldList .fieldproprow .fieldDefault {
        width: 100%;
        margin-top: 8px;
        #divFieldList .fieldproprow margin-bottom: 8px;
        padding-left: 4px;
    }

    #divFieldList .fieldproprow .fieldAlias {
        width: 100%;
        margin-top: 8px;
        margin-bottom: 8px;
        padding-left: 4px;
    }
       
    #divFieldList .fieldproprow .flddatatype {
        opacity: .4;
    }

    #divFieldList .fieldproprow .fldnewfieldtype {
        border: 1px solid darkorange;
        border-radius: 3px;
        background-color: transparent;
        color: darkorange;
    }
       
    #divFieldList input::-ms-clear {
        display: none;
    }

.fieldpropcheckbox {
    display: inline-block;
    width: 130px;
}

/* Chrome Scrollbar  */
#divFieldList::-webkit-scrollbar { background-color: transparent; width: 6px; }
#divFieldList::-webkit-scrollbar-thumb {  background-color: #dddddd; }

/*#endregion*/

/*#region ______________________________________________________ BOOKING FORM ________________________________________________ */

.BookingFormDeleteButton {
    display: inline-block;
    font-family: 'Segoe UI Light', 'Segoe UI', Arial;
    margin-left: 15px;
    color: red;
    font-size: 15px;
    cursor: pointer;
    float: left;
    margin-top: 5px;
}

/* Large Button on New Booking Form */
.BookingFormButton {
    background-color: #1398d3;
    background: linear-gradient(#24a8e4, #078cc3);
    height: 40px;
    line-height: 40px;
    color: white;
    border-radius: 2px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    text-align: center;
    font-size: 12pt;
    cursor: pointer;
    margin-top:10px;
}

.LiveBookingTime {
    font-size: 12px;
    color: orangered;
    margin-left: 6px;
}

.RequestMoveSubmit {
    display: table;
    margin: 0 auto;
    width: 150px;
    margin-top: 10px;
    margin-bottom: 5px;
}

.BookingListRow {
    font-family: 'Segoe UI Light', 'Segoe UI', Arial;
    font-size: 14px;
    border-top: 1px solid #f5f5f5;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 15px;
    margin-right: 15px;
}

    .BookingListRow:hover {
        color: Highlight;
        cursor: pointer;
    }

/*#endregion*/
/*#region ______________________________________________________ POPUP FORM ________________________________________________ */
#divPopupMsg {
    position: fixed;
    z-index: 1051;
    bottom: 0;
    width: 100%;
}

#divPopupMsg .alert {
    margin-bottom: 5px !important;
    margin-left: 5px;
    margin-right: 5px;
}

.PopupFormSearchIcon {
    cursor: pointer;
    width: 26px;
    height: 26px;
    margin-left: 20px;
    margin-top: 5px;
}

#lstPopupDeskList_Floors {
    font-size:20px;
    margin-top:3px;
    font-family:'Segoe UI Light', 'Segoe UI', Arial;
    border:none;
}

/*#endregion*/