/* CSS dos painéis delizantes */

	/* === Gráfico dentro do painel deslizante  === */

	/* Estilo para gráficos dentro do painel deslizante */
	.grafico_expandido{
		height: 200px!important; 
		margin-top: 16px;
		background:#fafafa;
		border: 1px solid #ddd;
		border-radius: 6px;
		box-shadow: 0 2px 6px rgba(0,0,0,0.05);  
		overflow: hidden; /* evita vazamento de estilos do Qlik */  
	}


	/* Estilo geral para conteúdo do painel */
	.slide-panel .panel-content {
		font-family: "Open Sans", sans-serif;
		font-size: 15px;
		line-height: 1.6;
		color: #333;
	}

	.slide-panel .panel-content p {
		margin: 12px 0;
	}

	.slide-panel .panel-content img {
		max-width: 100%;
		height: auto;
		border-radius: 4px;
		margin: 10px 0;
	}

	.slide-panel .panel-content a {
		color: #007bff;
		text-decoration: none;
	}

	.slide-panel .panel-content a:hover {
		text-decoration: underline;
	}

	/* === Fim do Gráfico dentro do painel deslizante  === */


	/* === Painel deslizante geral (da direita para a esquerda) === */
	.slide-panel {
		position: fixed;
		top: 0;
		right: -100%; /* começa fora da tela, à direita */
		width: 60%;
		max-width: 800px;
		height: 100vh;
		background: white;
		/* Sombra que cria a impressão de borda elevada */
		box-shadow: -8px 0 25px rgba(0,0,0,0.25);
		z-index: 3000;
		padding: 24px;
		overflow-y: auto;
		/* Velocidade média: 0.6s com easing suave */
		transition: right 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);*/
		outline: none;
		border-top-left-radius: 16px;
		border-bottom-left-radius: 16px;  
	}


	@media (max-width: 768px) {
		.slide-panel {
			width: 100%;
			max-width: none;
		}
	}

	.slide-panel.active {
		right: 0; /* desliza para dentro */
	}

	/* Botão de fechar (agora posicionado à esquerda do painel) */
	.close-btn {
		position: absolute;
		top: 20px;
		left: -44px; /* aparece fora do painel, à esquerda */
		width: 38px;
		height: 38px;
		background: white;
		border: 1px solid #ccc;
		border-radius: 6px;
		color: black;
		font-size: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		box-shadow: 0 2px 6px rgba(0,0,0,0.1);
		transition: background 0.2s;
		z-index: 3001;
	}

	.close-btn:hover {
		background: #f5f5f5;
	}

	/* Impede rolagem de fundo quando o painel está aberto */
	body.slide-panel-open {
		overflow: hidden;
	}

	.btn_deslizante{
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  width: 400px;
	  height: 48px; /* ajuste conforme necessário */
	  background-color: #28a745!important;
	  color: white!important;
	  text-decoration: none;
	  border-radius: 4px;
	  margin-top: 8px;
	}



	/* === Fim do Painel deslizante geral (da direita para a esquerda) === */