/*
 * AnySolve Emprego, camada de integração.
 * Liga o sistema de desenho da marca ao tema BuddyX e ao WP Career Board.
 * Só aqui é que se fala do tema; marca.css e cartoes.css ficam limpos.
 */

/* --- 1. O cabeçalho e o rodapé passam a ser nossos ------------------------ */

body.as-site .site-header-wrapper,
body.as-site #masthead,
body.as-site .site-info,
body.as-site .site-footer-wrapper {
  display: none;
}

/* O tema deixa espaço para o cabeçalho fixo dele; o nosso é sticky. */
body.as-site #page.site {
  padding-top: 0;
}

/* --- 2. Logotipo --------------------------------------------------------- */

.as-logo {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  text-decoration: none;
  border-radius: 6px;
}

.as-logo > .as-logo__pic,
.as-logo .as-logo__pic {
  display: block;
  line-height: 0;
}

/*
 * Especificidade deliberada: marca.css tem `.as-logo > img`, que é 0,1,1.
 * Como a imagem passou a viver dentro de um <picture>, esse selector já não
 * a apanha; estas regras é que mandam.
 */
.as-logo .as-logo__pic > .as-logo__img {
  display: block;
  height: 34px;
  width: auto;
  max-width: 62vw;
}

@media (min-width: 560px) {
  .as-logo .as-logo__pic > .as-logo__img {
    height: 40px;
    max-width: none;
  }
}

/* --- 3. Peças do menu que faltavam --------------------------------------- */

.as-site .as-menu__conta {
  display: none;
  align-items: center;
  min-height: var(--as-toque);
  padding: 0 var(--as-e-3);
  border-radius: var(--as-r-toque);
  font-size: var(--as-t-base);
  font-weight: 700;
  color: var(--as-texto);
  text-decoration: none;
  white-space: nowrap;
}

.as-menu__conta:hover {
  color: var(--as-marca-tinta);
  background-color: var(--as-marca-tenue);
}

/*
 * Especificidade deliberada: marca.css declara `.as-site .as-btn` (0,2,0).
 * Sem o `.as-site` à frente, o botão continuava visível no telemóvel e
 * esmagava o logotipo. Apanhado na imagem de ensaio a 390px.
 */
.as-site .as-menu__accao { display: none; }

@media (min-width: 880px) {
  .as-site .as-menu__conta { display: inline-flex; }
  .as-site .as-menu__accao { display: inline-flex; }
}

/* As três barras do botão do menu, desenhadas em CSS, sem ficheiro nenhum. */
.as-menu__barras,
.as-menu__barras::before,
.as-menu__barras::after {
  display: block;
  width: 18px;
  height: 2px;
  background-color: currentColor;
  border-radius: 2px;
}

.as-menu__barras {
  position: relative;
}

.as-menu__barras::before,
.as-menu__barras::after {
  content: "";
  position: absolute;
  left: 0;
}

.as-menu__barras::before { top: -6px; }
.as-menu__barras::after  { top: 6px; }

.as-menu__botao[aria-expanded="true"] .as-menu__barras { background-color: transparent; }
.as-menu__botao[aria-expanded="true"] .as-menu__barras::before { top: 0; transform: rotate(45deg); }
.as-menu__botao[aria-expanded="true"] .as-menu__barras::after  { top: 0; transform: rotate(-45deg); }

/* --- 4. Gaveta ----------------------------------------------------------- */

.as-menu__gaveta-lista {
  list-style: none;
  margin: 0 0 var(--as-e-3);
  padding: 0;
}

.as-menu__gaveta-lista li + li { border-top: 1px solid var(--as-borda); }

.as-menu__gaveta-lista a {
  display: flex;
  align-items: center;
  min-height: 52px;
  font-size: var(--as-t-lead);
  font-weight: 700;
  color: var(--as-texto);
  text-decoration: none;
}

.as-menu__gaveta-lista a:hover { color: var(--as-marca-tinta); }

.as-menu__gaveta-accao {
  display: flex;
  width: 100%;
  justify-content: center;
}

html.as-menu-aberto,
html.as-menu-aberto body { overflow: hidden; }

