/* Estilos para el body */
        body {
          font-family: 'Arial', sans-serif;
          margin: 50px 0 0;
          padding: 0;
          display: flex;
          justify-content: center;
          align-items: flex-start;
          min-height: 100vh;
          background-color: #F0F0F0;
        }

        /* Estilos para el formulario */
        form {
          background-color: #808080;
          padding: 30px;
          border-radius: 20px;
          box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
          max-width: 500px;
          width: 100%;
          display: inline-block;
          border: 1px solid #ccc;
          box-sizing: border-box;
        }

        /* Estilos para los campos del formulario */
        form input[type="number"],
        label,
        input {
          display: block;
          margin-bottom: 10px;
          width: 100%;
          box-sizing: border-box;
          font-weight: bold;
        }

        form input[type="number"] {
          border: none;
          border-bottom: 1px solid #ccc;
          width: 100%;
          padding: 10px;
          font-size: 16px;
          margin-bottom: 5px; /* Añade más espacio entre el texto y el input */
          margin-top: 20px;
        }

        /* Estilos para el botón del formulario */
        form button[type="submit"],
        input[type="submit"] {
          background-color: #FF0000;
          color: white;
          border: none;
          padding: 10px 20px;
          border-radius: 5px;
          font-size: 16px;
          cursor: pointer;
          width: 100%;
          box-sizing: border-box;
        }

        /* Estilos para el título del formulario */
        form h1,
        h2 {
          font-size: 28px;
          font-weight: 500;
          text-align: center;
          margin-bottom: 30px;
          margin-bottom: 5px;
        }

        /* Estilos CSS para el mensaje de error */
        .error {
          color: white;
          margin-top: 10px;
          text-align: center;
          font-weight: bold;
        }

        /* Estilos para la caja de inicio de sesión */
        .login-box {
          position: absolute;
          top: 50px; /* Ajustamos la posición superior a 50px */
          left: 50%;
          transform: translateX(-50%);
          background: #808080;
          padding: 40px;
          border-radius: 10px;
          box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2);
          max-width: 400px;
          width: 100%;
        }