﻿/*
 * Input padrão   
 */
input.default:not(.readonly) {
    border: 1px solid #C4C4C4;
    line-height: 30px;
    height: 38px;
    display: block;
    text-align: left;
    background-color: #FBFBFB;
    padding: 0px 10px;
    font-size: 12pt;
    color: #243E61;
    font-weight: normal;
}

input.default.readonly {
    border: none;
    line-height: 30px;
    height: 38px;
    display: block;
    text-align: left;
    background-color: transparent;
    padding: 0px 10px;
    font-size: 12pt;
    color: #243E61;
}

input[type="number"].default{
    display: inline-block !important;
    width: 90px;
}

/*
 * Input calendario   
 */
div.calendar:not(.readonly) {
    border: 1px solid #D9D9D9;
    line-height: 45px;
    height: 45px;
    display: block;
    text-align: left;
    background-color: #FBFBFB;
}

div.calendar.readonly {
    border: none;
    line-height: 45px;
    height: 45px;
    display: block;
    text-align: left;
    background-color: transparent;
}

div.calendar.readonly > i {
    display: none;
}

div.calendar > i {
    padding: 14px;
    cursor: pointer;
    border-left: 1px solid #D9D9D9;
    color: #7F7F7F;
    text-align: center;
    width: 45px;
}

div.calendar:hover {
    background-color: #F2F2F2;
}

div.calendar > input{
    cursor: pointer;
    background-color: transparent;
    border: none;
    padding: 5px 10px;
    width: calc(100% - 50px);
    font-size: 12pt;
    color: #243E61;
    line-height: 30px;
    display: inline-block;
}

/*
 * CALENDAR 2
 */
 div.calendar2.readonly > i {
    display: none;
}

div.calendar2 > i {
    padding: 14px;
    cursor: pointer;
    border-left: 1px solid #D9D9D9;
    color: #7F7F7F;
    text-align: center;
    width: 45px;
}

div.calendar2:hover {
    background-color: #F2F2F2;
}

div.calendar2 > input{
    cursor: pointer;
    background-color: transparent;
    border: none;
    padding: 5px 10px;
    width: calc(100% - 50px);
    font-size: 12pt;
    color: #243E61;
    line-height: 30px;
    display: inline-block;
}

/*CALENDAR 2*/
div.calendar2:not(.readonly) {
    background-color: #FBFBFB;
    border: 1px solid #C4C4C4;
    line-height: 20px;
    height: 40px;
    display: inline-block;
    text-align: left;
    cursor: pointer;
}

div.calendar2 > input{
    cursor: pointer;
    background-color: transparent;
    border: none;
    padding: 4px 10px;
    font-size: 12pt;
    color: #243E61;
    line-height: 30px;
    display: block;
}

div.calendar2 > input:disabled {
    background-color: transparent !important;
    border: none !important;
    padding: 3px 10px;
    color: #BFC1C4;
}

div.calendar2.disabled {
    background-color: #EEEEEE;
    border: 1px solid #AAAAAA;
    color: #BFC1C4;
}

div.calendar2:not(.disabled):before { 
    background-color: #FFF;
    color: #7F7F7F;
    padding: 10px 14px;
    content: "\f073";
    position: absolute;
    right: 1px;
    top: 0px;
    bottom: 0px;
    border-left: 1px solid #C4C4C4;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
    z-index: 2;
}


/*
 * Textarea padrão   
 */
textarea.default:not(.readonly) {
    border: 1px solid #D9D9D9;
    line-height: 45px;
    height: 45px;
    display: block;
    text-align: left;
    background-color: #FBFBFB;
    padding: 0px 10px;
    font-size: 12pt;
    color: #243E61;
}

textarea.default.readonly {
    border: none;
    line-height: 45px;
    height: 45px;
    display: block;
    text-align: left;
    background-color: transparent;
    padding: 0px 10px;
    font-size: 12pt;
    color: #243E61;
}

/*
 * Input Search   
 */
