/* =========================================================
   CE Header Scroll - CSS
   - Muda padding, fundo, sombra, blur
   - Diminui min-height no scroll
   - Alterna logos (duas imagens)
   - Corrige admin-bar (quando logado)
   ========================================================= */

/* Header base */
#header.ce-sticky-header{
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 2147483647 !important; /* z-index “máximo prático” */

  /* Evita “margem” externa inesperada */
  margin-top: 0 !important;

  /* Diminuir tamanho via padding + min-height */
  padding: var(--ce-h-pad-normal, 18px 0);
  min-height: var(--ce-h-minh-normal, 120px) !important;

  height: auto;
  display: flex;
  align-items: center;

  background: transparent;

  transition:
    min-height .25s ease,
    padding .25s ease,
    background-color .25s ease,
    box-shadow .25s ease,
}

/* Quando usuário está logado, o WP admin bar ocupa espaço no topo.
   Ajustamos o top do header para não “ficar por baixo” da barra. */
body.admin-bar #header.ce-sticky-header{
  top: 32px !important;
}
@media (max-width: 782px){
  body.admin-bar #header.ce-sticky-header{
    top: 46px !important;
  }
}

/* Estado ao rolar */
#header.ce-sticky-header.is-scrolled{
  padding: var(--ce-h-pad-scrolled, 8px 0);
  min-height: var(--ce-h-minh-scrolled, 80px) !important;

  background: var(--ce-h-bg-scrolled, rgb(10,10,10));
  box-shadow: var(--ce-h-shadow, 0 10px 30px rgba(0,0,0,.18));
}

/* Troca de logo (duas imagens no header) */
#header .ce-logo--scrolled{ display: none; }
#header.is-scrolled .ce-logo--default{ display: none; }
#header.is-scrolled .ce-logo--scrolled{ display: inline-block; }

/* Suaviza a transição na imagem */
#header .ce-logo--default img,
#header .ce-logo--scrolled img{
  transition: transform .25s ease, opacity .25s ease;
  transform-origin: center left;
}

/* Opcional: “encolhe” um pouco a logo no scroll */
#header.is-scrolled .ce-logo--scrolled img{
  transform: scale(var(--ce-logo-scale-scrolled, .92));
}