/* =============================================================================
 * FioSaúde — Header (barra Área Restrita) + Rodapé de 5 colunas  [GLOBAL]
 * Redesign 2026-07. CSS escopado, carregado pelo enfold-child.
 * Fonte versionada: goldencloud/fiosaude/wp/internal/202607-home-redesign/deploy/
 * Par do arquivo PHP: enfold-child/includes/fs-header-footer.php
 * Paleta: dark #17632f · medium #1e7a3d · lime #8cc63f · texto #1e5631
 * ========================================================================== */

/* --- a barra Área Restrita vive DENTRO do topbar nativo (#header_meta) --------
 *     repaginado: fundo branco, menu secundário e ícone de busca do Enfold
 *     escondidos (a barra tem a própria busca) ------------------------------- */
#top #header_meta {
	background: #eef0ee;                 /* barra Área Restrita: cinza levemente mais escuro (como o PDF) */
	border-bottom: 1px solid #e0e4e0;
	min-height: 0;
}
#top #header_meta .container { max-width: 1310px; width: 100%; }
/* o Quick CSS do site põe .sub_menu{top:10px;line-height:30px} -> desalinha a barra; zera aqui */
#top #header_meta nav.sub_menu {
	float: none; width: 100%; margin: 0; padding: 0; border: 0;
	top: 0 !important; line-height: normal !important; font-size: 13px;
}
#top #header_meta #avia2-menu { display: none; }           /* menu Endereços/Fale/Mapa */
#top #header .menu-item-search-dropdown { display: none !important; } /* busca dup do Enfold */

/* --- esconde os botões antigos de área restrita (widget na área 'header'):
 *     as pílulas novas vivem na barra Área Restrita ------------------------- */
#top #header_main > .widget_custom_html { display: none; }

/* =========================================================================
 * BARRA ÁREA RESTRITA — dentro de #header_meta
 * ========================================================================= */
#top .fs-arbar { background: transparent; font-size: 13px; }
#top .fs-arbar-in {
	max-width: none;
	margin: 0;
	padding: 9px 0;
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	box-sizing: border-box;
}

/* busca */
#top .fs-arbar .fs-search {
	display: flex;
	align-items: center;
	border: 1px solid #cfd8cf;
	border-radius: 6px;                /* retângulo arredondado, como o mockup */
	overflow: hidden;
	background: #fff;
	height: 36px;
	margin: 0 !important;              /* zera o margin-bottom padrão de <form> (desalinhava) */
}
#top .fs-arbar .fs-search input[type="text"] {
	border: 0; outline: none; background: transparent;
	padding: 0 6px 0 14px; font-size: 13px; width: 140px; height: 32px;
	color: #333; box-shadow: none; margin: 0;
}
#top .fs-arbar .fs-search button {
	border: 0; background: transparent; cursor: pointer;
	padding: 0 12px; color: #1e7a3d; display: flex; align-items: center; height: 32px;
}
#top .fs-arbar .fs-search button svg { width: 16px; height: 16px; fill: currentColor; }

/* grupo área restrita: rótulo + pílulas */
#top .fs-arbar-area { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#top .fs-arbar-area .lbl {
	color: #1e5631; font-weight: 700; font-size: 13px; white-space: nowrap; margin-right: 2px;
}
#top .fs-pill {
	display: inline-flex; align-items: center; gap: 6px;
	background: #1e7a3d; color: #ffffff !important;
	padding: 7px 15px; border-radius: 20px;
	font-size: 12px; font-weight: 700; line-height: 1;
	text-decoration: none; text-transform: uppercase; letter-spacing: .3px;
	transition: background .2s;
}
#top .fs-pill:hover { background: #17632f; }
#top .fs-pill-hl { background: #8cc63f; color: #16401d !important; }   /* Orientações (destaque) */
#top .fs-pill-hl:hover { background: #7cb342; color: #16401d !important; }

/* social à direita */
#top .fs-arbar-social { margin-left: auto; display: flex; gap: 8px; align-items: center; }
#top .fs-soc {
	width: 30px; height: 30px; border-radius: 50%;
	background: #1e7a3d; display: inline-flex; align-items: center; justify-content: center;
	transition: background .2s;
}
#top .fs-soc:hover { background: #17632f; }
#top .fs-soc svg { width: 15px; height: 15px; fill: #fff; }

/* =========================================================================
 * MENU AO LADO DO LOGO (layout Enfold "logo_left menu_right")  +  botão Rede.
 * Antes o menu era uma barra verde abaixo do logo; agora fica na MESMA linha,
 * à direita do logo, sobre branco — como o PDF. Overrides:
 *   - texto do menu era BRANCO (Quick CSS da barra verde) -> vira verde escuro;
 *   - o nav tinha posição absoluta herdada -> vira estático, em flex à direita.
 * ========================================================================= */
