/* GERAL */
a, button{
	color: #404040;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	outline: 0;
}
a:focus, button:focus{ outline: 0; }
strong{ font-weight: 600; }
.divisor{
	background-color: #eee;
	margin: 15px 0;
	height: 1px;
}
.fr{ float: right; }
.fl{ float: left; }
.bt1{
	border-radius: 0;
	border: none;
	background: #000;
	/*background-image: -moz-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%); */
	box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.2);
	color: #fff;
	display: block;
	font-size: 16px;
	height: 50px;
	line-height: 51px;
	padding: 0;
	position: relative;
	text-align: center;
	text-transform: uppercase;
	width: 220px;
}
.bt1.disabled{ cursor: not-allowed; }
.bt1:not(.bt2):not(.bt3):not(.bt4):hover{	
	box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.2), inset 0 -240px rgba(255,255,255, 1);
	color: #000;
}
.bt2{
	background: #fff;
	color: #999;
}
.bt2:hover{ background: #f3f3f3;  }
.bt3{ background: #999; }
.bt3:hover{ background: #858585;  }
.bt4{
	background-image: -moz-linear-gradient( 0deg, rgb(0,173,238) 0%, rgb(0,131,180) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(0,173,238) 0%, rgb(0,131,180) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(0,173,238) 0%, rgb(0,131,180) 100%);
}
.bt4:hover{	
	box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.2), inset 0 -240px rgba(0,102,166,0.4);
}
.lcase{ text-transform: lowercase; }
.dropdown-toggle{
	background-color: #fff !important;
	border-color: #c4c4c4 !important;
	color: #808080!important;
	padding: 13px 10px;
	min-width: 200px;
	text-align: left;
	outline: none !important;
}
.open .dropdown-toggle{ 
	background: #fff !important; 
	border-color: #a4a4a4!important;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
}
.dropdown-menu > li > a{ padding: 3px 10px;  }
.dropdown-toggle{ position: relative; }
.dropdown-toggle .caret{
	position: absolute;
	top: 20px;
	right: 11px;
}

/* HEADER ///////*/
header{}
header .topbar{
	min-height: 70px;
	position: relative;
	z-index: 2;
}
header .topbar .logo{ 
	float: left; 
	margin-top: 10px;
}
header .topbar .logo img{
	float: left;
}
header .topbar .logo span{
	color: #707070;
	float: left;
	font-size: 14px;
	font-weight: 300;
	margin: 20px 0 0 20px;
}
header .topbar .col-right{ float: right; }
header .topbar .login{
	float: left;
	margin-top: 12px;
	padding-bottom: 5px;
	position: relative;
}
header .topbar .login .seta{
	background-color: #000;
	border-radius: 50%;
	color: #fff;
	font-size: 12px;
	height: 16px;
	position: absolute;
	right: 0;
	text-indent: 4px;
	line-height: 16px;
	bottom: 5px;
	width: 16px;
}
header .topbar .login .txt{
	color: #707070;
	float: left;
	font-weight: 300;
    margin: 14px 8px 0 0;
}
header .topbar .login .txt strong{ 
	color: #404040;
	font-weight: 400; 
}
header .topbar .login .img{
	background-color: #eee;
	border-radius: 50%;
	float: right;
	height: 46px;
	overflow: hidden;
	width: 46px;
}
header .topbar .login .img img{
	display: block;
	width: 100%;
}
header .topbar .login .drop{
	background-color: #fff;
	border: 1px solid #c4c4c4;
	border-radius: 5px;
	box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.1);
	padding: 5px 10px 5px 13px;
	position: absolute;
	right: 23px;
	top: 50px;
	transform: translate(50%, -10px);
	opacity: 0;
	visibility: hidden;
	transition: all .2s cubic-bezier(0.42, 0, 0.29, 1.3);
	min-width: 100px;
}
header .topbar .login:hover .drop{
	visibility: visible;
	opacity: 1;
	transform: translate(50%, 0);	
}
header .topbar .login .drop a{
	color: #707070;
	font-size: 12px;
	float: left;
	clear: both;
	height: 20px;
	line-height: 20px;
	margin: 5px 0;
}
header .topbar .login .drop a span{
	background-color: #000;
	border-radius: 50%;
	color: #fff;
	font-size: 11px;
	height: 20px;
	float: left;
	line-height: 20px;
	margin-right: 5px;
	text-align: center;
	width: 20px;
}
header .topbar .login .drop a span.icon-tela{ 
	font-size: 9px; 
	line-height: 22px;
}
header .link-login{
	font-weight: 600;
	color: #000;
	text-decoration: none;
}
header .link-login:hover{ text-decoration: underline; }
header .topbar .idioma{
	border-left: 1px solid #eee;
	float: left;
	height: 25px;
	margin: 21px 0 0 20px;
	padding-left: 20px;
	position: relative;
}
header .topbar .idioma span,
header .topbar .idioma .drop a{ 
	color: #707070;
	display: block;
	font-size: 12px;
	line-height: 25px;
	padding-right: 30px;
	position: relative;
}
header .topbar .idioma .drop a{ margin: 5px 0; }
header .topbar .idioma span:after,
header .topbar .idioma .drop a:after{
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 50%;
	content: "";
	height: 20px;
	position: absolute;
	top: 2px;
	right: 0;
	width: 20px;
}
header .topbar .idioma .ico-idioma-1:after{ background-image: url(../imgs/idioma-1.jpg); }
header .topbar .idioma .ico-idioma-2:after{ background-image: url(../imgs/idioma-2.jpg); }
header .topbar .idioma .drop{
	background-color: #fff;
	border: 1px solid #c4c4c4;
	border-radius: 5px;
	box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.1);
	padding: 5px 23px 5px 10px;
	position: absolute;
	right: -24px;
	top: -11px;
	opacity: 0;
	visibility: hidden;
	transition: all .2s ease-in-out;
}
header .topbar .idioma:hover .drop{
	opacity: 1;
	visibility: visible;
}
header .topbar .idioma .drop a{
	clear: both;
	float: right;
}
header .topbar .idioma .seta{
	position: absolute;
	right: -16px;
	top: 7px;
	color: #707070;
	font-size: 12px;
}
header .menu{
	background-color: #000;
	height: 90px;
}
header .menu a{ 
	color: #fff; 
	font-size: 16px;
	font-weight: 300;
	position: relative;
	padding-bottom: 10px;
}
header .menu a:after{
	background-color: #fff;
	content: "";
	height: 2px;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 50px;
	transform: scaleX(0);
	transition: all .2s cubic-bezier(0.42, 0, 0.29, 1.3);
	transform-origin: 0 0;
}
header .menu a:hover:after{
	transform: scaleX(1);
}
header .menu nav{ margin-top: 35px; }
header .menu nav li{
	float: left;
	margin-left: 87px;
}
header .menu nav li:first-child{ margin-left: 0; }
header .linha-menu{
	height: 1px;
	background-color: #eee;
}
.enviar-novas-artes .menu .item1:after,
.suas-artes .menu .item2:after,
.suas-vendas .menu .item3:after,
.seus-dados .menu .item4:after,
.fale-conosco .menu .item5:after,
.perguntas-frequentes .menu .item6:after{
	transform: scaleX(1);
}


/* HOME */
.home .main h2{
	border-bottom: 1px solid #4a4a4a;
	font-size: 24px;
	font-weight: 600;
	margin: 45px 0 20px;
	padding-bottom: 20px;
	text-transform: uppercase;
}
.home .como-funcionamos{
	color: #4a4a4a;
	font-size: 15px;
	font-weight: 500;
}
.home .como-funcionamos h2{ 
	margin-top: 0; 
	color: #000;
	border-color: #000;
}
.home ul{ padding-left: 20px; }
.home .como-funcionamos li{
	margin-bottom: 24px;
}
.home .como-funcionamos li span{ font-weight: 600; }
.home .galerias .nome{
	position: absolute;
    right: 0;
    bottom: 20px;
    height: 67px;
    background-color: #fff;
    line-height: 67px;
    padding: 0 20px;
    text-transform: uppercase;
    font-size: 20px;
}
.home .galerias .nome strong{
	color: #ec008c;
	font-weight: 700;
}
.home .presenca-online .conteudo{
	background: url('../imgs/bg-online.jpg') no-repeat center;
	background-size: cover;
	height: 571px;
	position: relative;
	width: 100%;
}
.home .presenca-online .conteudo h3{
	color: #000;
	font-size: 24px;
	font-weight: 600;
	margin: 80px 0 20px;
}
.home .presenca-online .conteudo li{
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -.5px;
	margin-bottom: 20px;
}
.home .presenca-online .conteudo span{ 
	color: #707070;
	font-size: 11px; 
	font-weight: 500;
}

.home .nosso-suporte h2{ border-color: #eeeeee; }

.home .nosso-suporte .itens h3{
	color: #000;
	font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
}
.home .nosso-suporte .itens div.info{
	height: 384px;
	position: relative;
	width: 100%;
}
.home .nosso-suporte .itens div.newsletter .info{
	background: url('../imgs/img-newsletter.jpg') no-repeat center;
}
.home .nosso-suporte .itens div.social-media .info{
	background: url('../imgs/img-social-media.jpg') no-repeat center;
}
.home .nosso-suporte .itens div.eventos .info{
	background: url('../imgs/img-eventos.jpg') no-repeat center;
}
.home .nosso-suporte .itens div.artistas .info{
	background: url('../imgs/img-artistas.jpg') no-repeat center;
}
.home .nosso-suporte .itens div.info .txt{
	background: url('../imgs/bg-itens-black.png') no-repeat bottom center;
	bottom: 0;
	display: table;
	height: 130px;
	padding: 15px 20px;
	position: absolute;
	width: 100%;
}
.home .nosso-suporte .itens div.info .txt p{
	color: #fff;
	display: table-cell;
	font-size: 15px;
	text-transform: uppercase;
	vertical-align: bottom;
}

.home .condicoes{ margin-bottom: 40px; }
.home .condicoes a{
	background: #000;
	/*background: -moz-linear-gradient(left, #fe018f 0%, #ff5eb8 100%);
	background: -webkit-linear-gradient(left, #fe018f 0%,#ff5eb8 100%);
	background: linear-gradient(to right, #fe018f 0%,#ff5eb8 100%); */
	border: 0;
	border-radius: 5px;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, .3);
	color: #fff;
	cursor:  pointer;
	display: block;
	font-size: 16px;
	font-weight: 500;
	height: 60px;
	line-height: 60px;
	margin-bottom: 20px;
	padding: 0 20px;
	position: relative;
}
.home .condicoes a:before{
	background: url('../imgs/seta.png') no-repeat;
	border: 0;
	content: "";
	display: block;
    height: 9px;
    margin-top: -4.5px;
    position: absolute;
    right: 20px;
    top: 50%;
	width: 14px;
	transform: rotate(-90deg);
}

