* {
	margin:0px;
	padding:0px;
	box-sizing:border-box;
	cursor:default;
	font-family:"Helvetica";
	text-decoration:none;
	letter-spacing:1px;
	/* outline: 1px solid red; */
}
*:focus {
    outline:none;
}
body {
	padding:0px;
	width:100%;
	height:auto;
	position:relative;
	display:flex;
	flex-direction:column;
	touch-action: pan-x pan-y;
	background:#091527;
	overflow-x: hidden;
	
}

	/* #################### */
	/*   STYLE LOGIN.PHP    */
	/* #################### */
	#loginMain {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 90vh;
		width: 100%;
		padding: 0 20px;
	}

		#loginLogo img {
			width: 250px;
			margin-bottom: 50px;
		}

		#loginForm {
			background-color: #071b33;
			padding: 30px;
			border-radius: 10px;
			box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 100%;
			max-width: 360px;
			
			animation: loginFadeIn 0.6s ease-out;
			transition: transform 0.3s ease, box-shadow 0.3s ease;
		}
			#loginForm:hover {
				transform: translateY(-4px) scale(1.01);
				box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
			}
			@keyframes loginFadeIn {
				from {
					opacity: 0;
					transform: translateY(20px);
				}
				to {
					opacity: 1;
					transform: translateY(0);
				}
			}

			#loginLabelEmail {
				color: #e3e4ec;
				font-size: 15px;
				margin-bottom: 8px;
				width: 100%;
				text-align: left;
			}

				.loginInputWrapper input {
					width: 100%;
					padding: 12px;
					border: none;
					border-radius: 6px;
					background-color: #e3e4ec;
					color: #071b33;
					font-size: 14px;
				}

			.loginInputWrapper {
				width: 100%;
				margin-bottom: 20px;
			}

			.loginButton {
				background-color: #ccb178;
				color: #071b33;
				font-weight: bold;
				border-radius: 6px;
				padding: 12px 0;
				width: 100%;
				text-align: center;
				cursor: pointer;
				transition: background-color 0.2s ease-in-out;
			}

			.loginButton:hover {
				background-color: #e3e4ec;
				color: #071b33;
			}
	
	
	/* #################### */
	/*   STYLE INDEX.PHP    */
	/* #################### */
	#menuToggleButton {
		display: none;
	}
	#mainLayout {
		display: flex;
		flex-direction: row;
		height: 100vh;
		width: 100vw;
	}

		#mainMenu {
			width: 260px;
			min-width: 260px;
			max-width: 260px;
			background-color: #071B33;
			height: 100vh;
			display: flex;
			flex-direction: column;
			color: white;
			flex-shrink: 0;
		}

			#mainMenuTopo {
				padding: 30px 5px;
				text-align: center;
				border-bottom: 1px solid #2C3E50;
				flex-shrink: 0; /* fixa o topo do menu */
			}

				#mainMenuFoto {
					width: 80px;
					height: 80px;
					border-radius: 50%;
					object-fit: cover;
					margin-bottom: 15px;
				}

				#mainMenuNome {
					font-size: 16px;
					font-weight: bold;
					color: #ffffff;
				}

				#mainMenuCargo {
					font-size: 13px;
					color: #CCB178;
					margin-bottom: 0px;
				}

			#mainMenuItens {
				display: flex;
				flex-direction: column;
				margin-top: 30px;
				flex: 1 1 auto;              /* ocupa o restante do height */
				overflow-y: auto;             /* rolagem quando exceder 100vh */
				overflow-x: hidden;
				scrollbar-gutter: stable;      /* evita salto de layout ao mostrar barra */
				-webkit-overflow-scrolling: touch; /* rolagem suave em iOS */
			}
				
				.mainMenuItem {
					display: flex;
					align-items: center;
					padding: 15px 20px;
					cursor: pointer;
					transition: background 0.3s;
					border-left: 4px solid transparent;
				}
				.mainMenuItem * {
					cursor: pointer;
				}
					.mainMenuItem:hover {
						background-color: #091527;
					}

					.mainMenuItemAtivo {
						background-color: #091527;
						border-left: 4px solid #CCB178;
					}
					.mainMenuIcon {
						width: 20px;
						margin-right: 15px;
					}

					.mainMenuTexto {
						color: white;
						font-size: 14px;
					}

		#mainContainer {
			flex: 1;
			display: flex;
			flex-direction: column;
			background-color: #091527;
			min-width: 0;
			overflow-x: hidden;
		}

		#mainTopo {
			height: 60px;
			background-color: #0d2744;
			color: white;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 20px;
			flex-shrink: 0;
			width: 100%;
			box-sizing: border-box;
			overflow: hidden;
		}

			#mainTopoLogo {
				flex-shrink: 0;
			}
			
			#mainTopoLogo img {
				height: 25px;
				cursor: pointer;
			}

			#mainTopoAcoes {
				display: flex;
				align-items: center;
				gap: 20px;
				flex-shrink: 0;
				min-width: 0;
			}

				.mainTopoIcon {
					cursor: pointer;
					display: flex;
					align-items: center;
					position: relative;
				}

				.mainTopoIcon img {
					width: 22px;
					height: 22px;
					filter: brightness(100);
					transition: transform 0.2s ease-in-out;
					cursor:pointer;
				}

				.mainTopoIcon:hover img {
					transform: scale(1.1);
				}
				.mainNotificacaoBadge {
					position: absolute;
					top: -6px;
					right: -8px;
					background-color: #CCB178;
					color: #071B33;
					font-size: 11px;
					font-weight: bold;
					width: 18px;
					height: 18px;
					border-radius: 50%;
					line-height: 18px; /* alinhamento vertical perfeito */
					text-align: center;
					display: block;
					cursor:pointer;
				}


			#mainMiddle {
				flex: 1;
				overflow-y: auto;
				background-color: #FFF;
				overflow-x: hidden;
				position: relative;
				min-width: 0;
			}

	/* #################### */
	/*   STYLE REPORT.PHP   */
	/* #################### */

	#reportContentWrapper {
		overflow: visible !important;
		position: relative;
		margin: 0;
		padding: 40px;
	}
		#reportBlueContainer {
			background-color: #071b33;
			color: white;
			display: flex;
			max-width: 1200px;
			margin: 0 auto;
			box-sizing: border-box;
			position: relative;
			overflow: visible;
		}

			#reportBlueLeft {
				width: 50%;
				padding: 60px 50px;
				display: flex;
				flex-direction: column;
				gap: 20px;
			}

				.reportBlueTitle {
					font-size: 1.5em;
					font-weight: 600;
				}

				.reportBlueText {
					font-size: 0.8em;
					line-height: 1.6;
					text-align:justify;
				}

			#reportBlueRight {
				width: 50%;
				padding: 0;
				box-sizing: border-box;
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
				position: relative;
				overflow: visible;
			}

				#reportFormBox {
					background-color: #FFF;
					padding: 30px;
					box-sizing: border-box;
					width: 100%;
					max-width: 420px;
					display: flex;
					flex-direction: column;
					gap: 16px;
					position: absolute;
					top: -80px;
					left: 50%;
					transform: translateX(-50%);
					z-index: 10;
					box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);
				}

					.reportFormGroup {
						display: flex;
						flex-direction: column;
						gap: 6px;
					}

						.reportFormLabel {
							font-size: 0.85em;
							font-weight: 600;
							color: #000;
						}

						.reportFormInputWrapper,
						.reportFormButtonWrapper {
							display: flex;
						}

							.reportFormInput,
							.reportFormTextarea {
								width: 100%;
								padding: 10px;
								border: 1px solid #ccc;
								border-radius: 4px;
								font-size: 0.85em;
								resize: none;
							}

							.reportFormTextarea {
								height: 100px;
							}

							.reportFormButton {
								background-color: #ccb178;
								color: #000;
								border: none;
								padding: 10px;
								width: 100%;
								cursor: pointer;
								font-weight: 600;
								transition: background-color 0.3s ease;
							}

							.reportFormButton:hover {
								background-color: #bda067;
							}

						.reportFormDisclaimer {
							font-size: 0.7em;
							color: #333;
							margin-top: 10px;
							line-height: 1.4;
							text-align:center;
						}
						#reportFormSuccess {
							display: flex;
							flex-direction: column;
							align-items: center;
							justify-content: center;
							text-align: center;
							width: 100%;
							height: 100%;
						}

						#reportFormSuccess h3 {
							font-size: 1.1em;
							font-weight: 700;
							color: #071b33;
							margin-bottom: 10px;
						}

						#reportFormSuccess p {
							font-size: 0.85em;
							color: #333;
							margin: 2px 0;
						}
						#reportSubmitButton:disabled {
							background-color: #ccc;
							color: #555;
						}

	/* #################### */
	/*   STYLE TEAM.PHP   */
	/* #################### */

	#teamWrapper {
		overflow: visible !important;
		position: relative;
		width: 100%;
	}

	#teamBackgroundBar {
		height: 150px;
		background-color: #345B87;
		width: 100%;
	}

	#teamContentContainer {
		background-color: #ffffff;
		margin-top: 40px;
		padding: 40px 20px 60px;
		max-width: 1200px;
		margin-left: auto;
		margin-right: auto;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
	}

	#teamTitle {
		font-size: 2em;
		font-weight: bold;
		margin-bottom: 30px;
		color: #000000;
	}

	#teamGrid {
		display: flex;
		flex-wrap: wrap;
		gap: 30px;
		justify-content: center;
	}

	.teamCard {
		width: 280px;
		text-align: center;
	}
	
	.teamPhotoContainer {
		width: 100%;
		height: 340px;
		position: relative;
		overflow: hidden;
		background: transparent;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		padding: 0;
	}

	.teamPhoto {
		max-height: 90%;
		max-width: 90%;
		object-fit: contain;
		display: block;
		margin: 0 auto;
		transition: transform 0.3s ease;
	}

	.teamPhotoContainer:hover .teamPhoto {
		transform: scale(1.05);
	}


	/* Nome */
	.teamName {
		font-weight: 700;
		font-size: 1.2em;
		margin-top: 10px;
		color: #000000;
		text-align:left;
	}

	/* Cargo */
	.teamRole {
		color: #ccb178;
		font-weight: bold;
		margin: 5px 0;
		text-align:left;
	}

	/* Descrição */
	.teamDescription {
		font-size: 0.95em;
		color: #333333;
		text-align:left;
	}

	/* Social */
	.teamSocial {
		margin-top: 10px;
		display: flex;
		justify-content: center;
		gap: 10px;
	}

	/* Ícones (customizáveis por imagem ou com Font Awesome via background-image) */
	.teamIcon {
		width: 20px;
		height: 20px;
		background-size: contain;
		background-repeat: no-repeat;
		cursor: pointer;
	}

	/* Exemplo com Font Awesome (ou substitua por SVG/PNG no background-image) */
	.teamIconFacebook {
		background-image: url('assets/icons/facebook.svg');
	}

	.teamIconTwitter {
		background-image: url('assets/icons/twitter.svg');
	}

	.teamIconInstagram {
		background-image: url('assets/icons/instagram.svg');
	}


	/* #################### */
	/*   STYLE HOME.PHP   */
	/* #################### */
	#homeWrapper {
	padding: 0;
	font-family: 'Segoe UI', sans-serif;
}

