/* =====================================================================
   ESTILOS PARA O MENU SANFONA (DETAILS/SUMMARY)
   ===================================================================== */
/* Estilo base do container do menu */
.menu-sanfona-details {
	border: 2px solid #FFF;
	margin-bottom: 8px;
	border-radius: 16px; /* AS BORDAS ARREDONDADAS ESTÃO AQUI */
	overflow: hidden;
	transition: border-color .8s ease-in-out;
}

/* Estilo do título do menu (a parte clicável) */
.menu-sanfona-details summary {
	font-weight: bold;
	font-size: 16px;
	padding: 15px;
	background-color: #E8D8F2;
	cursor: pointer;
	outline: none;
	color: #000;
}

/* Estilo do menu QUANDO ABERTO */
.menu-sanfona-details[open] {
	border-color: #000;
}

/* Estilo do container do conteúdo interno do menu */
.menu-sanfona-details .conteudo-interno {
	padding: 15px;
	border-top: 1px solid #000;
}

/* =====================================================================
   ESTILOS PARA A TABELA (JÁ COM SUAS PERSONALIZAÇÕES)
   ===================================================================== */
.tablepress {
	border: none !important;
	background: none !important;
}

.tablepress.tabela-acolhimento {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #ccc;
	font-size: 12px;
}

.tablepress.tabela-acolhimento td {
	border: 1px solid #ccc;
	padding: 12px;
	background-color: #ffffff;
	vertical-align: top;
	color: #333333;
}

.tablepress.tabela-acolhimento .column-1 {
	width: 35%;
	font-weight: bold;
}

.tablepress.tabela-acolhimento .column-2 {
	width: 65%;
}

/* =====================================================================
   ESTILO PARA O BOTÃO DOS CAMPUS (BASEADO NO MENU SANFONA)
   ===================================================================== */
.botao-campus {
/* Cores e texto do menu sanfona */
	background-color: #E8D8F2; /* Cor de fundo lilás */
	color: #000; /* Cor do texto (preto) */
	font-weight: bold;
	font-size: 16px; /* Espaçamento e layout do menu sanfona */
	padding: 15px; /* Espaçamento interno */
	border-radius: 16px; /* Borda arredondada */
	margin-bottom: 8px !important; /* A MÁGICA ACONTECE AQUI */
/* Faz o botão ocupar a largura total, como o menu sanfona */
	display: block;
	text-decoration: none; /* Remove o sublinhado */
/* Adiciona uma transição suave para o hover */
	transition: background-color .3s ease-in-out;
}

.botao-campus:hover {
/* Cor de fundo quando o mouse está em cima, com um "fade" */
	background-color: #d1c1dc; /* Lilás um pouco mais escuro */
}

/* =====================================================================
   ESTILO PARA O BOTÃO DO GUIA (BASEADO NO MENU SANFONA)
   ===================================================================== */
.dropdown-container {
	max-width: 600px;
	margin: 20px auto;
	border: 1px solid #ccc;
	border-radius: 8px;
	font-family: Arial, sans-serif;
}

.dropdown-button {
	background-color: #f0f0f0;
	color: #333;
	padding: 15px 20px;
	width: 100%;
	text-align: left;
	border: none;
	cursor: pointer;
	font-size: 18px;
	font-weight: bold;
	border-radius: 8px 8px 0 0;
}

.dropdown-content {
	padding: 15px 20px;
	display: none; /* Esconde o conteúdo por padrão */
	background-color: #fff;
	border-top: 1px solid #ccc;
	border-radius: 0 0 8px 8px;
}

.dropdown-container:hover .dropdown-content {
	display: block; /* Mostra o conteúdo ao passar o mouse sobre o container */
}

/* Estilos para o conteúdo interno */
.dropdown-content ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.dropdown-content ul ul {
	list-style-type: disc;
	padding-left: 20px;
	margin-top: 5px;
}

.dropdown-content li {
	margin-bottom: 15px;
	line-height: 1.5;
}

.dropdown-content p {
	margin: 0;
}

/* =====================================================================
   Estilos para a Página "Quem Somos" - Acolhe UFSC
   ===================================================================== */
/* Container principal que agrupa todos os cartões (COM ESPAÇAMENTO MAIOR) */
.equipe-acolhe-ufsc {
	display: flex;
	flex-wrap: wrap;
	justify-content: center; /* <-- ADICIONE ESTA LINHA PARA O ESPAÇAMENTO */
	padding: 20px 0;
	font-family: Arial, sans-serif;
}

/* Estilo individual de cada cartão de membro */
.cartao-membro {
	background-color: #f9f9f9;
	border: 1px solid #ddd;
	border-radius: 10px;
	box-shadow: 0 4px 8px rgba(0,0,0,0.05);
	width: 320px;
	padding: 20px;
	text-align: center;
	transition: transform 0.3s, box-shadow .3s;
	margin: 15px; /* <-- ADICIONE ESTA LINHA PARA O ESPAÇAMENTO */
}

/* Efeito ao passar o mouse sobre o cartão */
.cartao-membro:hover {
	transform: translateY(-5px); /* Levanta o cartão levemente */
	box-shadow: 0 8px 16px rgba(0,0,0,0.1); /* Aumenta a sombra */
}

/* Estilo da foto da pessoa */
.foto-membro {
	width: 130px; /* Largura da foto */
	height: 130px; /* Altura da foto */
	border-radius: 50%; /* Deixa a foto redonda */
	object-fit: cover; /* Garante que a foto não fique distorcida */
	border: 4px solid #ffffff; /* Borda branca em volta da foto */
	box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Pequena sombra na foto */
	margin-bottom: 15px; /* Espaço abaixo da foto */
}

/* Container das informações de texto */
.info-membro {
	text-align: left; /* Alinha o texto das informações à esquerda para melhor leitura */
}

/* Estilo para o nome da pessoa */
.nome-membro {
	font-size: 1.4em; /* Tamanho da fonte do nome */
	color: #005A9C; /* Cor azul inspirada na identidade visual da UFSC (ajuste se necessário) */
	margin-top: 0;
	margin-bottom: 5px;
	text-align: center; /* Centraliza apenas o nome */
}

/* Estilo para os pronomes */
.pronomes-membro {
	font-size: .9em;
	font-style: italic;
	color: #777;
	margin-top: 0;
	margin-bottom: 20px; /* Espaço maior abaixo dos pronomes */
	text-align: center; /* Centraliza os pronomes */
}

/* Estilo para os parágrafos com os dados */
.dados-membro {
	font-size: .95em;
	color: #333; /* Cor do texto principal */
	margin: 8px 0; /* Espaçamento entre as linhas de informação */
	line-height: 1.5; /* Altura da linha para melhor legibilidade */
}

/* Deixa o texto da "etiqueta" (Cargo:, E-mail:) em negrito */
.dados-membro strong {
	color: #111; /* Cor um pouco mais escura para o label */
}

/* Estilo específico para o link do e-mail */
.email-membro a {
	color: #0073e6; /* Cor padrão de link, azul */
	text-decoration: none; /* Remove o sublinhado padrão */
}

.email-membro a:hover {
	text-decoration: underline; /* Adiciona sublinhado ao passar o mouse */
}

/* --- Ajustes para Telas Pequenas (Celulares) --- */
@media (max-width: 768px) {

	.cartao-membro {
		width: 90%; /* Ocupa quase toda a largura da tela */
		max-width: 400px; /* Limita a largura máxima em telas um pouco maiores */
	}

}