@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Code:ital,wght@0,300..800;1,300..800&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

body{
    font-family: "Open Sans", sans-serif;
    background-color: #272727; /* Cor do texto padrão */
    font-size:18px;
    color: #cacaca;
    font-size:18px;
}
a{color: #cacaca;}

:root{
  --hoForte:hsla(6,78%,57%,1.00);
  --seForte:hsla(24,100%,54%,1.00);
  --atForte:hsla(48,100%,49%,1.00);
  --siForte:#009688;
  --onForte:hsla(186,85%,49%,1.00);
  --teForte:hsla(204,100%,57%,1.00);
  --ceForte:hsla(222,100%,50%,1.00);
  --fiForte:hsla(265,79%,59%,1.00);
}

.welcome-banner {
  background-color: #27ae60; /* Um verde amigável */
  color: white;
  text-align: center;
  padding: 10px;
  font-weight: 500;
  
  /* Faz o banner "grudar" no topo da tela ao rolar a página */
  position: sticky;
  top: 0;
  
  /* Garante que ele fique na frente de outros elementos */
  z-index: 1001; 
}

/* Estilo base para todas as mensagens */
.ms {
  display: block;
  font-size: 1.1rem;
  padding: 0.50rem 1.25rem;
  border-radius: 1px;
  font-weight: bold;
  text-align: center;
  width: 100%;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

/* Mensagem de erro */
.ms.erro {
  background-color: #d32f2f; /* vermelho */
  color: #fff;
  border: 1px solid #d32f2f;
}

/* Mensagem de alerta */
.ms.alerta, .alerta {
  background-color: #ff9800; /* laranja */
  color: #fff;
  border: 1px solid #f57c00;
}

/* Mensagem de sucesso */
.ms.sucesso, .sucesso {
  background-color: #4caf50; /* verde */
  color: #fff;
  border: 1px solid #388e3c;
}

.ms a:hover{color:black;}