/* assets/css/help-popup.css*/
/* Estilo básico do botão de ajuda "?" */
/* Estilo básico do botão de ajuda "?" */
.btn-help {
    background-color: transparent;
    color: var(--brown);
    border: 2px solid var(--brown);
    border-radius: 50%;
    width: 24px;
    height: 24px;
    font-weight: bold;
    cursor: pointer;
    font-size: 16px;
    position: absolute;
    right: -2px;
    top: 50%;
    transform: translateY(-50%);
    
    /* Linhas para centralizar o texto "?" */
    display: flex;
    justify-content: center; /* Centraliza horizontalmente */
    align-items: center;     /* Centraliza verticalmente */
}

/* CORREÇÃO 1: Mantém a posição idêntica e blinda a cor do texto/borda no hover */
.btn-help:hover {
    background-color: var(--white) !important;
    color: var(--brown) !important;
    border-color: var(--brown) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

/* Botão OK de fechar */
.btn-close {
    margin-top: 15px;
    background-color: var(--brown);
    color: var(--white);
    border: none;
    padding: 8px 20px;
    border-radius: 4px;
    cursor: pointer;
}

/* CORREÇÃO 2: Removido o caractere "~" que estava a quebrar a sintaxe do CSS */
.btn-close:hover {
    background-color: var(--brown-dark);
}