#homeBanner {
	width: 100%;
	height: 300px;
	background-image: url('/img/home/banner.jpg');
	background-size: cover;
	background-position: center;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

/* #################### */
/*   STYLE JURIDICO.PHP */
/* #################### */
#juridicoWrapper {
    padding: 0;
    font-family: 'Segoe UI', sans-serif;
}

#juridicoBanner {
    width: 100%;
    height: 300px;
    background-image: url('/img/juridico/banner.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#juridicoBannerOverlay {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 60px;
}

#juridicoBannerTextoContainer {
    color: white;
}

#homeBannerOverlay {
	background: rgba(0, 0, 0, 0.4);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-left: 60px;
}

#homeBannerTextoContainer {
	color: white;
}

.homeWelcomeTextWrapper {
	display: inline-block;
	margin:0px 0px 20px 0px;
}

.homeWelcomeText {
	font-size: 36px;
	font-weight: bold;
	color: white;
	display: inline-block;
}

.homeBarraDourada {
	height: 10px;
	background-color: #ccb178;
	margin-top: 10px;
	width: 100%;
}


.homeSubtitleText {
	font-size: 18px;
	font-weight: 400;
	color: #f1f1f1;
}

/* Estilos para Normativos */
#normativosWrapper {
	padding: 0;
	font-family: 'Segoe UI', sans-serif;
}

#normativosBanner {
	width: 100%;
	height: 300px;
	background-image: url('/img/normativos/banner.jpg');
	background-size: cover;
	background-position: center;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

#normativosBannerOverlay {
	background: rgba(0, 0, 0, 0.4);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-left: 60px;
}

#normativosBannerTextoContainer {
	color: white;
}

.normativosWelcomeTextWrapper {
	display: inline-block;
	margin:0px 0px 20px 0px;
}

.normativosWelcomeText {
	font-size: 36px;
	font-weight: bold;
	color: white;
	display: inline-block;
}

.normativosBarraDourada {
	height: 10px;
	background-color: #ccb178;
	margin-top: 10px;
	width: 100%;
}

.normativosSubtitleText {
	font-size: 18px;
	font-weight: 400;
	color: #f1f1f1;
}

/* Estilos para Colaborador */
#colaboradorWrapper {
	padding: 0;
	font-family: 'Segoe UI', sans-serif;
}

#colaboradorBanner {
    width: 100%;
    height: 300px;
    background-image: url('/img/colaborador/banner.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#colaboradorBannerOverlay {
	background: rgba(0, 0, 0, 0.4);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-left: 60px;
}

#colaboradorBannerTextoContainer {
	color: white;
}

.colaboradorWelcomeTextWrapper {
	display: inline-block;
	margin:0px 0px 20px 0px;
}

.colaboradorWelcomeText {
	font-size: 36px;
	font-weight: bold;
	color: white;
	display: inline-block;
}

.colaboradorBarraDourada {
	height: 10px;
	background-color: #ccb178;
	margin-top: 10px;
	width: 100%;
}

.colaboradorSubtitleText {
	font-size: 18px;
	font-weight: 400;
	color: #f1f1f1;
}

/* Estilos para Redes */
#redesWrapper {
	padding: 0;
	font-family: 'Segoe UI', sans-serif;
}

#redesBanner {
	width: 100%;
	height: 300px;
	background-image: url('/img/redes/banner.jpg');
	background-size: cover;
	background-position: center;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

#redesBannerOverlay {
	background: rgba(0, 0, 0, 0.4);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-left: 60px;
}

#redesBannerTextoContainer {
	color: white;
}

.redesWelcomeTextWrapper {
	display: inline-block;
	margin:0px 0px 20px 0px;
}

.redesWelcomeText {
	font-size: 36px;
	font-weight: bold;
	color: white;
	display: inline-block;
}

.redesBarraDourada {
	height: 10px;
	background-color: #ccb178;
	margin-top: 10px;
	width: 100%;
}

.redesSubtitleText {
	font-size: 18px;
	font-weight: 400;
	color: #f1f1f1;
}

/* Estilos para Cards de Redes Sociais */
.redes-content-container {
	max-width: 1200px;
	margin: 40px auto;
	padding: 0 20px;
}

.redes-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 30px;
	padding: 20px 0;
}

.redes-card {
	background: #ffffff;
	border-radius: 16px;
	padding: 30px;
	text-align: center;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	border: 1px solid #f0f0f0;
	position: relative;
	overflow: hidden;
}

.redes-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, #ccb178, #d4c085);
	transition: height 0.3s ease;
}

.redes-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.15);
}

.redes-card:hover::before {
	height: 6px;
}

.redes-icon {
	width: 80px;
	height: 80px;
	margin: 0 auto 20px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	position: relative;
}

.redes-icon svg {
	width: 40px;
	height: 40px;
	transition: all 0.3s ease;
}

.redes-card h3 {
	color: #071b33;
	font-size: 1.4em;
	font-weight: 600;
	margin: 0 0 10px 0;
}

.redes-card p {
	color: #666;
	font-size: 0.95em;
	margin: 0 0 25px 0;
	line-height: 1.5;
}

.redes-link {
	display: inline-block;
	padding: 12px 24px;
	border-radius: 25px;
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9em;
	transition: all 0.3s ease;
	border: 2px solid transparent;
}

