/* Palette color:
    Color de Fondo Oscuro (#433E3F)
    Color de Fondo Principal (#F1F2EE)
*/
body {
  background-color: #f1f2ee;
  font-family: "Poppins", Sans-serif;
  font-size: 16px;
  margin: 0;
  padding: 0;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.hero-section {
  height: 100vh;
}
.name-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  text-align: center;
  text-size-adjust: 100%;
}
.btn-light {
  background-color: #433e3f;
  color: #f1f2ee;
}
/* Estilo para el botón flotante */
.btn-light.position-fixed {
  z-index: 1050;
}
.custom {
  background-color: #f8f5f0;
  color: #433e3f;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.list-group-item {
  background-color: #f8f5f0;
  border: none;
  color: #434343;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.text-change{
  color: #433e3f;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.section-title{
  font-family: "DM Mono", serif;
  font-weight: 500;
  font-style: normal;
  font-weight: bold;
}
.center{
  text-align: center;
}
.info{
  font-size: 1.2em;
}
.icons{
  font-size: 1.5em;
  color: #434343;
  transition: background-color 0.3s ease, color 0.3s ease;
}
/* Tema oscuro */
body.dark-theme {
  background-color: #433e3f;
  color: #f1f2ee;
  transition: background-color 0.3s ease, color 0.3s ease;
}
body.dark-theme nav {
  background-color: #333;
}

body.dark-theme .navbar-brand,
body.dark-theme .nav-link {
  color: #f1f2ee !important;
}
body.dark-theme .btn-light {
  background-color: #f1f2ee;
  color: #433e3f;
}
body.dark-theme .btn-light:hover {
  background-color: #433e3f;
  color: #f1f2ee;
}
body.dark-theme .custom {
  background-color: #332f30;
  color: #f1f2ee;
}
body.dark-theme .list-group-item {
  background-color: #332f30;
  border: none;
  color: #f1f2ee;
}
body.dark-theme .section-title{
  color: #f1f2ee;
}
body.dark-theme .icons{
  color: #f1f2ee;
}