/* --- 5. A entrada ocupa a largura toda, sem barra lateral ---------------- */

body.as-site.home #primary,
body.as-site.home .wcb-archive-shell,
body.as-site.home .wcb-archive-main,
body.as-site.page-template-anysolve-inicio #primary {
  max-width: none;
  width: 100%;
  padding: 0;
  margin: 0;
  display: block;
}

body.as-site.home .wcb-filter-panel,
body.as-site.home .entry-header,
body.as-site.home .page-header,
body.as-site.home .entry-title {
  display: none;
}

body.as-site.home > #page.site > .container,
body.as-site.home #page.site > .container {
  max-width: none;
  width: 100%;
  padding-inline: 0;
}

body.as-site.home .wcb-page-article,
body.as-site.home .entry-content {
  margin: 0;
  padding: 0;
  max-width: none;
}

/* --- 6. Correcções de fundo do tema -------------------------------------- */

body.as-site {
  background-color: var(--as-papel);
  color: var(--as-texto);
  font-family: var(--as-letra);
}

body.as-site a { color: var(--as-marca-tinta); }

/* A barra do WordPress não pode tapar o cabeçalho fixo. */
body.as-site.admin-bar .as-cabecalho { top: 32px; }

@media (max-width: 782px) {
  body.as-site.admin-bar .as-cabecalho { top: 46px; }
}

@media print {
  .as-cabecalho, .as-menu__gaveta { display: none; }
}

/* --- 7. Correcções apanhadas no ensaio ----------------------------------- */

/*
 * Botão de contorno dentro do bloco invertido. Sem isto herda a tinta escura
 * e desaparece no fundo preto. Apanhado a olho, na primeira imagem de ensaio.
 */
.as-site .as-sec--inverso .as-btn--linha,
.as-site .as-rodape .as-btn--linha {
  border-color: var(--as-inverso-borda);
  color: var(--as-inverso-texto);
}

.as-site .as-sec--inverso .as-btn--linha:hover,
.as-site .as-rodape .as-btn--linha:hover {
  border-color: var(--as-inverso-marca);
  color: var(--as-inverso-marca);
}

/*
 * A entrada tem de sair do contentor estreito do tema. O BuddyX usa
 * .container; os temas de blocos usam .is-layout-constrained e .entry-content.
 * Damos largura total ao nosso invólucro e deixamos o .as-larg de dentro
 * tratar da medida de leitura.
 */
.as-inicio,
.as-inicio > * {
  max-width: none;
  width: auto;
}

body.as-site.home :where(.entry-content, .wp-block-post-content, .wcb-page-article, .site-main, .container) {
  max-width: none;
  padding-inline: 0;
}

body.as-site.home .entry-content > .as-inicio {
  margin-inline: 0;
}

/*
 * Título da página. Tanto na entrada como nas páginas do sistema (RH, Preços,
 * Como me candidato), o herói já traz o título em letra grande. O título do
 * tema por cima é uma repetição, e nas páginas aparecia centrado, fora do eixo
 * à esquerda que o resto do desenho segue.
 */
body.as-site.home :where(.entry-header, .wp-block-post-title, .page-header, header.entry-header),
body.as-site:has(.as-pagina) :where(.entry-header, .wp-block-post-title, .page-header, header.entry-header) {
  display: none;
}

/* Cabeçalho e rodapé do tema, em temas clássicos e em temas de blocos. */
body.as-site :where(.wp-site-blocks > header, .wp-block-template-part header.wp-block-template-part, .site-header, #masthead, .site-header-wrapper) {
  display: none;
}

body.as-site :where(.wp-site-blocks > footer, .site-footer, #colophon, .site-info) {
  display: none;
}

/*
 * Os temas de blocos aplicam `.is-layout-constrained > *` com um selector de
 * peso alto e uma medida de leitura de cerca de 620px. A entrada não é texto
 * corrido, é uma sequência de secções de largura total, e a medida de leitura
 * quem a impõe é o `.as-larg` de dentro de cada secção. Esta é a única
 * declaração forçada do ficheiro, e é aqui que tinha de ser.
 */
body.as-site .as-inicio,
body.as-site .as-pagina,
body.as-site .as-rodape {
  max-width: none !important;
  width: 100%;
  margin-inline: 0 !important;
}

