/* 
    Created on : Jun 21, 2020, 11:32:37 AM
    Author     : Yosor
*/

/* Customer profiles */
.property-field-div label {
    margin-top: 10px;
}
#customer-profiles,.property_padding{
    padding:0px 10px 10px 10px;
}
.property_padding .btn-info-profile{
    margin:10px 0px !important;
    padding: 6px 12px !important;
    background: #03a9f4; 

}
#customer-profiles h2{
    margin-left: 10px;
    margin-top:0px;
}
.property_padding h2{
    margin-top:0px;
}
#profiles li{
    height: 90px;
    padding:15px 5px 15px 5px !important;
    border-bottom: 1px #ccc solid;
    cursor: pointer;
}

#profiles li a{
    display: block;
    margin-bottom:5px;
}
#profiles li .email{
    display: block;
}
#profiles li:last-child{
    border-bottom: 0px;
    height: 30px;
}
.customer_profile:hover{
    background: #f7f7f7;
}
#profiles .active{
    background: #f4f4f4;

}

/* Customer properties */
#properties_list{
    display: block;
}
#properties_list li{
    display: inline-block;
    width:100%;
    padding:5px;
    min-height: 45px;

}
#search_properties{
    float: left;
    width: 100%;
}
#search_values {
    float:left;
}
.property_name{
    float: left;
    width:100%;
    font-size: 14px;
    margin-left: 5px;
    margin-top:10px;
}
.property_name h2{
    float: left;
    width:100%;
        margin-top:0px !important;

}
.required-field{
    color:#fff;
}
.property_name a {
    color:#666;
}
a.add_new_link {
    float: left;
    color:#03a9f4 !important;
    margin-bottom: 5px;
}
.select_value{
    float:left;
    width:100%;
    height: 20px;
    border-bottom: 1px #ccc solid;
    cursor: pointer;
    padding-left:6px;
    margin-top: 10px;

}
.select_value i {
    float: right;
    margin-right: 10px;
}
.add_new_value {
    float:left;
    margin-top:10px;
    margin-bottom:10px;
}

.property_padding h2{
    float:left;
    margin-bottom: 20px;
}
#property_field_values{
    display:inline-block;
    width:100%;
}
#property_field_values li{
    margin-bottom: 12px;
}
.property_checkbox{
    font-size: 10px;
    width:15px !important;
    display: inline !important;
}

.next-step span{
    float: right;
    color:#000;
    font-size: 16px;
    margin-top:15px;
    margin-right: 15px;
}

.next-step i{
    color:#fff;
    width:48px;
    height:48px;
    font-size: 16px;
    padding-top:15px;
    float: right;
    margin-right: 17px;
    border-radius:2px;
    text-align: center
} 

.prev-step span{
    float: left;
    color:#000;
    font-size: 16px;
    margin-top:15px;
    margin-left: 15px;
}

.prev-step i{
    color:#fff;
    width:48px;
    height:48px;
    border:1px #ccc solid;
    font-size: 16px;
    padding-top:15px;
    float: left;
    margin-left: 17px;
    border-radius:2px;
    text-align: center
} 



.modal-header{
    border-bottom: 0px !important;
}

.back{
    font-size: 18px;
    color:#ccc;
    font-weight: normal
    
}
#property_field_values .inputGroup {
    background-color: #fff;
    display: block;
    position: relative;
}

#property_field_values label {
    padding: 12px 30px;
    width: 100%;
    display: block;
    text-align: left;
    color: #3C454C;
    cursor: pointer;
    position: relative;
    z-index: 2;
    transition: color 200ms ease-in;
    overflow: hidden;
    border:1px #eee solid
}

#property_field_values label:before {
    width: 100%;
    height: 10px;
    border-radius: 50%;
    content: '';
    background-color: #f0f0f0;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale3d(1, 1, 1);
    transition: all 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    opacity: 0;
    z-index: -1;
}

#property_field_values label:after {
    width: 32px;
    height: 32px;
    content: '';
    border: 2px solid #D1D7DC;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
    background-repeat: no-repeat;
    background-position: 2px 3px;
    border-radius: 50%;
    z-index: 2;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    transition: all 200ms ease-in;
}


#property_field_values input:checked ~ label {

    color: #03a9f4;
}

#property_field_values input[type=checkbox]:checked + label:before {
    transform: translate(-50%, -50%) scale3d(56, 56, 1);
    opacity: 1;
}

#property_field_values input[type=checkbox]:checked + label:after {
    background-color: #03a9f4;
    border-color: #03a9f4;
    color: #222;
}


#property_field_values input {
    width: 32px;
    height: 32px;
    order: 1;
    z-index: 2;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    visibility: hidden;
}

.property_padding h2,#property_padding h2{
    font-size: 24px;
    font-weight: 100;
}
.property_padding h2 a,#property_padding h2 a{
    color:#666;

}

@media (max-width: 450px){
    #myModal .modal-content {
        padding-bottom:0px !important;
        padding:0px !important;
    }

    .add_new_value {
        width:100%;
        padding-left:0px !important;

    }

}

.modal-header{
    border-bottom: 0px;
}

#no_matches{
    text-align:center !important;
}
#no_matches span{
        display:block;
    }

@media (max-width: 767px) {
    .margin-right-fa {
        margin-right: -8px !important;
    }
}