body {
    background-color: #f1f1f1;
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-family: Arial, sans-serif;
  }
  
  .container {
    display: flex;
    max-width: 800px;
  }
  
  .image-container {
    
    flex: 1;
    padding: 61px;
    background-color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .image-container img {
    max-width: 160%;
    max-height: 170%;
  }
  
  .login-container {
    flex: 1;
    background: linear-gradient(to right, #2d2dd5, #fcee21);
    padding: 40px;
    text-align: center;
    box-shadow: 0 0 10px rgba(10, 10, 0, 0.5);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  .login-container h2 {
    margin-bottom: 40px;
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  
  .login-container form input[type="text"],
  .login-container form input[type="password"] {
    width: 100%;
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #cccccc;
    border-radius: 4px;
    
  }
 
  
  .login-container form button {
    width: 70%;
    padding: 10px;
    background-color: #bf0411;
    color: #ffffff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    
  }
  
  .login-container form button:hover {
    background-color: #2d2dd5;
    box-shadow: 0 0 10px rgba(10, 10, 0, 0.5);
  }
  
  .login-container form .form-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    
  }

/* Estilo base del contenedor de consentimiento de cookies */
.cookie-consent-container {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.9); /* fondo semitransparente */
  color: #fff;
  padding: 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 -2px 8px rgba(0,0,0,0.2); /* sombra suave para dar profundidad */
  z-index: 1000;
  font-size: 14px; /* tamaño de texto uniforme */
}

/* Estilo para el texto y el enlace dentro del contenedor */
.cookie-text {
  flex-grow: 1; /* permite que el texto ocupe el espacio disponible */
  margin-right: 20px; /* espacio entre el texto y el botón */
}

.cookie-text a {
  color: #ffd700; /* color brillante para el enlace, asegurando contraste */
  text-decoration: none; /* sin subrayado */
}

.cookie-text a:hover,
.cookie-text a:focus {
  text-decoration: underline; /* subrayado al pasar el ratón para mejor accesibilidad */
}

/* Estilo del botón para aceptar las cookies */
.cookie-consent-container button {
  background-color: #bf0411; /* verde, color llamativo para la acción */
  color: #ffffff;
  border: none;
  padding: 10px 20px;
  font-size: 16px; /* tamaño de fuente más grande para facilidad de lectura */
  cursor: pointer;
  border-radius: 5px; /* bordes redondeados */
  outline: none; /* elimina el contorno que aparece al hacer clic */
  transition: background-color 0.3s; /* transición suave para el fondo */
}

.cookie-consent-container button:hover {
  background-color: #2d2dd5; /* cambio de color al pasar el ratón */
}

.cookie-consent-container button:focus {
  box-shadow: 0 0 0 3px rgba(255, 255, 0, 0.75); /* sombra de enfoque para accesibilidad */
}