/*
 * Apanhado na página de Preços: com a largura estrangulada, a grelha de quatro
 * escalões esmagava-se e as palavras partiam-se a meio ("trabalhad ores").
 * Além da largura, garantimos que nunca se parte uma palavra por hifenização
 * automática: em português fica ilegível.
 */
body.as-site .as-pagina :where(h1, h2, h3, h4, p, li, td, th, a, span) {
  hyphens: manual;
  overflow-wrap: break-word;
  word-break: normal;
}

/* --- 8. Barra lateral do tema, apanhada no site a sério ------------------- */

/*
 * O BuddyX mete uma barra lateral com "Pesquisar", "Artigos recentes" e
 * "Comentários recentes" ao lado da nossa entrada. Não faz sentido nenhum numa
 * bolsa de emprego, e roubava um terço da largura ao herói.
 */
body.as-sem-lateral #secondary,
body.as-sem-lateral .primary-sidebar,
body.as-sem-lateral .widget-area,
body.as-site.home #secondary,
body.as-site.home .primary-sidebar {
  display: none !important;
}

body.as-sem-lateral #primary,
body.as-sem-lateral .site-main,
body.as-sem-lateral .content-area,
body.as-site.home #primary {
  width: 100% !important;
  max-width: none !important;
  flex: 1 1 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.as-sem-lateral .site-content,
body.as-sem-lateral .container > .row {
  display: block !important;
}

/* --- 9. Páginas do WP Career Board ---------------------------------------- */

/*
 * As páginas do plugin (Vagas, Área do candidato, Área da empresa, Empresas,
 * Publicar uma vaga, Registo de empresa) não trazem o nosso .as-larg, porque
 * o conteúdo é do plugin. Quando lhes tiramos a barra lateral do BuddyX, o
 * painel ficava colado às margens do ecrã. Devolvemos aqui a respiração, e a
 * mesma largura máxima que as nossas páginas usam, para o site parecer um só.
 *
 * Apanhado a 24 de Agosto de 2026 em /area-do-candidato/, onde o painel do
 * candidato estava espremido num terço da largura com o resto vazio.
 */
body.as-sem-lateral.wcb-page #primary,
body.as-sem-lateral.wcb-page .site-main,
body.as-sem-lateral.wcb-page .content-area {
  padding: 2.5rem 1.25rem 4rem !important;
}

body.as-sem-lateral.wcb-page .entry-content,
body.as-sem-lateral.wcb-page .wcb-dashboard,
body.as-sem-lateral.wcb-page .wcb-page-fullwidth > * {
  max-width: 1180px;
  margin-inline: auto;
}

/* O plugin já se declara de largura total; não o deixamos ser estreitado. */
body.as-sem-lateral.wcb-page .site-content,
body.as-sem-lateral.wcb-page .container,
body.as-sem-lateral.wcb-page .container > .row {
  max-width: none !important;
  width: 100% !important;
}

@media (max-width: 48rem) {
  body.as-sem-lateral.wcb-page #primary,
  body.as-sem-lateral.wcb-page .site-main,
  body.as-sem-lateral.wcb-page .content-area {
    padding: 1.5rem 1rem 3rem !important;
  }
}

/* --- 10. Painéis do WP Career Board com uma coluna só ---------------------- */

/*
 * O plugin faz do #primary a sua própria grelha, com 300 pixéis para a
 * coluna dos filtros e o resto para o conteúdo. Nas páginas que não têm
 * filtros nenhuns, o conteúdo caía na coluna dos 300 e ficava espremido a um
 * terço da largura, com dois terços de ecrã vazio ao lado.
 *
 * Apanhado a 24 de Agosto de 2026 na Área do candidato: o painel media 601
 * pixéis dentro de uma coluna de 1110. Com esta regra passa a 1451.
 *
 * :only-child é de propósito. Quando houver mesmo uma coluna de filtros ao
 * lado, como no arquivo de vagas, a regra não pega e a grelha do plugin fica
 * como ele a desenhou.
 */
.as-site .wcb-archive-shell > .wcb-archive-main:only-child {
  grid-column: 1 / -1;
}