﻿::placeholder {
	color: var(--dark);
	opacity: .6;
}


::-ms-input-placeholder {
	color: var(--p1);
}

::-ms-input-placeholder {
	color: var(--p1);
}

.erro::placeholder {
	color: var(--t1);
	opacity: 1;
}

.erro::-ms-input-placeholder {
	color: var(--t1);
}

.erro::-ms-input-placeholder {
	color: var(--t1);
}

.account,
.support,
.new-cnpj {
	padding: 24px;
	border-radius: 10px;
}

form {
	display: flex;
	flex-wrap: wrap;
}

label {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: .25px;
	color: var(--p4);
	opacity: .6;
	margin-bottom: 8px;
}

label.label-option {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-between;
	align-items: center;
}

label.label-option a {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: flex-end;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: -.15px;
	font-weight: 500;
	text-transform: lowercase;
}

label.label-option a i {
	font-size: 16px;
	line-height: 1;
}

/* INPUT / SELECT / TEXTAREA */

input,
select,
.bootstrap-select button,
textarea {
	min-width: 100%;
	max-width: 100%;
	height: auto;
	padding: 12px;
	font-size: 14px;
	line-height: 21px;
	letter-spacing: .02em;
	border: 1px solid var(--gray);
	border-radius: 8px;
	background-color: transparent;
	color: var(--p900);
	outline: none;
}

input:focus,
select:focus,
textarea:focus,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	border-color: var(--p3);
	outline: none;
	box-shadow: none;
}

input.erro,
select.erro,
textarea.erro {
	border: solid var(--t) 1px !important;
	background-color: rgb(255 221 223 / 30%);
	color: var(--t);
}

input[disabled],
select[disabled],
textarea[disabled] {
	opacity: .6;
}

input[type=checkbox],
input[type=radio] {
	width: auto;
	min-width: auto;
	margin: 0;
	position: relative;
}

select {
	-webkit-appearance: none;
	background-image: url(../img/icons/down.svg);
	background-repeat: no-repeat;
	background-position: top 50% right 12px;
	opacity: .8;
}

select option {
	color: var(--dark);
	padding: 12px;
}

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
	width: 100%;
	max-width: 100%;
}

.bootstrap-select .dropdown-toggle:focus,
.bootstrap-select>select.mobile-device:focus+.dropdown-toggle,
.bootstrap-select button {
	outline: none !important;
	outline-offset: 0;
	border: 1px solid var(--gray);
}

.bootstrap-select>select {
	display: none !important;
}

.bootstrap-select .dropdown-menu {
	z-index: 1;
}

.bootstrap-select .dropdown-menu li a span.text {
	margin: 0 !important;
}

.bs-searchbox .form-control {
	margin-bottom: 0;
	width: 100%;
	height: auto;
	float: none;
	font-size: 14px;
	line-height: 20px;
	padding: 8px 12px;
	border-radius: 8px;
	box-shadow: none;
}

.btn-block {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	align-items: center;
}

.bs-actionsbox .btn-group button {
	min-width: 0;
}

.bootstrap-select .dropdown-menu li a {
	padding: 12px 16px;
}

#frm-atualiza-dados span {
	top: auto;
}

#frm-atualiza-dados .area-atuacao {
	gap: 0;
}

.form-check {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	padding: 0 0 0 4px;
	gap: 12px;
	margin-bottom: 8px;
}

.form-check label {
	margin: 0;
	width: calc(100% - 32px);
}

form .form-group {
	position: relative;
	width: 100%;
	flex: auto;
	max-width: 100%;
	padding: 0 15px;
	min-height: 1px;
	padding: 0 15px;
	margin-bottom: 24px;
}

form .form-group-1 {
	flex: 0 0 8.333333%;
	max-width: 8.333333%;
}

form .form-group-2 {
	flex: 0 0 16.666667%;
	max-width: 16.666667%;
}

form .form-group-3 {
	flex: 0 0 25%;
	max-width: 25%;
}

form .form-group-4 {
	flex: 0 0 33.333333%;
	max-width: 33.333333%;
}

form .form-group-5 {
	flex: 0 0 41.666667%;
	max-width: 41.666667%;
}

form .form-group-6 {
	flex: 0 0 50%;
	max-width: 50%;
}

form .form-group-7 {
	flex: 0 0 58.333333%;
	max-width: 58.333333%;
}

form .form-group-8 {
	flex: 0 0 66.666667%;
	max-width: 66.666667%;
}

form .form-group-9 {
	flex: 0 0 75%;
	max-width: 75%;
}

form .form-group-10 {
	flex: 0 0 83.333333%;
	max-width: 83.333333%;
}

form .form-group-11 {
	flex: 0 0 91.666667%;
	max-width: 91.666667%;
}

form .buttons {
	display: block;
	width: 100%;
	padding: 0;
}

form .buttons button {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 1.25px;
	text-transform: uppercase;
	color: var(--light);
	background-color: var(--p400);
	padding: 16px 32px;
	border: none;
	border-radius: 16px;
	margin-top: 32px;
	cursor: pointer;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}

form .buttons button[disabled] {
	cursor: default;
	opacity: .5;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}

.cities {
	border: 1px solid var(--gray);
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	padding: 8px;
	border-radius: 12px;
	background-color: #fafbff;
	position: relative;
	z-index: 0;
}