@media (min-width: 990px) {
	/* a linha do logo usa a MESMA caixa do topbar (centrada, mesma largura/padding)
	 * -> logo alinha à esquerda com a busca; botão Rede alinha à direita com o social */
	#top #header_main .container.av-logo-container {
		display: block !important; float: none !important;
		max-width: 1310px !important; width: auto !important;
		margin-left: auto !important; margin-right: auto !important;
		box-sizing: border-box;
	}
	#top #header_main .av-logo-container .inner-container {
		display: flex; align-items: center; width: 100%; padding: 0;
	}
	#top #header_main .my-logo-buttons-wrapper {
		flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-start;
	}
	#top #header_main nav.main_menu { flex: 1 1 auto; min-width: 0; position: static !important; }
	#top #header_main .av-main-nav-wrap { position: static !important; float: none; width: 100%; }
	#top #header_main .av-main-nav {
		display: flex; justify-content: flex-end; align-items: center; flex-wrap: nowrap;
		width: 100%;
	}
	#top #header_main .av-main-nav > li { height: auto; }
}
/* cor + caixa do menu sobre branco (sobrepõe o Quick CSS branco/uppercase + fundo verde
 * (#076240) que o CSS dinâmico do Enfold pinta em cada link da barra verde) */
#top #header .av-main-nav > li > a { background: transparent !important; }
#top #header .av-main-nav > li > a .avia-menu-fx,
#top #header .av-main-nav > li > a .avia-menu-fx .avia-arrow-wrap { background: transparent !important; }
#top #header .av-main-nav > li > a .avia-menu-text,
#top #header .av-main-nav > li > a .avia-menu-subtext {
	color: #1e5631 !important; text-transform: none !important; font-weight: 600 !important;
	font-size: 16px !important;                 /* fonte do menu um pouco maior (pedido do Daniel) */
}
#top #header .av-main-nav > li > a:hover .avia-menu-text,
#top #header .av-main-nav > li.current-menu-item > a .avia-menu-text { color: #1e7a3d !important; }

/* logo: Enfold posiciona .logo em ABSOLUTE (centra vertical); aqui ela precisa fluir
 * na coluna (brasão em cima, ANS embaixo), menor, centralizada na linha */
#top #header_main .logo {
	position: static !important; height: auto !important; width: auto !important;
	line-height: 0; margin: 0; display: block;
}
#top #header_main .logo a { height: auto !important; display: inline-block; }
#top #header_main .logo img { height: auto !important; max-height: 44px; width: auto !important; }

/* tira a linha verde (#8bba34) que o Quick CSS põe embaixo do menu */
#top #header_main { border-bottom: 0 !important; }
#top #header .container_wrap.container_wrap_logo { border-bottom: 0 !important; }

/* fundo branco OPACO na linha do logo/menu (senão, com o header inteiro sticky,
 * o conteúdo aparece por trás ao rolar) */
#top #header_main { background: #ffffff !important; }

/* botão "Rede Credenciada" — contorno verde sobre branco, no fim da linha */
#top .fs-redebtn {
	display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
	margin-left: 18px;
	padding: 8px 20px; border: 2px solid #1e7a3d; border-radius: 24px;
	color: #1e7a3d !important; font-weight: 700; font-size: 14px; line-height: 1;
	text-decoration: none; white-space: nowrap; background: transparent;
	transition: background .2s, color .2s;
}
#top .fs-redebtn:hover { background: #1e7a3d; color: #ffffff !important; }

/* selo ANS (imagem) sob o logo (JS insere .fs-ans-cap dentro do wrapper do logo) */
#top .av-logo-container img.fs-ans-cap {
	display: block; width: auto; height: 18px; margin: 5px 0 0 1px; max-width: none;
}

/* =========================================================================
 * RODAPÉ DE 5 COLUNAS — via ava_before_footer (fica acima do bloco de endereço)
 * ========================================================================= */
#top .fs-foot5 {
	background: #f4f6f4;
	padding: 42px 0 34px;
	border-top: 1px solid #e4e8e4;
}
#top .fs-foot5-in {
	max-width: 1200px; margin: 0 auto; padding: 0 30px;
	display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px;
	box-sizing: border-box;
}
#top .fs-foot5 .fs-foot5-col h4 { margin: 0 0 14px; font-size: 15px; line-height: 1.25; }
#top .fs-foot5 .fs-foot5-col h4 a { color: #1e5631 !important; text-decoration: none; font-weight: 700; }
#top .fs-foot5 .fs-foot5-col h4 a:hover { color: #1e7a3d !important; }
#top .fs-foot5 .fs-foot5-col ul { list-style: none; margin: 0; padding: 0; }
#top .fs-foot5 .fs-foot5-col li { margin: 0 0 9px; }
#top .fs-foot5 .fs-foot5-col li a {
	color: #6a746a !important; text-decoration: none; font-size: 13.5px; line-height: 1.4;
	transition: color .15s;
}
#top .fs-foot5 .fs-foot5-col li a:hover { color: #1e7a3d !important; }

