/* Garante que o contentor não quebra a linha */
.ler-mais-wrapper {
    display: inline ;
}

/* Puxa apenas o botão "Ler mais" inicial para cima */
.ler-mais-wrapper .botao-abrir {
    margin-top: -10px !important; /* Ajuste este valor (ex: -5px, -15px) até ficar na altura ideal */
    vertical-align: middle !important; /* Ajuda a alinhar com a linha do texto superior */
    position: relative !important; /* Permite micro-ajustes se necessário */
}



/* Esconde o texto por padrão */
.ler-mais-wrapper .conteudo-oculto {
    display: none ;
}

/* Mostra o texto em linha quando ativado */
.ler-mais-wrapper .conteudo-oculto.is-visible {
    display: inline ;
    animation: fadeInInline 0.2s ease-in-out ;
}

/* Esconde o botão "Ler mais" inicial quando o texto expande */
.ler-mais-wrapper .botao-abrir.is-hidden {
    display: none ;
}

/* Estilo dos botões inline (estilo link discreto) */
.ler-mais-wrapper .gatilho-ler-mais {
    display: inline-block ;
    background: none ;
    border: none ;
    padding: 0 5px ;
    margin: 0px ;
    color: #0073aa ; /* Cor de link típica, mude se quiser */
    font-size: inherit ;
    font-weight: bold ;
    font-family: inherit ;
    cursor: pointer ;
    text-decoration: underline ;
}

.ler-mais-wrapper .gatilho-ler-mais:hover {
    color: #005177 ;
}

/* Botão fechar ligeiramente espaçado da última palavra */
.ler-mais-wrapper .botao-fechar {
    margin-left: 6px ;
    color: #cc0000 ; /* Cor vermelha para o "Ler menos" (opcional) */
}

@keyframes fadeInInline {
    from { opacity: 0; }
    to { opacity: 1; }
}


/* Força os parágrafos do WordPress a correr em linha para não quebrarem o código */
.ler-mais-wrapper .conteudo-oculto.is-visible p {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Cria o efeito de parágrafo/quebra de linha usando CSS puro */
.ler-mais-wrapper .conteudo-oculto.is-visible p + p::before {
    content: "\A\A"; 
    white-space: pre-wrap !important;
}