.bg-custom{
  background-color: #948979;
}

.card-personalizado {
  background: rgba(255, 255, 255, 0.5);  /* Fondo semi-transparente */
  border-radius: 15px; /* Bordes redondeados */
  padding: 20px; /* Espaciado interno */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); 
}

.btn-custom {
  background-color: #153448; /* Color de fondo inicial */
  color: #fff; /* Color de texto inicial */
  padding: 7px 14px; /* Espaciado interno */
  border-radius: 5px; /* Bordes redondeados */
  border: none; /* Sin borde */
  cursor: pointer; /* Apunta a que es clickeable */
  transition: all 0.2s ease; /* Transición suave para todos los cambios */
  width: 120PX;
}

.btn-custom i {
  margin-right: 0.5rem; /* Espacio entre el ícono y el texto */
  font-size: 12px; /* Tamaño del icono */
  transition: transform 0.3s ease; /* Transición para el icono */
}

.btn-custom:hover i {
  transform: translateX(5px); /* El icono se mueve ligeramente a la derecha */
}

.btn-custom:hover {
  background-color: #153448; /* Color de fondo cuando se pasa el mouse */
  color: white; /* Color del texto */
  font-size: 1rem; /* Tamaño de fuente */
  text-align: center; /* Centrado del texto */
  transform: scale(0.9); /* Escalado suave para un efecto de "aumento" */
}

.btn-custom:active {
  background-color: #5C8374;
  color: white;
  font-size: 1rem; /* Tamaño de fuente */
  text-align: center;
}

.logo {
  max-width: 150px; /* Tamaño máximo del logo */
  height: auto; /* Mantener la relación de aspecto */
  margin-bottom: 20px; /* Espacio debajo del logo */
}

.btn-custom-show {
  background-color: #3C5B6F; /* Color de fondo inicial */
  color: #fff; /* Color de texto inicial */
  padding: 7px 14px; /* Espaciado interno */
  border-radius: 5px; /* Bordes redondeados */
  border: none; /* Sin borde */
  cursor: pointer; /* Apunta a que es clickeable */
  transition: all 0.2s ease; /*Transición suave para todos los cambios*/
  width: 110px;
}

.btn-custom-show i {
  margin-right: 0.5rem; /* Espacio entre el ícono y el texto */
  font-size: 12px; /* Tamaño del icono */   
  transition: transform 0.3s ease; /* Transición para el icono */
}

.btn-custom-show:hover i {
  transform: translateX(5px); /* El icono se mueve ligeramente a la derecha */
}

.btn-custom-show:hover {
  background-color: #3C5B6F; /* Color de fondo cuando se pasa el mouse */
  color: white; /* Color del texto */
  font-size: 1rem; /* Tamaño de fuente */
  text-align: center; /* Centrado del texto */
  /* transform: scale(0.9); */
}

.btn-custom-index {
  background-color: #DFD0B8; /* Color de fondo inicial */
  color: #3C5B6F; /* Color de texto inicial */
  padding: 7px 14px; /* Espaciado interno */
  border-radius: 5px; /* Bordes redondeados */
  border: none; /* Sin borde */
  cursor: pointer; /* Apunta a que es clickeable */
  transition: all 0.4s ease; /*Transición suave para todos los cambios*/
}

.btn-custom-index:hover {
  background-color: #DFD0B8; /* Color de fondo cuando se pasa el mouse */
  color: #3C5B6F ; /* Color del texto */
  font-size: 1rem; /* Tamaño de fuente */
  text-align: center; /* Centrado del texto */
  /* transform: scale(0.9); */
}

.btn-custom-ver {
  background-color: #00224D; /* Color de fondo inicial */
  color: white; /* Color de texto inicial */
  padding: 5px 10px; /* Espaciado interno */
  border-radius: 5px; /* Bordes redondeados */
  border: none; /* Sin borde */
  cursor: pointer; /* Apunta a que es clickeable */
  transition: all 0.2s ease; /*Transición suave para todos los cambios*/
  width: 110px;
}