/* --- assinatura "Desenvolvido por Golden Cloud Apps" + nuvem, centralizada no fim.
 *     Resgatada do rodapé antigo (que escondemos logo abaixo). ------------------- */
#top .fs-foot5-sig {
	max-width: 1200px; margin: 30px auto 0; padding: 16px 30px 0;
	border-top: 1px solid #e4e8e4; text-align: center; box-sizing: border-box;
}
#top .fs-foot5-sig a {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	color: #6a746a !important; text-decoration: none; font-size: 13.5px; line-height: 1;
	transition: color .15s;
}
#top .fs-foot5-sig a:hover { color: #1e7a3d !important; }
/* o ícone herda a cor do link (o Enfold pinta via av-no-color) e casa o tamanho do rodapé antigo */
#top .fs-foot5-sig .fs-gc-icon,
#top .fs-foot5-sig .fs-gc-icon .av-icon-char { color: inherit !important; }
#top .fs-foot5-sig .fs-gc-icon .av-icon-char { font-size: 20px; line-height: 20px; }

/* --- remove o rodapé antigo (bloco de endereço/copyright/Unidas = widget Footer 1).
 *     O #footer inteiro só tem esse bloco; as 5 colunas ficam ANTES dele. --------- */
#top #footer { display: none; }

/* =========================================================================
 * RESPONSIVO
 * ========================================================================= */
@media (max-width: 989px) {
	#top .fs-redebtn { display: none; }        /* menu vira burger */
	#top #header_meta { display: none; }        /* barra Área Restrita some do topo -> vai pro burger */

	/* meus <li> injetados no ul do burger: sem a borda/fundo/padding de item de menu */
	#top .av-burger-overlay #av-burger-menu-ul > li.fs-mob-top-li,
	#top .av-burger-overlay #av-burger-menu-ul > li.fs-mob-social-li {
		border: 0 !important; background: none !important; margin: 0 !important; list-style: none !important;
	}
	#top .av-burger-overlay #av-burger-menu-ul > li.fs-mob-top-li { padding: 46px 26px 12px !important; }
	#top .av-burger-overlay #av-burger-menu-ul > li.fs-mob-social-li { padding: 4px 26px 8px !important; }

	/* ---- conteúdo injetado DENTRO do menu burger (overlay branco).
	 *      prefixo #top p/ ganhar dos estilos base #top .fs-arbar-* ---- */
	#top .av-burger-overlay .fs-mob-top { padding: 4px 0; margin: 0 0 4px; }
	#top .av-burger-overlay .fs-mob-top .fs-search {
		display: flex; align-items: center; width: 100%; height: 42px; margin: 0 0 16px;
		border: 1px solid #cfd8cf; border-radius: 6px; overflow: hidden; background: #fff;
	}
	#top .av-burger-overlay .fs-mob-top .fs-search input[type="text"] {
		flex: 1 1 auto; border: 0; outline: none; background: transparent;
		padding: 0 10px; height: 40px; font-size: 16px; color: #333; margin: 0; box-shadow: none; width: auto;
	}
	#top .av-burger-overlay .fs-mob-top .fs-search button {
		border: 0; background: transparent; color: #1e7a3d; padding: 0 14px; display: flex; align-items: center; height: 40px;
	}
	#top .av-burger-overlay .fs-mob-top .fs-search button svg { width: 18px; height: 18px; fill: currentColor; }
	#top .av-burger-overlay .fs-mob-top .fs-arbar-area { display: flex; flex-direction: column; align-items: stretch; gap: 9px; }
	#top .av-burger-overlay .fs-mob-top .fs-arbar-area .lbl { color: #1e5631; font-weight: 700; font-size: 14px; margin: 0 0 2px; }
	#top .av-burger-overlay .fs-mob-top .fs-pill { justify-content: center; padding: 12px 14px; font-size: 13px; border-radius: 26px; }
	#top .av-burger-overlay .fs-mob-social {
		display: flex; gap: 14px; justify-content: center; margin: 12px 0 0; padding: 18px 0 4px; border-top: 1px solid #e4e8e4;
	}
	#top .av-burger-overlay .fs-mob-social .fs-soc {
		width: 42px !important; height: 42px !important; padding: 0 !important;
		border-radius: 50% !important; display: inline-flex !important; flex: 0 0 auto;
	}
	#top .av-burger-overlay .fs-mob-social .fs-soc svg { width: 19px; height: 19px; }
}
@media (max-width: 900px) {
	#top .fs-foot5-in { grid-template-columns: repeat(2, 1fr); gap: 22px; }
	#top .fs-arbar-in { justify-content: center; }
	#top .fs-arbar-social { margin-left: 0; }
}
@media (max-width: 520px) {
	#top .fs-foot5-in { grid-template-columns: 1fr; }
	#top .fs-arbar .fs-search input[type="text"] { width: 110px; }
	#top .fs-pill { padding: 6px 12px; font-size: 11px; }
}