/* Cores específicas para cada plataforma */
.redes-card[data-platform="website"] .redes-icon {
	background: linear-gradient(135deg, #071b33, #0a2240);
	color: white;
}

.redes-card[data-platform="website"] .redes-link {
	background: #071b33;
	color: white;
}

.redes-card[data-platform="website"] .redes-link:hover {
	background: #0a2240;
	transform: translateY(-2px);
}

.redes-card[data-platform="instagram"] .redes-icon {
	background: linear-gradient(135deg, #E4405F, #C13584, #833AB4);
	color: white;
}

.redes-card[data-platform="instagram"] .redes-link {
	background: #E4405F;
	color: white;
}

.redes-card[data-platform="instagram"] .redes-link:hover {
	background: #C13584;
	transform: translateY(-2px);
}

.redes-card[data-platform="facebook"] .redes-icon {
	background: #1877F2;
	color: white;
}

.redes-card[data-platform="facebook"] .redes-link {
	background: #1877F2;
	color: white;
}

.redes-card[data-platform="facebook"] .redes-link:hover {
	background: #166FE5;
	transform: translateY(-2px);
}

.redes-card[data-platform="linkedin"] .redes-icon {
	background: #0A66C2;
	color: white;
}

.redes-card[data-platform="linkedin"] .redes-link {
	background: #0A66C2;
	color: white;
}

.redes-card[data-platform="linkedin"] .redes-link:hover {
	background: #004182;
	transform: translateY(-2px);
}

.redes-card[data-platform="maps"] .redes-icon {
	background: linear-gradient(135deg, #4285F4, #34A853);
	color: white;
}

.redes-card[data-platform="maps"] .redes-link {
	background: #4285F4;
	color: white;
}

.redes-card[data-platform="maps"] .redes-link:hover {
	background: #34A853;
	transform: translateY(-2px);
}

.redes-card[data-platform="whatsapp"] .redes-icon {
	background: #25D366;
	color: white;
}

.redes-card[data-platform="whatsapp"] .redes-link {
	background: #25D366;
	color: white;
}

.redes-card[data-platform="whatsapp"] .redes-link:hover {
	background: #128C7E;
	transform: translateY(-2px);
}

/* Responsividade */
@media (max-width: 768px) {
	.redes-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	
	.redes-card {
		padding: 25px 20px;
	}
	
	.redes-icon {
		width: 70px;
		height: 70px;
	}
	
	.redes-icon svg {
		width: 35px;
		height: 35px;
	}
}

/* Apps abaixo */

#homeApps {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	justify-content: center;
	position: relative;
	top: 0;
	transform: translateY(-50%);
	padding: 30px 40px 0px 40px;
	margin-bottom: -30px;
	z-index: 2;
}

.homeAppBlock {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100px;
	height: 100px;
}

.homeAppItem {
	width: 80px;
	height: 80px;
	background: white;
	border-radius: 12px;
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease;
	cursor: pointer;
}


.homeAppItem:hover {
	transform: scale(1.05);
}

.homeAppIcon {
	width: 48px;
	height: 48px;
	object-fit: contain;
	cursor:pointer;
}


.homeAppText {
	position: absolute;
	bottom: -10px;
	font-size: 13px;
	font-weight: 500;
	color: #071b33;
	opacity: 0;
	transition: opacity 0.2s ease;
	pointer-events: none;
}

.homeAppBlock:hover .homeAppText {
	opacity: 1;
}

/* Dashboard Styles */
.homeDateTime {
	margin-top: 10px;
	display: flex;
	align-items: center;
	gap: 15px;
}

.homeDate, .homeTime {
	color: #ffffff;
	font-size: 14px;
	font-weight: 500;
	background: rgba(255, 255, 255, 0.1);
	padding: 5px 10px;
	border-radius: 15px;
	backdrop-filter: blur(10px);
}

/* Home Dashboard */
/* Card de Notícias Destacado - Isolado */
#homeNoticiasDestaque {
	padding: 10px 20px 20px 20px;
	max-width: 1200px;
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
}

#homeNoticiasDestaque .noticias-destaque {
    width: 100%;
    margin: 0 auto;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border: 1px solid #e9ecef;
}

#homeNoticiasDestaque .noticias-destaque .homeCardHeader {
	background: linear-gradient(135deg, #2c5aa0 0%, #1e3a5f 100%);
	padding: 25px;
	min-height: 80px;
}

#homeNoticiasDestaque .noticias-destaque .homeCardHeader h3 {
	font-size: 18px;
	font-weight: 700;
}

#homeNoticiasDestaque .noticias-destaque .homeCardContent {
    padding: 25px;
    min-height: 120px;
}

/* Grid interno de duas colunas (principal 2fr, secundária 1fr) */
.noticiasGrid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 28px;
}

.noticia-principal {}

.noticia-coluna-menor {
    display: flex;
    flex-direction: column;
    gap: 16px;
    border-left: 1px solid #e3e7ed;
    padding-left: 24px;
}

.noticia-secundaria .noticia-titulo {
    font-size: 15px;
}

.noticia-secundaria .noticia-descricao {
    -webkit-line-clamp: 4;
}

/* Destaque de imagem na coluna principal */
.noticia-principal .noticia-thumb {
    width: 240px;
    height: 150px;
}

/* Estilos do conteúdo da notícia */
.noticia-item {
	display: flex;
	gap: 20px;
	align-items: flex-start;
}

.noticia-thumb {
	flex-shrink: 0;
	width: 120px;
	height: 80px;
	border-radius: 8px;
	overflow: hidden;
}

.noticia-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.noticia-conteudo {
	flex: 1;
	min-width: 0;
}

.noticia-titulo {
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: #2c5aa0;
	text-decoration: none;
	margin-bottom: 8px;
	line-height: 1.4;
}

.noticia-titulo:hover {
	color: #1e3a5f;
	text-decoration: underline;
}

.noticia-descricao {
	color: #666;
	font-size: 14px;
	line-height: 1.5;
	margin-bottom: 10px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.noticia-meta {
	display: flex;
	gap: 15px;
	font-size: 12px;
	color: #999;
}

.noticia-fonte {
	font-weight: 500;
}

.noticia-data {
	font-style: italic;
}

/* Estilos para notícias sem imagem */
.noticia-sem-imagem {
    display: flex !important;
    flex-direction: column !important;
}

.noticia-sem-imagem .noticia-conteudo {
    width: 100% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Garantir que notícias com imagem mantenham o layout original */
.noticia-com-imagem {
    display: flex;
    flex-direction: row;
}

.noticia-com-imagem .noticia-conteudo {
    flex: 1;
    margin-left: 15px;
}

/* Ajustes específicos para a notícia principal sem imagem */
.noticia-principal .noticia-sem-imagem {
    min-height: auto;
}

/* Ajustes específicos para a notícia secundária sem imagem */
.noticia-secundaria .noticia-sem-imagem {
    min-height: auto;
    padding: 15px;
}

/* Cards Agrupados - Grid de 3 colunas */
#homeDashboard {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	padding: 10px 20px 30px 20px;
	max-width: 1200px;
	margin: 0 auto;
	overflow-x: hidden;
	width: 100%;
	box-sizing: border-box;
}

	.homeDashboardCard {
		background: #ffffff;
		border-radius: 12px;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
		overflow: hidden;
		transition: transform 0.2s ease, box-shadow 0.2s ease;
	}

	.homeDashboardCard:hover {
		transform: translateY(-2px);
		box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
	}

		.homeCardHeader {
		padding: 20px;
		background: linear-gradient(135deg, #071b33 0%, #0a2240 100%);
		color: white;
		display: flex;
		justify-content: space-between;
		align-items: center;
		min-height: 70px;
		box-sizing: border-box;
	}

	.homeCardHeader h3 {
		margin: 0;
		font-size: 16px;
		font-weight: 600;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 8px;
		text-align: left;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		flex: 1;
	}

			.homeCardHeaderActions {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				gap: 10px;
				min-width: 60px;
				height: 100%;
			}

				.homeBadge {
					background: rgba(255, 255, 255, 0.2);
					color: white;
					padding: 4px 8px;
					border-radius: 12px;
					font-size: 12px;
					font-weight: 600;
					min-width: 24px;
					text-align: center;
					display: inline-flex;
					align-items: center;
					justify-content: center;
				}

				/* Botões de criar (ícone padrão nos headers) */
				.homeCardHeaderActions .homeBtnCriar,
				.homeCardHeaderActions .homeBtnCriarAviso,
				.homeCardHeaderActions .homeBtnCriarEvento {
                    background: rgba(255, 255, 255, 0.1);
                    border: 1px solid rgba(255, 255, 255, 0.2);
                    color: white;
                    width: 32px;
                    height: 32px;
                    padding: 0;
                    border-radius: 6px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    cursor: pointer;
                    transition: all 0.2s ease;
                }

				.homeCardHeaderActions .homeBtnCriar:hover,
				.homeCardHeaderActions .homeBtnCriarAviso:hover,
				.homeCardHeaderActions .homeBtnCriarEvento:hover {
                    background: rgba(255, 255, 255, 0.2);
                    border-color: rgba(255, 255, 255, 0.3);
                    transform: scale(1.05);
                }

		.homeCardContent {
			padding: 20px;
		}

		.homeNoData {
			color: #666;
			text-align: center;
			font-size: 14px;
			display: flex;
			align-items: center;
			justify-content: center;
			height: 100%;
			min-height: 150px;
		}

/* Home Recursos (Fundos e Timbrado) */
		/* Card de Recursos ocupa toda a largura do grid */
		#homeDashboard .recursos-card {
			grid-column: 1 / -1;
		}

		/* Ramais deve ocupar 2/3 da largura em desktop */
		#homeDashboard .ramais-card {
			grid-column: span 2;
		}

		/* Ajustes internos do card de Ramais para melhor aproveitamento de espaço */
		#homeDashboard .ramais-card .homeCardContent table.homeTable {
			width: 100%;
			border-collapse: collapse;
			border: 1px solid #e5e7eb; /* grade externa */
		}

		#homeDashboard .ramais-card .homeCardContent table.homeTable thead th,
		#homeDashboard .ramais-card .homeCardContent table.homeTable tbody td {
			padding: 12px 14px;
			vertical-align: middle;
			border-right: 1px solid #e5e7eb; /* linhas verticais */
			border-bottom: 1px solid #e5e7eb; /* linhas horizontais */
		}

		#homeDashboard .ramais-card .homeCardContent table.homeTable thead th:last-child,
		#homeDashboard .ramais-card .homeCardContent table.homeTable tbody td:last-child {
			border-right: none;
		}

		#homeDashboard .ramais-card .homeCardContent table.homeTable thead th {
			background: #f7f9fc;
			font-weight: 600;
		}

		#homeDashboard .ramais-card .homeCardContent table.homeTable tbody tr:nth-child(even) {
			background: #fbfcfe; /* leve zebra para leitura */
		}

		/* Larguras e quebra de texto por coluna */
		#homeDashboard .ramais-card .homeCardContent table.homeTable th:nth-child(1),
		#homeDashboard .ramais-card .homeCardContent table.homeTable td:nth-child(1) {
			width: 110px;
			white-space: nowrap;
		}

		#homeDashboard .ramais-card .homeCardContent table.homeTable th:nth-child(2),
		#homeDashboard .ramais-card .homeCardContent table.homeTable td:nth-child(2) {
			white-space: normal;
			word-break: break-word;
		}

		#homeDashboard .ramais-card .homeCardContent table.homeTable th:nth-child(3),
		#homeDashboard .ramais-card .homeCardContent table.homeTable td:nth-child(3) {
			width: 180px;
		}

		#homeDashboard .ramais-card .homeCardContent table.homeTable th:last-child,
		#homeDashboard .ramais-card .homeCardContent table.homeTable td:last-child {
			width: 90px;
			text-align: center;
		}

		#homeDashboard .ramais-card .homeCardContent .btnTiny {
			margin-right: 6px;
		}
		.recursosSection {
			margin-bottom: 16px;
		}

		.recursosSection h4 {
			margin: 0 0 10px 0;
			color: #333;
			font-size: 15px;
			font-weight: 600;
		}

		.recursosList {
			display: grid;
			grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
			gap: 12px;
		}

		.recursoItem {
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 8px;
			padding: 10px;
			background: #f8f9fa;
			border-radius: 8px;
		}

		.recursoThumb {
			width: 100%;
			height: 100px;
			object-fit: cover;
			border-radius: 4px;
			background: #fff;
		}

		.recursoIcon {
			font-size: 26px;
		}

		.recursoNome {
			font-size: 13px;
			color: #555;
			text-align: center;
			word-break: break-word;
		}

