@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

:root {
  --fuente-letra: 'Poppins', sans-serif;
}

body {
  font-family: var(--fuente-letra);
}

.fs-7 {
  font-size: 0.9rem !important;
}

.bg-azul-rey {
  background-color: #004589 !important;
}

.bg-gris-claro {
  background-color: #c2c2c2 !important;
}

.bg-azul-marino {
  background-color: #1b97a2 !important;
}

/* Personalización del botón */
.btn-azul-rey {
  /* Establecer el color del texto en el botón */
  --bs-btn-color: #fff !important;  /* Color de texto en el estado normal */
  
  /* Establecer el color del texto cuando se pasa el ratón por encima */
  --bs-btn-hover-color: #fff !important;  /* Color de texto cuando está en hover */
  
  /* Establecer el fondo del botón cuando está activo (presionado) */
  --bs-btn-active-bg: #002448 !important;  /* Fondo en el estado activo */
  
  /* Establecer el color y fondo para el botón cuando está deshabilitado */
  --bs-btn-disabled-color: #fff;  /* Color de texto cuando está deshabilitado */
  --bs-btn-disabled-bg: #004589 !important;  /* Fondo cuando está deshabilitado */
  
  /* Fondo principal del botón */
  background-color: #004589 !important;  /* Fondo en el estado normal */
  
  /* Borde de los botones */
  border-color: #004589 !important;
}

/* Estado hover del botón */
.btn-azul-rey:hover {
  background-color: #002448 !important;  /* Fondo cuando se pasa el ratón */
  border-color: #002448 !important;  /* Borde cuando se pasa el ratón */
}

/* Estado activo del botón (cuando se hace clic) */
.btn-azul-rey:active {
  background-color: #001a33 !important;  /* Fondo cuando se hace clic */
  border-color: #011120 !important;  /* Borde cuando se hace clic */
}

/* Estado deshabilitado del botón */
.btn-azul-rey:disabled {
  background-color: #004589 !important;  /* Fondo cuando está deshabilitado */
  border-color: #004589 !important;  /* Borde cuando está deshabilitado */
  color: #fff !important;  /* Color del texto cuando está deshabilitado */
}

.text-azul-rey {
  color: #004589;
}

.btn-azul-rey-gradient {
  background: linear-gradient(135deg, #004589, #005fa3) !important;
  color: #ffffff !important;
  border-radius: 2rem;
  padding: .75rem 2rem;
  box-shadow: 0 .25rem .5rem rgba(0, 0, 0, 0.1);
}

.btn-azul-rey-gradient:hover {
  opacity: .9 !important;
  color: #c0d9f2 !important;
}