/* General 
body {
  background-color: #f9f9f9;
  font-family: 'Arial', sans-serif;
}
*/

.card {
  max-width: 400px;
  width: 100%;
  background-color: #fff;
  border-radius: 10px;
}

/* Logo 
.logo {
  max-width: 100%;
  height: auto;
}

/* Botón 
.btn-primary {
  font-weight: bold;
  font-size: 16px;
  background-color: #3b90bd;
}

/* Cambiar color del botón cuando el mouse está encima 
.btn-primary:hover {
  background-color: #005988 !important; 
  border-color: #005988 !important; 
}

#aRecuperar{
  color: #3b90bd;
}

#aRecuperar{
  color: #005988 !important;
}

 Spinner 
.spinner {
  max-width: 50px;
  display: block;
  margin: auto;
}

 Personalizar el borde cuando el input tiene el foco
.form-control:focus {
  border-color: #3b90bd !important; 
  box-shadow: 0 0 5px rgba(0, 89, 136, 0.5) !important; 
  outline: none !important; 
}
*/

body {
  background-color: #f8f9fa;
  overflow-x: hidden;
}

/* Navbar superior fija */
.navbar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1030;
}

.navbar-brand img {
  height: 60px;
}

@media (max-width: 768px) {
  .navbar-brand img {
      height: 30px;
  }
}

/* Sidebar en pantallas grandes */
.sidebar {
  width: 250px;
  background-color: #eee;
  color: white;
  position: fixed;
  top: 56px; /* Ajustar al tamaño del navbar */
  left: 0;
  height: calc(100vh - 56px);
  padding-top: 20px;
  overflow-y: auto;            
}

.sidebar a {
  color: black;
  padding: 10px;
  display: block;
  text-decoration: none;
}

.sidebar a:hover {
  background-color: #c2c2c2;
}

/* Contenedor principal */
.main-content {
  margin-left: 250px;
  margin-top: 56px;
  padding: 20px;
  min-height: 100vh;
  transition: margin-left 0.3s ease-in-out;
}

/* Ajustes para pantallas pequeñas */
@media (max-width: 768px) {
  .sidebar {
      display: none;
  }

  .main-content {
      margin-left: 0;
  }
}

.sidebar ul, .offcanvas-body ul {
list-style: none; /* Elimina viñetas */
padding-left: 0; /* Elimina espacio izquierdo extra */
margin: 0; /* Ajusta márgenes si es necesario */
}

/* Botón */
.btn-primary {
font-weight: bold;
font-size: 14px;
background-color: #3b90bd;
height: 30px;
padding-top: 2px;
margin-top: 4px;
}

.btn-primary:hover {
background-color: #005988 !important; /* Color personalizado */
border-color: #005988 !important; /* Borde personalizado */
}

.btn-danger {
  font-weight: bold;
  font-size: 14px;
  /* background-color: #3b90bd; */
  height: 30px;
  padding-top: 2px;
  margin-top: 4px;
  }
  /*
  .btn-danger:hover {
  background-color: #005988 !important; 
  border-color: #005988 !important; 
  }
*/

.btn-info {
background-color: #005988 !important; /* Color personalizado */
border-color: #005988 !important; /* Borde personalizado */
color:#eee !important;
font-weight: bold;
font-size: 14px;  
height: 30px;
padding-top: 2px;
margin-top: 4px;
}

.btn-info:hover{
background-color: #00324d !important;
border-color: #00324d !important;
}

.datepicker {
  z-index: 2000 !important;
}