/* Home Avisos */
			.homeAvisoItem {
				display: flex;
				align-items: flex-start;
				gap: 12px;
				padding: 12px 0;
				border-bottom: 1px solid #f0f0f0;
			}

			.homeAvisoItem:last-child {
				border-bottom: none;
			}

				.homeAvisoIcon {
					font-size: 20px;
					flex-shrink: 0;
				}

				.homeAvisoContent {
					flex: 1;
				}

					.homeAvisoTitle {
						font-weight: 600;
						color: #071b33;
						margin-bottom: 4px;
					}

					.homeAvisoText {
						color: #666;
						font-size: 14px;
						margin-bottom: 4px;
					}

					.homeAvisoDate {
						color: #999;
						font-size: 12px;
					}

			.homeAvisoItem.urgente .homeAvisoTitle {
				color: #dc3545;
			}

			.homeAvisoItem.normal .homeAvisoTitle {
				color: #071b33;
			}

			.homeAvisoItem.info .homeAvisoTitle {
				color: #17a2b8;
			}

			.homeVerTodos {
				text-align: center;
				margin-top: 15px;
				padding-top: 15px;
				border-top: 1px solid #f0f0f0;
			}

			.homeVerTodos a {
				color: #071b33;
				text-decoration: none;
				font-weight: 500;
				transition: color 0.2s ease;
			}

			.homeVerTodos a:hover {
				color: #0a2240;
			}

/* Home Botão Criar Aviso */
				.homeBtnCriarAviso {
					background: #28a745;
					color: white;
					border: none;
					border-radius: 6px;
					padding: 8px 12px;
					font-size: 14px;
					cursor: pointer;
					transition: all 0.2s ease;
					display: flex;
					align-items: center;
					gap: 6px;
					box-shadow: 0 2px 4px rgba(40, 167, 69, 0.2);
				}

				.homeBtnCriarAviso:hover {
					background: #218838;
					transform: translateY(-1px);
					box-shadow: 0 4px 8px rgba(40, 167, 69, 0.3);
				}

				.homeBtnCriarAviso i {
					font-size: 16px;
				}

/* Home Modal Criar Aviso */
.homeModal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
}

	.homeModalContent {
		background: white;
		border-radius: 12px;
		padding: 24px;
		width: 90%;
		max-width: 500px;
		max-height: 90vh;
		overflow-y: auto;
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
	}

		.homeModalHeader {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 20px;
			padding-bottom: 15px;
			border-bottom: 1px solid #eee;
		}

			.homeModalTitle {
				font-size: 20px;
				font-weight: 600;
				color: #071b33;
				margin: 0;
			}

			.homeModalClose {
				background: none;
				border: none;
				font-size: 24px;
				color: #999;
				cursor: pointer;
				padding: 0;
				width: 30px;
				height: 30px;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 50%;
				transition: all 0.2s ease;
			}

			.homeModalClose:hover {
				background: #f5f5f5;
				color: #666;
			}

		.homeModalBody {
			padding: 0;
		}

			.homeFormGroup {
				margin-bottom: 16px;
			}

			.homeFormGroup label {
				display: block;
				margin-bottom: 6px;
				font-weight: 500;
				color: #333;
			}

			.homeFormGroup input,
			.homeFormGroup select,
			.homeFormGroup textarea {
				width: 100%;
				padding: 10px 12px;
				border: 1px solid #ddd;
				border-radius: 6px;
				font-size: 14px;
				transition: border-color 0.2s ease;
				box-sizing: border-box;
			}

			.homeFormGroup input:focus,
			.homeFormGroup select:focus,
			.homeFormGroup textarea:focus {
				outline: none;
				border-color: #071b33;
				box-shadow: 0 0 0 2px rgba(7, 27, 51, 0.1);
			}

			.homeFormGroup textarea {
				resize: vertical;
				min-height: 80px;
			}

			.homeFormRow {
				display: flex;
				gap: 12px;
			}

			.homeFormRow .homeFormGroup {
				flex: 1;
			}

		.homeModalFooter {
			display: flex;
			gap: 12px;
			justify-content: flex-end;
			margin-top: 24px;
			padding-top: 20px;
			border-top: 1px solid #eee;
		}

			.homeBtnSecondary {
				background: #6c757d;
				color: white;
				border: none;
				border-radius: 6px;
				padding: 10px 20px;
				font-size: 14px;
				cursor: pointer;
				transition: background 0.2s ease;
			}

			.homeBtnSecondary:hover {
				background: #5a6268;
			}

			.homeBtnPrimary {
				background: #071b33;
				color: white;
				border: none;
				border-radius: 6px;
				padding: 10px 20px;
				font-size: 14px;
				cursor: pointer;
				transition: background 0.2s ease;
			}

			.homeBtnPrimary:hover {
				background: #0a2240;
			}

.btn-primary:disabled {
	background: #ccc;
	cursor: not-allowed;
}



/* Estatísticas Styles */
.stat-item {
	text-align: center;
	padding: 15px 0;
	border-bottom: 1px solid #f0f0f0;
}

.stat-item:last-child {
	border-bottom: none;
}

.stat-number {
	font-size: 28px;
	font-weight: 700;
	color: #071b33;
	margin-bottom: 5px;
}

.stat-label {
	color: #666;
	font-size: 14px;
	margin-bottom: 5px;
}

.stat-trend {
	font-size: 12px;
	font-weight: 600;
}

.stat-trend.up {
	color: #28a745;
}

.stat-trend.down {
	color: #dc3545;
}

/* Eventos Styles */
.evento-item {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 12px 0;
	border-bottom: 1px solid #f0f0f0;
}

.evento-item:last-child {
	border-bottom: none;
}