.btn-custom-ver:hover {
  background-color: #00224D; /* Color de fondo cuando se pasa el mouse */
  color: white ; /* Color del texto */
  font-size: 1rem; /* Tamaño de fuente */
  text-align: center; /* Centrado del texto */
  /* transform: scale(0.9); */
}

.btn-custom-eliminar {
  background-color: #FF204E; /* Color de fondo inicial */
  color: white; /* Color de texto inicial */
  padding: 5px 10px; /* Espaciado interno */
  border-radius: 5px; /* Bordes redondeados */
  border: none; /* Sin borde */
  cursor: pointer; /* Apunta a que es clickeable */
  transition: all 0.2s ease; /*Transición suave para todos los cambios*/
  width: 110px;
}

.btn-custom-eliminar:hover {
  background-color: #FF204E; /* Color de fondo cuando se pasa el mouse */
  color: white ; /* Color del texto */
  font-size: 1rem; /* Tamaño de fuente */
  text-align: center; /* Centrado del texto */
  /* transform: scale(0.9); */
}

.btn-custom-modificar {
  background-color: #FFC100; /* Color de fondo inicial */
  color: white; /* Color de texto inicial */
  padding: 5px 10px; /* Espaciado interno */
  border-radius: 5px; /* Bordes redondeados */
  border: none; /* Sin borde */
  cursor: pointer; /* Apunta a que es clickeable */
  transition: all 0.2s ease; /*Transición suave para todos los cambios*/
  width: 110px;
}

.btn-custom-modificar:hover {
  background-color: #FFC100; /* Color de fondo cuando se pasa el mouse */
  color: white ; /* Color del texto */
  font-size: 1rem; /* Tamaño de fuente */
  text-align: center; /* Centrado del texto */
  /* transform: scale(0.9); */
}

.bg-table {
  background-color: #DFD0B8;  /* Color de fondo */
  color: #3C5B6F;  /* Color de texto */
  font-family: 'Arial', sans-serif;  /* Fuente de la cabecera */
  font-weight: bold;  /* Negrita */
  text-transform: uppercase;  /* Convertir el texto a mayúsculas */
  font-size: 0.9rem;  /* Tamaño de fuente */
  padding: 12px;  /* Espaciado dentro de las celdas */
  letter-spacing: 1px;  /* Espaciado entre las letras */
  border-bottom: 2px solid #3C5B6F;  /* Borde inferior para dar énfasis */
}

.bg-table th {
  /* Estilo específico para las cabeceras de la tabla */
  padding: 15px;  /* Asegura un buen espaciado */
}

.custom-success {
  background-color: #597E52;
  color: white;
  padding: 15px;
  border-radius: 5px;
}


.btn-custom-buscar {
  background-color: #3A3845; /* Blue background */
  color: white;
  padding: 8px 16px;
  border-radius: 5px;
  font-size: 14px; /* Larger text size */
}

.btn-custom-quitarFiltro {
  background-color: #F7CCAC; /* Red background */
  color: #948979;
  padding: 8px 16px;
  border-radius: 5px;
  font-size: 14px;
}

.btn-custom-buscar i, .btn-custom-quitarFiltro i {
  margin-right: 8px; /* Space between icon and text */
  font-size: 18px; /* Icon size */
}

/* Optional hobuscar effects */
.btn-custom-buscar:hover {
  background-color: #DFD0B8; /* Darker blue */
}

.btn-custom-quitarFiltro:hover {
  background-color: #3C5B6F; /* Darker red */
  color: white;
}

.btn-custom-importFile {
  background-color: #3A3845; /* Blue background */
  color: white;
  padding: 8px 16px;
  border-radius: 5px;
  font-size: 14px; /* Larger text size */
}

.btn-custom-importFile i, .btn-custom-quitarFiltro i {
  margin-right: 8px; /* Space between icon and text */
  font-size: 18px; /* Icon size */
}

/* Optional hoimportFile effects */
.btn-custom-importFile:hover {
  background-color: #DFD0B8; /* Darker blue */
}