/* CHECKBOX + TOOGLE */
input.toggle {
max-height: 0;
max-width: 0;
opacity: 0;
display: none;
}
input.toggle + label {
display: inline-block;
position: relative;
box-shadow: inset 0 0 0px 1px #d5d5d5;
text-indent: -5000px;
height: 28px;
width: 50px;
border-radius: 15px;
margin-bottom: 0;
}

input.toggle + label:before {
content: "";
position: absolute;
display: block;
height: 28px;
width: 28px;
top: 0;
left: 0;
border-radius: 15px;
background: rgba(19,191,17,0);
-moz-transition: .25s ease-in-out;
-webkit-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}

input.toggle + label:after {
content: "";
position: absolute;
display: block;
height: 28px;
width: 28px;
top: 0;
left: 0px;
border-radius: 15px;
background: white;
box-shadow: inset 0 0 0 1px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.2);
-moz-transition: .25s ease-in-out;
-webkit-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}
input.toggle:checked + label:before {
width: 50px;
background: rgba(19,191,17,1);
}

input.toggle:checked + label:after {
left: 22px;
box-shadow: inset 0 0 0 1px rgba(19,191,17,1), 0 2px 4px rgba(0,0,0,.2);
}
.form-group input.toggle + label {
	display: block;
}

/* FORM - CAMPOS INVALIDOS */
form.ng-submitted .ng-invalid {
	border-color: red;
	background-color: #fff6f6;
}
form .not-valid {
	border-color: red;
}


/* STATUS */
span.status {
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: green;
}
span.status.bloqueado {
	background-color: red;
}


button.close {
    display: block !important;
}

.padding-0 {
	padding: 0px;
}

.inativo {
	background: #eee;
}

.notificar-error {
    color: red !important;
}

.notificar-error:after {
    content: '*';
    font-size: 22px;
    float: right;
    margin-top: -7px;
}
.cor-9 {
	font-size: 15px;
    color: #03bb10;
    font-weight: 400;
}

.status-cancelado {
    color: red;
    font-weight: 600;
}

.box-pedido-cancelado>.panel-heading{
    color: red;
}

input.toggle2 + label {
    display: inline-block;
    position: relative;
    box-shadow: inset 0 0 0px 1px #d5d5d5;
    text-indent: -5000px;
    height: 22px;
    width: 37px;
    border-radius: 15px;
    margin-bottom: 0;
    cursor: pointer;
}

input.toggle2 + label:before {
    content: "";
    position: absolute;
    display: block;
    height: 22px;
    width: 28px;
    top: 0;
    left: 0;
    border-radius: 15px;
    background: rgba(19,191,17,0);
    -moz-transition: .25s ease-in-out;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

input.toggle2 + label:after {
    content: "";
    position: absolute;
    display: block;
    height: 22px;
    width: 23px;
    top: 0;
    left: 0px;
    border-radius: 15px;
    background: white;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.2);
    -moz-transition: .25s ease-in-out;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

input.toggle2:checked + label:after {
    left: 16px;
    box-shadow: inset 0 0 0 1px rgba(19,191,17,1), 0 2px 4px rgba(0,0,0,.2);
}

input.toggle2:checked + label:before {
    width: 38px;
    background: rgba(19,191,17,1);
}

.swal2-popup {
    width: 50em !important;
}

.swal2-html-container {
    font-size: 16px;
    line-height: 22px;
}

.swal2-styled.swal2-confirm {
    font-size: 16px !important;
}

.swal2-styled.swal2-cancel {
    font-size: 16px !important;
}


.conversa-chatbot .tail-in{
	float: left;
	color: #1a9d1a;
	margin-top: -2px;
}

.conversa-chatbot .tail-out{
	float: right;
	color: #1a9d1a;
	margin-top: -2px;
}

.conversa-chatbot .mensagem{	
	max-width: 75%;
	overflow: hidden;
	padding: 10px 20px 10px;
	background: #1a9d1a;
	color: #fff;
	font-weight: bold;
}

.conversa-chatbot .mensagem.bot-message{
	float: left;
	border-radius: 0 5px 5px;
}

.conversa-chatbot .mensagem.user-message{
	float: right;
	border-radius:  5px 0 5px 5px;
}

.conversa-chatbot .list-group-item.user{
	text-align: right;
}

.conversa-chatbot .list-group{
	max-height: 400px;
	overflow-y: auto;
	background: #dfdfdf;
}

.conversa-chatbot .list-group .list-group-item{
	background: #dfdfdf;
}

#myBar {
    width: 1%;
    height: 30px;
    background-color: #02830a;
}