.evento-date {
	text-align: center;
	background: #071b33;
	color: white;
	padding: 8px;
	border-radius: 8px;
	min-width: 50px;
}

.evento-day {
	font-size: 18px;
	font-weight: 700;
}

.evento-month {
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
}

.evento-content {
	flex: 1;
}

.evento-title {
	font-weight: 600;
	color: #071b33;
	margin-bottom: 4px;
}

.evento-time {
	color: #666;
	font-size: 14px;
}

/* Links Úteis Styles */
.link-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid #f0f0f0;
}

.link-item:last-child {
	border-bottom: none;
}

.link-icon {
	font-size: 18px;
}

.link-item a {
	color: #071b33;
	text-decoration: none;
	font-weight: 500;
	transition: color 0.2s ease;
}

.link-item a:hover {
	color: #0a2240;
	text-decoration: underline;
}

/* Carrossel de ícones para mobile */
.homeApps-carousel {
	display: none;
	position: relative;
	overflow: hidden;
	padding: 0 40px;
	margin: 20px 0;
}

.homeApps-carousel-container {
	display: flex;
	transition: transform 0.3s ease;
	gap: 20px;
	width: 100%;
}

.homeApps-carousel .homeAppBlock {
	flex: 0 0 calc(33.333% - 14px);
	min-width: calc(33.333% - 14px);
}

.carousel-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(7, 27, 51, 0.8);
	color: white;
	border: none;
	border-radius: 50%;
	width: 35px;
	height: 35px;
	cursor: pointer;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	transition: background 0.2s ease;
}

.carousel-btn:hover {
	background: rgba(7, 27, 51, 1);
}

.carousel-btn.prev {
	left: 5px;
}

.carousel-btn.next {
	right: 5px;
}

.carousel-indicators {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 15px;
}

.carousel-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: rgba(7, 27, 51, 0.3);
	cursor: pointer;
	transition: background 0.2s ease;
}

.carousel-dot.active {
	background: #071b33;
}

/* Responsive */
@media (max-width: 1250px) {
	#homeApps {
		display: none;
	}
	
	.homeApps-carousel {
		display: block;
	}
}

@media (max-width: 768px) {
	.homeCardHeader, .homeCardContent {
		padding: 15px;
	}
	
	.homeDateTime {
		flex-direction: column;
		gap: 8px;
		align-items: flex-start;
	}
}

@media (max-width: 900px) {
    #homeNoticiasDestaque {
        padding: 10px 15px 20px 15px;
    }
    
    #homeNoticiasDestaque .noticias-destaque {
        width: 100%;
    }

    .noticiasGrid {
        grid-template-columns: 1fr; /* Empilha no tablet */
    }

    .noticia-coluna-menor {
        border-left: none;
        padding-left: 0;
    }
	
    #homeDashboard {
        display: flex;
        flex-direction: column;
        gap: 20px;
        max-width: 100vw;
        padding: 10px 15px 20px 15px;
        margin: 0 auto;
    }
	
    .homeDashboardCard {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 700px) {
    #homeDashboard {
        display: flex;
        flex-direction: column;
        gap: 16px;
        max-width: 100vw;
        padding: 10px 15px 20px 15px;
        margin: 0 auto;
    }

	.homeDashboardCard {
		width: 100%;
		min-width: 0;
	}
    #homeApps {
        transform: none;
        padding: 10px 15px;
        margin-bottom: 0;
        gap: 20px;
    }
    .homeAppBlock {
        width: 100px;
        height: 100px;
    }
    .homeAppItem {
        width: 80px;
        height: 80px;
    }
}
@media (max-width: 600px) {
    #homeNoticiasDestaque {
        padding: 10px;
    }
	
	#homeNoticiasDestaque .noticias-destaque .homeCardHeader,
	#homeNoticiasDestaque .noticias-destaque .homeCardContent {
		padding: 20px;
	}
	
    .noticia-item {
        flex-direction: column;
        gap: 15px;
    }
	
	.noticia-thumb {
		width: 100%;
		height: 150px;
	}
	
    #homeDashboard {
        display: flex;
        flex-direction: column;
        gap: 12px;
        max-width: 100vw;
        padding: 10px 15px 20px 15px;
    }
	
    .homeDashboardCard {
        width: 100%;
        min-width: 0;
    }
    #homeApps {
        transform: none;
        padding: 10px;
        margin-bottom: 0;
        gap: 16px;
    }
    .homeAppBlock {
        width: 90px;
        height: 90px;
    }
    .homeAppItem {
        width: 70px;
        height: 70px;
    }
}

@media (max-width: 500px) {
    #homeDashboard {
        max-width: 100vw;
        padding: 10px;
    }
	
    .homeDashboardCard {
        width: 100%;
        min-width: 0;
    }
	
	.okrDepartmentInfo {
		margin: 25px 0;
	}
	
	.okrDepartmentCard {
		background: linear-gradient(135deg, #071b33 0%, #0d2744 100%);
		border: none;
		border-radius: 12px;
		padding: 30px;
		box-shadow: 0 8px 25px rgba(7, 27, 51, 0.3);
		position: relative;
		overflow: hidden;
	}
	
	.okrDepartmentCard::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 4px;
		background: linear-gradient(90deg, #ccb178 0%, #d4c085 50%, #ccb178 100%);
	}
	
	.okrDepartmentCard h3 {
		color: white;
		font-size: 1.4rem;
		font-weight: 600;
		margin: 0 0 20px 0;
		display: flex;
		align-items: center;
		gap: 12px;
	}
	
	.okrDepartmentCard h3 i {
		color: #ccb178;
		font-size: 1.2rem;
	}
	
	.okrDepartmentCard h3 span {
		color: #ccb178;
		font-weight: 500;
	}
	
	#okrDashboard {
		max-width: calc(100vw - 20px);
		padding: 10px;
	}
}

/* OKR Styles - Redesigned */
#okrWrapper {
	padding: 0;
	margin: 0;
	font-family: 'Segoe UI', sans-serif;
}

.okr-content-container {
	max-width: 1200px;
	margin: 60px auto 40px auto;
	padding: 20px;
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	color: #333333;
}

.okrHeader {
	margin-bottom: 0;
	text-align: center;
	background: #071b33;
	padding: 30px 20px;
	border-bottom: 1px solid #0d2744;
}

.okrHeader h1 {
	color: #ffffff;
	font-size: 2rem;
	margin-bottom: 8px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
}

.okrHeader p {
	color: #ccb178;
	font-size: 1rem;
	margin: 0;
	font-weight: 400;
}

.okrDepartmentInfo {
	margin: 20px;
}

.okrDepartmentCard {
	background: #f8f9fa;
	border: 1px solid #e0e0e0;
	padding: 20px;
	margin-bottom: 20px;
	border-radius: 8px;
}

.okrDepartmentCard h3 {
	color: #333333;
	font-size: 1.2rem;
	font-weight: 600;
	margin: 0 0 15px 0;
	display: flex;
	align-items: center;
	gap: 10px;
}

.okrDepartmentCard h3 span {
	color: #ccb178;
	font-weight: 500;
}

.okrPeriodSelector {
	margin-top: 15px;
	display: flex;
	align-items: center;
	gap: 15px;
}

.okrPeriodSelector label {
	font-size: 1rem;
	color: #333333;
	font-weight: 500;
}

.okrSelectPeriod {
	padding: 8px 12px;
	border: 1px solid #e0e0e0;
	border-radius: 4px;
	background: #ffffff;
	font-size: 14px;
	color: #333333;
	cursor: pointer;
	font-weight: 500;
	min-width: 180px;
}

.okrSelectPeriod:focus {
	outline: none;
	border-color: #ccb178;
	box-shadow: 0 0 0 2px rgba(204, 177, 120, 0.2);
}
	
#okrDashboard {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
	gap: 20px;
	margin-top: 0;
	align-items: start;
	padding: 20px;
	max-width: 1200px;
	margin: 0 auto;
}

.okrDashboardCard {
	background: #ffffff;
	border: 1px solid #e0e0e0;
	overflow: hidden;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.okrStatsCard {
	height: auto;
	align-self: start;
}

.okrObjectivesCard {
	height: auto;
}
			
.okrCardHeader {
	padding: 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #e0e0e0;
	margin-bottom: 0;
	background: #f8f9fa;
}

.okrCardHeader h3 {
	color: #333333;
	font-size: 1.2rem;
	font-weight: 600;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 8px;
	text-transform: none;
	letter-spacing: 0;
}

.okrCardHeaderActions {
	display: flex;
	align-items: center;
	gap: 10px;
}

.okrBtnCreateObjective {
	background: #ccb178;
	color: #071b33;
	border: none;
	padding: 8px 14px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
}

.okrBtnCreateObjective:hover {
	background: #bda067;
}
			
.okrCardContent {
	padding: 30px;
}

.okrStatsGrid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 15px;
}

