/* Botão flutuante para abrir TXT */
.fab-txt {
  position: fixed;
  bottom: 80px;                 /* Fica acima do botão de download */
  right: 20px;
  width: 40px;
  height: 40px;
  background-color: #0d6efd;    /* Azul Bootstrap */
  color: white;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  cursor: pointer;
  z-index: 1050;
  transition: all 0.3s ease;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

/* Hover: escurece e aumenta */
.fab-txt:hover {
  background-color: #084298;    /* Azul mais escuro */
  transform: scale(1.1);
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
}

/* Animação do ícone */
.pulse-icon {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.08);
    opacity: 0.9;
  }
}

/* Responsividade */
@media (max-width: 576px) {
  .fab-txt {
    width: 50px;
    height: 50px;
    font-size: 20px;
    bottom: 75px;               /* Ajusta posição acima do botão download */
    right: 15px;
  }
}


/* ===============================================================
   Container de cada bloco do modal de texto
=================================================================*/
.bloco-texto {
  position: relative;           /* Permite posicionar o botão copiar dentro do bloco */
  margin-bottom: 1rem;          /* Espaço entre blocos */
  background-color: #f7f7f8;    /* Fundo suave */
  border-radius: 0.5rem;        /* Cantos arredondados */
  padding: 0.75rem;             /* Espaçamento interno */
  box-shadow: 0 2px 6px rgba(0,0,0,0.08); /* Sombra leve */
  overflow: hidden;             /* Evita que conteúdo ultrapasse o container */
  transition: box-shadow 0.2s ease; /* Animação suave no hover */
}

.bloco-texto:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.12); /* Sombra maior ao passar o mouse */
}

/* ===============================================================
   Conteúdo do bloco (texto dentro de <pre>)
=================================================================*/
.bloco-conteudo {
  margin: 0;                      /* Remove margem padrão */
  font-family: monospace;         /* Fonte monoespaçada para alinhamento */
  white-space: pre-wrap;           /* Mantém quebras de linha */
  word-wrap: break-word;           /* Quebra linhas longas */
  line-height: 1.4;                /* Espaçamento entre linhas */
  font-size: 0.875rem;             /* Tamanho de fonte legível */
  background-color: #f5f5f5;       /* Fundo diferente do container */
  padding: 10px;                   /* Espaçamento interno */
  border-radius: 4px;              /* Bordas arredondadas */
  overflow-x: auto;                /* Barra de rolagem horizontal se necessário */
}

/* ===============================================================
   Botão copiar dentro do bloco
=================================================================*/
.bloco-texto .btn-copy {
  position: absolute;             /* Posicionado no canto superior direito */
  top: 0.25rem;
  right: 0.25rem;
  background-color: #007bff;      /* Azul padrão */
  color: white;                   /* Texto branco */
  border: none;                   /* Sem borda */
  padding: 0.25rem 0.5rem;        /* Espaçamento interno do botão */
  border-radius: 0.375rem;        /* Cantos arredondados */
  font-size: 0.75rem;             /* Fonte pequena */
  opacity: 0.9;                   /* Leve transparência */
  cursor: pointer;                /* Cursor de clique */
  transition: opacity 0.2s ease, transform 0.2s ease; /* Animação ao hover */
}

.bloco-texto .btn-copy:hover {
  opacity: 1;                     /* Totalmente visível ao passar o mouse */
  transform: scale(1.1);          /* Leve aumento do botão */
}



/* ===============================================================
   Título do bloco - não está utilizando
=================================================================*/
.bloco-titulo {
    font-size: 1rem;                /* Tamanho legível */
    font-weight: 600;               /* Negrito moderno */
    color: #111827;                  /* Cor escura profissional */
    margin-bottom: 0.5rem;           /* Espaçamento abaixo do título */
    display: flex;
    justify-content: space-between;  /* Total à direita */
    align-items: center;
}

.bloco-total {
    font-weight: 700;               /* Mais destaque para o total */
    color: #2563eb;                 /* Azul moderno */
    font-size: 0.9rem;
    background-color: #e0f2fe;      /* Fundo azul suave */
    padding: 0.15rem 0.4rem;
    border-radius: 0.25rem;
}



/* ==========================
   ESTILO DOS BLOCOS (MODAL)
========================== */
.bloco-card {
  background-color: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  padding: 1rem;
  margin-bottom: 1rem;
  transition: all 0.25s ease;
}

.bloco-card:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  transform: scale(1.01);
}

.bloco-conteudo {
  font-family: "Consolas", "Courier New", monospace;
  background-color: #f8f9fa;
  color: #212529;
  border-radius: 6px;
  padding: 0.75rem;
  font-size: 0.9rem;
  white-space: pre-wrap;
  overflow-x: auto;
  max-height: 300px;
}

.bloco-conteudo::-webkit-scrollbar {
  height: 6px;
  width: 6px;
}
.bloco-conteudo::-webkit-scrollbar-thumb {
  background-color: #bdbdbd;
  border-radius: 6px;
}
.bloco-conteudo::-webkit-scrollbar-thumb:hover {
  background-color: #999;
}

.btn-copy {
  background: transparent;
  border: none;
  color: #ccc;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.btn-copy i {
  font-size: 0.9rem;
}

.btn-copy:hover {
  color: #fff;
  opacity: 0.85;
  cursor: pointer;
}

.btn-copy.copiado {
  color: #00c46c; /* verde igual ChatGPT */
  font-weight: 500;
}

.btn-copy.copiado i {
  color: #00c46c;
}



/* =============================
   Toast flutuante sobre o botão
============================= */
.toast-chatgpt {
  position: absolute;
  background: rgba(25, 25, 25, 0.95);
  color: #fff;
  padding: 0.45rem 0.9rem;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.85rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  font-weight: 500;
  opacity: 0;
  transform: translateY(5px);
  transition: all 0.25s ease;
  pointer-events: none;
  z-index: 99999;
}

.toast-chatgpt.show {
  opacity: 1;
  transform: translateY(0);
}

.toast-chatgpt::after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: rgba(25, 25, 25, 0.95) transparent transparent transparent;
}