/* ==========================================================================
   Cabecalho fixo - Fabrica Business

   O header e um template do Elementor Theme Builder, mas o comportamento
   fixo e feito aqui em CSS puro: nao depende do Elementor Pro, nao usa JS,
   e viaja no Git junto com o tema (o sticky do Elementor ficaria no banco).

   Alvo: .elementor-location-header (wrapper que o Elementor imprime).
   ========================================================================== */

:root {
	--fb-header-z: 90;          /* acima do conteudo, abaixo dos modais do Tutor */
	--fb-header-offset: 0px;    /* sobrescrito quando a admin bar esta visivel */
	--fb-header-altura: 90px;   /* meca o seu no DevTools e ajuste */
}

/* ------------------------------------------------------------------ sticky */

.elementor-location-header {
	position: sticky;
	top: var(--fb-header-offset);
	z-index: var(--fb-header-z);
	background: #fff;
	box-shadow: 0 1px 0 rgba(10, 35, 66, 0.08);
}

/* --------------------------------------------------------------- admin bar */

/* A barra do WordPress e position: fixed e ocuparia o mesmo espaco. */
.admin-bar .elementor-location-header {
	--fb-header-offset: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .elementor-location-header {
		--fb-header-offset: 46px;
	}
}

/* Abaixo de 600px a admin bar deixa de ser fixed e rola com a pagina. */
@media screen and (max-width: 600px) {
	.admin-bar .elementor-location-header {
		--fb-header-offset: 0px;
	}
}

/* ---------------------------------------------------------------- ancoras */

/* Sem isto, um link para #secao rola ate o topo do elemento -- que fica
   escondido atras do header fixo. */
html {
	scroll-padding-top: calc(var(--fb-header-altura) + 1rem);
}

/* ------------------------------------------------- respiro do conteudo */

/* As paginas de curso do Tutor encostavam no header. */
body.single-courses .tutor-container:first-of-type,
body.single-courses .tutor-wrap:first-of-type {
	padding-top: clamp(1.25rem, 3vw, 2.5rem);
}

/* ------------------------------------------------------- sticky killers */

/* Se qualquer ancestral tiver overflow diferente de visible, o navegador
   desliga o sticky em silencio. Estes sao os wrappers mais comuns. */
body,
#page,
.site,
.site-content,
.elementor-page-wrapper {
	overflow: visible;
}

/* ---------------------------------------------------------- acessibilidade */

@media (prefers-reduced-motion: reduce) {
	.elementor-location-header {
		transition: none;
	}
}

/* ------------------------------------------------- sticky footer (min-height) */

/* NAO transformamos o body em flex: ele ja carrega comportamentos do
   Elementor e vira flex quebra o hero, a busca do catalogo e o footer.

   Em vez disso, damos altura minima ao wrapper de conteudo -- o irmao do
   header e do footer. Se o conteudo for curto, ele estica ate a altura da
   tela (menos header e admin bar) e empurra o footer para baixo. Se for
   longo, cresce normalmente.

   Alvos reais confirmados no DevTools:
     .tutor-wrap                     -> paginas WP comuns / login
     .tutor-certificate-verification -> verificacao de certificado
   Novos wrappers de conteudo entram nesta lista. */

.tutor-wrap,
.tutor-certificate-verification,
.tutor-dashboard-wrap {
	min-height: calc(100vh - var(--fb-header-altura, 90px));
}

.admin-bar .tutor-wrap,
.admin-bar .tutor-certificate-verification,
.admin-bar .tutor-dashboard-wrap {
	min-height: calc(100vh - var(--fb-header-altura, 90px) - 32px);
}

@media screen and (max-width: 782px) {
	.admin-bar .tutor-wrap,
	.admin-bar .tutor-certificate-verification,
	.admin-bar .tutor-dashboard-wrap {
		min-height: calc(100vh - var(--fb-header-altura, 90px) - 46px);
	}
}