.okrStatItem {
	text-align: center;
	padding: 20px;
	background: #f8f9fa;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
}

.okrStatNumber {
	font-size: 2rem;
	font-weight: 700;
	color: #071b33;
	margin-bottom: 8px;
	text-shadow: none;
}

.okrStatLabel {
	font-size: 0.85rem;
	color: #666666;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.okrObjectiveItem {
	background: #ffffff;
	border: 1px solid #e8eaed;
	padding: 28px;
	margin: 0 0 56px 0;
	color: #333333;
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	transition: all 0.2s ease;
	position: relative;
}

.okrObjectiveItem:hover {
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
	border-color: #ccb178;
	transform: translateY(-2px);
}
					
.okrObjectiveHeader {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 16px;
}

.okrObjectiveTitle {
	font-weight: 700;
	color: #071b33;
	font-size: 1.2rem;
	margin: 0;
	text-transform: none;
	letter-spacing: -0.01em;
	line-height: 1.3;
}

.okrObjectiveActions {
	display: flex;
	gap: 8px;
}

.okrObjectiveActions button {
	background: #ccb178;
	border: none;
	color: #071b33;
	padding: 6px 10px;
	cursor: pointer;
	font-weight: 600;
	font-size: 0.85rem;
}

.okrObjectiveActions button:hover {
	background: #bda067;
}
					
.okrObjectiveDescription {
	color: #6b7280;
	font-size: 0.95rem;
	margin-bottom: 20px;
	line-height: 1.6;
	font-weight: 400;
}

.okrObjectiveProgress {
	margin-bottom: 20px;
}

.okrProgressLabel {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
	font-size: 0.9rem;
	font-weight: 600;
	color: #374151;
	text-transform: none;
}

.okrProgressPercentage {
	color: #ccb178;
	font-weight: 700;
}

.okrProgressBar {
	width: 100%;
	height: 8px;
	background: #f3f4f6;
	border: none;
	overflow: hidden;
	border-radius: 4px;
}

.okrProgressFill {
	height: 100%;
	background: linear-gradient(90deg, #3b82f6, #10b981);
	transition: width 0.3s ease;
	border-radius: 4px;
}
					
.okrKeyResults {
	margin-top: 20px;
}

.okrKeyResultsHeader {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	padding: 12px 16px;
	background: #f8f9fa;
	border-radius: 8px;
	border: 1px solid #e9ecef;
}

.okrKeyResultsHeader h5 {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 600;
	color: #666666;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	display: flex;
	align-items: center;
	gap: 6px;
}

.okrKeyResultsHeader h5 i {
	font-size: 0.85rem;
	color: #ccb178;
}

.okrBtnAddKeyResult {
	background: #ccb178;
	color: #071b33;
	border: none;
	padding: 6px 12px;
	font-size: 0.8rem;
	cursor: pointer;
	font-weight: 600;
	text-transform: none;
	border-radius: 4px;
	transition: background-color 0.2s ease;
}

.okrBtnAddKeyResult:hover {
	background: #bda067;
}
						
.okrKeyResultItem {
	padding: 18px 16px;
	margin-bottom: 12px;
	background: #ffffff;
	border: 1px solid #e9ecef;
	border-radius: 8px;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.okrKeyResultItem:last-child {
	margin-bottom: 0;
}

.okrKeyResultItem:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	border-color: #ccb178;
	transform: translateY(-1px);
}

.okrKeyResultHeader {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 12px;
}

.okrKeyResultTitle {
	font-weight: 600;
	color: #374151;
	font-size: 0.95rem;
	margin: 0;
	text-transform: none;
	line-height: 1.4;
}

.okrKeyResultActions {
	display: flex;
	gap: 6px;
}

.okrKeyResultActions button {
	border: none;
	padding: 6px 10px;
	cursor: pointer;
	font-size: 0.8rem;
	font-weight: 600;
	border-radius: 4px;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	gap: 4px;
}

/* Botão de atualizar progresso - azul como os menus */
.okrBtnUpdateProgress {
	background: #3b82f6;
	color: white;
}

.okrBtnUpdateProgress:hover {
	background: #2563eb;
	transform: translateY(-1px);
}

/* Botão de detalhes - cinza claro */
.okrBtnDetails {
	background: #6b7280;
	color: white;
	padding: 6px 8px;
	font-size: 0.75rem;
	min-width: auto;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.okrBtnDetails:hover {
	background: #4b5563;
	transform: translateY(-1px);
}

/* Botões de confirmação inline */
.okrConfirmationButtons {
	display: flex;
	gap: 8px;
	align-items: center;
}

.okrBtnConfirm {
	background: #10b981;
	color: white;
	padding: 6px 12px;
	border: none;
	border-radius: 6px;
	font-size: 0.875rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s ease;
}

.okrBtnConfirm:hover {
	background: #059669;
	transform: translateY(-1px);
}

.okrBtnCancel {
	background: #ef4444;
	color: white;
	padding: 6px 12px;
	border: none;
	border-radius: 6px;
	font-size: 0.875rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s ease;
}

.okrBtnCancel:hover {
	background: #dc2626;
	transform: translateY(-1px);
}

/* Botões quadrados apenas com emojis */
.okrBtnEmojiConfirm {
	background: #10b981;
	color: white;
	width: 32px;
	height: 32px;
	border: none;
	border-radius: 6px;
	font-size: 16px;
	font-weight: bold;
	cursor: pointer;
	transition: all 0.2s ease;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-right: 8px;
}

.okrBtnEmojiConfirm:hover {
	background: #059669;
	transform: translateY(-1px);
}

.okrBtnEmojiCancel {
	background: #ef4444;
	color: white;
	width: 32px;
	height: 32px;
	border: none;
	border-radius: 6px;
	font-size: 16px;
	font-weight: bold;
	cursor: pointer;
	transition: all 0.2s ease;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.okrBtnEmojiCancel:hover {
	background: #dc2626;
	transform: translateY(-1px);
}

/* Botão para marcar como concluído - azul como o botão atualizar */
.okrBtnComplete {
	background: #3b82f6;
	color: white;
	width: 32px;
	height: 32px;
	padding: 6px 8px;
	font-size: 0.8rem;
	font-weight: 600;
	border-radius: 4px;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: auto;
}

.okrBtnComplete:hover {
	background: #2563eb;
	transform: translateY(-1px);
}

/* Botão já concluído - verde claro discreto */
.okrBtnCompleted {
	background: #86efac;
	color: #166534;
	cursor: not-allowed;
	width: 32px;
	height: 32px;
	padding: 6px 8px;
	font-size: 0.8rem;
	font-weight: 600;
	border-radius: 4px;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: auto;
}

.okrBtnCompleted:hover {
	transform: none;
}

/* Tag para campos automáticos */
.okrAutomaticTag {
	font-size: 0.75rem;
	color: #6b7280;
	text-align: center;
	line-height: 1.2;
	font-weight: 500;
	padding: 4px 8px;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	background-color: #f9fafb;
}

.okrKeyResultActions button i {
	font-size: 0.75rem;
}

.okrKeyResultDescription {
	color: #6b7280;
	font-size: 0.85rem;
	margin-bottom: 12px;
	line-height: 1.5;
}

.okrKeyResultProgress {
	margin-bottom: 8px;
}

.okrProgressInfo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 6px;
}

.okrProgressLabel {
	font-size: 0.8rem;
	color: #6b7280;
	font-weight: 500;
}

.okrProgressValue {
	font-size: 0.85rem;
	font-weight: 600;
	color: #374151;
}

.okrProgressBarSmall {
	height: 4px;
	background: #f3f4f6;
	border-radius: 2px;
	overflow: hidden;
}

.okrKeyResultDeadline {
	font-size: 0.8rem;
	color: #6b7280;
	display: flex;
	align-items: center;
	gap: 4px;
	margin-top: 8px;
}

.okrKeyResultDeadline i {
	font-size: 0.75rem;
	color: #ccb178;
}

.okrEmptyKeyResults {
	color: #9ca3af;
	font-size: 0.9rem;
	font-style: italic;
	text-align: center;
	padding: 20px 0;
	margin: 0;
}

.okrStatusBadge {
	padding: 4px 8px;
	border-radius: 12px;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.okrStatusCompleted {
	background-color: #d1fae5;
	color: #065f46;
}

.okrStatusOnTrack {
	background-color: #dbeafe;
	color: #1e40af;
}

.okrStatusAtRisk {
	background-color: #fef3c7;
	color: #92400e;
}

.okrStatusBehind {
	background-color: #fee2e2;
	color: #991b1b;
}

/* OKR Modal Styles */
.okrModal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	
	.okrModalContent {
		background: white;
		border-radius: 12px;
		max-width: 600px;
		width: 100%;
		max-height: 90vh;
		overflow-y: auto;
		box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
		
		.okrModalHeader {
			padding: 20px 20px 0 20px;
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1px solid #e5e7eb;
			margin-bottom: 20px;
			
			.okrModalTitle {
				margin: 0;
				font-size: 1.5rem;
				font-weight: 600;
				color: #071b33;
			}
			
			.okrModalClose {
				background: none;
				border: none;
				font-size: 1.5rem;
				cursor: pointer;
				color: #6b7280;
				padding: 5px;
				border-radius: 4px;
				transition: all 0.2s ease;
				
				&:hover {
					background: #f3f4f6;
					color: #374151;
				}
			}
		}
		
		.okrModalBody {
			padding: 0 20px;
			
			.okrFormGroup {
				margin-bottom: 20px;
				
				label {
					display: block;
					margin-bottom: 5px;
					font-weight: 500;
					color: #374151;
					font-size: 0.875rem;
				}
				
				input, textarea, select {
					width: 100%;
					padding: 10px 12px;
					border: 1px solid #d1d5db;
					border-radius: 6px;
					font-size: 0.875rem;
					transition: border-color 0.2s ease, box-shadow 0.2s ease;
					box-sizing: border-box;
					
					&:focus {
						outline: none;
						border-color: #3b82f6;
						box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
					}
				}
				
				textarea {
					resize: vertical;
					min-height: 80px;
				}
			}
			
			.okrFormRow {
				display: grid;
				grid-template-columns: 1fr 1fr;
				gap: 15px;
				margin-bottom: 20px;
			}
		}
		
		.okrModalFooter {
			padding: 20px;
			display: flex;
			justify-content: flex-end;
			gap: 10px;
			border-top: 1px solid #e5e7eb;
			margin-top: 20px;
			
			.okrBtnSecondary {
				background: #f3f4f6;
				color: #374151;
				border: 1px solid #d1d5db;
				padding: 10px 20px;
				border-radius: 6px;
				cursor: pointer;
				font-weight: 500;
				transition: all 0.2s ease;
				
				&:hover {
					background: #e5e7eb;
					border-color: #9ca3af;
				}
			}
			
			.okrBtnPrimary {
				background: #3b82f6;
				color: white;
				border: none;
				padding: 10px 20px;
				border-radius: 6px;
				cursor: pointer;
				font-weight: 500;
				transition: all 0.2s ease;
				
				&:hover {
					background: #2563eb;
					transform: translateY(-1px);
				}
				
				&:disabled {
					background: #9ca3af;
					cursor: not-allowed;
					transform: none;
				}
			}
		}
	}
}

/* Conteúdo de observações */
.okrObservationsContent {
	background: #f8f9fa;
	border: 1px solid #e9ecef;
	border-radius: 8px;
	padding: 16px;
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.5;
	color: #495057;
	white-space: pre-wrap;
	word-wrap: break-word;
	min-height: 60px;
}

/* Responsive OKR */
@media (max-width: 768px) {
	#okrWrapper {
		padding: 15px;
		
		.okrHeader h1 {
			font-size: 2rem;
		}
		
		#okrDashboard {
			grid-template-columns: 1fr;
			
			.okrDashboardCard {
				.okrCardContent {
					.okrStatsGrid {
						grid-template-columns: 1fr 1fr;
					}
				}
			}
		}
	}
	
	.okrModal {
		padding: 10px;
		
		.okrModalContent {
			max-width: 100%;
			
			.okrModalBody {
				.okrFormRow {
					grid-template-columns: 1fr;
					gap: 0;
				}
			}
		}
	}
}

