/* Comentários / Reações */
.cg-reaction-bar{
    text-align:center;
    margin-bottom:1.5rem;
}

/* Barra de reações */
.cg-reaction-buttons{
    display:flex;
    justify-content:center;
    flex-wrap:nowrap;
    gap:0.5rem;
    margin-top:0.5rem;
}

.cg-reaction-btn{
    border:none !important;
    background:transparent !important;
    padding:0.1rem;
    cursor:pointer;
    display:flex;
    flex-direction:column;
    align-items:center;
    transition:transform 0.15s ease;
    color:#666;
    text-align:center;
}

.cg-reaction-btn:hover{transform:scale(1.1);}

.cg-reaction-btn .emoji{display:block;}
.cg-reaction-btn .count{font-weight:600;font-size:0.55rem;color:#333;display:block;margin-top:0.1rem;}
.cg-reaction-btn .label{font-size:0.85rem;color:#444;margin-top:0.15rem;display:block;}

.cg-comment-item{border-bottom:1px solid #e2e8f0;padding:0.75rem 0;}
.cg-comment-item .content{margin-top:0.25rem;}
.cg-comment-form{margin-top:1rem;}
.cg-comment-form textarea{width:100%;padding:0.5rem;border:1px solid #cbd5e1;border-radius:6px;resize:vertical;}
.cg-comment-form .cg-btn{margin-top:0.5rem;}

/* Overrides tamanho emojis – será ajustado via CSS inline do tema, mas deixamos default 50px */
.cg-reaction-btn .emoji img{
    width:50px;height:50px;min-width:50px;min-height:50px;max-width:50px;max-height:50px;margin:0;padding:0;
} 

/* Botão "Faça login para comentar" */
.cg-btn{
    display:inline-flex;
    align-items:center;
    gap:0.5rem;
    padding:0.6rem 1.3rem;
    border:none;
    border-radius:8px;
    font-weight:600;
    text-decoration:none;
    cursor:pointer;
    transition:all 0.2s ease;
    font-size:0.875rem;
}

.cg-login-btn{
    background:#08203C;
    color:#fff !important;
}

/* Wrapper para centralizar o botão */
.cg-login-wrapper{ 
    text-align:center;
    margin-top:1rem;
}

.cg-login-wrapper .cg-login-btn{ 
    display:inline-flex; /* garante centralização */
}

/* Atualizar cor de texto no hover */
.cg-login-btn:hover{
    background:#699824;
    color:#08203C !important;
} 

/* Avatar nos comentários */
.cg-comment-item{ 
    display:flex;
    align-items:flex-start;
    gap:0.75rem;
}

.cg-comment-item .cg-avatar{
    width:40px;
    height:40px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    font-size:1rem;
    color:#08203C; /* texto escuro para contraste em gradiente claro */
    flex-shrink:0;
}

.cg-comment-body strong{display:block;font-weight:600;}
.cg-comment-body time{display:block;font-size:0.75rem;color:#666;margin-bottom:0.25rem;}

/* Aumentar tamanho da contagem das reações */
.cg-reaction-btn .count{font-size:1.25rem !important;font-weight:700 !important;} 

/* Botão primário de envio de comentário */
.cg-btn-primary{
    background:#08203C !important;
    color:#fff !important;
    border:none !important;
}

.cg-btn-primary:hover{
    background:#699824 !important;
    color:#fff !important;
} 