/* 🔥 Estilo para a seção de comentários - Cyberpunk Edition */
        .comments-section, .annotations-section {
            margin-top: 20px;
            border-top: 1px solid var(--cor-borda);
            background-color: var(--fundo-bloco);
            border-radius: 8px;
            box-shadow: 0px 2px 10px var(--sombra-destaque);
            padding: 15px;
        }


        .comments-section img {
            width: 50px;
            height: 50px;
            border-radius: 50%;
        }


        .comments-section h2 {
            margin-bottom: 10px;
            font-size: 18px;
            font-weight: bold;
            color: var(--cor-destaque-1-titulo);
            text-shadow: 0px 0px 8px var(--sombra-titulo);
            font-family: var(--fonte-titulo);
        }

        .annotations-section h2 {
            margin-bottom: 10px;
            font-size: 18px;
            font-weight: bold;
            color: var(--cor-destaque-1-titulo);
            text-shadow: 0px 0px 8px var(--sombra-titulo);
            font-family: var(--fonte-titulo);
        }


        /* 🔥 Formulário de comentários */
        #commentForm, #annotationForm {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        #commentForm textarea, #annotationForm textarea {
            height: 80px;
            font-size: 14px;
            border: 1px solid var(--cor-borda);
            border-radius: 5px;
            resize: none;
            background-color: var(--cor-fundo-codigo);
            color: var(--cor-texto-codigo);
            padding: 10px;
            box-shadow: 0px 0px 8px var(--sombra-destaque);
        }

        #commentForm button, #annotationForm button {
            background-color: var(--cor-destaque-1);
            color: var(--cor-texto);
            border: none;
            padding: 10px;
            cursor: pointer;
            border-radius: 5px;
            transition: background 0.3s, box-shadow 0.3s;
            font-family: var(--fonte-principal);
        }

        #commentForm button:hover, #annotationForm button:hover {
            background-color: var(--cor-hover-botao);
            box-shadow: 0px 0px 15px var(--sombra-destaque);
        }

        /* 🔥 Estilização dos comentários */
        .comment-post {
            margin-top: 10px;
            padding: 10px;
            background-color: var(--fundo-conteudo);
            border-left: 4px solid var(--cor-destaque-1);
            border-radius: 5px;
            transition: background 0.3s, box-shadow 0.3s;
            box-shadow: 0px 0px 8px var(--sombra-destaque);
        }

        .comment:hover {
            background-color: rgba(0, 238, 255, 0.1);
            box-shadow: 0px 0px 12px var(--sombra-destaque);
        }

        .comment p {
            font-size: 14px;
            margin: 0;
            color: var(--cor-texto);
        }

        .comment strong {
            color: var(--cor-destaque-2);
        }

        .comment small {
            display: block;
            font-size: 12px;
            color: var(--cor-texto-secundario);
            margin-top: 5px;
        }

        /* 🔥 Estilização dos botões de comentário */
        .comment button {
            margin: 5px; /* Adicionando espaçamento entre os botões */
            margin-top: 5px;
            font-size: 12px;
            padding: 5px 8px;
            border: none;
            cursor: pointer;
            border-radius: 5px;
            transition: background 0.3s, box-shadow 0.3s;
            font-family: var(--fonte-principal);
        }

        /* 🔴 Botão de exclusão */
        .comment button.delete {
            background-color: var(--cor-destaque-2);
            color: white;
        }

        .comment button.delete:hover {
            background-color: #cc0000;
            box-shadow: 0px 0px 12px var(--cor-destaque-2);
        }

        /* 🚨 Botão de denúncia */
        .comment button.report {
            background-color: var(--cor-destaque-1-titulo);
            color: #333;
        }

        .comment button.report:hover {
            background-color: #e6b800;
            box-shadow: 0px 0px 12px var(--cor-destaque-1-titulo);
        }

        /* 💬 Botão de resposta */
        .comment button.reply {
            background-color: var(--cor-destaque-3);
            color: white;
        }

        .comment button.reply:hover {
            background-color: #00cc66;
            box-shadow: 0px 0px 12px var(--cor-destaque-3);
        }

        /* 🔥 Estilização das respostas */
        .replies {
            margin-top: 10px;
            padding-left: 20px;
            border-left: 2px solid var(--cor-destaque-2);
        }

        .reply {
            background-color: var(--cor-fundo);
            padding: 8px;
            border-left: 3px solid var(--cor-destaque-3);
            border-radius: 5px;
            margin-top: 5px;
            box-shadow: 0px 0px 8px var(--sombra-destaque);
        }

        .reply p {
            font-size: 13px;
            margin: 0;
            color: var(--cor-texto);
        }

        .reply small {
            font-size: 11px;
            color: var(--cor-texto-secundario);
        }

        /* Responsividade para telas menores */
        @media (max-width: 600px) {
            .comments-section, .annotations-section {
                margin: 10px;
                padding: 10px;
            }

            .comment {
                padding: 8px;
            }

            .replies {
                padding-left: 10px;
            }
        }

        .imagem-centralizada {
            display: block;
            margin-left: auto;
            margin-right: auto;
            width: -webkit-fill-available;
            height: auto;
        }