.home .cadastro{ background: #eeeeee; }
.home .cadastro .criar-conta{
	margin: 30px 0 40px;
	float: left;
	padding-right: 90px;
	width: 50%;
}
.home .cadastro .entrar{
    width: 50%;
    margin-top: 60px;
}
.home .cadastro .entrar h3{
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 500;
	margin-bottom: 20px;
}
.home .cadastro label,
.home .fale-conosco label{
	color: #4a4a4a;
	font-weight: 600;
}
.home .cadastro .form-control,
.home .fale-conosco .form-control{
	color: #808080;
	font-weight: 500;
}
.form-control[type="password"]{
	font-size: 30px;
}
.home .cadastro .termos{ 
	color: #4a4a4a;
	font-size: 15px;
	font-weight: 500;
	text-align: center; 
}
.home .cadastro .termos span{ margin-left: 5px; }
.home .cadastro .bt1{
	font-weight: 500;
	margin-top: 10px;
	margin-bottom: 10px;
	width: 100%;
}


.home .fale-conosco{ font-weight: 500; }
.home .fale-conosco{ font-size: 16px; }
.home .fale-conosco .form{ margin-top: 40px; }
.home .fale-conosco .bt1{ width: 470px; }




/* FOOTER ///////*/
footer .divulgue{
	border-top: 1px solid #eee;
	height: 60px;
}
footer .divulgue p{
	float: left;
	font-size: 16px;
	line-height: 60px;
}
footer .divulgue p a{ 
	color: #ff018f; 
	margin-left: 20px;
	position: relative;
	text-decoration: underline;
}
footer .divulgue p a span{ 
	font-size: 10px;
    padding-left: 5px;
    position: absolute;
    right: -19px;
    text-decoration: none;
    top: 6px;
}
footer .divulgue a:hover{ text-decoration: none; } 
footer .menu{
	background-color: #403e40;
	color: #fff;
}
footer .menu nav .row{ 
	padding-bottom: 30px; 
	padding-top: 30px; 
	border-top: 1px solid #fff;
}
footer .menu nav .row:first-child{ border-top: none;  }
footer .menu h2{
	font-size: 19px;
	text-transform: uppercase;
}
footer .menu ul{ 
	list-style: none; 
	padding: 0;
}
footer .menu a{ 
	color: #fff; 
	display: inline-block;
	font-size: 16px;
	font-weight: 300;
	margin-bottom: 8px;
}
footer .menu h2 a{ 
	font-weight: 400; 
	font-size: 19px;
}
footer .menu a:hover{
	text-decoration: underline;
}
footer .info{ min-height: 80px; }
footer .info p{
	color: #707070;
	font-size: 11px;
	float: left;
	margin-top: 24px;
}
footer .info .logo{
	margin-top: 26px;
	float: right;
}
footer .info .logo img{
	width: 182px;
}


/* CONTEUDO ///////*/
/* GERAL */
.main{ 
	padding: 50px 0 65px;
}
.main .tit2{ 
	font-size: 20px; 
	margin: 10px 0 0;
}
.main .conteudo h1{ 
	font-size: 30px; 
	margin: 10px 0 20px;
}
.main .conteudo h2{ 
	border-bottom: 1px solid #eee;
	font-size: 20px; 
	margin-top: 40px;
	padding-bottom: 15px;
}
.main p.firstp{
	font-size: 16px;
}
.main .conteudo a, a.cor2{
	color: #000;
	font-weight: 500; 
	text-decoration: underline;
}
.main .conteudo a:hover, a.cor2:hover{ text-decoration: none; }
.main .cor2{ color: #000; }
.main .cor3{ color: #707070; }
.main .aba-lateral .item {
	border-right: 2px solid #eee;
	color: #999;
	display: block;
	font-size: 14px;
	margin-bottom: 40px;
	padding-right: 30px;
	text-align: center;
	width: 120px;
	transition: border .25s ease-in-out;
}
.main .aba-lateral .item:hover{ border-color: #cecece; }
.main .aba-lateral .item .ico{
	background-color: #eee;
	border-radius: 50%;
	font-size: 20px;
	height: 68px;
	margin: 0 auto 10px;
	line-height: 68px;
	width: 68px;
	transition: box-shadow .25s ease-in-out;
}
.main .aba-lateral .item:hover .ico{
	box-shadow: 0 0 90px rgba( 0,0,0, .15) inset;
}
.main .aba-lateral .item .icon-janelas{ font-size: 24px; }
.main .aba-lateral .item .icon-img{ font-size: 23px; }
.main .aba-lateral .item .icon-doc{ font-size: 28px; }
.main .aba-lateral .item .icon-upload{ font-size: 32px; }
.main .aba-lateral .item .icon-money{ font-size: 24px; }
.main .aba-lateral .item .icon-dash{ font-size: 25px; }
.main .aba-lateral .item .icon-ok{ font-size: 14px; }
.main .aba-lateral .item .icon-relogio{ font-size: 22px; }
.main .aba-lateral .item .icon-x{ font-size: 18px; }

.enviar-novas-artes .como-enviar-arte .aba-lateral .item1,
.enviar-novas-artes .formatos-possiveis .aba-lateral .item2,
.enviar-novas-artes .enviar-novas-artes .aba-lateral .item3,
.enviar-novas-artes .termos-uso .aba-lateral .item4,
.suas-artes .artes-aprovadas .aba-lateral .item1,
.suas-artes .artes-pendentes .aba-lateral .item2,
.suas-artes .artes-reprovadas .aba-lateral .item3,
.suas-artes .series .aba-lateral .item4,
.suas-artes .landing-page .aba-lateral .item5,
.suas-artes .remover-artes .aba-lateral .item6,
.suas-vendas .tabela .aba-lateral .item1,
.suas-vendas .dashboard .aba-lateral .item2{ 
	border-color: #000;
	color: #000;
	font-weight: 600;
}
.enviar-novas-artes .como-enviar-arte .aba-lateral .item1 .ico,
.enviar-novas-artes .formatos-possiveis .aba-lateral .item2 .ico,
.enviar-novas-artes .enviar-novas-artes .aba-lateral .item3 .ico,
.enviar-novas-artes .termos-uso .aba-lateral .item4 .ico,
.suas-artes .artes-aprovadas .aba-lateral .item1 .ico,
.suas-artes .artes-pendentes .aba-lateral .item2 .ico,
.suas-artes .artes-reprovadas .aba-lateral .item3 .ico,
.suas-artes .series .aba-lateral .item4 .ico,
.suas-artes .landing-page .aba-lateral .item5 .ico,
.suas-artes .remover-artes .aba-lateral .item6 .ico,
.suas-vendas .tabela .aba-lateral .item1 .ico,
.suas-vendas .dashboard .aba-lateral .item2 .ico{ 
	background-color: #000; 
	color: #fff;
	box-shadow: none;
}

.main .big-icons{ 
	margin: 50px 0 0; 
	float: left;
	width: 100%;
}
.main .big-icons .item{
	float: left;
	margin-left: 48px;
}
.main .big-icons .item:first-child{ margin-left: 0; }
.main .big-icons .item .ico{
	align-items: center;
	border-radius: 5px;
	background: #000;
	/*
	background-image: -moz-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	*/
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
	color: #fff;
	display: inline-flex;
	font-size: 50px;
	height: 200px;
	position: relative;
	text-align: center;
	width: 200px;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: center;
}
.main .big-icons .item .icon-money{ font-size: 60px; }
.main .big-icons .item .icon-divulga{ font-size: 40px; }
.main .big-icons .item .icon-tela{ font-size: 44px; }
.main .big-icons .item .icon-dpi:before{
	background: url(../imgs/ico-dpi.png) no-repeat center;
	content: "";
	height: 74px;
}
.main .big-icons .item .icon-cromatico:before{
	background: url(../imgs/ico-cromatico.png) no-repeat center;
	content: "";
	height: 87px;
}
.main .big-icons .item .ico:before{ width: 100%; }
.main .big-icons .item .ico>span{
	color: #fff;
	display: block;
	font-size: 16px;
	text-transform: uppercase;
	text-align: center;
	width: 100%;
}
.main .big-icons .item>span{
	color: #707070;
	display: block;
	margin-top: 10px;
	text-align: center;
}
.main .big-icons .item .ico .txt{
	display: block;
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 26px;
    padding-top: 10px;
}
.main .box-orientacoes h2{ line-height: 30px; }
.main .box-orientacoes h2:before{
	background: #ff7200 url(../imgs/ico-alerta.png)	no-repeat center;
	border-radius: 50%;
	content: "";
	float: left;
	margin-right: 10px;
	height: 30px;
	width: 30px;
}
.main .box-orientacoes ul{
	padding-left: 20px;
	line-height: 22px;
}
.main .alert{
	border: 1px solid #c4c4c4;
	box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.1);
	color: #707070;
	font-size: 14px;
	margin-top: 20px;
	padding: 20px 20px 20px 60px;
	position: relative;
}
.main .alert2{ padding: 10px 20px 10px 60px; }
.main .alert:before{
	background-color: #ff7200;
	border-radius: 50%;
	content: "!";
	color: #fff;
	height: 21px;
	left: 20px;
	line-height: 21px;
	margin-top: -10px;
	position: absolute;
	text-align: center;
	top: 50%;
	width: 21px;
}
.main .alert-seta{ position: relative; }
.main .alert-seta:after, .main .alert-seta-2:after{
	background-color: #fff;
	border-bottom: 1px solid #c4c4c4;
	border-left: 1px solid #c4c4c4;
	content: "";
	height: 8px;
    left: -5px;
    margin-top: -5px;
    position: absolute;
    top: 50%;
    width: 8px;
    transform: rotate(45deg);
}
.main .alert-seta-2:after{
	top: 0;
	left: 30px;
	transform: rotate(135deg);
}
.msg{
	color: #707070;
	font-size: 13px;
	margin-top: 10px;
	padding-left: 30px;
	position: relative;
}
.msg:before{
	background-color: #ff7200;
	border-radius: 50%;
	content: "!";
	color: #fff;
	height: 21px;
	left: 0;
	line-height: 21px;
	margin-top: -10px;
	position: absolute;
	text-align: center;
	top: 50%;
	width: 21px;
}
.main .bts{
	margin-top: 20px;
	float: right;
}
.main .bts span{
	color: #999;
	display: block;
	font-size: 12px;
	margin-top: 5px;
	text-align: center;
}
.box-sombra{
	border: 1px solid #c4c4c4;
	border-radius: 5px;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
	padding: 20px 15px 0 20px;
}

/* PAGINACAO */
.pagination{ float: right; }
.pagination > li:first-child > a, .pagination > li:first-child > span{ border: none; }
.pagination > li > a{ 
	border: none; 
	color: #999;
	margin: 0 3px;
	padding: 3px 9px;
}
.pagination > .active > a{ border-radius: 5px; }
.pagination > li > a:hover{ 
	color: #404040;
}
.pagination .icon-angle-left,
.pagination .icon-angle-right{ 
	font-size: 30px;
    line-height: 18px;
    margin: 0 5px;
}


/* ENVIAR NOVAS ARTE */
.main .player{
	background: url(../imgs/cover-video.jpg) no-repeat center;
	height: 532px;
	position: relative;
	width: 945px;
}
.main .player:after{
	background-color: rgba(48,48,48,.6);
	content: "";
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.main .player iframe{
	position: relative;
	z-index: 2;
}
.main .player a{
	position: absolute;
	color: #ccc;
	text-decoration: none;
	font-size: 50px;
	z-index: 3;
	left: 50%;
	top: 50%;
	opacity: .8;
	transform: translate(-50%, -50%);
}
.main .player a:hover{
	opacity: 1;
}

/* ENVIAR NOVAS ARTE: Formatos possiveis */
.formatos { margin-top: 40px; }
.formatos .abas{
	border-bottom: 1px solid #eee;
	margin-bottom: 20px;
	height: 41px;
}
.formatos .abas div{
	cursor: pointer;
	float: left;
	font-size: 16px;
	line-height: 20px;
	margin-right: 40px;
	padding-bottom: 18px;
	position: relative;
	transition: color .2s ease-in-out;
}
.formatos .abas div.item5{ margin-right: 0; }
.formatos .abas div:hover{ color: #707070; }
.formatos .abas div.ativo{ color: #ff008f; }
.formatos .abas div:before{
	border: 2px solid #404040;
	content: "";
	float: left;
	height: 26px;
	margin-right: 7px;
	width: 20px;
	transition: border .2s ease-in-out;
	margin-top: -4px;
}
.formatos .abas div.item2:before{ width: 26px; height: 20px; margin-top: -1px; }
.formatos .abas div.item3:before{ width: 40px; height: 20px; margin-top: -1px; }
.formatos .abas div.item4:before{ width: 20px; height: 40px; margin-top: -10px; }
.formatos .abas div.item5:before{ width: 20px; height: 20px; margin-top: -1px; }
.formatos .abas div:hover:before{ border-color: #707070; }
.formatos .abas div.ativo:before{ border-color: #ff008f; }
.formatos .abas div:after{
	background-color: #ff008f;
	content: "";
	height: 2px;
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	transition: transform .2s ease-in-out;
	transform-origin: 0 0;
	transform: scaleX(0);
}
.formatos .abas div.ativo:after{ 
	transform: scaleX(1);
}
.formatos .parede{
	background: url(../imgs/parede-formatos.jpg) no-repeat center bottom;
	height: 550px;
	position: relative;
	width: 945px;
	transition: height .2s ease-in-out;
}
.formatos .parede.tamanho2{ height: 902px; }
.formatos .parede .quadros{
	background: no-repeat center;
	position: absolute;
	opacity: 0;
	height: 550px;
	transition: opacity .2s ease-in-out;
}
.formatos .parede .quadros.ativo{ opacity: 1; }
.formatos .parede .quadros.retrato { 
	background-image: url(../imgs/quadros-ambiente-retrato.png); 
	left: 210px;
	top: 10px;
	height: 370px;
	width: 528px;
}
.formatos .parede .quadros.paisagem { 
	background-image: url(../imgs/quadros-ambiente-paisagem.png); 
	left: 158px; 
	top: 50px;
	height: 276px;
	width: 578px;
}
.formatos .parede .quadros.panoramicoh{ 
	background-image: url(../imgs/quadros-ambiente-panoramicoh.png);
	left: 55px;
	top: 50px;
	height: 260px;
	width: 699px;
}
.formatos .parede .quadros.panoramicov { 
	background-image: url(../imgs/quadros-ambiente-panoramicov.png);
	left: 367px;
	top: 22px;
	height: 699px;
	width: 260px;
}
.formatos .parede .quadros.quadrado {
	background-image: url(../imgs/quadros-ambiente-quadrado.png);
	left: 220px;
	top: 52px;
	height: 275px;
	width: 517px;
}

.formatos .leg{
	color: #707070;
	font-size: 12px;
	float: left;
	margin-top: 35px;
}

/* ENVIAR NOVAS ARTE: Envio */
.abas-envio{
	border-bottom: 1px solid #eee;
	height: 30px;
	margin: 40px 0;
	position: relative;
}
.abas-envio:after{
	background-color: #000;
	/*
	background-image: -moz-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	*/
	box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.2);
	border-radius: 3px;
	content: "";
	height: 6px;
	position: absolute;
	bottom: -3px;
	left: 0;
	transition: width .2s ease-in-out;
}
.passo1 .abas-envio:after{ width: 152px; }
.passo2 .abas-envio:after{ width: 322px; }
.passo3 .abas-envio:after{ width: 527px; }
.passo4 .abas-envio:after{ width: 764px; }
.passo5 .abas-envio:after{ width: 945px; }
.abas-envio .aba{
	color: #a7aab3;
	float: left;
	font-size: 16px;
	margin-left: 93px;
	transition: color .2s ease-in-out;
}
.abas-envio .aba:first-child{ margin-left: 0; }
.passo1 .abas-envio .aba1,
.passo2 .abas-envio .aba:not(:nth-child(1n+3)),
.passo3 .abas-envio .aba:not(:nth-child(1n+4)),
.passo4 .abas-envio .aba:not(:nth-child(1n+5)),
.passo5 .abas-envio .aba:not(:nth-child(1n+6)){ color: #000; font-weight: 600; }
.passos-envio>div{ display: none; }
.passo1 .passo-envio-1 { display: block; }
.passo2 .passo-envio-2 { display: block; }
.passo3 .passo-envio-3 { display: block; }
.passo4 .passo-envio-4 { display: block; }
.passo5 .passo-envio-5 { display: block; }
.passos-envio .box-sombra{ margin: 50px 0 60px; }
.passos-envio .box-sombra ul{
	padding-left: 10px;
}
.passos-envio .box-sombra ul li{
	font-size: 13px;
	color: #707070;
	padding-bottom: 10px;
}
.passos-envio .campo-inline{ margin-right: 50px; }
.box-infos{ padding-bottom: 10px; }
.box-infos .infos{
	margin: 0;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: .3s ease-in-out;
}
.box-infos .infos.ativo{
	max-height: 200px;
	opacity: 1;
	transition-delay: .3s;
}
.passo-envio-1 .bts{ 
	position: relative; 
	width: 220px;
}
.passo-envio-1 .bts span{
	margin-top: 60px;
}
.passo-envio-1 .bts .bt1{
	position: absolute;
	top: 0;
	opacity: 0;
	visibility: hidden;
	transition: all .2s ease-in-out;
}
.passo-envio-1 .bts .bt1.ativo{
	position: absolute;
	top: 0;
	opacity: 1;
	visibility: visible;
}
.passo-envio-2 .sucesso{
	position: absolute;
	text-align: center;
	font-size: 14px;
	color: #707070;
	background: #fff;
	width: 250px;
	height: 320px;
	top: -30px;
	transition: all .3s ease-in-out;
	opacity: 0;
	visibility: hidden;
}
.passo-envio-2 .sucesso.exibe{
	opacity: 1;
	visibility: visible;
}
.passo-envio-2 .sucesso .ico{
	align-items: center;
	border-radius: 5px;
	background-image: -moz-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
	color: #fff;
	display: inline-flex;
	font-size: 50px;
	height: 240px;
	position: relative;
	text-align: center;
	width: 240px;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: center;
	margin-bottom: 10px;
}

.passo-envio-2 .sucesso a{
	text-decoration: underline;
	color: #ff008f;
}
.passo-envio-2 .sucesso a:hover{ text-decoration: none; }
.passo-envio-2 .upload{
	float: left;
	margin-top: 100px;
	position: relative;
	width: 510px;
}
.passo-envio-2 .upload .bt1{ float: left; }
.passo-envio-2 .upload .msg{
	float: left;
	margin-left: 30px;
	width: 260px;
}
.passo-envio-2.finalizado .upload .msg{ display: none; }
.passo-envio-2 .upload .box-sombra{
	clear: left;
	float: left;
	margin-top: 20px;	
	position: relative;
}
.passo-envio-2 .upload .loading{
	background-color: #fff;
	position: absolute;
	height: 100%;
	left: 0;
	top: 0;
	width: 100%;
	visibility: hidden;
	opacity: 0;
	transition: all .3s ease-in-out;
}
.passo-envio-2.upload-img .upload .loading{
	opacity: 1;
	visibility: visible;
}
.passo-envio-2 .upload .loading .cont{
	background-image: -moz-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	border-radius: 15px;
	position: absolute;
	top: 90px;
	width: 0%;
	padding-left: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	color: #707070;
	transition: width .2s ease-out;
}
.passo-envio-2 .upload .loading .cont span{ 
	color: #fff; 
	font-size: 12px;
	font-weight: 300;
	width: 100%;
	position: absolute;
	left: 0;
	line-height: 30px;
	top: 0;
}
.passo-envio-2 .upload .loading .cont span:after{ content: " %" }
.form-upload-ajax{
	height: 0;
	overflow: hidden;
	visibility: hidden;
}
.lista-erros { margin: -15px 0; }
.lista-erros .msg{
	border-top: 1px solid #eee;
	margin: 0;
	padding-bottom: 20px;
	padding-top: 20px;
}
.lista-erros .msg:first-child{ border-top: none; }
.img-preview{ width: 292px; }
.img-preview .img{
	background: #eee no-repeat center;
	background-size: contain;
	border: 1px solid #eee;
	margin-top: 30px;
	height: 384px;
	width: 292px;
}
.img-preview .replace{
	background: #eee;
	text-align: center;
	line-height: 384px;
	font-size: 64px;
	color: #909090;
	height: 100%;
	position: relative;
	width: 100%;
	transition: all .3s ease-in-out;
}
.finalizado .img-preview .replace{ 
	opacity: 0; 
	visibility: hidden; 
}
.download-img .img-preview .replace:after{
	border: 3px solid rgba(144, 144, 144, 0.39);
	border-bottom: 3px solid rgb(144, 144, 144);
	border-radius: 50%;
	content: "";
	height: 30px;
	left: 50%;
	margin-left: -15px;
	position: absolute;
	top: 270px;
	width: 30px;
	animation: rotateLF .6s linear infinite;
}
@keyframes rotateLF{
    from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}

.img-preview img{
	display: block;
	width: 100%;
}
.img-preview .bt1{ 
	width: 260px; 
	margin: 15px auto 0;
}
.passo-envio-2 .img-preview .bt1{ 
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease-in-out;
}
.passo-envio-2.finalizado .img-preview .bt1{
	opacity: 1;
	visibility: visible;
}
.bootstrap-tagsinput{
	padding: 60px 0 0;
	position: relative;
}
.edicao-tags .bootstrap-tagsinput{
	width: 490px;
}
.bootstrap-tagsinput .label{
	background-color: #ff008f;
	border-radius: 5px;
	display: inline-block;
	color: #fff;
	font-size: 14px;
	font-weight: 400;
	height: 30px;
	line-height: 30px;
	margin: 0 10px 10px 0;
	padding: 0 23px 0 10px;
	position: relative;
}
.bootstrap-tagsinput .label:before{ content: "#"; }
.bootstrap-tagsinput .label span{
	cursor: pointer;
	position: absolute;
    width: 17px;
    right: 2px;
    font-size: 24px;
    opacity: .8;
	transition: opacity .2s ease-in-out;
}
.bootstrap-tagsinput .label span:hover{ opacity: 1; }
.bootstrap-tagsinput .label span:after{	content: '×'; }
.bootstrap-tagsinput .twitter-typeahead{
    position: absolute !important;
    top: 0;
    left: 0;
}
.bootstrap-tagsinput .twitter-typeahead input{
	border: 1px solid #c4c4c4;
	border-radius: 4px;
	color: #808080;
    margin-bottom: 10px;
    height: 46px;
    outline: 0!important;
    padding: 10px 12px;
    width: 490px;
}
.edicao-tags .bootstrap-tagsinput input{ width: 430px; }
.bootstrap-tagsinput input:focus{
	border-color: #a4a4a4;
    outline: 0;
    -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
}
.tt-menu{
	background: #fff;
	border: 1px solid #c4c4c4;
	color: #999;
	padding: 5px 10px;
	border-radius: 5px;
	margin-top: -20px;
	margin-left: 10px;
}
.tt-menu .tt-highlight{
	color: #707070;
	font-weight: 500;
}
.tt-menu .tt-suggestion:hover .tt-highlight,
.tt-menu .tt-suggestion:hover{ 
	cursor: pointer;
	color: #ff008f; 
}
.tt-menu .tt-cursor,
.tt-menu .tt-cursor .tt-highlight{ color: #ff008f; }
.tags{ margin-top: 15px; }
.tags > div{
	background-color: #ff008f;
	border-radius: 5px;
	display: inline-block;
	color: #fff;
	font-size: 14px;
	font-weight: 400;
	height: 30px;
	line-height: 30px;
	margin: 0 10px 10px 0;
	padding: 0 10px;
	position: relative;
}
.tags > div:before{ content: "#"; }
.tags span{ float: left; }
.tags .del{
	float: right;
	margin-left: 6px;
	cursor: pointer;
	font-size: 24px;
	margin-right: -10px;
	padding-right: 6px;
	opacity: .8;
	transition: opacity .2s ease-in-out;
}
.tags .del:hover{ opacity: 1; }
.resumo-arte{ 
	float: left;  
	margin: 24px 0 0 50px;
}
.resumo-arte .tags{ 
	margin-top: 0; 
	width: 600px;
}

.box-cor{
	border: 1px solid #c4c4c4;
	float: left;
	margin: 2px 10px 0 0;
	height: 14px;
	width: 14px;
}
.campo-disabled{
	background-color: #f5f5f5;
	cursor: not-allowed;
}
.campo-cor{ line-height: 26px; }
.campo-cor .box-cor{ margin-top: 5px; }
.passos-envio .radiobox{ padding-right: 20px; }


/* ENVIAR NOVAS ARTE: Termos de uso */
.main .conteudo.termos ol{
	list-style-position: inside;
	padding: 20px 0 0;
}
.main .conteudo.termos ol li{ 
	color: #707070;
	padding-top: 10px; 
}
.main .conteudo.termos ol li strong{ color: #404040; } 


/* SUAS ARTES */
.filtro .item{
	float: left;
	margin-right: 30px;
}
.filtro span{
	color: #999;
	display: inline-block;
	font-size: 12px;
	margin-bottom: 10px;
	text-transform: uppercase;
}
.campo-hidden{
	visibility: hidden;
	height: 0;
}
.listagem-artes{ 
	padding-top: 15px; 
	overflow: hidden;
}
.listagem-artes .arte{
	float: left;
	height: 404px;
	margin-right: 139px;
	position: relative;
	width: 222px;
}
.listagem-artes .arte.editar-arte{ cursor: pointer; }
.listagem-artes .arte.loading{ cursor: not-allowed; }
.listagem-artes .arte.loading .img:before{
	background: rgba(255,255,255,.9);
	content: "";
	position: absolute;
	height: 100%;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1;
}
.listagem-artes .arte.loading .img:after{
	border: 3px solid rgba(144, 144, 144, 0.39);
	border-bottom: 3px solid rgb(144, 144, 144);
	border-radius: 50%;
	content: "";
	height: 30px;
	left: 50%;
	margin: -15px 0 0 -15px;
	position: absolute;
	top: 50%;
	width: 30px;
	animation: rotateLF .5s linear infinite;
	z-index: 2;
}
.listagem-artes .arte.hide-arte{
	opacity: 0;
	transform: scale(.8);
	transition: all .3s ease-in-out;
} 
.listagem-artes .arte[data-toggle]{ cursor: pointer; }
.listagem-artes .arte .img{
	border: 1px solid #eee;
	background-color: #fbfbfb;
	height: 292px;
	width: 222px;
	display: flex;
	align-items: center;
	position: relative;
}
.listagem-artes .arte .img img{
	display: block;
	margin: 0 auto;
	max-height: 290px;
	max-width: 220px;
	height: auto;
	width: auto;
}
.listagem-artes .arte .nome{
	display: block;
	font-weight: 500;
	padding-top: 15px;
}
.listagem-selecionar{ margin-top: 40px; }
.listagem-selecionar .arte{ 
	margin-right: 134px; 
	cursor: pointer;
}
.listagem-selecionar .arte:after{
	background-color: #909090;
	box-shadow: 0 0 1px 1px rgba(255,255,255,.8);
	border-radius: 50%;
	color: #fff;
	content: "\ea0a";
	font-size: 10px;
	height: 28px;
	line-height: 28px;
	position: absolute;
	text-align: center;
	top: -11px;
	right: -11px;
	width: 28px;
	z-index: 3;
	font-family: 'icomoon' !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.listagem-selecionar .arte:not(.block):hover:after,
.listagem-selecionar .arte.selecionado:after{ background-color: #00c13b; content: "\ea10"; }
.listagem-selecionar .arte.selecionado:not(.block):hover:after{ background-color: #ff0000; content: "\ea0f"; }
.listagem-artes .arte:nth-child(3n){ margin-right: 0; }

.opcao-desativar-artista-obra button {
	margin: 10px 0;
}

.listagem-remover-artes {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	overflow: hidden;
	justify-content: space-between;
}

.listagem-remover-artes .arte.remover-arte {
	align-items: center;
	background-color: #fbfbfb;
	border: #eee 1px solid;
	border-radius: 10px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	height: 250px;
	margin: 25px;
	padding: 15px;
	position: relative;
	width: 250px;
}

.listagem-remover-artes .arte.remover-arte .obra {
	width: 100%;
}

.listagem-remover-artes .arte img{
	display: block;
	margin: 0 auto;
	max-height: 290px;
	max-width: 220px;
	height: 150px;
	width: auto;
}

.listagem-remover-artes .arte.remover-arte span {
	display: flex;
	justify-content: center;
	padding: 10px;
}

#opcoes-remover {
    align-items: center;
	display: flex;
    justify-content: space-between;
}

.listagem-remover-artes .arte.remover-arte input[type="checkbox"] {
	margin-right: 20px;
	width: 1em;
}

#btn-confirma-remover-artes, #btn-remover, #btn-cancela-conta, #btn-opcao-artista {
	margin-left: 20px;
}

#paginacao-btn button {
	background-color: #000;
	border-radius: 50%;
    border: #fff 1px solid;
	color: #fff;
	font-family: monospace !important;
	font-size: 20px;
	padding: 0.2rem 1rem;
}

#paginacao-btn button:disabled {
	background-color: #eee;
	border-radius: 50%;
    border: #fff 1px solid;
	color: #909090;
	cursor: not-allowed;
	font-family: monospace !important;
	font-size: 20px;
	padding: 0.2rem 1rem;
}

.modal-dialog{ width: 945px; }
.modal-editar-arte .modal-body{
	padding-bottom: 30px;
}
.modal-editar-arte .img-preview-2{ margin-left: 20px; }

/* SUAS ARTES: Séries */
.lista-series>.big-icons,
.lista-series>a{
	float: left;
	margin: 40px 48px 8px 0;
	width: 200px;
}
.lista-series>.big-icons .ico>div{ width: 100%; }
.lista-series>.big-icons .icon-mais{ margin-bottom: -15px; }
.lista-series>.big-icons span{ 
	font-size: 16px; 
	text-transform: uppercase;
}
.lista-series>*:nth-child(4n){ margin-right: 0; }
.lista-series .serie .img{
	background: no-repeat center;
	background-size: cover;
	box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	height: 200px;
	width: 200px;
}
.lista-series .serie .nome{
	color: #707070;
	display: block;
	font-weight: 500;
	margin-top: 15px;
	text-transform: uppercase;
	transition: color .2s ease;
}
.lista-series .serie:hover .nome{ color: #404040; }
#modalConfirmaExclusao .modal-dialog{ width: 600px; }
.ajax-paginacao{ 
	overflow: hidden;
	position: relative; 
}
.ajax-paginacao.loading:before{
	background-color: rgba(255,255,255,.5);
	content: "";
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 3;
}
.ajax-paginacao.loading:after{
	border: 3px solid rgba(144, 144, 144, 0.39);
	border-bottom: 3px solid rgb(144, 144, 144);
	border-radius: 50%;
	content: "";
	height: 30px;
	left: 50%;
	margin-left: -15px;
	position: absolute;
	bottom: 24px;
	width: 30px;
	animation: rotateLF .5s linear infinite;
	z-index: 3;
}

/* SUAS ARTES: Landing page */
.link-divulga { padding-top: 40px; }
.link-divulga span{
	color: #999;
	display: block;
	font-size: 12px;
	padding-bottom: 5px;
	text-transform: uppercase;
}
.link-divulga .link{
	background-color: #eee;
	border: 1px solid #c4c4c4;
	border-radius: 5px;
	color: #808080;
	float: left;
	height: 45px;
	line-height: 45px;
	text-indent: 12px; 
	margin: 3px 20px 0 0;
	padding-right: 12px;
	min-width: 280px;
}
.link-divulga .bt1{ float: left; }


/* SUAS VENDAS */
.tabela-vendas{ 
	overflow: hidden; 
	padding: 0 0 20px;
}
.leg-vendas{
	clear: both;
	float: left;
	font-size: 12px;
	width: 100%;
}
.filtro-grafico{ 
	overflow: hidden; 
	padding: 10px 0 5px;
}
.filtro-grafico span{ 
	float: left; 
	margin: 35px 20px 0 0;
}
.box-grafico{
	box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.1);
	border: 1px solid #eee;
	border-radius: 5px;
	margin: 10px 0 55px;
	overflow: hidden;
	padding: 30px 0 30px 15px;
	position: relative;
}
.box-grafico #line{
	height: 380px;
	width: 100%;
}
.box-grafico .loading{
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: #fff;
    border-radius: 5px;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	visibility: hidden;
	opacity: 0;
	transform: scale(1.4);
	transition: all .3s ease-in-out;
	animation-play-state: paused;
	z-index: 3;
}
.box-grafico .loading.ativo{
	transform: scale(1);
	opacity: 1;
	visibility: visible;
}
.box-grafico .loading:after{
	border: 3px solid rgba(144, 144, 144, 0.39);
	border-bottom: 3px solid rgb(144, 144, 144);
	border-radius: 50%;
	content: "";
	height: 40px;
	left: 50%;
	margin: -20px 0 0 -20px;
	position: absolute;
	top: 50%;
	width: 40px;
	animation: rotateLF .5s linear infinite;
	animation-play-state: paused;
}
.box-grafico .loading.ativo:after{ animation-play-state: running; }
.box-grafico .title{
	position: absolute;
    top: 76px;
    left: 30px;
    z-index: 2;
    font-size: 14px;
}
.main .conteudo .box-grafico h2{
	margin: 0 0 20px;
	padding: 0 0 0 15px;
	border: none;
}
.box-dashboard{
	background: url(../imgs/img-temp-dashboard.png) no-repeat;
	box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.1);
	border: 1px solid #eee;
	border-radius: 5px;
	height: 494px;
	margin: 10px 0 55px;
	width: 945px;
}
.tabela-vendas .item{
	align-items: center;
	display: flex;
	float: left;
	margin: 25px 0;
	width: 378px;
}
.tabela-vendas .item:nth-child(2n){
	float: right;
}
.tabela-vendas .item .ico{
	border-radius: 5px;
	background: #000;
	/*
	background-image: -moz-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(255,0,143) 0%, rgb(245,111,100) 100%);
	*/
	box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.1);
	float: left;
	width: 100px;
	height: 100px;
	color: #fff;
	font-size: 32px; 
	text-align: center;
	display: inline-flex;
	align-items: center;
}
.tabela-vendas .item .icon-money{ font-size: 40px; }
.tabela-vendas .item .icon-grafico{ font-size: 28px; }
.tabela-vendas .item .ico:before{ width: 100%; }
.tabela-vendas .item .valor{
	font-size: 16px;
	color: #999;
	padding-left: 20px;
}
.tabela-vendas .item .valor strong{
	color: #404040;
	font-weight: 400;
}
.link-planilha{
	color: #707070;
	float: right;
	margin: 35px 20px 0 0;
	position: relative;
	text-decoration: underline;
}
.link-planilha:hover{ text-decoration: none; }
.link-planilha span{
	position: absolute;
	right: -20px;
	top: 2px;
}
.listagem-vendas .arte{
	height: 444px;
}
.listagem-vendas .arte .infos span{
	margin-top: 6px;
	display: block;
}
.listagem-vendas .arte .infos span strong{
	color: #999;
	font-weight: 400;
}
.listagem-vendas.mais-vendidos .arte{ margin-right: 132px; }
.listagem-vendas.mais-vendidos .arte:after{
	border-radius: 50%;
	color: #fff;
	font-size: 16px;
	height: 30px;
	line-height: 30px;
	position: absolute;
	right: -15px;
	text-align: center;
	top: -15px;
	width: 30px;	
}
.listagem-vendas.mais-vendidos .ouro:after{ 
	background-color: #eea643;
	background-image: -moz-linear-gradient( 0deg, rgb(252,190,113) 0%, rgb(219,132,3) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(252,190,113) 0%, rgb(219,132,3) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(252,190,113) 0%, rgb(219,132,3) 100%);
	content: "1";
}
.listagem-vendas.mais-vendidos .prata:after{ 
	background-color: #979897;
	background-image: -moz-linear-gradient( 0deg, rgb(169,171,172) 0%, rgb(130,129,127) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(169,171,172) 0%, rgb(130,129,127) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(169,171,172) 0%, rgb(130,129,127) 100%);
	content: "2";
}
.listagem-vendas.mais-vendidos .bronze:after{ 
	background-color: #b7712b;
	background-image: -moz-linear-gradient( 0deg, rgb(205,127,50) 24%, rgb(140,83,27) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(205,127,50) 24%, rgb(140,83,27) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(205,127,50) 24%, rgb(140,83,27) 100%);
	content: "3";
}
.listagem-vendas.mais-vendidos .arte:nth-child(3n){ margin-right: 0; }

/* SEUS DADOS */
.cadastro .conteudo{ text-align: center; }
.abas-cadastro{
	border-bottom: 1px solid #eee;
	height: 65px;
	margin-bottom: 40px;
	padding-top: 30px;
	position: relative;
}
.abas-cadastro:after{
	background-color: #a7aab3;
	background-image: -moz-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -webkit-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	background-image: -ms-linear-gradient( 0deg, rgb(255,94,184) 0%, rgb(254,1,143) 100%);
	box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.2);
	border-radius: 3px;
	content: "";
	height: 6px;
	position: absolute;
	bottom: -3px;
	left: 0;
	width: 31%;
	transition: width .2s ease-in-out;
}
.passo2 .abas-cadastro:after{ width: 64%; }
.passo3 .abas-cadastro:after{ width: 100%; }
.abas-cadastro .aba{
	color: #a7aab3;
	font-size: 20px;
	float: left;
	width: 33.33%;
}
.abas-cadastro .aba.aba1,
.passo2 .abas-cadastro .aba.aba2,
.passo3 .abas-cadastro .aba.aba2,
.passo3 .abas-cadastro .aba.aba3{
	color: #ff008f;
}
.cadastro-passos{ 
	display: none; 
	position: relative;
}
.passo1 .cadastro-passo1 { display: block; }
.passo2 .cadastro-passo2 { display: block; }
.passo3 .cadastro-passo3 { display: block; }
.form-cadastro .cadastro-passo1 .bloco-campos{
	margin-bottom: 20px;
	position: relative;
	padding: 0 0 0;
}
.form-cadastro .cadastro-passo1 .bloco-campos:before{
	background-color: #eee;
	content: "";
	display: block;
	height: 100%;
	left: 180px;
	position: absolute;
	top: 0;
	width: 2px;
	transition: all .2s ease-in-out;
}
.form-cadastro .cadastro-passo1 .bloco-campos.ativo:before{ background-color: #ff008f; }
.cadastro-passo1 .help-block{ margin-bottom: -28px; }
.form-cadastro .label-grupo{
	color: #707070;	
	display: block;
	margin-top: 25px;
}
.form-cadastro label{ margin-top: 15px; }
.campos-bloqueados{ 
	min-height: 172px;
	padding: 20px 0 40px; 
}
.campos-bloqueados label{ margin-top: 0; }
.campos-bloqueados .msg{
	align-items: center;
	display: flex;
	float: left;
	margin-top: 0;
	height: 112px;
	width: 130px;
}
.campos-bloqueados .box{
	border: 1px solid #c4c4c4;
	border-radius: 5px;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
	float: right;
	min-height: 112px;
	padding: 17px 0 0 35px;
	width: 983px;
}
.campos-bloqueados .box .campo{
	float: left;
	margin-right: 30px;
	width: 282px;
}
.lista-recebimento{
	float: left;
	left: 50%;
	overflow: visible;
	padding: 110px 0;
	position: relative;
	transform: translateX(-50%);
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease-in-out;
}

.editar-cadastro .lista-recebimento{
	float: left;
	padding: 10px 0 30px; 
	left: auto;
	transform: none;
	opacity: 1;
	visibility: hidden;
	margin: 0 50px;
	
} 
.lista-recebimento .item{
	float: left;
	height: 180px;
	margin: 0 ;
}
.editar-cadastro .lista-recebimento .item{ margin: 0; }
.lista-recebimento .info{ 
	color: #707070;
	float: left; 
	height: 180px;
	display: inline-flex;
	align-items: center;
	padding-left: 35px;
}
.lista-recebimento .item label{
	align-items: center;
	border: 1px solid #c4c4c4;
	border-radius: 5px;
	cursor: pointer;
	display: inline-flex;
	height: 180px;
	margin: 0 10px;
	width: 180px;
}
.lista-recebimento .item label img{
	display: block;
	height: auto;
	margin: 0 auto;
}
.lista-recebimento .item input{ display: none; }
.lista-recebimento .help-block{
	margin-top: 30px;
	text-align: center;
	height: 24px;
}
.box-recebimento{
    width: 620px;
    left: 265px;
    opacity: 0;
    visibility: hidden;
    transition: all .3s ease-in-out;
}
.box-recebimento .item{
	float: left;
	width: 180px;
}
.box-recebimento .item .logo{
	align-items: center;
	border: 1px solid #c4c4c4;
	border-radius: 5px;
	display: inline-flex;
	position: relative;
	height: 180px;
	margin: 54px 0 0;
	width: 180px;
}
.box-recebimento .item .logo img{
	display: block;
	margin: 0 auto; 
}
.box-recebimento .item .logo:after{
	background-color: #00c13b;
    content: "\ea10";
	border-radius: 50%;
	color: #fff;
	font-size: 10px;
	height: 28px;
	line-height: 28px;
	position: absolute;
	text-align: center;
	top: -11px;
	right: -11px;
	width: 28px;
	font-family: 'icomoon' !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.box-recebimento .item a{
	display: block;
	margin-top: 20px;
	font-size: 12px;
	text-decoration: underline;
	text-transform: uppercase;
	text-align: center;
}
.box-recebimento .item a:hover{ text-decoration: none; }
.box-recebimento .campos{
	float: right;
	width: 320px;
}
.box-recebimento .campos .nomargin{ margin: 0; }
.box-recebimento .campos .help-block{ margin-bottom: -24px; }
.lista-recebimento.ativo,
.box-recebimento.ativo{
	opacity: 1;
	visibility: visible;
}
.perfil{
	padding: 30px 0 40px;
	overflow: hidden;
}
.editar-cadastro .perfil{ padding-top: 15px; }
.perfil .foto { 
	float: left; 
	position: relative;
}
.perfil .foto .thumbnail{
	border: 1px solid #eee;
    background-color: #eee;
	border-radius: 50%;
	height: 142px;
	margin-bottom: 15px;
	overflow: hidden;
	padding: 0;
	width: 142px;
	align-items: center;
	display: flex;
	line-height: normal !important;
	text-align: center;
}
.perfil .foto .thumbnail:before{
	content: "\e900";
    font-size: 40px;
    color: #909090;
    width: 100%;
}
.perfil .foto .fileinput-exists .thumbnail:before{ display: none; }
.perfil .foto .bt{
	background-color: #000;
	border-radius: 5px;
	cursor: pointer;
	color: #fff;
	display: block;
	height: 40px;
	line-height: 40px;
	text-align: center;
	width: 140px;
}
.perfil .foto .bt:hover{ background-color: #e60081; }
.perfil .foto .bt-remove{ display: none; }
.perfil .foto .fileinput-exists .bt{ display: none; }
.perfil .foto .fileinput-exists .bt-remove{	display: block; }
.perfil .foto .btn-file>input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    font-size: 23px;
    height: 142px;
    width: 100%;
    direction: ltr;
    cursor: pointer;
}
.perfil .foto .alert{
	bottom: 0;
	left: 160px;
	margin: 0;
	position: absolute;
	white-space: nowrap;
}
.perfil .nome{
	float: left;
	padding: 50px 0 0 70px;
}
.perfil .nome p{
	border-right: 1px solid #eee;
	color: #707070;
	float: left;
	line-height: 50px;
	padding: 0 42px 0 0;
}
.perfil .nome .radiobox{ float: left; }
.radiobox .item{ float: left; }
.radiobox .item label{
	cursor: pointer;
	margin: 17px 0 0 20px;
	padding-left: 25px;
	position: relative;
	text-transform: none;
	transition: color .2s ease-in-out;
}
.radiobox .item label:before{
	border: 3px solid #c4c4c4;
	border-radius: 50%;
	content: "";
	height: 16px;
	left: 0;
	position: absolute;
	top: 0;
	width: 16px;
	transition: .2s all ease-in-out;
}
.radiobox .item label:hover{ color: #707070; }
.radiobox .item label:hover:before{
	border-color: #aaa;
	box-shadow: 0 0 1px rgba(0,0,0,.2);
}
.radiobox .item label.ativo:before{ border: 4px solid #000; }
.radiobox .item input{ display: none; }
.ico-biografia{
	background-color: #000;
	border-radius: 50%;
	color: #fff;
	height: 40px;
	line-height: 40px !important;
	text-align: center;
	width: 40px;
	position: absolute;
    right: -42px;
    top: 41px;
}


/* FORM */
.form>p{
	color: #707070;
	padding-bottom: 20px;
}
.campo-inline{
	float: left;
	margin-right: 20px;
}
.help-block{
	font-size: 12px;
	margin: 3px 0 0;
	clear: left;
	float: left;
	width: 100%;
}
.erro-termos{
	position: absolute;
    bottom: 85px;
    right: 15px;
    width: auto;
}

.campo-size1{ width: 150px; }
.campo-size2{ width: 210px; }
.campo-size3{ width: 89px; }
.campo-size4{ width: 490px; }
.campo-size5{ width: 270px; }
.select-seta{
	position: relative;
}
.select-seta select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.select-seta select::-ms-expand { display:none; }
.select-seta:before{
	content: "";
	position: absolute;
	right: 11px;
	top: 50%;
	margin-top: -3px;
	width: 0;
	height: 0;
	margin-left: 2px;
	vertical-align: middle;
	border-top: 6px dashed;
	border-top: 6px solid \9;
	border-top-color: #999;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}
.form-contato{
	position: relative;
}
.form-contato .msg-contato{
	position: absolute;
	left: 0;
	top: 40px;
	background-color: #efefef;
	height: 106%;
	border-radius: 4px;
	width: 1144px;
	text-align: center;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-line-pack: center;
        align-content: center;
}
.home .form-contato .msg-contato{
	left: -1px;
	top: 0;
	height: 116%;
}
.form-group ul{
	padding-left: 0;
}
.form .msg-contato div.msg-ok{
	border: none;
	color: #707070;
	text-align: center;
	padding: 0 20px;
	width: 100%
}
.form .msg-contato h3{
	color: #404040;
	display: inline-block;
	font-size: 20px;
	font-weight: 500;
	margin-bottom: 20px;
	text-transform: uppercase;
}
.form .msg-contato .bt{
	background: #ff008f;
	color: #fff;
	display: block;
	font-weight: 500;
	height: 40px;
	line-height: 40px;
	margin: 20px auto 0;
	border-radius: 20px;
	text-align: center;
	text-indent: 0;
	text-transform: uppercase;
	width: 200px;
}
.form .msg-ativo{
	opacity: 1;
	visibility: visible;
}
.form .msg-load{
	color: #707070;
	font-size: 16px;
	font-weight: 400;
	height: 80px;
	padding-top: 60px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -40px 0 0 -40px;
	width: 80px;
}
.form .msg-load:after{
	border: 2px solid rgba(0,0,0,.2);
	border-bottom: 2px solid  rgba(0,0,0,.5);
	border-radius: 50%;
	content: "";
	height: 40px;
	left: 20px;
	position: absolute;
	top: 0;
	width: 40px;
	-webkit-animation: rotateLF .5s linear infinite;
	animation: rotateLF .5s linear infinite;
}
@-webkit-keyframes rotateLF{
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}
@keyframes rotateLF{
    from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}


/* PERGUNTAS FREQUENTES */
.faq-item{
	overflow: hidden;
	margin-top: 20px;
}
.faq-item .big-icons{
	margin-bottom: 7px;
	margin-top: 0;
	width: auto;
}
.faq-item .texto{
	color: #707070;
	float: left;
	min-height: 200px;
	padding-left: 40px;
	width: 940px;
}
.faq-item .texto h3{
	font-weight: 600;
	font-size: 16px;
	margin: 30px 0 10px;
}
.faq-item .texto h3:first-of-type{ margin-top: 10px; }
.faq-item .texto strong{ font-weight: 600; }
.faq-item .texto ul{ 
	padding-left: 20px; 
	margin-bottom: 20px;
}
.lastp{
	border-top: 1px solid #eee;
	font-size: 12px;
	color: #707070;
	margin-top: 50px;
	padding-top: 15px;
}

/* FUNCIONALIDADES GERAIS ///////*/
/* ICONES */
@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoon.eot?q58ux1');
  src:  url('../fonts/icomoon.eot?q58ux1#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?q58ux1') format('truetype'),
    url('../fonts/icomoon.woff?q58ux1') format('woff'),
    url('../fonts/icomoon.svg?q58ux1#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"]{
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-plus:before { content: "\ea0a"; }
.icon-cross:before { content: "\ea0f"; }
.icon-checkmark:before { content: "\ea10"; }
.icon-file-picture:before { content: "\e900"; }
.icon-file:before { content: "\e900"; }
.icon-document:before { content: "\e900"; }
.icon-file-image:before { content: "\e900"; }
.icon-youtube:before { content: "\e901"; }
.icon-brand:before { content: "\e901"; }
.icon-social:before { content: "\e901"; }
.icon-pencil:before { content: "\e902"; }
.icon-write:before { content: "\e902"; }
.icon-edit:before { content: "\e902"; }
.icon-angle-left:before { content: "\f104"; }
.icon-angle-right:before { content: "\f105"; }
.icon-angle-up:before { content: "\f106"; }
.icon-angle-down:before { content: "\f107"; }
.icon-calendario:before { content: "\e903"; }
.icon-camera:before { content: "\e904"; }
.icon-dash:before { content: "\e905"; }
.icon-divulga:before { content: "\e906"; }
.icon-doc:before { content: "\e907"; }
.icon-docs:before { content: "\e908"; }
.icon-download:before { content: "\e909"; }
.icon-escudo:before { content: "\e90a"; }
.icon-grafico:before { content: "\e90b"; }
.icon-img:before { content: "\e90c"; }
.icon-janelas:before { content: "\e90d"; }
.icon-mais:before { content: "\e90e"; }
.icon-money:before { content: "\e90f"; }
.icon-nuvem:before { content: "\e910"; }
.icon-ok:before { content: "\e911"; }
.icon-pasta:before { content: "\e912"; }
.icon-reload:before { content: "\e913"; }
.icon-relogio:before { content: "\e914"; }
.icon-seta:before { content: "\e915"; }
.icon-tela:before { content: "\e916"; }
.icon-upload:before { content: "\e917"; }
.icon-user:before { content: "\e918"; }
.icon-x:before { content: "\e919"; }
.icon-power:before{ content:"\e91a"; }




/* CARROSSEL */
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}
.owl-carousel{display:none;width:100%;z-index:1}
.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y}
.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}
.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}
.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d}
.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}
.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}
.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.owl-carousel.owl-loading{opacity:0;display:block}
.owl-carousel.owl-hidden{opacity:0}
.owl-carousel.owl-refresh .owl-item{visibility:hidden}
.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.owl-carousel.owl-grab{cursor:move;cursor:-webkit-grab;cursor:grab}
.owl-carousel.owl-rtl{direction:rtl}
.owl-carousel.owl-rtl .owl-item{float:right}
.owl-carousel .animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.owl-carousel .owl-animated-in{z-index:0}
.owl-carousel .owl-animated-out{z-index:1}
.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}
.owl-height{-webkit-transition: height .5s ease-in-out;transition:height .5s ease-in-out}
.owl-carousel .owl-item .owl-lazy{opacity:0;-webkit-transition: opacity .4s ease;transition:opacity .4s ease}
.owl-carousel .owl-item img.owl-lazy{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}
.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}
.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:-webkit-transform .1s ease;-webkit-transition: -webkit-transform .1s ease;transition: transform .1s ease;transition:transform .1s ease, -webkit-transform .1s ease}
.owl-carousel .owl-video-play-icon:hover{-webkit-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}
.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}
.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;-webkit-transition: opacity .4s ease;transition:opacity .4s ease}
.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
.owl-dots{ 
	margin: 20px 0;
	text-align: center; 
}
.owl-dot{
	border: 1px solid #909090;
	border-radius: 50%;
	display: inline-block;
	height: 11px;
	margin: 0 5px;
	width: 11px;
	transition: all .2s ease-in-out;
}
.owl-dot.active{ background-color: #909090; }


.pass-send-link-color a{
	text-decoration: underline;
	color: #000;
	font-weight: 600;
}

/* Popup */

.popup-bg :not(#popup, #popup-title, #popup-text, #popup-button){
	overflow: hidden;
	-webkit-filter: blur(2px);
    -moz-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
    filter: blur(2px );   
}
.popup{
	width: 400px;
	background: #fff;
	border: solid #000;
	z-index: 10;
	border-radius: 6px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) scale(0.1);
	text-align: center;
	padding: 0 30px 30px;
	visibility: hidden;
	transition: transform 0.4s, top 0.4s;
}

