/* Conecta On — Header Module & Top Bar Styles (Forensic Correction 11.6.5-A & 11.6.5-F) */

/* Wrapper fixed container for Top Bar & Header */
.conecta-header-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: var(--conecta-z-sticky, 9999);
	box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

/* WP Admin Bar Coexistence */
body.logged-in .conecta-header-wrapper {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.logged-in .conecta-header-wrapper {
		top: 46px;
	}
}

/* Top Bar Divided 50/50 Grid Layout */
.conecta-topbar {
	background-color: #050505;
	width: 100%;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.conecta-topbar-grid {
	display: grid;
	grid-template-columns: 1fr 1fr; /* Dividida exatamente no meio 50% / 50% */
	width: 100%;
	height: 40px;
	margin: 0;
	padding: 0;
}

.conecta-topbar-tab {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	font-size: 13.5px;
	font-weight: 800;
	text-decoration: none;
	transition: all 0.25s cubic-bezier(0.25, 1, 0.5, 1);
	box-sizing: border-box;
	border: 2px solid transparent; /* Borda invisível para manter layout ao passar o mouse */
	border-radius: 8px; /* Cantos arredondados */
	letter-spacing: 0.3px;
	cursor: pointer;
}

/* Lado Esquerdo: Conexão para Você - Fundo Cinza */
.conecta-topbar-tab.tab-voce {
	background-color: #334155; /* Fundo Cinza Slate */
	color: #FFFFFF;
}

/* Lado Direito: Para Empresas - Fundo Azul Marinho */
.conecta-topbar-tab.tab-empresas {
	background-color: #0E2434; /* Fundo Azul Marinho */
	color: #FFFFFF;
}

/* Mouse Hover Effect: Borda e Fonte na cor #61CE70 com cantos redondos */
.conecta-topbar-tab:hover,
.conecta-topbar-tab.active:hover {
	border-color: #61CE70 !important;
	color: #61CE70 !important;
	border-radius: 8px !important;
	background-color: rgba(97, 206, 112, 0.12) !important;
}

.conecta-topbar-tab.active {
	border-color: #61CE70;
	color: #61CE70;
	border-radius: 8px;
}

/* Main Header — Fundo Verde #197819 */
.conecta-header {
	position: relative;
	width: 100%;
	height: 80px;
	background-color: #197819 !important; /* Fundo Verde Oficial #197819 */
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	transition: background-color 0.3s ease, box-shadow 0.3s ease, height 0.3s ease;
}

.conecta-header.is-sticky {
	box-shadow: var(--conecta-shadow-header);
	background-color: rgba(25, 120, 25, 0.96) !important; /* Sticky Verde Translucido */
	backdrop-filter: blur(8px);
}

.conecta-header-inner {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* Main Content Offset */
.conecta-main-content {
	padding-top: 120px; /* 40px Topbar + 80px Header = 120px */
}

/* Brand Logo */
.conecta-brand img {
	height: 48px;
	width: auto;
	object-fit: contain;
}

/* Desktop Navigation */
.conecta-nav-desktop {
	display: flex;
	align-items: center;
	gap: 32px;
}

.conecta-nav-menu {
	display: flex;
	align-items: center;
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.conecta-nav-menu a {
	font-family: var(--conecta-font-primary);
	font-size: 15px;
	font-weight: 700;
	color: #FFFFFF;
	padding: 8px 0;
	position: relative;
	text-decoration: none;
	transition: color 0.2s ease;
}

/* Menu Mouse Hover: Cor #0F172A */
.conecta-nav-menu a:hover,
.conecta-nav-menu .current-menu-item > a {
	color: #0F172A !important;
}

.conecta-nav-menu a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 2.5px;
	background-color: #0F172A;
	transition: width 0.2s ease;
}

.conecta-nav-menu a:hover::after,
.conecta-nav-menu .current-menu-item > a::after {
	width: 100%;
}

/* CTA Button "Já sou cliente" - WHITE BACKGROUND AS IN ORIGINAL */
.conecta-header-cta {
	background-color: #FFFFFF !important;
	color: #0E2434 !important;
	font-weight: 800 !important;
	font-size: 14px !important;
	padding: 10px 24px !important;
	border-radius: 9999px !important;
	text-decoration: none !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
	transition: all 0.2s ease !important;
	display: inline-block !important;
}

.conecta-header-cta:hover {
	background-color: #61CE70 !important;
	color: #0E2434 !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 6px 18px rgba(97, 206, 112, 0.4) !important;
}

/* Hamburger Toggle */
.conecta-menu-toggle {
	display: none;
	background: none;
	border: none;
	width: 40px;
	height: 40px;
	cursor: pointer;
	align-items: center;
	justify-content: center;
}

.conecta-menu-toggle span {
	display: block;
	width: 24px;
	height: 2px;
	background-color: #FFFFFF;
	position: relative;
	transition: background 0.2s ease;
}

.conecta-menu-toggle span::before,
.conecta-menu-toggle span::after {
	content: "";
	position: absolute;
	width: 24px;
	height: 2px;
	background-color: #FFFFFF;
	transition: transform 0.3s ease;
}

.conecta-menu-toggle span::before { top: -7px; }
.conecta-menu-toggle span::after { bottom: -7px; }

/* Mobile Offcanvas Drawer */
.conecta-nav-mobile {
	position: fixed;
	top: 0;
	right: -100%;
	width: 300px;
	height: 100vh;
	background-color: #197819;
	box-shadow: -4px 0 20px rgba(0, 0, 0, 0.4);
	z-index: 10000;
	padding: 80px 24px 32px 24px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	transition: right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	color: #FFFFFF;
}

.conecta-nav-mobile.is-open {
	right: 0;
}

.conecta-nav-mobile-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 9999;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.conecta-nav-mobile-overlay.is-open {
	opacity: 1;
	visibility: visible;
}

@media (max-width: 1024px) {
	.conecta-header { height: 64px; }
	.conecta-main-content { padding-top: 104px; }
	.conecta-nav-desktop { display: none; }
	.conecta-menu-toggle { display: flex; }
}