/* style.css */
body {
    background-color: #000000; /* Fundo preto */
    color: #fff; /* Texto branco */
  }

/* Limite de imagens */
#limiteImagens {
    background-color: #000;
    color: #fff;
    border: 1px solid #888;
    border-radius: 6px;
    padding: 4px 10px;
}
#limiteImagens:focus {
    outline: none;
    border-color: #888;
}

/* Botão ativo (categoria selecionada) */
.active-category {
  background-color: transparent !important; /* mantém o fundo preto */
  color: #fff !important; /* texto na cor principal */
  border: 2px solid #eb2401 !important; /* contorno vermelho */
  box-shadow: 0 0 12px #eb2401; /* brilho vermelho suave */
  transform: scale(1.05);
  transition: all 0.25s ease;
}

/* Efeito ao passar o rato sobre qualquer botão */
.btn-outline-primary:hover {
  background-color: #888 !important; /* fundo cinza ao passar o rato */
  color: #fff !important;
  border-color: #eb2401 !important; /* contorno vermelho */
  box-shadow: 0 0 10px #eb2401; /* brilho vermelho */
  transform: scale(1.05);
  transition: all 0.25s ease;
}

/* Efeito de hover também no botão ativo */
.active-category:hover {
  background-color: #888 !important;
  color: #fff !important;
  border-color: #eb2401 !important;
  box-shadow: 0 0 14px #eb2401;
}

/*  Secção de Destaque */
#destaques h2 {
  color: #fff;
  font-weight: 600;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.4); /* brilho suave no título */
}

#destaques .card-body p {
  color: #fff;
  font-weight: 500;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.5); /* sombra/brilho no texto */
}

/* Efeito nas imagens de destaque */
#destaques .card-img-top {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 0 15px rgba(255, 255, 255, 0.3);
}

#destaques .card-img-top:hover {
  transform: scale(1.05);
  box-shadow: 0 0 15px rgba(255, 255, 255, 0.3);
}
  
/*  Galeria  */
  .card {
    background-color: #000000; /* Fundo dos cards */
    color: #fff; /* Texto branco dos cards */
  }
  
  .card-text {
    color: #ffffff; /* Texto da descrição um pouco mais suave */
    font-size: 0.85rem;
  }

  .card-img-top {
    transition: transform 0.3s ease;
    cursor: pointer;
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.3);
  }
  
  .card-img-top:hover {
    transform: scale(1.05);
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.3);
  }
 
  .gallery-item { 
      display: none; 
  }
  
  .gallery-item.show { 
      display: block; 
  }
  
  .btn-outline-primary {
    color: #fff;
    border-color: #fff;
  }
  
  .btn-outline-primary:hover {
    background-color: #fff;
    color: #000;
  }
  
  input.form-control {
    background-color: #222;
    color: #fff;
    border-color: #444;
  }
  
  input.form-control::placeholder {
    color: #aaa;
  }