.fancybox {
	cursor: pointer
}

.fancybox-content:has(> .fix > .boxAbas, > .boxAbas) {
	padding: 0px;
	background-color: var(--color-tintegra-azul);
	background: rgb(102, 51, 153);
	background: linear-gradient(45deg, var(--color-empresa-azul-escuro) 0%, var(--color-empresa-azul) 50%, var(--color-empresa-azul-claro) 100%);
}



.boxFancy {
	display: none;
	padding: 10px;

	&.total {
		width: 95%;
		height: 80vh;
	}
	
	&.carregando, 
	&.info, 
	&.sucesso, 
	&.erro {
		border-radius: 4px;
		transform: translateY(-80px);
		transition: all .5s;
		padding: 30px;
		background: #FFF;
		color: #333;
		text-align: center;

		> i {
			font-size: 3rem;
			text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
		}

		> h2 {
			text-align: center;
			margin-top: 0;
			margin-bottom: 10px;
			text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
		}

		> .botoes {
			margin-top: 20px;
		}

		&.carregando,
		&.info {
			background: linear-gradient(45deg, #b6dbe4 0%, #FFF 50%, #FFF 100%);
			> i,h2 {
				color: #3babc7;
			}
		}

		&.sucesso, 
		&.erro {
			color: #FFF;
			> i, 
			> h2 {
				text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
			}
		}

		&.sucesso {
			background: linear-gradient(45deg, #008f56 32%, #0D9 100%);
		}

		&.erro {
			background: linear-gradient(45deg, #c30000 0%, #ff0000 100%);
		}
	}
	
	> .fix {
		display: grid;
		grid-template-rows: auto 1fr;
		height: 100%;
	}

	&:has(> .fix > .boxAbas, > .boxAbas) .titulopagina {
		padding: 20px 30px 10px 30px;
		
		* {
			color: #FFF;
		}

		> .titulo:after {
			background-color: #9645e7;
		}
	}
}



.fancybox-slide--current .carregando, 
.fancybox-slide--current .info, 
.fancybox-slide--current .sucesso, 
.fancybox-slide--current .erro {
	transform: translateY(0);
	opacity: 1;
	transition-duration: .3s
}

.boxFancy-titulo {
	margin: 0 0 20px 0;
}

.boxFancy-titulo .titulo {
	margin: 0;
}

.boxFancy-titulo:has(>.icone) {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 10px;
	align-items: end;
}

.boxFancy-titulo .icone > i {
	font-size: 3rem; 
	color: var(--botao-background-color);
}








.boxAbas {
    display: grid;
    grid-template-rows: auto 1fr;
	max-height: 100%;
	min-height: 0;
    padding-bottom: 0px;
	position: relative;

	> .menu {
		position: relative;
		display: flex;
		flex-wrap: wrap;
		padding: 0 20px;
		margin: 0;
		gap: 2px;

		> span {
			padding: 3px 7px 3px 7px;
			background-color: var(--color-tintegra-azul);
			color: #FFF;
			border-radius: 8px 8px 0 0;
			border: 1px solid var(--color-tintegra-azul);
			cursor: pointer;
			font-size: .8rem;

			&.ativo {
				background-color: #FFF;
				color: var(--color-tintegra-azul);
				border-bottom-color: #FFF;
				z-index: 2;
				box-shadow: none;
			}

			&.bloqueado {
				color: #BBB;
				cursor: not-allowed;
				background-color: #DDD;
				opacity: .5;
			}

			&.oculto {
				display: none;
			}

			&.alerta::before,
            &.sucesso::before {
                font-family: Icofont !important;
                margin-right: 5px;
            }

			&.alerta::before {
				content: "\ef1b";
				color: #FF0;
			}

			&.alerta.ativo::before {
				color: #FA0;
			}

			&.sucesso::before {
				content: "\eed7";
				color: #0D9;
			}

			&.sucesso.ativo::before {
				color: #18c034;
			}

			&.bloqueado.alerta::before,
			&.bloqueado.sucesso::before {
				color: #BBB;
			}
		}
	}

	> .aba {
		display: none;
		width: 100%;
		height: 100%;
		background-color: #FFF;
		min-height: 0;

		&::has(>.boxinfo) {
			grid-template-rows: 1fr auto auto;
		}

		&.ativo {
			display: block;
		}

		.boxform {
			display: grid;
			grid-template-rows: 1fr auto;
			height: 100%;

			> div {
				padding: 0px 30px 0px 30px;
			}

			> .boxinfo {
				padding: 10px 30px;
				border: 0;
			}

			> .botoes {
				padding: 15px 30px 30px 30px;
			}

			> .conteudo {
				padding: 15px 30px 10px 30px;
				height: 100%;
				max-height: 100%;
				min-height: 0;
				overflow-y: auto;

				&.overflow {
					height: 500px;
					max-height: 500px;
					padding: 5px 5px 100px 5px;
					overflow: auto;
				}

				&:has(>.Editor-container) {
					padding: 0;
					overflow-y: inherit;
				}

				> .Editor-container {
					margin-top: 0;
					height: 100%;
					min-height: 0;
					display: grid;
					grid-template-rows: auto 1fr auto;
				}

				> .Editor-container > .Editor-editor {
					height: 100%;
				}
			}
		}

		form {
			height: 100%;
			min-height: 0;
		}
	}
}


