@media (max-width: 480px) {
	#okrWrapper {
		.okrHeader h1 {
			font-size: 1.75rem;
		}
		
		#okrDashboard {
			.okrDashboardCard {
				.okrCardContent {
					.okrStatsGrid {
						grid-template-columns: 1fr;
					}
				}
			}
		}
	}
	
	#mainTopoAcoes {
		gap: 10px;
	}
	
	.mainTopoIcon img {
		width: 20px;
		height: 20px;
	}
}

/* Aniversariantes Styles */
.aniversariante-item {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 12px 0;
	border-bottom: 1px solid #f0f0f0;
	transition: background-color 0.2s ease;
}

.aniversariante-item:last-child {
	border-bottom: none;
}

.aniversariante-item:hover {
	background-color: #f8f9fa;
	border-radius: 8px;
	margin: 0 -8px;
	padding: 12px 8px;
}

.aniversariante-date {
	text-align: center;
	background: #071b33;
	color: white;
	padding: 8px;
	border-radius: 8px;
	min-width: 50px;
	transition: background-color 0.2s ease;
}

.aniversariante-day {
	font-size: 18px;
	font-weight: 700;
}

.aniversariante-month {
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
}

.aniversariante-content {
	flex: 1;
}

.aniversariante-name {
	font-weight: 600;
	color: #071b33;
	margin-bottom: 4px;
	font-size: 14px;
}

.aniversariante-info {
    color: #666;
    font-size: 13px;
    margin-bottom: 2px;
}


/* Estilos especiais para aniversariantes */
.aniversariante-hoje {
	background: linear-gradient(90deg, rgba(255, 193, 7, 0.1) 0%, rgba(255, 193, 7, 0.05) 100%);
	border-left: 4px solid #ffc107;
	padding-left: 12px;
	margin-left: -4px;
}

.aniversariante-hoje .aniversariante-date {
	background: linear-gradient(135deg, #ffc107 0%, #ffb300 100%);
	color: #071b33;
	box-shadow: 0 2px 8px rgba(255, 193, 7, 0.3);
}

.aniversariante-hoje .aniversariante-name {
	color: #e65100;
	font-weight: 700;
}

.aniversariante-proximo {
	background: linear-gradient(90deg, rgba(13, 202, 240, 0.1) 0%, rgba(13, 202, 240, 0.05) 100%);
	border-left: 4px solid #0dcaf0;
	padding-left: 12px;
	margin-left: -4px;
}

.aniversariante-proximo .aniversariante-date {
	background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
	color: white;
	box-shadow: 0 2px 8px rgba(13, 202, 240, 0.3);
}

.aniversariante-proximo .aniversariante-name {
	color: #0a58ca;
	font-weight: 600;
}

/* Responsividade para aniversariantes */
@media (max-width: 768px) {
	.aniversariante-item {
		gap: 10px;
		padding: 10px 0;
	}
	
	.aniversariante-date {
		min-width: 45px;
		padding: 6px;
	}
	
	.aniversariante-day {
		font-size: 16px;
	}
	
	.aniversariante-month {
		font-size: 9px;
	}
	
	.aniversariante-name {
		font-size: 13px;
	}
	
	.aniversariante-info {
		font-size: 12px;
	}
	

}

/* === COMPLIANCE BANNER STYLES === */
#complianceBanner {
    width: 100%;
    height: 300px;
    background-image: url('/img/compliance/banner.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#complianceBannerOverlay {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 60px;
}

#complianceBannerTextoContainer {
    color: white;
}

.complianceWelcomeTextWrapper {
    display: inline-block;
    margin: 0px 0px 20px 0px;
}

.complianceWelcomeText {
    font-size: 36px;
    font-weight: bold;
    color: white;
    display: inline-block;
}

.complianceBarraDourada {
    height: 10px;
    background-color: #ccb178;
    margin-top: 10px;
    width: 100%;
}

.complianceSubtitleText {
    font-size: 18px;
    font-weight: 400;
    color: #f1f1f1;
}

/* Estilos para visualização de PDF de compliance */
.compliance-pdf-container {
    max-width: 1200px;
    margin: 60px auto 40px auto;
    padding: 20px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.compliance-pdf-header {
    text-align: center;
    margin-bottom: 30px;
    padding: 30px 20px;
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%);
    border-radius: 12px;
    color: white;
}

.compliance-pdf-header h1 {
    font-size: 2.5em;
    font-weight: 700;
    margin: 0 0 10px 0;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.compliance-pdf-header p {
    font-size: 1.1em;
    margin: 0;
    opacity: 0.9;
}

.compliance-pdf-viewer {
    margin-bottom: 20px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border: 1px solid #e0e0e0;
}

.compliance-pdf-viewer iframe {
    display: block;
    border: none;
    min-height: 600px;
}



/* Responsividade para PDF viewer */
/* === OKR BANNER STYLES === */
#okrBanner {
    width: 100%;
    height: 300px;
    background-image: url('/img/okr/banner.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    z-index: 10;
}

#okrBannerOverlay {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 60px;
}

#okrBannerTextoContainer {
    color: white;
}

.okrWelcomeTextWrapper {
    display: inline-block;
    margin: 0px 0px 20px 0px;
}