.open-popup{
	visibility: visible;
	top: 50%;
	transform: translate(-50%, -50%) scale(1);
}
	
.popup img{
	width: 100px;
	margin-top: -50px;
	border-radius: 50%;
	box-shadow: 0 2px 5px rgba(0,0,0,0.2)
}
	
/*.popup h2{
	font-size: 38px;
	font-weight: 600;
	margin: 30px 0 10px;
} */
	
.popup button{
	width: 100%;
	margin-top: 50px;
	padding: 10px 0;
	background: #000;
	color: #fff;
	border: 0;
	outline: none;
	font-size: 18px;
	border-radius: 4px;
	cursor: pointer;
}


/* Mobile */
@media only screen and (max-width: 768px) {
	.home .cadastro .container {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.home .cadastro .container .criar-conta {
		padding-right: 0;
		width: 100%;
	}
	.home .cadastro .container .entrar {
		padding: 0 0 40px 0;
		width: 100%;
	}
	.home .fale-conosco .bt1 {
		width: 100%;
	}
}

/* ==========================================================================
   11. Portal do Artista - Redesign Moderno & Editorial Urban Arts
   ========================================================================== */

body.portal-artista-page {
	background: #F8F8F6 !important;
	background-image: 
		radial-gradient(at 15% 15%, rgba(255, 0, 143, 0.035) 0px, transparent 45%),
		radial-gradient(at 85% 75%, rgba(17, 17, 17, 0.03) 0px, transparent 50%) !important;
	background-attachment: fixed !important;
	color: #111111 !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Header no Portal: Consistente com ArtLab (Off-White #EAEAE6 com blur) */
body.portal-artista-page header.artlab-header {
	background: #FFFFFF !important;
	backdrop-filter: blur(16px) !important;
	-webkit-backdrop-filter: blur(16px) !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

body.portal-artista-page header .topbar .logo img {
	filter: none !important;
}

body.portal-artista-page .badge-rede-artista {
	background: #111111 !important;
	color: #FFFFFF !important;
	box-shadow: none !important;
	border: none !important;
}

/* Ponto Rosa da Marca (Hot Pink #FF008F) */
.pink-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #FF008F;
	display: inline-block;
	box-shadow: 0 0 8px rgba(255, 0, 143, 0.7);
	flex-shrink: 0;
}

/* 1. Hero Section com Tipografia Editorial & Moldura de Arte */
.portal-hero-section {
	padding: 48px 0 20px;
}

.portal-container {
	max-width: 1170px !important;
	width: 100% !important;
	margin: 0 auto !important;
	padding-left: 15px !important;
	padding-right: 15px !important;
	box-sizing: border-box !important;
}

.portal-hero-header {
	text-align: center;
	max-width: 760px;
	margin: 0 auto 36px;
}

.portal-hero-kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #737373;
	background: rgba(0, 0, 0, 0.04);
	padding: 5px 14px;
	border-radius: 999px;
	margin-bottom: 16px;
}

.portal-hero-title {
	font-size: 38px !important;
	font-weight: 800 !important;
	line-height: 1.18 !important;
	letter-spacing: -0.03em !important;
	color: #111111 !important;
	margin: 0 0 14px !important;
	border: none !important;
	padding: 0 !important;
}

.highlight-pink {
	color: #111111;
	position: relative;
	display: inline-block;
}

.highlight-pink::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 2px;
	width: 100%;
	height: 3px;
	background: #FF008F;
	border-radius: 2px;
}