.cities span {
	display: initial;
	font-size: 12px;
	line-height: 18px;
	margin: 4px;
	width: auto;
	padding: 4px 24px 4px 8px;
	letter-spacing: .5px;
	color: var(--gray);
	background-color: #e3e3e3;
	border-radius: 8px;
	position: relative;
	display: none;
}

.cities span.selected {
	display: block;
}

.cities span:after {
	content: '';
	width: 16px;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 4px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z' fill='rgba(100,100,100,1)'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 14px;
	opacity: .5;
}

.city-select {
	display: none;
	max-height: 300px;
	overflow-y: scroll;
	padding: 24px 16px 16px 16px;
	border: 1px solid rgb(100 100 100 / 50%);
	margin-top: -10px;
	border-top: 0;
	border-radius: 0 0 12px 12px;
}

.city-select li {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: .5px;
	color: var(--gray);
	padding: 8px 12px;
	border: 1px solid rgb(187 187 187 / 50%);
	border-radius: 8px;
	margin: 4px 0;
	position: relative;
}

.city-select li.adicionado {
	border-color: var(--primary);
	color: var(--primary);
	background-color: rgb(0 79 173 / 10%);
}

.city-select li:after {
	content: '';
	width: 40px;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z' fill='rgba(100,100,100,1)'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 16px;
	opacity: .5;
}

.city-select li.adicionado:after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M5 11h14v2H5z' fill='rgba(0,79,173,1)'/%3E%3C/svg%3E");
}

#frm-atualiza-dados span {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: .5px;
	font-weight: 500;
	color: var(--p900);
	margin-bottom: 24px;
}

/* IMPORT CNPJ */

.cnpj h3 {
	font-size: 20px;
	line-height: 28px;
	letter-spacing: 0.25px;
	font-weight: 500;
	margin-bottom: 24px;
}

.cnpj .box-import {
	margin-bottom: 40px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
}

.cnpj .box-import input[type="file"] {
	display: none;
}

.cnpj .box-import .btn-import-file {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	align-items: center;
	gap: 14px;
	width: 100%;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 1.25px;
	padding: 16px;
	border-radius: 14px;
	background-color: var(--s);
	color: var(--light);
}

.cnpj .box-import .btn-import-file i {
	font-size: 20px;
	line-height: 1;
}

.cnpj .box-import form {
	width: 100%;
}

.cnpj .box-import form span {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 40px 12px;
	background-color: rgb(112 130 141 / 6%);
	border: 2px dashed var(--gray);
	border-radius: 22px;
	margin-top: 24px;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 1.25px;
	font-weight: 500;
	opacity: .8;
}

.cnpj .box-import form span i {
	font-size: 20px;
	line-height: 1;
}

.cnpj .box-import form span.file {
	color: var(--s3);
	border-color: var(--s3);
	background-color: rgb(42 191 191 / 4%);
}

/* DOCUMENTOS PENDENTES */

#solicita-doc .cont-item {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	gap: 12px;
	margin-top: 40px;
}

#solicita-doc .cont-item .h3 {
	font-size: 24px;
	line-height: 36px;
	letter-spacing: -.15px;
	font-weight: 500;
	text-align: center;
	width: 100%;
	margin: 0;
}

#solicita-doc .cont-item .h3 span {
	font-size: 16px;
	line-height: 24px;
	text-align: center;
	letter-spacing: .15px;
	display: block;
	width: 100%;
	color: var(--p);
	;
}

#solicita-doc #frm-docs {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-content: center;
	justify-content: center;
	align-items: center;
	gap: 24px;
	margin-top: 24px;
}

#solicita-doc #frm-docs .doc {
	width: 100%;
	display: block;
}

#solicita-doc #frm-docs .doc .h4 {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: .15px;
	font-weight: 500;
	margin: 0 0 4px;
}

#solicita-doc #frm-docs .doc input[type="file"] {
	display: none;
}

#solicita-doc #frm-docs .doc .input-file {
	width: 100%;
	height: 150px;
	border: 1px dashed;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 12px;
	color: var(--s);
	background-color: rgb(42 191 191 / 5%);
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
}

#solicita-doc #frm-docs .doc .input-file i {
	font-size: 24px;
	line-height: 1;
}

@media screen and (max-width: 768px) {

	.account,
	.support,
	.new-cnpj {
		background: transparent;
		padding: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.account {
		padding: 0;
	}

	form .form-group {
		margin-bottom: 40px;
	}

	form .form-group,
	form .form-group-2,
	form .form-group-3,
	form .form-group-4,
	form .form-group-5,
	form .form-group-6,
	form .form-group-7,
	form .form-group-8,
	form .form-group-9,
	form .form-group-10,
	form .form-group-11 {
		flex: 0 0 100%;
		max-width: 100%;
		padding: 0;
		margin-bottom: 24px;
	}

	form .buttons button {
		width: 100%;
	}

	form .buttons {
		text-align: center;
	}
}
#modal-importacao {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.8); 
	z-index: 9;
	display: none;
}

	#modal-importacao .modal-content {
	border-radius: 15px;
	overflow: hidden;
	position: relative;
	background-color: #fff;
	max-width: 372px; 
	margin: 20% auto; 
	padding: 20px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 
}

#modal-importacao .modal-content .close {
	position: absolute;
	top: 8px;
	right: 8px;
	background-color: #fff;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 12px rgba(0,0,0,0.5);
	border-radius: 20px;
}

			

#modal-importacao .modal-content p {
	font-family: "Roboto", sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #333;
	margin-bottom: 15px;
}
a.btn.btn-import-file {
	margin: 5px;
}