.okrWelcomeText {
    font-size: 36px;
    font-weight: bold;
    color: white;
    display: inline-block;
}

.okrBarraDourada {
    height: 10px;
    background-color: #ccb178;
    margin-top: 10px;
    width: 100%;
}

.okrSubtitleText {
    font-size: 18px;
    font-weight: 400;
    color: #f1f1f1;
}

/* === REPORT BANNER STYLES === */
#reportBanner {
    width: 100%;
    height: 300px;
    background-image: url('/img/report/banner.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    z-index: 10;
    margin-bottom: 80px;
}

#reportBannerOverlay {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 60px;
}

#reportBannerTextoContainer {
    color: white;
}

.reportWelcomeTextWrapper {
    display: inline-block;
    margin: 0px 0px 20px 0px;
}

.reportWelcomeText {
    font-size: 36px;
    font-weight: bold;
    color: white;
    display: inline-block;
}

.reportBarraDourada {
    height: 10px;
    background-color: #ccb178;
    margin-top: 10px;
    width: 100%;
}

.reportSubtitleText {
    font-size: 18px;
    font-weight: 400;
    color: #f1f1f1;
}

/* === TEAM BANNER STYLES === */
#teamBanner {
    width: 100%;
    height: 300px;
    background-image: url('/img/equipe/banner.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    z-index: 10;
}

#teamBannerOverlay {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 60px;
}

#teamBannerTextoContainer {
    color: white;
}

.teamWelcomeTextWrapper {
    display: inline-block;
    margin: 0px 0px 20px 0px;
}

.teamWelcomeText {
    font-size: 36px;
    font-weight: bold;
    color: white;
    display: inline-block;
}

.teamBarraDourada {
    height: 10px;
    background-color: #ccb178;
    margin-top: 10px;
    width: 100%;
}

.teamSubtitleText {
    font-size: 18px;
    font-weight: 400;
    color: #f1f1f1;
}

@media (max-width: 768px) {
    #complianceBannerOverlay,
    #okrBannerOverlay,
    #reportBannerOverlay,
    #teamBannerOverlay {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .complianceWelcomeText,
    .okrWelcomeText,
    .reportWelcomeText,
    .teamWelcomeText {
        font-size: 28px;
    }
    
    .complianceSubtitleText,
    .okrSubtitleText,
    .reportSubtitleText,
    .teamSubtitleText {
        font-size: 16px;
    }
    
    .compliance-pdf-container {
        padding: 15px;
        margin: 10px;
    }
    
    .compliance-pdf-header {
        padding: 20px 15px;
    }
    
    .compliance-pdf-header h1 {
        font-size: 1.8em;
    }
    
    .compliance-pdf-header p {
        font-size: 1em;
    }
    
    .compliance-pdf-viewer iframe {
        height: 500px;
        min-height: 400px;
    }
    

}

@media (max-width: 480px) {
    .compliance-pdf-header h1 {
        font-size: 1.5em;
    }
    
    .compliance-pdf-viewer iframe {
        height: 400px;
        min-height: 350px;
    }
}

/* Fim dos estilos para PDF de compliance */

/* #################### */
/*   ESTILOS NORMATIVOS */
/* #################### */

.normativos-content-container {
    max-width: 1200px;
    margin: 60px auto 40px auto;
    padding: 20px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.normativos-menu-container {
    display: flex;
    gap: 30px;
    min-height: 700px;
}

/* Sidebar com lista de normativos */
.normativos-sidebar {
    flex: 0 0 350px;
    background: #f8f9fa;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border: 1px solid #e0e0e0;
}

.normativos-sidebar h3 {
    color: #071b33;
    font-size: 1.3em;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 2px solid #071b33;
    padding-bottom: 10px;
}

.normativos-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.normativo-item {
    display: flex;
    align-items: center;
    padding: 15px;
    margin-bottom: 10px;
    background: #ffffff;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    border-left: 4px solid transparent;
    border: 1px solid #e0e0e0;
}

.normativo-item:hover {
    background: #f0f7ff;
    border-left-color: #071b33;
    transform: translateX(5px);
    box-shadow: 0 2px 8px rgba(7, 27, 51, 0.2);
}

.normativo-item.active {
    background: #e3f2fd;
    border-left-color: #071b33;
    box-shadow: 0 2px 8px rgba(7, 27, 51, 0.3);
}

.normativo-icon {
    font-size: 1.5em;
    margin-right: 12px;
    flex-shrink: 0;
    color: #071b33;
}

.normativo-nome {
    color: #333333;
    font-size: 0.95em;
    line-height: 1.3;
    font-weight: 500;
}

.normativo-item.active .normativo-nome {
    color: #071b33;
    font-weight: 600;
}

/* Área de visualização do PDF */
.normativos-viewer {
    flex: 1;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    border: 1px solid #e0e0e0;
}

.normativos-viewer-header {
    background: linear-gradient(135deg, #071b33 0%, #0a2240 100%);
    padding: 20px 25px;
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.normativos-viewer-header h4 {
    color: white;
    font-size: 1.2em;
    margin: 0;
    flex: 1;
    min-width: 200px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.normativos-actions {
    display: flex;
    gap: 10px;
}

.btn-action {
    background: rgba(255, 255, 255, 0.2);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 8px 15px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 5px;
}

.btn-action:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.btn-action:active {
    transform: translateY(0);
}

.normativos-iframe-container {
    padding: 0;
    height: calc(100% - 80px);
    min-height: 600px;
}

#pdf-viewer {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 0;
    background: #ffffff;
}

.normativos-empty-state {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #666666;
    font-size: 1.1em;
    text-align: center;
}

/* Placeholder quando não há normativos */
.normativos-placeholder {
    text-align: center;
    padding: 60px 20px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    max-width: 600px;
    margin: 0 auto;
    border: 1px solid #e0e0e0;
}

.normativos-placeholder h3 {
    color: #1976d2;
    font-size: 1.5em;
    margin-bottom: 15px;
}

.normativos-placeholder p {
    color: #666666;
    font-size: 1.1em;
    line-height: 1.5;
}

/* Responsividade */
@media (max-width: 1200px) {
    .normativos-sidebar {
        flex: 0 0 300px;
    }
}

@media (max-width: 968px) {
    .normativos-menu-container {
        flex-direction: column;
        gap: 20px;
    }
    
    .normativos-sidebar {
        flex: none;
        order: 2;
    }
    
    .normativos-viewer {
        order: 1;
    }
    
    .normativos-viewer-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .normativos-actions {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .normativos-content-container {
        padding: 20px 15px;
    }
    
    .normativos-sidebar {
        padding: 20px;
    }
    
    .normativo-item {
        padding: 12px;
    }
    
    .normativo-nome {
        font-size: 0.9em;
    }
    
    .normativos-iframe-container {
        padding: 15px;
        min-height: 500px;
    }
    
    #pdf-viewer {
        height: 500px;
    }
}

@media (max-width: 480px) {
    .normativos-viewer-header h4 {
        font-size: 1em;
    }
    
    .btn-action {
        padding: 6px 12px;
        font-size: 0.8em;
    }
    
    .normativos-iframe-container {
        min-height: 400px;
    }
    
    #pdf-viewer {
        height: 400px;
    }
}

/* Fim dos estilos para normativos */

/* OKR Notification Styles */
.okrNotification {
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 15px 20px;
    border-radius: 5px;
    color: #ffffff;
    font-weight: 600;
    z-index: 10000;
    opacity: 0;
    transform: translateX(100%);
    transition: all 0.3s ease;
    max-width: 300px;
    word-wrap: break-word;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}

.okrNotificationShow {
    opacity: 1;
    transform: translateX(0);
}

.okrNotificationSuccess { background-color: #28a745; }
.okrNotificationError { background-color: #dc3545; }
.okrNotificationInfo { background-color: #17a2b8; }
.okrNotificationWarning { background-color: #ffc107; color: #212529; }

@media (max-width: 768px) {
    .okrNotification {
        left: 10px;
        right: 10px;
        top: 10px;
    }
}

/* Transição suave ao trocar de notícia na Home */
#noticiaContainer {
    transition: opacity 0.65s ease, transform 0.65s ease;
    will-change: opacity, transform;
}

#noticiaContainer.fade-out {
    opacity: 0;
    transform: translateY(6px);
}

#noticiaContainer.fade-in {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    #noticiaContainer {
        transition: none;
    }
}
#rhWrapper {
    padding: 0;
    font-family: 'Segoe UI', sans-serif;
}

#rhBanner {
    width: 100%;
    height: 300px;
    background-image: url('/img/rh/banner.jpg'), url('/img/home/banner.jpg');
    background-size: cover;
    background-position: center;
    background-color: #071B33;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#rhBannerOverlay {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 60px;
}

#rhBannerTextoContainer {
    color: white;
}