.portal-hero-subtitle {
	font-size: 15.5px !important;
	color: #666666 !important;
	line-height: 1.6 !important;
	max-width: 620px;
	margin: 0 auto !important;
	font-weight: 400;
}

/* Moldura de Galeria para o Banner Autoral */
.portal-cover-frame {
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 16px 44px -8px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.02);
	border: 1px solid rgba(0, 0, 0, 0.08);
	background: #FFFFFF;
	position: relative;
	line-height: 0;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.portal-cover-frame:hover {
	box-shadow: 0 22px 56px -6px rgba(0, 0, 0, 0.12);
}

.portal-cover-image {
	width: 100%;
	height: auto;
	max-height: 480px;
	object-fit: cover;
	object-position: center;
	display: block;
}

.portal-cover-overlay-badge {
	position: absolute;
	bottom: 18px;
	left: 18px;
	background: rgba(17, 17, 17, 0.88);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	padding: 8px 16px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 1px solid rgba(255, 255, 255, 0.15);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.portal-cover-overlay-badge svg {
	color: #FF008F;
}

/* 2. Action Hub Section (Card de Abas Fluidas) */
.portal-hub-section {
	padding: 44px 0 84px;
	position: relative;
}

.portal-hub-card {
	max-width: 540px;
	margin: 0 auto;
	background: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 12px;
	box-shadow: 0 20px 60px -10px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.02);
	padding: 40px 42px;
	position: relative;
	transition: box-shadow 0.3s ease;
}

.portal-hub-card:hover {
	box-shadow: 0 24px 70px -8px rgba(0, 0, 0, 0.12);
}

/* Segmented Control / Pill Tabs */
.portal-tabs-nav {
	background: #EFEFEA;
	border-radius: 999px;
	padding: 5px;
	display: flex;
	gap: 4px;
	margin-bottom: 32px;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06);
}

.portal-tab-btn {
	flex: 1;
	height: 44px;
	border: none;
	background: transparent;
	border-radius: 999px;
	font-family: 'Inter', sans-serif;
	font-size: 13.5px;
	font-weight: 600;
	color: #666666;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	cursor: pointer;
	transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
	user-select: none;
	padding: 0 16px;
}

.portal-tab-btn .tab-icon {
	color: #888888;
	transition: color 0.2s ease, transform 0.2s ease;
	flex-shrink: 0;
}

.portal-tab-btn:hover {
	color: #111111;
}

.portal-tab-btn:hover .tab-icon {
	color: #111111;
}

.portal-tab-btn.active {
	background: #FFFFFF;
	color: #111111;
	font-weight: 700;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.09);
}

.portal-tab-btn.active .tab-icon {
	color: #FF008F;
	transform: scale(1.05);
}

.tab-indicator-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: transparent;
	display: inline-block;
	transition: background 0.2s ease, box-shadow 0.2s ease;
}

.portal-tab-btn.active .tab-indicator-dot {
	background: #FF008F;
	box-shadow: 0 0 8px rgba(255, 0, 143, 0.7);
}

/* Tab Panels */
.portal-tab-panel {
	opacity: 0;
	transform: translateY(4px);
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.portal-tab-panel.active {
	opacity: 1;
	transform: translateY(0);
}

.portal-panel-header {
	margin-bottom: 26px;
	text-align: left;
}

.portal-panel-kicker {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #737373;
	margin-bottom: 8px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.portal-panel-title {
	font-size: 24px !important;
	font-weight: 800 !important;
	color: #111111 !important;
	letter-spacing: -0.025em !important;
	margin: 0 0 8px !important;
	line-height: 1.2 !important;
	border: none !important;
	padding: 0 !important;
}

.portal-panel-desc {
	font-size: 13.5px !important;
	color: #666666 !important;
	line-height: 1.55 !important;
	margin: 0 !important;
}

/* Formulários Modernos com Ícones de Campo */
.portal-form {
	margin-top: 4px;
}

.portal-field-group {
	margin-bottom: 20px !important;
	text-align: left !important;
}

.portal-field-label {
	display: block !important;
	font-size: 11.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	color: #333333 !important;
	margin-bottom: 7px !important;
}

.portal-field-label-row {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	margin-bottom: 7px !important;
}

.portal-forgot-link {
	font-size: 12px !important;
	color: #666666 !important;
	text-decoration: underline !important;
	text-underline-offset: 3px !important;
	transition: color 0.15s ease !important;
	cursor: pointer;
}

.portal-forgot-link:hover {
	color: #FF008F !important;
}

.portal-input-wrapper {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
}

.portal-input-wrapper .field-icon {
	position: absolute !important;
	left: 14px !important;
	color: #9E9E9C !important;
	pointer-events: none !important;
	transition: color 0.2s ease !important;
	z-index: 2;
}

.portal-modern-input {
	width: 100% !important;
	height: 48px !important;
	background: #FCFCFA !important;
	border: 1.5px solid #E5E5E2 !important;
	border-radius: 6px !important;
	padding: 10px 14px 10px 42px !important;
	font-size: 14px !important;
	color: #111111 !important;
	box-shadow: none !important;
	transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease !important;
	box-sizing: border-box !important;
}

.portal-modern-input:focus {
	border-color: #111111 !important;
	background: #FFFFFF !important;
	box-shadow: 0 0 0 3px rgba(255, 0, 143, 0.14) !important;
	outline: none !important;
}

.portal-input-wrapper:focus-within .field-icon {
	color: #FF008F !important;
}

.portal-modern-input::placeholder {
	color: #999999 !important;
	font-weight: 400 !important;
}

select.portal-modern-input,
select.portal-select,
select.form-control,
.portal-select {
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%236B7280%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-size: 14px 14px !important;
	background-color: #FFFFFF !important;
	border: 1.5px solid #E5E7EB !important;
	border-radius: 9px !important;
	padding: 10px 38px 10px 14px !important;
	font-family: 'Inter', -apple-system, sans-serif !important;
	font-size: 14px !important;
	color: #111111 !important;
	height: 44px !important;
	min-height: 44px !important;
	line-height: normal !important;
	cursor: pointer !important;
	box-shadow: none !important;
	transition: all 0.2s ease !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

/* Botão Moderno com Micro-interação */
.portal-btn-action {
	margin-top: 10px !important;
	width: 100% !important;
	height: 52px !important;
	background: #111111 !important;
	color: #FFFFFF !important;
	border: 1px solid #111111 !important;
	border-radius: 6px !important;
	font-size: 13.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12) !important;
	transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
	float: none !important;
}

.portal-btn-action svg {
	transition: transform 0.2s ease;
}

.portal-btn-action:hover {
	background: #000000 !important;
	border-color: #000000 !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.24) !important;
	color: #FFFFFF !important;
}

.portal-btn-action:hover svg {
	transform: translateX(4px);
}

.portal-form-status-overlay {
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.96);
	backdrop-filter: blur(8px);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 32px;
	z-index: 10;
	text-align: center;
}

/* 3. Seção Curadoria (Cards & Timeline Editorial) */
.portal-curation-section {
	background: #FFFFFF;
	padding: 80px 0 96px;
	border-top: 1px solid rgba(0, 0, 0, 0.06);
	position: relative;
}

.portal-section-header {
	text-align: center;
	max-width: 680px;
	margin: 0 auto 52px;
}

.portal-section-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #737373;
	background: #F4F4F0;
	padding: 5px 14px;
	border-radius: 999px;
	margin-bottom: 14px;
}

.portal-section-title {
	font-size: 30px !important;
	font-weight: 800 !important;
	color: #111111 !important;
	letter-spacing: -0.025em !important;
	margin: 0 0 12px !important;
	border: none !important;
	padding: 0 !important;
	line-height: 1.25 !important;
}

.portal-section-desc {
	font-size: 15px !important;
	color: #666666 !important;
	line-height: 1.6 !important;
	margin: 0 !important;
}

.portal-steps-timeline {
	display: flex !important;
	gap: 20px !important;
	margin-bottom: 48px !important;
}

.portal-timeline-step {
	flex: 1 !important;
	min-width: 0 !important;
	background: #FAFAF8 !important;
	border: 1px solid rgba(0, 0, 0, 0.06) !important;
	border-radius: 10px !important;
	padding: 30px 24px !important;
	display: flex !important;
	flex-direction: column !important;
	transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease !important;
	position: relative !important;
}

.portal-timeline-step:hover {
	border-color: #111111 !important;
	background: #FFFFFF !important;
	transform: translateY(-5px) !important;
	box-shadow: 0 14px 36px rgba(0, 0, 0, 0.07) !important;
}

.portal-timeline-step .step-card-header {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	margin-bottom: 18px !important;
}

.portal-timeline-step .step-badge {
	font-size: 12px !important;
	font-weight: 800 !important;
	color: #FFFFFF !important;
	background: #111111 !important;
	padding: 3px 9px !important;
	border-radius: 4px !important;
	letter-spacing: 0.04em !important;
}

.portal-timeline-step .step-icon-wrap {
	width: 36px !important;
	height: 36px !important;
	border-radius: 50% !important;
	background: #EFEFEA !important;
	color: #111111 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: background 0.2s ease, color 0.2s ease !important;
}

.portal-timeline-step:hover .step-icon-wrap {
	background: #FF008F !important;
	color: #FFFFFF !important;
}

.portal-timeline-step .step-title {
	font-size: 16px !important;
	font-weight: 700 !important;
	color: #111111 !important;
	margin: 0 0 8px !important;
	letter-spacing: -0.01em !important;
}

.portal-timeline-step .step-desc {
	font-size: 13.5px !important;
	color: #666666 !important;
	line-height: 1.55 !important;
	margin: 0 !important;
}

/* Card de Diretrizes e Termos */
.portal-terms-card {
	background: #FAFAF8;
	border: 1px solid rgba(0, 0, 0, 0.07);
	border-radius: 10px;
	padding: 28px 32px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	transition: box-shadow 0.2s ease;
}

.portal-terms-card:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}

.portal-terms-card .terms-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #737373;
	margin-bottom: 6px;
}

.portal-terms-card .terms-info {
	display: flex;
	flex-direction: column;
	text-align: left;
}

.portal-terms-card .terms-info strong {
	font-size: 15px;
	font-weight: 700;
	color: #111111;
	margin-bottom: 4px;
}

.portal-terms-card .terms-info span {
	font-size: 13px;
	color: #666666;
	line-height: 1.5;
}

.portal-terms-card .terms-links {
	display: flex;
	gap: 12px;
	flex-shrink: 0;
}

.portal-btn-link {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	background: #FFFFFF !important;
	border: 1px solid #D8D8D8 !important;
	border-radius: 6px !important;
	padding: 10px 18px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #111111 !important;
	text-decoration: none !important;
	transition: all 0.2s ease !important;
	white-space: nowrap !important;
}

.portal-btn-link:hover {
	background: #111111 !important;
	color: #FFFFFF !important;
	border-color: #111111 !important;
	text-decoration: none !important;
}

.portal-btn-link:hover svg {
	transform: translateX(3px);
}

.portal-btn-link svg {
	transition: transform 0.2s ease;
}

/* Modal de Recuperação de Senha */
.portal-modal-content {
	border-radius: 12px !important;
	border: 1px solid rgba(0, 0, 0, 0.1) !important;
	box-shadow: 0 24px 64px rgba(0, 0, 0, 0.16) !important;
	padding: 8px !important;
}

.portal-modal-header {
	border-bottom: 1px solid #EEEEEE !important;
	padding: 18px 20px 14px !important;
}

.portal-modal-header .modal-title {
	font-size: 18px !important;
	font-weight: 700 !important;
	color: #111111 !important;
}

.portal-modal-body {
	padding: 20px !important;
}

.portal-modal-hint {
	font-size: 13.5px !important;
	color: #666666 !important;
	line-height: 1.5 !important;
	margin-bottom: 18px;
}