div.search {
    border: 1px solid #D9D9D9;
    line-height: 40px;
    height: 40px;
    display: block;
    text-align: left;
    background-color: #FBFBFB;
}

div.search input[type=text]{
    background-color: transparent;
    border: none;
    padding: 10px 60px 10px 10px;
    font-size: 12pt;
    color: #243E61;
    font-weight: normal;
    width: 100%;
    display: block;
}

div.search input[type=button]{
    font: normal normal normal 14px/1 FontAwesome;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f015";
    padding: 0px 10px;
    position: absolute;
    top: 0;
    right: 0;
    border: none;
    bottom: 0;
    width: 50px;
    color: #243E61;
    cursor: pointer;
}

div.search input[type=button]:hover {
    box-shadow: inset 0 0 0 30px rgba(0,0,0,0.1);
}

div.search input[type=button]:active {
    box-shadow: inset 0 0 0 30px rgba(0,0,0,0.2);
}

div.search .selectOpt {
    position:absolute;
    right: 50px;
    top: -1px;
}

/*
 *INPUT DESATIVADO
 */
input:disabled {
    border: 1px solid #F9F9F9 !important;
    background-color: #DBDBDB !important;
    cursor: default !important;
}

/*input.inactive {
    border: 1px solid #F9F9F9 !important;
    background-color: #DBDBDB !important;
    cursor: default !important;
}*/

/*
 * AUTOCOMPLETE   
 */

.autocomplete input[type=text]{
    border: 1px solid #D9D9D9;
    line-height: 45px;
    height: 45px;
    display: block;
    text-align: left;
    background-color: #FBFBFB;
    padding: 0px 10px;
    font-size: 12pt;
    color: #243E61;
    font-weight: normal;
    width: 100%;
}

.autocomplete.readonly input{
    border: none;
    line-height: 45px;
    height: 45px;
    display: block;
    text-align: left;
    background-color: transparent;
    padding: 0px 10px;
    font-size: 12pt;
    color: #243E61;
}

.autocomplete ul{
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    background-color: #FBFBFB;
    font-size: 12pt;
    color: #243E61;
    font-weight: normal;
    z-index: 10;
    border: 1px solid #D9D9D9;
    max-height: 115px;
    overflow-y: auto;
    display: none;
}

.autocomplete ul li {
    padding: 10px;
}

.autocomplete ul li:hover {
    background-color: rgba(0,0,0,0.1);
}

/*
 * INPUT MODAL
 */

.inputModal {
    display: inline-block;
    background-color: #FBFBFB;
    border: 1px solid #C4C4C4;
    cursor: pointer;
}

.inputModal input{
    -webkit-appearance: none;
    -webkit-user-select: none;

    padding: 0px 10px;
    cursor: pointer;

    color: #243E61;
    font-size: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    line-height: 30px;
    height: 40px;
    border: none;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/*
    Alguns inputs devem ficar sempre disabled (caso do input para escolher Grupos e Proprietários na tela de editar usuário)
    caso contrário o cursor ficaria liberado para o usuário digitar dentro desses inputs que deveriam ser apenas para click
    por isso foi criado essa classe .active para sobreescrever as configurações do input:disabled quando este input estiver
    liberado para ser clicado
*/
.inputModal input.active{
    border: 0px solid #F9F9F9 !important;
    background-color: transparent !important;
    cursor: pointer !important;
}

.inputModal.readonly {
    border: none;
    cursor: default;
    background-color: transparent;
}

.inputModal.readonly input {
    color: #243E61;
    cursor: default;
    background-color: transparent;
}

.inputModal.linked:before {
    content: "\f127";
}

.inputModal.readonly:before {
    display: none;
}

.inputModal:before { 
    background-color: #FFF;
    color: #7F7F7F;
    padding: 14px 14px;
    content: "\f0c1";
    position: absolute;
    right: 1px;
    top: 0px;
    bottom: 0px;
    border-left: 1px solid #C4C4C4;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
    z-index: 2;
}