/* ==========================================================================
   LINHA DE BAIXO — GRID E LARGURAS
   ========================================================================== */

/* 1) Grid da linha "Abaixo do cabeçalho" */
.ast-below-header-wrap .ast-builder-grid-row {
  display: grid !important;                    /* Garante grid */
  grid-template-columns: auto 1fr !important;  /* Coluna 1 automática, Coluna 2 preenche */
  grid-column-gap: 30px !important;            /* Espaço entre colunas */
  width: 100%;
  align-items: center;                          /* Alinhamento vertical */
}

/* 2) Largura fixa da seção ESQUERDA (onde está o botão) */
.ast-below-header-wrap .site-header-below-section-left {
  width: 330px !important;      /* Largura fixa */
  min-width: 330px !important;  /* Não encolhe */
  max-width: 330px !important;  /* Não cresce */
  margin: 0 !important;
}

/* 3) Largura do WIDGET dentro da seção esquerda */
.ast-below-header-wrap .site-header-below-section-left .header-widget-area {
  width: 100% !important;  /* Ocupa 100% da coluna */
  max-width: 100% !important;
  margin: 0 !important;
}

/* 4) Botão ocupa toda a largura do widget */
.ast-below-header-wrap .site-header-below-section-left .header-widget-area section#block-11 {
  width: 100% !important;
  box-sizing: border-box; /* Padding/borda não aumentam a largura */
}

/* 5) Dropdown (lista) — largura/posição */
.ast-below-header-wrap .site-header-below-section-left .header-widget-area section#block-14 {
  width: 300px !important;   /* Mesma largura definida aqui */
  left: 10px !important;
  top: 100% !important;
}

/* 6) Seções centro/direita (onde fica o menu) */
.ast-below-header-wrap .site-header-below-section-center,
.ast-below-header-wrap .site-header-below-section-right {
  width: 100% !important;    /* Ocupa 100% da coluna "1fr" */
  margin: 0 !important;
}

/* 7) Alinhamento do menu principal */
.ast-below-header-wrap .menu-menu-principal-container ul#menu-menu-principal {
  justify-content: flex-start !important;
  width: 100%;
}


/* ==========================================================================
   BOTÃO "TODAS AS CATEGORIAS" (section#block-11) + TÍTULO
   ========================================================================== */

/* 2. Estiliza a SECTION do Título (Bloco 11) como o botão */
section#block-11 {
  background-color: #fec300 !important;
  color: #ffffff !important;
  /* Bordas arredondadas apenas no topo */
  border-radius: 15px 15px 0 0 !important; /* TL, TR, BR, BL */
  cursor: pointer !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
}
section#block-11:hover {
  filter: brightness(1.06);
}

/* 3. Estiliza o H2 dentro do botão */
section#block-11 h2.wp-block-heading {
  color: inherit !important;
  padding: 14px 20px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-size: 16px !important;
  font-weight: bold !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}
section#block-11 h2.wp-block-heading::after {
  content: '▼' !important;
  font-size: 12px !important;
}
/* ===== Desktop: painel de categorias aberto por padrão, com limite e scroll ===== */
@media (min-width:922px){

  .ast-below-header-wrap{ overflow: visible !important; }
  .ast-below-header-wrap .site-header-below-section-left .header-widget-area{
    position: relative !important;
  }

  /* Botão */
  .epw-cats-toggle{
    border-radius: 15px 15px 0 0 !important;
  }

  /* Painel SEMPRE ABERTO por padrão (aparência que você aprovou) */
  .ast-below-header-wrap .site-header-below-section-left .header-widget-area .epw-cats-panel{
    position: absolute !important;
    left: 0 !important;
    top: calc(100% + 8px) !important;

    width: 100% !important;             /* acompanha a coluna esquerda */
    height: auto !important;
    max-height: 68vh !important;        /* limite visual */
    overflow-y: auto !important;        /* scroll vertical */
    overflow-x: hidden !important;

    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    padding: 12px 0 !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.14) !important;
    z-index: 9999 !important;
    transform: none !important;

    transition: max-height .25s ease, opacity .2s ease, visibility .2s ease;
  }