.portal-modal-footer {
	border-top: 1px solid #EEEEEE !important;
	padding: 16px 0 0 !important;
	margin-top: 20px;
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

.portal-modal-btn-cancel {
	background: transparent !important;
	border: 1px solid #D8D8D8 !important;
	color: #555555 !important;
	border-radius: 6px !important;
	padding: 10px 18px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
}

.portal-modal-btn-submit {
	background: #111111 !important;
	border: 1px solid #111111 !important;
	color: #FFFFFF !important;
	border-radius: 6px !important;
	padding: 10px 22px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
}

.portal-modal-btn-submit:hover {
	background: #000000 !important;
}

/* Responsividade de Abas & Timeline */
@media (max-width: 991px) {
	.portal-hero-title {
		font-size: 30px !important;
	}

	.portal-hub-section {
		padding: 36px 0 60px;
	}

	.portal-hub-card {
		padding: 32px 24px;
	}

	.portal-steps-timeline {
		flex-wrap: wrap !important;
	}

	.portal-timeline-step {
		flex: 1 1 calc(50% - 10px) !important;
	}

	.portal-terms-card {
		flex-direction: column;
		align-items: flex-start;
	}

	.portal-terms-card .terms-links {
		width: 100%;
		flex-direction: column;
	}

	.portal-btn-link {
		justify-content: center;
	}
}

@media (max-width: 640px) {
	.portal-hero-title {
		font-size: 25px !important;
	}

	.portal-hub-card {
		padding: 24px 18px;
	}

	.portal-tabs-nav {
		margin-bottom: 24px;
	}

	.portal-tab-btn {
		font-size: 12.5px;
		height: 40px;
		padding: 0 10px;
	}

	.portal-steps-timeline {
		flex-direction: column !important;
	}

	.portal-timeline-step {
		flex: 1 1 100% !important;
	}
}



/* ==========================================================================
   13. Modo Escuro Moderno (Dark Mode) - Portal Inteiro
   ========================================================================== */

/* Botão Alternador de Tema */
.theme-toggle-btn {
	width: 32px !important;
	height: 32px !important;
	border-radius: 50% !important;
	background: rgba(0, 0, 0, 0.05) !important;
	border: 1px solid rgba(0, 0, 0, 0.1) !important;
	color: #444444 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer !important;
	padding: 0 !important;
	transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
	position: relative !important;
	user-select: none !important;
	outline: none !important;
	line-height: 0 !important;
	flex-shrink: 0 !important;
}

.theme-toggle-btn:hover {
	background: rgba(0, 0, 0, 0.09) !important;
	color: #111111 !important;
	transform: scale(1.06) !important;
}

.theme-toggle-btn .theme-icon-sun {
	display: none !important;
}

.theme-toggle-btn .theme-icon-moon {
	display: block !important;
}

html.dark-theme .theme-toggle-btn {
	background: rgba(255, 255, 255, 0.09) !important;
	border-color: rgba(255, 255, 255, 0.16) !important;
	color: #F5F5F7 !important;
}

html.dark-theme .theme-toggle-btn:hover {
	background: rgba(255, 255, 255, 0.16) !important;
	color: #FF008F !important;
	transform: scale(1.06) !important;
	box-shadow: 0 0 12px rgba(255, 0, 143, 0.35) !important;
}

html.dark-theme .theme-toggle-btn .theme-icon-sun {
	display: block !important;
	color: #FFD600 !important;
}

html.dark-theme .theme-toggle-btn .theme-icon-moon {
	display: none !important;
}

/* Base Dark Mode */
html.dark-theme,
html.dark-theme body {
	background-color: #0E0E10 !important;
	color: #F4F4F6 !important;
}

html.dark-theme body.portal-artista-page {
	background: #0E0E10 !important;
	background-image: 
		radial-gradient(at 15% 15%, rgba(255, 0, 143, 0.07) 0px, transparent 45%),
		radial-gradient(at 85% 75%, rgba(255, 255, 255, 0.03) 0px, transparent 50%) !important;
	background-attachment: fixed !important;
}

/* Header Dark Mode */
html.dark-theme #header,
html.dark-theme header,
html.dark-theme header.artlab-header,
html.dark-theme body.portal-artista-page #header,
html.dark-theme body.portal-artista-page header.artlab-header {
	background: #0E0E10 !important;
	background: rgba(14, 14, 16, 0.95) !important;
	backdrop-filter: blur(16px) !important;
	-webkit-backdrop-filter: blur(16px) !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 1px 12px rgba(0, 0, 0, 0.5) !important;
}

html.dark-theme #header .topbar,
html.dark-theme header .topbar {
	background: transparent !important;
}

html.dark-theme #header .topbar .logo img,
html.dark-theme header .topbar .logo img,
html.dark-theme .logo-ua-img,
html.dark-theme .footer-logo-img {
	filter: brightness(0) invert(1) !important;
}

html.dark-theme .badge-rede-artista {
	background: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

html.dark-theme #header .topbar .user-data,
html.dark-theme #header .topbar .user-data .gallery,
html.dark-theme #header .topbar .user-data .gallery .store,
html.dark-theme #header .topbar .user-data .user,
html.dark-theme header .topbar .user-data .user,
html.dark-theme .header-right .user-data .gallery,
html.dark-theme .header-right .user-data .gallery .store,
html.dark-theme .header-right .user-data .user {
	color: #F4F4F6 !important;
}

html.dark-theme .header-right .user-data .pipe {
	color: rgba(255, 255, 255, 0.25) !important;
}

html.dark-theme .header-right .user-data .link-login:hover,
html.dark-theme .header-right .user-data .user:hover {
	color: #FF008F !important;
}

html.dark-theme .dropdown-menu-user {
	background: #18181B !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.7) !important;
}

html.dark-theme .dropdown-menu-user a {
	color: #E4E4E7 !important;
}

html.dark-theme .dropdown-menu-user a:hover {
	background: #27272A !important;
	color: #FF008F !important;
}

/* Menus e Navegações Internas (Portal Inteiro) */
html.dark-theme nav#menu,
html.dark-theme .menu-navegacao,
html.dark-theme .nav-tabs,
html.dark-theme .abas-interno {
	background: #141416 !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme nav#menu a,
html.dark-theme .nav-tabs > li > a {
	color: #A1A1AA !important;
}

html.dark-theme nav#menu a:hover,
html.dark-theme nav#menu a.active,
html.dark-theme .nav-tabs > li.active > a {
	color: #FFFFFF !important;
	background: rgba(255, 255, 255, 0.08) !important;
	border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Hero Section (Portal do Artista) */
html.dark-theme .portal-hero-title {
	color: #FFFFFF !important;
}

html.dark-theme .highlight-pink {
	color: #FFFFFF !important;
}

html.dark-theme .portal-hero-subtitle {
	color: #A1A1AA !important;
}

html.dark-theme .portal-cover-frame {
	border-color: rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7) !important;
	background: #18181B !important;
}

/* Action Hub Card (Abas Fluidas) Dark Mode */
html.dark-theme .portal-hub-card {
	background: #18181B !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.75), 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

html.dark-theme .portal-tabs-nav {
	background: #111113 !important;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5) !important;
	border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

html.dark-theme .portal-tab-btn {
	color: #8E8E93 !important;
}

html.dark-theme .portal-tab-btn .tab-icon {
	color: #71717A !important;
}

html.dark-theme .portal-tab-btn:hover {
	color: #FFFFFF !important;
}

html.dark-theme .portal-tab-btn:hover .tab-icon {
	color: #FFFFFF !important;
}

html.dark-theme .portal-tab-btn.active {
	background: #27272A !important;
	color: #FFFFFF !important;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .portal-tab-btn.active .tab-icon {
	color: #FF008F !important;
}

html.dark-theme .portal-panel-kicker {
	color: #A1A1AA !important;
}

html.dark-theme .portal-panel-title {
	color: #FFFFFF !important;
}

html.dark-theme .portal-panel-desc {
	color: #A1A1AA !important;
}

html.dark-theme .portal-field-label {
	color: #D4D4D8 !important;
}

html.dark-theme .portal-forgot-link {
	color: #A1A1AA !important;
}

html.dark-theme .portal-forgot-link:hover {
	color: #FF008F !important;
}

html.dark-theme .portal-modern-input,
html.dark-theme .form-control {
	background: #121214 !important;
	border-color: rgba(255, 255, 255, 0.14) !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-modern-input:focus,
html.dark-theme .form-control:focus {
	border-color: #FF008F !important;
	background: #161619 !important;
	box-shadow: 0 0 0 3px rgba(255, 0, 143, 0.3) !important;
}

html.dark-theme .portal-input-wrapper .field-icon {
	color: #71717A !important;
}

html.dark-theme .portal-input-wrapper:focus-within .field-icon {
	color: #FF008F !important;
}

html.dark-theme .portal-modern-input::placeholder,
html.dark-theme .form-control::placeholder {
	color: #636366 !important;
}

html.dark-theme select.portal-modern-input,
html.dark-theme select.portal-select,
html.dark-theme select.form-control,
html.dark-theme .portal-select {
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%239CA3AF%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-size: 14px 14px !important;
	background-color: #141417 !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
	padding-right: 38px !important;
	height: 44px !important;
	min-height: 44px !important;
	cursor: pointer !important;
}

html.dark-theme select.portal-modern-input option,
html.dark-theme select.form-control option {
	background: #18181B !important;
	color: #FFFFFF !important;
}

/* Botão de Ação Dark Mode (Glow Rosa Vibrante) */
html.dark-theme .portal-btn-action {
	background: #FF008F !important;
	color: #FFFFFF !important;
	border-color: #FF008F !important;
	box-shadow: 0 6px 24px rgba(255, 0, 143, 0.35) !important;
}

html.dark-theme .portal-btn-action:hover {
	background: #E60081 !important;
	border-color: #E60081 !important;
	box-shadow: 0 10px 32px rgba(255, 0, 143, 0.55) !important;
}

/* Curadoria Dark Mode */
html.dark-theme .portal-curation-section {
	background: #111113 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .portal-section-badge {
	background: #18181B !important;
	color: #A1A1AA !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .portal-section-title {
	color: #FFFFFF !important;
}

html.dark-theme .portal-section-desc {
	color: #A1A1AA !important;
}

html.dark-theme .portal-timeline-step {
	background: #18181B !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .portal-timeline-step:hover {
	background: #1E1E22 !important;
	border-color: rgba(255, 255, 255, 0.28) !important;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6) !important;
}

html.dark-theme .portal-timeline-step .step-badge {
	background: #FFFFFF !important;
	color: #111111 !important;
}

html.dark-theme .portal-timeline-step .step-icon-wrap {
	background: #27272A !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-timeline-step:hover .step-icon-wrap {
	background: #FF008F !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-timeline-step .step-title {
	color: #FFFFFF !important;
}

html.dark-theme .portal-timeline-step .step-desc {
	color: #A1A1AA !important;
}

/* Card de Diretrizes Dark Mode */
html.dark-theme .portal-terms-card {
	background: #18181B !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .portal-terms-card .terms-badge {
	color: #A1A1AA !important;
}

html.dark-theme .portal-terms-card .terms-info strong {
	color: #FFFFFF !important;
}

html.dark-theme .portal-terms-card .terms-info span {
	color: #A1A1AA !important;
}

html.dark-theme .portal-btn-link {
	background: #27272A !important;
	border-color: rgba(255, 255, 255, 0.14) !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-btn-link:hover {
	background: #FFFFFF !important;
	color: #111111 !important;
	border-color: #FFFFFF !important;
}

/* Rodapé Dark Mode */
html.dark-theme .portal-footer {
	background: #09090B !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .footer-brand-copy {
	color: #A1A1AA !important;
}

html.dark-theme .footer-social-icon {
	background: #18181B !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html.dark-theme .footer-social-icon:hover {
	background: #FF008F !important;
	border-color: #FF008F !important;
	color: #FFFFFF !important;
}

html.dark-theme .footer-col-title {
	color: #FFFFFF !important;
}

html.dark-theme .footer-nav-list li a {
	color: #A1A1AA !important;
}

html.dark-theme .footer-nav-list li a:hover {
	color: #FF008F !important;
}

html.dark-theme .footer-bottom-bar {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #71717A !important;
}

html.dark-theme .footer-legal-address strong {
	color: #FFFFFF !important;
}

/* Telas Internas do Portal (Tabelas, Painéis, Caixas) */
html.dark-theme .box,
html.dark-theme .panel,
html.dark-theme .well,
html.dark-theme .card,
html.dark-theme .main-content {
	background-color: #18181B !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	color: #F4F4F6 !important;
}

html.dark-theme table,
html.dark-theme .table {
	color: #E4E4E7 !important;
	background-color: transparent !important;
}

html.dark-theme .table > thead > tr > th,
html.dark-theme table th {
	background-color: #27272A !important;
	color: #FFFFFF !important;
	border-bottom: 2px solid rgba(255, 255, 255, 0.12) !important;
}

html.dark-theme .table > tbody > tr > td,
html.dark-theme table td {
	border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

html.dark-theme .table-striped > tbody > tr:nth-of-type(odd) {
	background-color: rgba(255, 255, 255, 0.02) !important;
}

html.dark-theme .table-hover > tbody > tr:hover {
	background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Modais Dark Mode */
html.dark-theme .modal-content,
html.dark-theme .portal-modal-content {
	background: #18181B !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.8) !important;
	color: #FFFFFF !important;
}

html.dark-theme .modal-header,
html.dark-theme .portal-modal-header {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .modal-title,
html.dark-theme .portal-modal-header .modal-title {
	color: #FFFFFF !important;
}

html.dark-theme .modal-header .close,
html.dark-theme .portal-modal-header .close {
	color: #FFFFFF !important;
	opacity: 0.7 !important;
}

html.dark-theme .modal-header .close:hover,
html.dark-theme .portal-modal-header .close:hover {
	opacity: 1 !important;
}

html.dark-theme .portal-modal-hint {
	color: #A1A1AA !important;
}

html.dark-theme .modal-footer,
html.dark-theme .portal-modal-footer {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .portal-modal-btn-cancel {
	border-color: rgba(255, 255, 255, 0.16) !important;
	color: #D4D4D8 !important;
}

html.dark-theme .portal-modal-btn-cancel:hover {
	background: rgba(255, 255, 255, 0.08) !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-modal-btn-submit {
	background: #FF008F !important;
	border-color: #FF008F !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-modal-btn-submit:hover {
	background: #E60081 !important;
}



/* Avatar do Usuário na Header (Substituindo ico-user.png escuro por ícone claro e nítido) */
.user-data .user,
header .topbar .login .user {
	background: none !important;
	padding-right: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
}

.header-user-avatar {
	width: 26px !important;
	height: 26px !important;
	border-radius: 50% !important;
	background: #111111 !important;
	color: #FFFFFF !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.2s ease !important;
	flex-shrink: 0 !important;
}

.user-data .user:hover .header-user-avatar {
	background: #FF008F !important;
	color: #FFFFFF !important;
	transform: scale(1.08) !important;
}

/* Ícone claro no Dark Mode (Fundo translúcido claro + ícone branco) */
html.dark-theme .header-user-avatar {
	background: rgba(255, 255, 255, 0.18) !important;
	color: #FFFFFF !important;
	border: 1px solid rgba(255, 255, 255, 0.28) !important;
	box-shadow: 0 0 10px rgba(255, 255, 255, 0.1) !important;
}

html.dark-theme .user-data .user:hover .header-user-avatar {
	background: #FF008F !important;
	border-color: #FF008F !important;
	box-shadow: 0 0 14px rgba(255, 0, 143, 0.5) !important;
}

/* Seletor de Idioma no Footer */
.footer-lang-selector {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	margin-top: 14px !important;
}

.footer-lang-selector a {
	display: inline-flex !important;
	align-items: center !important;
	gap: 5px !important;
	color: #737373 !important;
	font-size: 11.5px !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	letter-spacing: 0.05em !important;
	opacity: 0.7 !important;
	transition: opacity 0.15s ease, color 0.15s ease !important;
}

.footer-lang-selector a:hover,
.footer-lang-selector a.active {
	opacity: 1 !important;
	color: #111111 !important;
	font-weight: 700 !important;
}

.footer-lang-selector a img {
	width: 17px !important;
	height: 12px !important;
	object-fit: cover !important;
	border-radius: 1px !important;
}

.footer-lang-selector .lang-divider {
	color: #D4D4D4 !important;
	font-size: 11px !important;
	margin: 0 2px !important;
}

html.dark-theme .footer-lang-selector a {
	color: #8E8E93 !important;
}

html.dark-theme .footer-lang-selector a:hover,
html.dark-theme .footer-lang-selector a.active {
	color: #FFFFFF !important;
}

html.dark-theme .footer-lang-selector .lang-divider {
	color: rgba(255, 255, 255, 0.2) !important;
}



/* ==========================================================================
   Modal de Recuperação de Senha (Design Moderno & Consistente)
   ========================================================================== */

#ExemploModalCentralizado .modal-dialog {
	max-width: 480px !important;
	margin: 80px auto !important;
}

.portal-modal-content {
	border-radius: 14px !important;
	padding: 28px 30px !important;
	border: 1px solid rgba(0, 0, 0, 0.1) !important;
	box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22) !important;
	background: #FFFFFF !important;
	overflow: hidden !important;
}

html.dark-theme .portal-modal-content {
	background: #18181B !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.8) !important;
}

.portal-modal-header {
	padding: 0 0 16px !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	float: none !important;
}

html.dark-theme .portal-modal-header {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.portal-modal-header .modal-title {
	font-size: 20px !important;
	font-weight: 800 !important;
	color: #111111 !important;
	letter-spacing: -0.02em !important;
	margin: 0 !important;
}

html.dark-theme .portal-modal-header .modal-title {
	color: #FFFFFF !important;
}

.portal-modal-close {
	background: rgba(0, 0, 0, 0.05) !important;
	border: none !important;
	width: 32px !important;
	height: 32px !important;
	border-radius: 50% !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	color: #666666 !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
	padding: 0 !important;
	line-height: 0 !important;
	outline: none !important;
	opacity: 1 !important;
	float: none !important;
	margin: 0 !important;
}

.portal-modal-close:hover {
	background: rgba(0, 0, 0, 0.1) !important;
	color: #111111 !important;
	transform: scale(1.05) !important;
}

html.dark-theme .portal-modal-close {
	background: rgba(255, 255, 255, 0.08) !important;
	color: #A1A1AA !important;
}

html.dark-theme .portal-modal-close:hover {
	background: rgba(255, 255, 255, 0.16) !important;
	color: #FFFFFF !important;
}

.portal-modal-body {
	padding: 20px 0 0 !important;
}

.portal-modal-hint {
	font-size: 14px !important;
	color: #666666 !important;
	line-height: 1.55 !important;
	margin: 0 0 20px !important;
}

html.dark-theme .portal-modal-hint {
	color: #A1A1AA !important;
}

/* Modal Footer & Buttons (Eliminando a barra branca no dark mode) */
.portal-modal-footer,
.modal-footer {
	background: transparent !important;
	background-color: transparent !important;
	border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
	padding: 18px 0 0 !important;
	margin-top: 24px !important;
	display: flex !important;
	justify-content: flex-end !important;
	align-items: center !important;
	gap: 10px !important;
	text-align: right !important;
}

html.dark-theme .portal-modal-footer,
html.dark-theme .modal-footer {
	background: transparent !important;
	background-color: transparent !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.portal-modal-btn-cancel {
	background: transparent !important;
	background-color: transparent !important;
	border: 1.5px solid #D8D8D8 !important;
	color: #666666 !important;
	border-radius: 6px !important;
	padding: 10px 20px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: 0.04em !important;
	text-transform: uppercase !important;
	transition: all 0.2s ease !important;
	cursor: pointer !important;
	box-shadow: none !important;
	margin: 0 !important;
}

.portal-modal-btn-cancel:hover {
	background: rgba(0, 0, 0, 0.04) !important;
	color: #111111 !important;
	border-color: #AAAAAA !important;
}

html.dark-theme .portal-modal-btn-cancel {
	background: rgba(255, 255, 255, 0.06) !important;
	background-color: rgba(255, 255, 255, 0.06) !important;
	border-color: rgba(255, 255, 255, 0.16) !important;
	color: #E4E4E7 !important;
}

html.dark-theme .portal-modal-btn-cancel:hover {
	background: rgba(255, 255, 255, 0.12) !important;
	background-color: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
	border-color: rgba(255, 255, 255, 0.28) !important;
}

.portal-modal-btn-submit {
	background: #111111 !important;
	border: 1.5px solid #111111 !important;
	color: #FFFFFF !important;
	border-radius: 6px !important;
	padding: 10px 24px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	transition: all 0.2s ease !important;
	cursor: pointer !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12) !important;
	margin: 0 !important;
}

.portal-modal-btn-submit:hover {
	background: #000000 !important;
	border-color: #000000 !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.22) !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-modal-btn-submit {
	background: #FF008F !important;
	background-color: #FF008F !important;
	border-color: #FF008F !important;
	color: #FFFFFF !important;
	box-shadow: 0 4px 16px rgba(255, 0, 143, 0.4) !important;
}

html.dark-theme .portal-modal-btn-submit:hover {
	background: #E60081 !important;
	background-color: #E60081 !important;
	border-color: #E60081 !important;
	box-shadow: 0 8px 22px rgba(255, 0, 143, 0.55) !important;
	transform: translateY(-1px) !important;
	color: #FFFFFF !important;
}



/* Card Principal do Wizard */
.portal-wizard-card {
	background: #FFFFFF;
	border: 1px solid #E5E7EB;
	border-radius: 18px;
	box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.05), 0 4px 8px -2px rgba(0, 0, 0, 0.02);
	padding: 40px 44px;
	position: relative;
	transition: all 0.3s ease;
}

html.dark-theme .portal-wizard-card {
	background: #18181C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 16px 36px rgba(0, 0, 0, 0.45);
}

/* Cabeçalhos de Seção Internos */
.portal-section-header {
	margin-bottom: 28px;
	padding-bottom: 16px;
	border-bottom: 1px solid #F3F4F6;
}

html.dark-theme .portal-section-header {
	border-bottom-color: rgba(255, 255, 255, 0.07);
}

.portal-step-header-full {
	margin-bottom: 28px;
	padding-bottom: 18px;
	border-bottom: 1px solid #F3F4F6;
}

html.dark-theme .portal-step-header-full {
	border-bottom-color: rgba(255, 255, 255, 0.07);
}

.portal-section-title {
	font-size: 22px;
	font-weight: 700;
	color: #111111;
	margin: 0 0 6px 0;
	letter-spacing: -0.015em;
}

html.dark-theme .portal-section-title {
	color: #FFFFFF !important;
}

.portal-section-desc {
	font-size: 14px;
	color: #6B7280;
	margin: 0;
	line-height: 1.5;
}

html.dark-theme .portal-section-desc {
	color: #9CA3AF !important;
}

/* PASSO 1: Grid e Uploader */
.portal-step-grid {
	display: flex;
	gap: 36px;
	align-items: flex-start;
}

.portal-step-sidebar {
	flex: 0 0 310px;
}

.portal-step-content {
	flex: 1;
	min-width: 0;
}

/* Tip Box / Dicas: Card Neutro e Sofisticado */
.portal-tip-box {
	background: #FAFAFA !important;
	border: 1px solid #E5E7EB !important;
	border-radius: 16px !important;
	padding: 24px !important;
	position: sticky !important;
	top: 24px !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

html.dark-theme .portal-tip-box {
	background: #18181C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

.portal-tip-icon {
	width: 38px !important;
	height: 38px !important;
	border-radius: 10px !important;
	background: rgba(255, 0, 143, 0.08) !important;
	color: #FF008F !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin-bottom: 14px !important;
}

html.dark-theme .portal-tip-icon {
	background: rgba(255, 0, 143, 0.15) !important;
	color: #FF008F !important;
}

.portal-tip-title {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: #111111 !important;
	margin: 0 0 8px 0 !important;
	letter-spacing: -0.01em !important;
}

html.dark-theme .portal-tip-title {
	color: #FFFFFF !important;
}

.portal-tip-text {
	font-size: 13px !important;
	line-height: 1.55 !important;
	color: #4B5563 !important;
	margin: 0 0 16px 0 !important;
}

html.dark-theme .portal-tip-text {
	color: #A1A1AA !important;
}

.portal-tip-features {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 10px !important;
}

.portal-tip-features li {
	font-size: 12.5px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	line-height: 1.4 !important;
}

html.dark-theme .portal-tip-features li {
	color: #D4D4D8 !important;
}

.feature-check-icon {
	width: 18px !important;
	height: 18px !important;
	border-radius: 50% !important;
	background: rgba(16, 185, 129, 0.12) !important;
	color: #10B981 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
}

/* Card Moderno de Upload de Avatar */
.portal-avatar-uploader {
	background: #FAFAFA !important;
	border: 1px solid #E5E7EB !important;
	border-radius: 16px !important;
	padding: 24px 28px !important;
	margin-bottom: 28px !important;
	display: flex !important;
	align-items: center !important;
	gap: 28px !important;
	transition: all 0.2s ease !important;
}

html.dark-theme .portal-avatar-uploader {
	background: #18181C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

.portal-avatar-uploader .perfil {
	float: none !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
}

.portal-avatar-uploader .perfil .foto {
	float: none !important;
	margin: 0 !important;
	position: static !important;
}

.portal-avatar-uploader .fileinput {
	display: flex !important;
	align-items: center !important;
	gap: 24px !important;
	margin: 0 !important;
}

/* Círculo do Preview */
.portal-avatar-uploader .perfil .foto .thumbnail,
.avatar-preview-circle {
	width: 104px !important;
	height: 104px !important;
	min-width: 104px !important;
	min-height: 104px !important;
	max-width: 104px !important;
	max-height: 104px !important;
	border-radius: 50% !important;
	border: 3px solid #FFFFFF !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
	background-color: #F3F4F6 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 0 !important;
	cursor: pointer !important;
	position: relative !important;
	transition: all 0.2s ease !important;
	flex-shrink: 0 !important;
}

/* Remover o ícone font-icon antigo duplicado (\e900) */
.portal-avatar-uploader .perfil .foto .thumbnail:before,
.avatar-preview-circle:before {
	display: none !important;
	content: "" !important;
}

html.dark-theme .portal-avatar-uploader .perfil .foto .thumbnail,
html.dark-theme .avatar-preview-circle {
	border-color: #27272A !important;
	background-color: #27272A !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3) !important;
}

.portal-avatar-uploader .perfil .foto .thumbnail:hover,
.avatar-preview-circle:hover {
	transform: scale(1.02);
	border-color: #FF008F !important;
}

.avatar-placeholder-overlay {
	color: #9CA3AF;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 100% !important;
	transition: all 0.2s ease !important;
}

.avatar-preview-circle:hover .avatar-placeholder-overlay {
	color: #FF008F;
}

/* Imagem carregada no preview */
.portal-avatar-uploader .thumbnail img,
.avatar-preview-circle img {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: cover !important;
	border-radius: 50% !important;
	display: block !important;
}

/* Quando há imagem, esconder o placeholder de câmera */
.fileinput-exists .avatar-placeholder-overlay {
	display: none !important;
}

/* Coluna de Informações e Ações do Avatar */
.portal-avatar-info {
	display: flex !important;
	flex-direction: column !important;
	gap: 12px !important;
	flex: 1 !important;
}

.avatar-info-header {
	display: flex !important;
	flex-direction: column !important;
	gap: 3px !important;
}

.avatar-info-title {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: #111111 !important;
	margin: 0 !important;
	letter-spacing: -0.01em !important;
}

html.dark-theme .avatar-info-title {
	color: #FFFFFF !important;
}

.avatar-info-desc {
	font-size: 12.5px !important;
	color: #6B7280 !important;
	margin: 0 !important;
	line-height: 1.4 !important;
}

html.dark-theme .avatar-info-desc {
	color: #9CA3AF !important;
}

/* Botões de Ação do Avatar */
.avatar-actions {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	margin: 0 !important;
}

.portal-btn-choose,
.portal-btn-change {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 7px !important;
	background: #111111 !important;
	color: #FFFFFF !important;
	height: 38px !important;
	min-height: 38px !important;
	padding: 0 16px !important;
	border-radius: 9px !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
	border: none !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	text-decoration: none !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
	width: auto !important;
}

.portal-btn-choose:hover,
.portal-btn-change:hover {
	background: #FF008F !important;
	box-shadow: 0 4px 14px rgba(255, 0, 143, 0.35) !important;
	color: #FFFFFF !important;
	transform: translateY(-1px) !important;
}

html.dark-theme .portal-btn-choose,
html.dark-theme .portal-btn-change {
	background: #27272A !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html.dark-theme .portal-btn-choose:hover,
html.dark-theme .portal-btn-change:hover {
	background: #FF008F !important;
	border-color: #FF008F !important;
}

/* Botão Remover Foto */
.portal-btn-remove {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	background: rgba(239, 68, 68, 0.08) !important;
	border: 1px solid rgba(239, 68, 68, 0.2) !important;
	color: #DC2626 !important;
	height: 38px !important;
	min-height: 38px !important;
	padding: 0 14px !important;
	border-radius: 9px !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	text-decoration: none !important;
	width: auto !important;
}

.portal-btn-remove:hover {
	background: #DC2626 !important;
	color: #FFFFFF !important;
	border-color: #DC2626 !important;
	box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25) !important;
	transform: translateY(-1px) !important;
}

html.dark-theme .portal-btn-remove {
	background: rgba(239, 68, 68, 0.15) !important;
	border-color: rgba(239, 68, 68, 0.3) !important;
	color: #F87171 !important;
}

html.dark-theme .portal-btn-remove:hover {
	background: #EF4444 !important;
	color: #FFFFFF !important;
	border-color: #EF4444 !important;
}

/* Controle Estrito dos Estados Jasny (fileinput-new vs fileinput-exists) */
.fileinput.fileinput-new .portal-btn-choose {
	display: inline-flex !important;
}
.fileinput.fileinput-new .portal-btn-change,
.fileinput.fileinput-new .portal-btn-remove {
	display: none !important;
}

.fileinput.fileinput-exists .portal-btn-choose {
	display: none !important;
}
.fileinput.fileinput-exists .portal-btn-change {
	display: inline-flex !important;
}
.fileinput.fileinput-exists .portal-btn-remove {
	display: inline-flex !important;
}

/* Chips de Especificações (Formatos, Dimensões, Peso) */
.portal-specs-chips {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	flex-wrap: wrap !important;
	margin-top: 2px !important;
}

.spec-chip {
	display: inline-flex !important;
	align-items: center !important;
	padding: 3px 8px !important;
	border-radius: 6px !important;
	background: #E5E7EB !important;
	color: #4B5563 !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em !important;
	line-height: 1 !important;
}

html.dark-theme .spec-chip {
	background: #27272A !important;
	color: #9CA3AF !important;
}

/* Campos de Formulário Modernos */
.portal-form-group {
	margin-bottom: 22px;
}

.portal-label-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
}

.portal-form-label {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #374151 !important;
	margin: 0 0 7px 0 !important;
	display: flex;
	align-items: center;
	gap: 8px;
}

html.dark-theme .portal-form-label {
	color: #E5E7EB !important;
}

.portal-char-counter {
	font-size: 11.5px;
	font-weight: 600;
	color: #9CA3AF;
	font-variant-numeric: tabular-nums;
}

.portal-input,
.portal-textarea {
	background: #FFFFFF !important;
	border: 1.5px solid #E5E7EB !important;
	border-radius: 9px !important;
	padding: 10px 14px !important;
	font-size: 14px !important;
	color: #111111 !important;
	box-shadow: none !important;
	transition: all 0.2s ease !important;
	width: 100% !important;
	height: 44px;
	box-sizing: border-box !important;
}

select.portal-select,
.portal-select {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%236B7280%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-size: 14px 14px !important;
	background-color: #FFFFFF !important;
	border: 1.5px solid #E5E7EB !important;
	border-radius: 9px !important;
	padding: 10px 38px 10px 14px !important;
	font-size: 14px !important;
	color: #111111 !important;
	box-shadow: none !important;
	transition: all 0.2s ease !important;
	width: 100% !important;
	height: 44px !important;
	min-height: 44px !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	cursor: pointer !important;
	box-sizing: border-box !important;
}

.portal-input:focus,
.portal-select:focus,
.portal-textarea:focus {
	border-color: #FF008F !important;
	box-shadow: 0 0 0 3px rgba(255, 0, 143, 0.18) !important;
	outline: none !important;
}

html.dark-theme .portal-input,
html.dark-theme .portal-textarea {
	background: #141417 !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html.dark-theme select.portal-select,
html.dark-theme .portal-select {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%239CA3AF%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-size: 14px 14px !important;
	background-color: #141417 !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	padding-right: 38px !important;
	height: 44px !important;
	min-height: 44px !important;
	cursor: pointer !important;
}

html.dark-theme .portal-input:focus,
html.dark-theme .portal-select:focus,
html.dark-theme .portal-textarea:focus {
	border-color: #FF008F !important;
	box-shadow: 0 0 0 3px rgba(255, 0, 143, 0.3) !important;
}

.portal-input-locked {
	background: #F9FAFB !important;
	color: #6B7280 !important;
	cursor: not-allowed !important;
	border-style: dashed !important;
}

html.dark-theme .portal-input-locked {
	background: #17171B !important;
	color: #9CA3AF !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

.portal-form-hint {
	font-size: 12px;
	color: #9CA3AF;
	display: block;
	margin-top: 5px;
}

.portal-label-row .portal-form-label {
	margin-bottom: 0 !important;
}

.portal-badge-locked {
	display: inline-flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 5px !important;
	white-space: nowrap !important;
	flex-shrink: 0 !important;
	padding: 3px 8px !important;
	background: #F3F4F6 !important;
	border: 1px solid #E5E7EB !important;
	border-radius: 6px !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	color: #4B5563 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.05em !important;
}

.portal-badge-locked svg {
	display: inline-block !important;
	vertical-align: middle !important;
	flex-shrink: 0 !important;
	stroke: #D97706 !important;
}

html.dark-theme .portal-badge-locked {
	background: #27272A !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #D4D4D8 !important;
}

html.dark-theme .portal-badge-locked svg {
	stroke: #FBBF24 !important;
}

.portal-badge-verified {
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	background: rgba(16, 185, 129, 0.1);
	border: 1px solid rgba(16, 185, 129, 0.25);
	border-radius: 4px;
	font-size: 10.5px;
	font-weight: 700;
	color: #10B981;
}

/* PASSO 2: Cards de Agrupamento */
.portal-form-card {
	background: #FFFFFF;
	border: 1px solid #F3F4F6;
	border-radius: 14px;
	padding: 24px;
	margin-bottom: 24px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
}

html.dark-theme .portal-form-card {
	background: #1D1D22;
	border-color: rgba(255, 255, 255, 0.06);
	box-shadow: none;
}

.portal-card-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
	padding-bottom: 14px;
	border-bottom: 1px solid #F3F4F6;
}

html.dark-theme .portal-card-header {
	border-bottom-color: rgba(255, 255, 255, 0.06);
}

.portal-card-icon {
	width: 36px;
	height: 36px;
	border-radius: 9px;
	background: rgba(255, 0, 143, 0.08);
	color: #FF008F;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.portal-card-title {
	font-size: 15px;
	font-weight: 700;
	color: #111111;
	margin: 0;
}

html.dark-theme .portal-card-title {
	color: #FFFFFF !important;
}

.portal-card-subtitle {
	font-size: 12px;
	color: #6B7280;
	margin: 0;
}

html.dark-theme .portal-card-subtitle {
	color: #9CA3AF !important;
}

/* Grids Responsivos */
.portal-grid {
	display: grid;
	gap: 16px;
}

.portal-grid-2 {
	grid-template-columns: repeat(2, 1fr);
}

.portal-grid-3 {
	grid-template-columns: repeat(3, 1fr);
}

.portal-grid-4 {
	grid-template-columns: repeat(4, 1fr);
}

.portal-col-span-2 {
	grid-column: span 2;
}

/* PASSO 3: Formas de Recebimento */
/* Formas de Recebimento Uniformes (PIX, Itaú, PayPal) */
.portal-payment-options,
.lista-recebimento,
.seus-dados .lista-recebimento {
	overflow: visible !important;
}

.portal-payment-options {
	margin-bottom: 30px;
}

.portal-payment-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 20px !important;
	margin: 0 !important;
	padding-top: 10px !important;
	padding-bottom: 8px !important;
	overflow: visible !important;
}

.portal-pay-card {
	position: relative !important;
	height: 100% !important;
	overflow: visible !important;
}

.portal-pay-card .portal-pay-radio {
	position: absolute !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.portal-pay-card-label {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	background: #FFFFFF !important;
	border: 2px solid #E5E7EB !important;
	border-radius: 16px !important;
	padding: 26px 18px 22px 18px !important;
	min-height: 140px !important;
	height: 100% !important;
	cursor: pointer !important;
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
	position: relative !important;
	margin: 0 !important;
	width: 100% !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03) !important;
}

html.dark-theme .portal-pay-card-label {
	background: #18181C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2) !important;
}

.portal-pay-card-label:hover {
	transform: translateY(-2px) !important;
	border-color: rgba(255, 0, 143, 0.5) !important;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08) !important;
}

html.dark-theme .portal-pay-card-label:hover {
	background: #1F1F24 !important;
	border-color: rgba(255, 0, 143, 0.5) !important;
}

.portal-pay-radio:checked + .portal-pay-card-label {
	border-color: #FF008F !important;
	background: rgba(255, 0, 143, 0.03) !important;
	box-shadow: 0 0 0 3px rgba(255, 0, 143, 0.2), 0 8px 24px rgba(255, 0, 143, 0.12) !important;
}

html.dark-theme .portal-pay-radio:checked + .portal-pay-card-label {
	background: rgba(255, 0, 143, 0.08) !important;
	box-shadow: 0 0 0 3px rgba(255, 0, 143, 0.3), 0 8px 24px rgba(255, 0, 143, 0.2) !important;
}

.portal-pay-logo-wrap {
	width: 60px !important;
	height: 60px !important;
	border-radius: 14px !important;
	background: #F3F4F6 !important;
	border: 1.5px solid #E5E7EB !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin-bottom: 14px !important;
	color: #1F2937 !important;
	transition: all 0.25s ease !important;
	padding: 0 !important;
	box-shadow: none !important;
}

html.dark-theme .portal-pay-logo-wrap {
	background: rgba(255, 255, 255, 0.05) !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	color: #FFFFFF !important;
}

.portal-pay-card-label:hover .portal-pay-logo-wrap {
	border-color: rgba(255, 0, 143, 0.4) !important;
	color: #FF008F !important;
}

.portal-pay-radio:checked + .portal-pay-card-label .portal-pay-logo-wrap {
	border-color: #FF008F !important;
	background: rgba(255, 0, 143, 0.14) !important;
	color: #FF008F !important;
}

.portal-pay-icon {
	display: block !important;
}

.portal-pay-name {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: #111111 !important;
	letter-spacing: 0.3px !important;
	margin: 0 !important;
	text-align: center !important;
}

html.dark-theme .portal-pay-name {
	color: #FFFFFF !important;
}

.portal-pay-desc,
.portal-pay-badge-rec,
.portal-pay-more-link {
	display: none !important;
}

/* Selected Payment Logo in Box */
.portal-selected-logo {
	width: 52px !important;
	height: 52px !important;
	border-radius: 12px !important;
	background: rgba(255, 0, 143, 0.12) !important;
	border: 1px solid rgba(255, 0, 143, 0.3) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	color: #FF008F !important;
}

.portal-selected-logo svg {
	max-width: 28px !important;
	max-height: 28px !important;
	display: block !important;
}

/* Box de Recebimento Detalhado (Reset Radical) */
.portal-wizard-card .box-recebimento,
.portal-cadastro-page .box-recebimento,
.portal-receiving-box {
	background: #FAFAFA !important;
	border: 1.5px solid #E5E7EB !important;
	border-radius: 16px !important;
	padding: 24px 28px !important;
	margin-bottom: 30px !important;
	width: 100% !important;
	max-width: 100% !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	position: static !important;
	float: none !important;
	box-shadow: none !important;
	box-sizing: border-box !important;
	clear: both !important;
}

html.dark-theme .portal-wizard-card .box-recebimento,
html.dark-theme .portal-cadastro-page .box-recebimento,
html.dark-theme .portal-receiving-box {
	background: #18181C !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
}

.portal-receiving-header {
	margin-bottom: 24px !important;
	padding-bottom: 18px !important;
	border-bottom: 1px solid #E5E7EB !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	float: none !important;
	width: 100% !important;
	box-sizing: border-box !important;
	flex-wrap: wrap !important;
	gap: 16px !important;
}

html.dark-theme .portal-receiving-header {
	border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

.portal-selected-header-left {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
}

.portal-wizard-card .box-recebimento .item,
.portal-receiving-header .item,
.portal-selected-method-item {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}

.portal-wizard-card .box-recebimento .item .logo,
.portal-selected-logo {
	width: 52px !important;
	height: 52px !important;
	min-width: 52px !important;
	min-height: 52px !important;
	max-width: 52px !important;
	max-height: 52px !important;
	border-radius: 12px !important;
	background: #FFFFFF !important;
	border: 1px solid #E5E7EB !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 6px !important;
	margin: 0 !important;
	float: none !important;
	position: relative !important;
	overflow: hidden !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
	box-sizing: border-box !important;
}

.portal-wizard-card .box-recebimento .item .logo:after,
.portal-selected-logo:after {
	display: none !important;
	content: none !important;
}

.portal-selected-logo img,
.portal-wizard-card .box-recebimento .item .logo img {
	max-width: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain !important;
	display: block !important;
	margin: 0 auto !important;
}

/* Ocultar rigorosamente qualquer texto que caia dentro de .logo */
.portal-selected-logo p,
.portal-selected-logo h4,
.portal-selected-logo span,
.portal-selected-logo .portal-pay-name,
.portal-selected-logo .portal-pay-desc,
.portal-selected-logo .portal-pay-badge-rec,
.portal-selected-logo .portal-pay-more-link {
	display: none !important;
}

.portal-selected-info {
	display: flex !important;
	flex-direction: column !important;
	gap: 3px !important;
}

.portal-selected-badge {
	font-size: 11px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.06em !important;
	color: #9CA3AF !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
	line-height: 1.2 !important;
}

.portal-selected-title {
	font-size: 17px !important;
	font-weight: 700 !important;
	color: #111111 !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
	line-height: 1.2 !important;
}

html.dark-theme .portal-selected-title {
	color: #FFFFFF !important;
}

.portal-change-method-link,
.portal-wizard-card .box-recebimento .item a {
	display: inline-flex !important;
	align-items: center !important;
	gap: 7px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #FF008F !important;
	padding: 8px 16px !important;
	background: rgba(255, 0, 143, 0.08) !important;
	border: 1px solid rgba(255, 0, 143, 0.22) !important;
	border-radius: 9px !important;
	text-decoration: none !important;
	text-transform: none !important;
	transition: all 0.2s ease !important;
	float: none !important;
	margin: 0 !important;
	cursor: pointer !important;
	line-height: 1 !important;
}

.portal-change-method-link:hover,
.portal-wizard-card .box-recebimento .item a:hover {
	background: rgba(255, 0, 143, 0.16) !important;
	color: #FF008F !important;
	text-decoration: none !important;
	transform: translateY(-1px) !important;
}

/* Reset dos campos */
.portal-wizard-card .box-recebimento .campos,
.portal-receiving-fields {
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
}

/* Pills de Chave PIX */
.portal-pix-container {
	margin-top: 10px;
}

.portal-pix-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 20px;
}

.portal-pix-pill {
	display: inline-flex;
	align-items: center;
	padding: 8px 16px;
	background: #FFFFFF;
	border: 1.5px solid #E5E7EB;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #4B5563;
	cursor: pointer;
	transition: all 0.2s ease;
	user-select: none;
	margin: 0 !important;
}

html.dark-theme .portal-pix-pill {
	background: #141417;
	border-color: rgba(255, 255, 255, 0.12);
	color: #D4D4D8;
}

.portal-pix-pill input[type="radio"] {
	margin: 0 8px 0 0;
	accent-color: #FF008F;
}

.portal-pix-pill:hover {
	border-color: #FF008F;
}

.portal-pix-pill:has(input[type="radio"]:checked) {
	background: rgba(255, 0, 143, 0.06);
	border-color: #FF008F;
	color: #FF008F;
}

html.dark-theme .portal-pix-pill:has(input[type="radio"]:checked) {
	background: rgba(255, 0, 143, 0.15);
	color: #FFFFFF;
}

/* Barra de Ações do Wizard e Botão Próximo */
.portal-wizard-actions {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	margin-top: 32px !important;
	padding-top: 24px !important;
	border-top: 1px solid #F3F4F6 !important;
	clear: both !important;
}

html.dark-theme .portal-wizard-actions {
	border-top-color: rgba(255, 255, 255, 0.08) !important;
}

/* Reset radical de .bt1 para botões do wizard */
.portal-wizard-actions .portal-btn,
.portal-wizard-actions button.portal-btn,
.portal-wizard-actions a.portal-btn,
.portal-wizard-card .portal-wizard-actions .bt1 {
	width: auto !important;
	min-width: 200px !important;
	max-width: 100% !important;
	height: 48px !important;
	min-height: 48px !important;
	line-height: 1 !important;
	padding: 0 26px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	border-radius: 10px !important;
	font-family: 'Inter', -apple-system, sans-serif !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
	white-space: nowrap !important;
	float: none !important;
	box-sizing: border-box !important;
	cursor: pointer !important;
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
	text-decoration: none !important;
}

.portal-wizard-actions .portal-btn-primary,
.portal-btn-primary {
	background: linear-gradient(135deg, #FF008F 0%, #E60081 100%) !important;
	color: #FFFFFF !important;
	border: none !important;
	box-shadow: 0 4px 14px rgba(255, 0, 143, 0.35) !important;
}

.portal-wizard-actions .portal-btn-primary:hover,
.portal-btn-primary:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 22px rgba(255, 0, 143, 0.45) !important;
	color: #FFFFFF !important;
}

.portal-wizard-actions .portal-btn-secondary,
.portal-btn-secondary {
	background: #F3F4F6 !important;
	color: #374151 !important;
	border: 1px solid #E5E7EB !important;
	box-shadow: none !important;
}

.portal-wizard-actions .portal-btn-secondary:hover,
.portal-btn-secondary:hover {
	background: #E5E7EB !important;
	color: #111111 !important;
	transform: translateY(-1px) !important;
}

html.dark-theme .portal-wizard-actions .portal-btn-secondary,
html.dark-theme .portal-btn-secondary {
	background: #27272A !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	color: #E5E7EB !important;
}

html.dark-theme .portal-wizard-actions .portal-btn-secondary:hover,
html.dark-theme .portal-btn-secondary:hover {
	background: #3F3F46 !important;
	color: #FFFFFF !important;
}

.portal-wizard-actions .portal-btn-submit-wizard,
.portal-btn-submit-wizard {
	background: linear-gradient(135deg, #10B981 0%, #059669 100%) !important;
	color: #FFFFFF !important;
	padding: 0 32px !important;
	height: 48px !important;
	min-height: 48px !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	border-radius: 10px !important;
	box-shadow: 0 4px 16px rgba(16, 185, 129, 0.35) !important;
	border: none !important;
}

.portal-wizard-actions .portal-btn-submit-wizard:hover,
.portal-btn-submit-wizard:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 24px rgba(16, 185, 129, 0.5) !important;
	color: #FFFFFF !important;
}

/* Responsividade */
@media (max-width: 992px) {
	.portal-step-grid {
		flex-direction: column !important;
		gap: 24px !important;
	}

	.portal-step-sidebar {
		flex: none !important;
		width: 100% !important;
		order: 2 !important;
	}

	.portal-step-content {
		order: 1 !important;
	}

	.portal-payment-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.portal-grid-3,
	.portal-grid-4 {
		grid-template-columns: repeat(2, 1fr);
	}

	.portal-col-span-2 {
		grid-column: span 1;
	}
}

@media (max-width: 768px) {
	.portal-wizard-card {
		padding: 24px 18px;
	}

	.portal-stepper-nav {
		gap: 8px;
	}

	.step-text-wrap {
		display: none;
	}

	.portal-step-item {
		padding: 6px;
	}

	.portal-stepper-track {
		left: 24px;
		right: 24px;
	}

	.portal-avatar-uploader .fileinput {
		flex-direction: column !important;
		align-items: center !important;
		text-align: center !important;
	}

	.portal-avatar-info {
		align-items: center !important;
		text-align: center !important;
	}

	.portal-specs-chips {
		justify-content: center !important;
	}

	.avatar-actions {
		justify-content: center !important;
		flex-wrap: wrap !important;
	}

	.avatar-actions {
		justify-content: center;
	}

	.portal-grid-2,
	.portal-grid-3,
	.portal-grid-4 {
		grid-template-columns: 1fr;
	}

	.portal-payment-grid {
		grid-template-columns: 1fr;
	}

	.portal-wizard-actions {
		display: flex !important;
		flex-direction: column-reverse !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
		gap: 12px !important;
		width: 100% !important;
	}

	.portal-wizard-actions > div:empty {
		display: none !important;
	}

	.portal-wizard-actions .portal-btn,
	.portal-wizard-actions button.portal-btn,
	.portal-wizard-actions a.portal-btn,
	.portal-wizard-card .portal-wizard-actions .bt1 {
		width: 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		height: 48px !important;
		min-height: 48px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		text-align: center !important;
		box-sizing: border-box !important;
		float: none !important;
		margin: 0 !important;
		border-radius: 10px !important;
	}
}




/* ==========================================================================
   TOPBAR UNIFICADA INTEGRADA (MODERN HEADER)
   ========================================================================== */

/* Desativar completamente o menu inferior antigo e linhas redundantes */
header .menu,
.artlab-header .menu,
#header .menu,
.header-menu-inner,
#nav-principal,
header .linha-menu,
.linha-menu {
	display: none !important;
}

#header.topbar-modern,
header.artlab-header.topbar-modern {
	position: relative;
	z-index: 1000;
	height: 68px !important;
	min-height: 68px !important;
}

.topbar-modern .header-inner.topbar {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	height: 68px !important;
	max-width: 1240px !important;
	width: 100% !important;
	margin: 0 auto !important;
	padding: 0 20px !important;
	box-sizing: border-box !important;
}

/* Navegação Central */
.topbar-nav {
	display: flex;
	align-items: center;
	margin: 0 16px;
}

.topbar-nav-list {
	display: flex;
	align-items: center;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.topbar-nav-item {
	position: relative;
	margin: 0;
	padding: 0;
}

.topbar-nav-link {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	height: 38px !important;
	min-height: 38px !important;
	padding: 0 14px !important;
	border-radius: 9px !important;
	font-family: 'Inter', -apple-system, sans-serif !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #4B5563 !important;
	text-decoration: none !important;
	border: 1px solid transparent !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
	white-space: nowrap !important;
	box-sizing: border-box !important;
	line-height: 1 !important;
}

.topbar-nav-icon {
	color: #6B7280;
	transition: all 0.2s ease;
	flex-shrink: 0;
}

.topbar-nav-link:hover {
	background: rgba(0, 0, 0, 0.05);
	color: #111111;
}

.topbar-nav-link:hover .topbar-nav-icon {
	color: #111111;
}

/* Item Ativo */
.topbar-nav-item.active .topbar-nav-link {
	background: #FFFFFF;
	color: #111111;
	font-weight: 600;
	border-color: rgba(0, 0, 0, 0.08);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.topbar-nav-item.active .topbar-nav-icon {
	color: #FF008F !important;
}

/* Caret Dropdown */
.topbar-caret {
	transition: transform 0.2s ease;
	opacity: 0.6;
	margin-left: 1px;
}

.topbar-dropdown-item:hover .topbar-caret {
	transform: rotate(180deg);
	opacity: 1;
}

/* Dropdown Ajuda */
.topbar-dropdown-item {
	position: relative;
}

.dropdown-menu-ajuda {
	position: absolute;
	top: 100%;
	margin-top: 6px;
	right: 0;
	min-width: 220px;
	background: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 12px;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12);
	padding: 8px;
	z-index: 1050;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0.08s, transform 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0.08s, visibility 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0.08s;
	pointer-events: none;
}

/* Hover bridge invisível para eliminar o gap entre o botão e o menu */
.dropdown-menu-ajuda::before {
	content: '' !important;
	position: absolute !important;
	top: -12px !important;
	left: 0 !important;
	right: 0 !important;
	height: 12px !important;
	display: block !important;
	background: transparent !important;
	pointer-events: auto !important;
}

.topbar-dropdown-item:hover .dropdown-menu-ajuda,
.dropdown-menu-ajuda.active,
#dropdown-ajuda-menu.active {
	opacity: 1 !important;
	visibility: visible !important;
	transform: translateY(0) !important;
	pointer-events: auto !important;
	transition-delay: 0s !important;
}

.dropdown-menu-ajuda a {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 9px 12px !important;
	border-radius: 8px !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	text-decoration: none !important;
	transition: all 0.15s ease !important;
}

.dropdown-menu-ajuda a svg {
	color: #6B7280;
	flex-shrink: 0;
}

.dropdown-menu-ajuda a:hover {
	background: #F3F4F6 !important;
	color: #111111 !important;
}

.dropdown-menu-ajuda a:hover svg {
	color: #FF008F !important;
}

.dropdown-menu-ajuda a.active {
	background: rgba(255, 0, 143, 0.08) !important;
	color: #FF008F !important;
	font-weight: 600 !important;
}

/* Header Right e alinhamento vertical dos botões */
.topbar-modern .header-right,
header.topbar-modern .topbar .col-right {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	height: 68px !important;
	margin: 0 !important;
	padding: 0 !important;
}

.topbar-modern .user-data,
.topbar-modern .user-data.login {
	height: auto !important;
	line-height: normal !important;
	display: inline-flex !important;
	align-items: center !important;
	margin: 0 !important;
	padding: 0 !important;
}

.user-dropdown-wrapper {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	height: 38px !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Botão CTA: Enviar Artes */
/* Botão Alternador de Tema */
.topbar-modern .theme-toggle-btn {
	width: 38px !important;
	height: 38px !important;
	min-height: 38px !important;
	border-radius: 9px !important;
	background: rgba(0, 0, 0, 0.04) !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	color: #4B5563 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	line-height: 1 !important;
	transition: all 0.2s ease !important;
}

.topbar-modern .theme-toggle-btn:hover {
	background: rgba(0, 0, 0, 0.08) !important;
	color: #111111 !important;
	transform: translateY(-1px) !important;
}

/* Botão do Usuário (Nome / Perfil) alinhado perfeitamente com os demais botões */
.topbar-user-pill {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	height: 38px !important;
	min-height: 38px !important;
	padding: 0 12px 0 8px !important;
	background: rgba(0, 0, 0, 0.04) !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	border-radius: 9px !important;
	text-decoration: none !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
	cursor: pointer !important;
	box-sizing: border-box !important;
	line-height: 1 !important;
}

.topbar-user-pill:hover {
	background: rgba(0, 0, 0, 0.08) !important;
	border-color: rgba(0, 0, 0, 0.14) !important;
	transform: translateY(-1px) !important;
}

.topbar-user-avatar {
	width: 24px !important;
	height: 24px !important;
	border-radius: 6px !important;
	background: rgba(0, 0, 0, 0.08) !important;
	color: #111111 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	overflow: hidden !important;
	flex-shrink: 0 !important;
}

.topbar-user-avatar img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

.topbar-user-avatar svg {
	width: 14px !important;
	height: 14px !important;
	stroke: currentColor !important;
}

.topbar-user-name {
	font-family: 'Inter', -apple-system, sans-serif !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #111111 !important;
	line-height: 1 !important;
	max-width: 140px !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

.topbar-user-pill .topbar-caret {
	color: #6B7280 !important;
	transition: transform 0.2s ease !important;
	margin-left: 1px !important;
}

.user-dropdown-wrapper:hover .topbar-caret {
	transform: rotate(180deg) !important;
}

/* User Dropdown */
#header .dropdown-menu-user,
.topbar-modern .dropdown-menu-user,
.user-dropdown-wrapper .dropdown-menu-user,
.dropdown-menu-user {
	position: absolute !important;
	top: 100% !important;
	margin-top: 6px !important;
	right: 0 !important;
	left: auto !important;
	width: 230px !important;
	min-width: 230px !important;
	max-width: 260px !important;
	background: #FFFFFF !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	border-radius: 12px !important;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
	padding: 8px !important;
	margin: 0 !important;
	z-index: 1050 !important;
	opacity: 0 !important;
	visibility: hidden !important;
	transform: translateY(-4px) !important;
	transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0.08s, transform 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0.08s, visibility 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0.08s !important;
	pointer-events: none !important;
	float: none !important;
	clear: none !important;
	box-sizing: border-box !important;
}

/* Hover bridge invisível para eliminar o gap do menu do usuário */
#header .dropdown-menu-user::before,
.topbar-modern .dropdown-menu-user::before,
.user-dropdown-wrapper .dropdown-menu-user::before,
.dropdown-menu-user::before {
	content: '' !important;
	position: absolute !important;
	top: -12px !important;
	left: 0 !important;
	right: 0 !important;
	height: 12px !important;
	display: block !important;
	background: transparent !important;
	pointer-events: auto !important;
}

.user-dropdown-wrapper:hover .dropdown-menu-user,
.user-dropdown-wrapper .dropdown-menu-user.active,
#dropdown-user-menu.active {
	opacity: 1 !important;
	visibility: visible !important;
	transform: translateY(0) !important;
	pointer-events: auto !important;
	transition-delay: 0s !important;
}

.dropdown-user-header {
	padding: 10px 12px !important;
	margin-bottom: 6px !important;
	border-bottom: 1px solid #F3F4F6 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 3px !important;
	float: none !important;
	clear: both !important;
	box-sizing: border-box !important;
}

.dropdown-user-greeting {
	font-family: 'Inter', sans-serif !important;
	font-size: 10.5px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.08em !important;
	color: #9CA3AF !important;
	line-height: 1.2 !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
}

.dropdown-user-title {
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: #111111 !important;
	line-height: 1.3 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	display: block !important;
}

#header .dropdown-menu-user a,
.topbar-modern .dropdown-menu-user a,
.user-dropdown-wrapper .dropdown-menu-user a,
.dropdown-menu-user a {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	height: 38px !important;
	min-height: 38px !important;
	line-height: 1 !important;
	padding: 0 12px !important;
	margin: 2px 0 !important;
	border-radius: 8px !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	text-decoration: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	transition: all 0.15s ease !important;
	float: none !important;
	clear: none !important;
	white-space: nowrap !important;
	box-sizing: border-box !important;
}

#header .dropdown-menu-user a svg,
.topbar-modern .dropdown-menu-user a svg,
.dropdown-menu-user a svg {
	width: 16px !important;
	height: 16px !important;
	color: #6B7280 !important;
	flex-shrink: 0 !important;
	stroke-width: 2 !important;
}

#header .dropdown-menu-user a:hover,
.topbar-modern .dropdown-menu-user a:hover,
.dropdown-menu-user a:hover {
	background: #F3F4F6 !important;
	color: #111111 !important;
}

#header .dropdown-menu-user a:hover svg,
.topbar-modern .dropdown-menu-user a:hover svg,
.dropdown-menu-user a:hover svg {
	color: #FF008F !important;
}

#header .dropdown-menu-user a.logout-link,
.topbar-modern .dropdown-menu-user a.logout-link,
.dropdown-menu-user a.logout-link {
	margin-top: 6px !important;
	border-top: 1px solid #F3F4F6 !important;
	padding-top: 8px !important;
	height: 38px !important;
	color: #EF4444 !important;
	font-weight: 600 !important;
}

#header .dropdown-menu-user a.logout-link svg,
.topbar-modern .dropdown-menu-user a.logout-link svg,
.dropdown-menu-user a.logout-link svg {
	color: #EF4444 !important;
}

#header .dropdown-menu-user a.logout-link:hover,
.topbar-modern .dropdown-menu-user a.logout-link:hover,
.dropdown-menu-user a.logout-link:hover {
	background: rgba(239, 68, 68, 0.08) !important;
	color: #DC2626 !important;
}

/* Botão de Login quando visitante */
.topbar-login-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 7px !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em !important;
	color: #111111 !important;
	height: 38px !important;
	min-height: 38px !important;
	padding: 0 14px !important;
	border-radius: 9px !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	background: rgba(0, 0, 0, 0.04) !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	line-height: 1 !important;
	box-sizing: border-box !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
	cursor: pointer !important;
}

.topbar-login-btn:hover {
	background: rgba(0, 0, 0, 0.08) !important;
	border-color: rgba(0, 0, 0, 0.16) !important;
	color: #111111 !important;
	transform: translateY(-1px) !important;
}

.topbar-login-btn .login-btn-txt-full {
	display: inline !important;
}

.topbar-login-btn .login-btn-txt-mobile {
	display: none !important;
}

/* ==========================================================================
   TOPBAR DARK MODE
   ========================================================================== */

html.dark-theme .topbar-nav-link {
	color: #9CA3AF;
}

html.dark-theme .topbar-nav-icon {
	color: #9CA3AF;
}

html.dark-theme .topbar-nav-link:hover {
	background: rgba(255, 255, 255, 0.06);
	color: #FFFFFF;
}

html.dark-theme .topbar-nav-link:hover .topbar-nav-icon {
	color: #FFFFFF;
}

html.dark-theme .topbar-nav-item.active .topbar-nav-link {
	background: #1C1C20;
	color: #FFFFFF;
	border-color: rgba(255, 255, 255, 0.12);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}

html.dark-theme .topbar-nav-item.active .topbar-nav-icon {
	color: #FF008F !important;
}

html.dark-theme .topbar-user-pill {
	background: rgba(255, 255, 255, 0.06) !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
}

html.dark-theme .topbar-user-pill:hover {
	background: rgba(255, 255, 255, 0.1) !important;
	border-color: rgba(255, 255, 255, 0.18) !important;
}

html.dark-theme .topbar-user-name {
	color: #FFFFFF !important;
}

html.dark-theme .topbar-user-avatar {
	background: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html.dark-theme .topbar-user-pill .topbar-caret {
	color: #9CA3AF !important;
}

html.dark-theme #header .dropdown-menu-ajuda,
html.dark-theme #header .dropdown-menu-user,
html.dark-theme .topbar-modern .dropdown-menu-ajuda,
html.dark-theme .topbar-modern .dropdown-menu-user,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user,
html.dark-theme #dropdown-user-menu,
html.dark-theme #dropdown-ajuda-menu,
html.dark-theme .dropdown-menu-ajuda,
html.dark-theme .dropdown-menu-user {
	background: #18181B !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 20px 48px rgba(0, 0, 0, 0.7) !important;
}

html.dark-theme #header .dropdown-user-header,
html.dark-theme .dropdown-user-header {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme #header .dropdown-user-greeting,
html.dark-theme .dropdown-user-greeting {
	color: #71717A !important;
}

html.dark-theme #header .dropdown-user-title,
html.dark-theme .dropdown-user-title {
	color: #FFFFFF !important;
}

html.dark-theme #header .dropdown-menu-ajuda a,
html.dark-theme #header .dropdown-menu-user a,
html.dark-theme .topbar-modern .dropdown-menu-ajuda a,
html.dark-theme .topbar-modern .dropdown-menu-user a,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user a,
html.dark-theme #dropdown-user-menu a,
html.dark-theme #dropdown-ajuda-menu a,
html.dark-theme .dropdown-menu-ajuda a,
html.dark-theme .dropdown-menu-user a {
	color: #D4D4D8 !important;
}

html.dark-theme #header .dropdown-menu-ajuda a svg,
html.dark-theme #header .dropdown-menu-user a svg,
html.dark-theme .topbar-modern .dropdown-menu-ajuda a svg,
html.dark-theme .topbar-modern .dropdown-menu-user a svg,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user a svg,
html.dark-theme #dropdown-user-menu a svg,
html.dark-theme #dropdown-ajuda-menu a svg,
html.dark-theme .dropdown-menu-ajuda a svg,
html.dark-theme .dropdown-menu-user a svg {
	color: #A1A1AA !important;
}

html.dark-theme #header .dropdown-menu-ajuda a:hover,
html.dark-theme #header .dropdown-menu-user a:hover,
html.dark-theme .topbar-modern .dropdown-menu-ajuda a:hover,
html.dark-theme .topbar-modern .dropdown-menu-user a:hover,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user a:hover,
html.dark-theme #dropdown-user-menu a:hover,
html.dark-theme #dropdown-ajuda-menu a:hover,
html.dark-theme .dropdown-menu-ajuda a:hover,
html.dark-theme .dropdown-menu-user a:hover {
	background: #27272A !important;
	color: #FFFFFF !important;
}

html.dark-theme #header .dropdown-menu-ajuda a:hover svg,
html.dark-theme #header .dropdown-menu-user a:hover svg,
html.dark-theme .topbar-modern .dropdown-menu-ajuda a:hover svg,
html.dark-theme .topbar-modern .dropdown-menu-user a:hover svg,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user a:hover svg,
html.dark-theme #dropdown-user-menu a:hover svg,
html.dark-theme #dropdown-ajuda-menu a:hover svg,
html.dark-theme .dropdown-menu-ajuda a:hover svg,
html.dark-theme .dropdown-menu-user a:hover svg {
	color: #FF008F !important;
}

html.dark-theme .dropdown-menu-ajuda a.active {
	background: rgba(255, 0, 143, 0.15) !important;
	color: #FF008F !important;
}

html.dark-theme #header .dropdown-menu-user a.logout-link,
html.dark-theme .topbar-modern .dropdown-menu-user a.logout-link,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user a.logout-link,
html.dark-theme #dropdown-user-menu a.logout-link,
html.dark-theme .dropdown-menu-user a.logout-link {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #F87171 !important;
}

html.dark-theme #header .dropdown-menu-user a.logout-link svg,
html.dark-theme .topbar-modern .dropdown-menu-user a.logout-link svg,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user a.logout-link svg,
html.dark-theme #dropdown-user-menu a.logout-link svg,
html.dark-theme .dropdown-menu-user a.logout-link svg {
	color: #F87171 !important;
}

html.dark-theme #header .dropdown-menu-user a.logout-link:hover,
html.dark-theme .topbar-modern .dropdown-menu-user a.logout-link:hover,
html.dark-theme .user-dropdown-wrapper .dropdown-menu-user a.logout-link:hover,
html.dark-theme #dropdown-user-menu a.logout-link:hover,
html.dark-theme .dropdown-menu-user a.logout-link:hover {
	background: rgba(239, 68, 68, 0.15) !important;
	color: #FCA5A5 !important;
}

html.dark-theme .topbar-login-btn {
	color: #FFFFFF !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	background: rgba(255, 255, 255, 0.06) !important;
}

html.dark-theme .topbar-login-btn:hover {
	background: rgba(255, 255, 255, 0.12) !important;
	border-color: rgba(255, 255, 255, 0.25) !important;
	color: #FFFFFF !important;
}

/* ==========================================================================
   MOBILE RESPONSIVENESS & DRAWER TOTALMENTE ADAPTADO
   ========================================================================== */

.topbar-mobile-btn {
	display: none;
}

.topbar-mobile-btn .hamburger-icon-close {
	display: none !important;
}

.topbar-mobile-btn.active .hamburger-icon-bars {
	display: none !important;
}

.topbar-mobile-btn.active .hamburger-icon-close {
	display: block !important;
}

.topbar-mobile-drawer {
	display: none;
}

@media (max-width: 991px) {
	/* Prevenir qualquer scroll horizontal indesejado no mobile */
	html,
	body {
		overflow-x: hidden !important;
		max-width: 100vw !important;
	}

	/* Cor uniforme e moderna da Header no Mobile (sem quebras ou divisão de cores) */
	#header,
	header,
	header.artlab-header,
	#header.topbar-modern,
	body.portal-artista-page header.artlab-header,
	body.portal-artista-page #header {
		background: #FFFFFF !important;
		height: 60px !important;
		min-height: 60px !important;
		width: 100% !important;
		max-width: 100vw !important;
		border-top: none !important;
		border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
		box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
		box-sizing: border-box !important;
	}

	/* Dark Mode para Header no Mobile */
	html.dark-theme #header,
	html.dark-theme header,
	html.dark-theme header.artlab-header,
	html.dark-theme #header.topbar-modern,
	html.dark-theme body.portal-artista-page header.artlab-header,
	html.dark-theme body.portal-artista-page #header {
		background: #0E0E10 !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
		box-shadow: 0 1px 8px rgba(0, 0, 0, 0.6) !important;
	}

	.topbar-modern .header-inner.topbar,
	header .topbar,
	.header-inner {
		background: transparent !important;
		height: 60px !important;
		min-height: 60px !important;
		padding: 0 14px !important;
		max-width: 100% !important;
		width: 100% !important;
		box-sizing: border-box !important;
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 8px !important;
		overflow: hidden !important;
	}

	/* Esconder abas desktop, botão CTA desktop e dropdown de usuário no mobile */
	.topbar-nav,
	.topbar-btn-upload,
	.topbar-modern .user-dropdown-wrapper {
		display: none !important;
	}

	.topbar-modern .user-data {
		display: inline-flex !important;
		align-items: center !important;
		margin: 0 !important;
		padding: 0 !important;
		height: auto !important;
	}

	/* Brand Group compacto no Mobile */
	.header-left,
	header .topbar .logo {
		height: 100% !important;
		display: flex !important;
		align-items: center !important;
	}

	.topbar-modern .brand-group {
		gap: 8px !important;
		display: inline-flex !important;
		align-items: center !important;
	}

	.topbar-modern .brand-group .logo-ua-img,
	header .topbar .logo img {
		height: 22px !important;
		max-height: 22px !important;
		width: auto !important;
	}

	.topbar-modern .brand-group .badge-rede-artista {
		font-size: 8px !important;
		padding: 2.5px 5px !important;
		letter-spacing: 0.05em !important;
	}

	/* Ações à direita no mobile */
	.topbar-modern .header-right,
	header.topbar-modern .topbar .col-right {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: 8px !important;
		height: 100% !important;
		flex-shrink: 0 !important;
	}

	.topbar-modern .theme-toggle-btn {
		width: 36px !important;
		height: 36px !important;
		min-height: 36px !important;
		border-radius: 8px !important;
		flex-shrink: 0 !important;
	}

	/* Botão de Login quando visitante no mobile: formato e tamanho idênticos aos botões de controle (36px, raio 8px) */
	.topbar-login-btn {
		height: 36px !important;
		min-height: 36px !important;
		border-radius: 8px !important;
		padding: 0 11px !important;
		font-size: 11.5px !important;
		gap: 5px !important;
		white-space: nowrap !important;
		flex-shrink: 0 !important;
		line-height: 1 !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		box-sizing: border-box !important;
	}

	.topbar-login-btn .login-btn-txt-full {
		display: none !important;
	}

	.topbar-login-btn .login-btn-txt-mobile {
		display: inline !important;
		font-weight: 600 !important;
	}

	/* Botão Hambúrguer Mobile */
	.topbar-mobile-btn {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 36px !important;
		height: 36px !important;
		border-radius: 8px !important;
		border: 1px solid rgba(0, 0, 0, 0.1) !important;
		background: rgba(0, 0, 0, 0.03) !important;
		color: #111111 !important;
		cursor: pointer !important;
		padding: 0 !important;
		margin: 0 !important;
		transition: all 0.2s ease !important;
		outline: none !important;
		box-sizing: border-box !important;
	}

	.topbar-mobile-btn:hover,
	.topbar-mobile-btn.active {
		background: rgba(0, 0, 0, 0.08) !important;
		color: #FF008F !important;
	}

	html.dark-theme .topbar-mobile-btn {
		border-color: rgba(255, 255, 255, 0.15) !important;
		background: rgba(255, 255, 255, 0.05) !important;
		color: #FFFFFF !important;
	}

	html.dark-theme .topbar-mobile-btn:hover,
	html.dark-theme .topbar-mobile-btn.active {
		background: rgba(255, 255, 255, 0.1) !important;
		color: #FF008F !important;
	}

	/* PAINEL MOBILE DRAWER COMPLETO E FLUIDO */
	.topbar-mobile-drawer {
		display: none;
		position: absolute !important;
		top: 60px !important;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		max-height: calc(100vh - 60px) !important;
		overflow-y: auto !important;
		-webkit-overflow-scrolling: touch !important;
		background: #FFFFFF !important;
		border-bottom: 2px solid rgba(0, 0, 0, 0.08) !important;
		box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
		padding: 16px 16px 24px !important;
		z-index: 1040 !important;
		flex-direction: column !important;
		gap: 12px !important;
		box-sizing: border-box !important;
		opacity: 0;
		transform: translateY(-8px);
		transition: opacity 0.22s ease, transform 0.22s ease !important;
	}

	.topbar-mobile-drawer.active {
		display: flex !important;
		opacity: 1 !important;
		transform: translateY(0) !important;
	}

	html.dark-theme .topbar-mobile-drawer {
		background: #141417 !important;
		border-bottom-color: rgba(255, 255, 255, 0.1) !important;
		box-shadow: 0 20px 50px rgba(0, 0, 0, 0.7) !important;
	}

	/* Header do Usuário no Drawer */
	.mobile-drawer-profile {
		display: flex !important;
		align-items: center !important;
		gap: 12px !important;
		padding: 12px 14px !important;
		background: rgba(0, 0, 0, 0.03) !important;
		border: 1px solid rgba(0, 0, 0, 0.06) !important;
		border-radius: 12px !important;
		box-sizing: border-box !important;
	}

	html.dark-theme .mobile-drawer-profile {
		background: rgba(255, 255, 255, 0.04) !important;
		border-color: rgba(255, 255, 255, 0.08) !important;
	}

	.mobile-drawer-avatar {
		width: 38px !important;
		height: 38px !important;
		border-radius: 10px !important;
		background: #111111 !important;
		color: #FFFFFF !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		overflow: hidden !important;
		flex-shrink: 0 !important;
	}

	html.dark-theme .mobile-drawer-avatar {
		background: #27272A !important;
	}

	.mobile-drawer-avatar img {
		width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
	}

	.mobile-drawer-user-info {
		display: flex !important;
		flex-direction: column !important;
		gap: 2px !important;
		overflow: hidden !important;
	}

	.mobile-drawer-kicker {
		font-family: 'Inter', sans-serif !important;
		font-size: 10px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.08em !important;
		color: #9CA3AF !important;
		line-height: 1.2 !important;
	}

	.mobile-drawer-username {
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		color: #111111 !important;
		line-height: 1.3 !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		white-space: nowrap !important;
	}

	html.dark-theme .mobile-drawer-username {
		color: #FFFFFF !important;
	}

	/* Botão CTA Enviar Artes no Drawer */
	.mobile-drawer-btn-upload {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		height: 44px !important;
		min-height: 44px !important;
		background: linear-gradient(135deg, #FF008F 0%, #E60081 100%) !important;
		color: #FFFFFF !important;
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		padding: 0 16px !important;
		border-radius: 10px !important;
		text-decoration: none !important;
		box-shadow: 0 4px 14px rgba(255, 0, 143, 0.35) !important;
		box-sizing: border-box !important;
		transition: all 0.2s ease !important;
	}

	.mobile-drawer-btn-upload:hover {
		transform: translateY(-1px) !important;
		box-shadow: 0 6px 18px rgba(255, 0, 143, 0.45) !important;
		color: #FFFFFF !important;
	}

	/* Lista de Navegação no Drawer */
	.mobile-drawer-nav {
		display: flex !important;
		flex-direction: column !important;
		gap: 3px !important;
	}

	.mobile-nav-group-label {
		font-family: 'Inter', sans-serif !important;
		font-size: 10.5px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.08em !important;
		color: #9CA3AF !important;
		padding: 8px 12px 4px !important;
		line-height: 1 !important;
	}

	.mobile-nav-link {
		display: flex !important;
		align-items: center !important;
		gap: 12px !important;
		height: 42px !important;
		min-height: 42px !important;
		padding: 0 14px !important;
		border-radius: 9px !important;
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 500 !important;
		color: #374151 !important;
		text-decoration: none !important;
		transition: all 0.15s ease !important;
		box-sizing: border-box !important;
	}

	.mobile-nav-link svg {
		color: #6B7280 !important;
		flex-shrink: 0 !important;
	}

	.mobile-nav-link:hover {
		background: #F3F4F6 !important;
		color: #111111 !important;
	}

	.mobile-nav-link:hover svg {
		color: #FF008F !important;
	}

	.mobile-nav-link.active {
		background: rgba(255, 0, 143, 0.08) !important;
		color: #FF008F !important;
		font-weight: 600 !important;
	}

	.mobile-nav-link.active svg {
		color: #FF008F !important;
	}

	html.dark-theme .mobile-nav-link {
		color: #D4D4D8 !important;
	}

	html.dark-theme .mobile-nav-link svg {
		color: #9CA3AF !important;
	}

	html.dark-theme .mobile-nav-link:hover {
		background: #27272A !important;
		color: #FFFFFF !important;
	}

	html.dark-theme .mobile-nav-link:hover svg {
		color: #FF008F !important;
	}

	html.dark-theme .mobile-nav-link.active {
		background: rgba(255, 0, 143, 0.15) !important;
		color: #FF008F !important;
	}

	.mobile-nav-divider {
		height: 1px !important;
		background: #E5E7EB !important;
		margin: 6px 4px !important;
		box-sizing: border-box !important;
	}

	html.dark-theme .mobile-nav-divider {
		background: rgba(255, 255, 255, 0.08) !important;
	}

	/* Link de Logout no Mobile */
	.mobile-nav-logout {
		color: #EF4444 !important;
		font-weight: 600 !important;
	}

	.mobile-nav-logout svg {
		color: #EF4444 !important;
	}

	.mobile-nav-logout:hover {
		background: rgba(239, 68, 68, 0.08) !important;
		color: #DC2626 !important;
	}

	html.dark-theme .mobile-nav-logout {
		color: #F87171 !important;
	}

	html.dark-theme .mobile-nav-logout svg {
		color: #F87171 !important;
	}

	html.dark-theme .mobile-nav-logout:hover {
		background: rgba(239, 68, 68, 0.15) !important;
		color: #FCA5A5 !important;
	}
}

@media (max-width: 480px) {
	.topbar-modern .header-inner.topbar {
		padding: 0 10px !important;
		gap: 6px !important;
	}

	.topbar-modern .brand-group {
		gap: 5px !important;
	}

	.topbar-modern .brand-group .logo-ua-img,
	header .topbar .logo img {
		height: 19px !important;
		max-height: 19px !important;
	}

	.topbar-modern .brand-group .badge-rede-artista {
		font-size: 7.5px !important;
		padding: 2px 4px !important;
	}

	.topbar-modern .theme-toggle-btn {
		width: 34px !important;
		height: 34px !important;
		min-height: 34px !important;
		border-radius: 7px !important;
	}

	.topbar-login-btn {
		height: 34px !important;
		min-height: 34px !important;
		border-radius: 7px !important;
		padding: 0 9px !important;
		font-size: 11px !important;
		gap: 4px !important;
	}

	.topbar-mobile-btn {
		width: 34px !important;
		height: 34px !important;
		min-height: 34px !important;
		border-radius: 7px !important;
	}
}


/* Stepper Progress bar dynamic states */
.portal-stepper-progress {
	height: 100%;
	background: linear-gradient(90deg, #FF008F 0%, #FF4D6D 100%);
	border-radius: 4px;
	transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1), background 0.35s ease;
	width: 15%;
}
.main.passo1 .portal-stepper-progress {
	width: 15%;
	background: linear-gradient(90deg, #FF008F 0%, #FF4D6D 100%) !important;
}
.main.passo2 .portal-stepper-progress {
	width: 50% !important;
	background: #10B981 !important;
}
.main.passo3 .portal-stepper-progress {
	width: 100% !important;
	background: #10B981 !important;
}


@media (max-width: 768px) {
	.portal-payment-grid {
		grid-template-columns: 1fr !important;
		gap: 12px !important;
	}
	.portal-pay-card-label {
		flex-direction: row !important;
		align-items: center !important;
		justify-content: flex-start !important;
		padding: 16px 20px !important;
		min-height: auto !important;
		gap: 16px !important;
		text-align: left !important;
	}
	.portal-pay-logo-wrap {
		margin-bottom: 0 !important;
		width: 48px !important;
		height: 48px !important;
		flex-shrink: 0 !important;
	}
	.portal-pay-name {
		font-size: 15px !important;
		text-align: left !important;
	}
}

/* Enhancements for portal wizard elements */
.portal-badge-locked {
	display: inline-flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 5px !important;
	white-space: nowrap !important;
}

html.dark-theme .portal-selected-logo,
html.dark-theme .box-recebimento .item .logo,
html.dark-theme .portal-wizard-card .box-recebimento .item .logo {
	background: #18181B !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

@media (max-width: 768px) {
	.portal-wizard-actions,
	.main.cadastro .portal-wizard-actions,
	.portal-wizard-card .portal-wizard-actions {
		display: flex !important;
		flex-direction: column-reverse !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
		gap: 12px !important;
		width: 100% !important;
		float: none !important;
		clear: both !important;
	}

	.portal-wizard-actions .portal-btn,
	.portal-wizard-actions button,
	.portal-wizard-actions a,
	.portal-wizard-actions .bt1,
	.portal-wizard-actions .bt2,
	.portal-wizard-actions .prev,
	.portal-wizard-actions .next,
	.portal-wizard-actions .fl,
	.portal-wizard-actions .fr,
	.main.cadastro .portal-wizard-actions .bt1,
	.main.cadastro .portal-wizard-actions .bt2,
	.main.cadastro .portal-wizard-actions a,
	.main.cadastro .portal-wizard-actions button {
		width: 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		height: 48px !important;
		min-height: 48px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		text-align: center !important;
		box-sizing: border-box !important;
		float: none !important;
		margin: 0 !important;
		border-radius: 10px !important;
	}
}
